.pwa-install h2{font-weight:400;padding-top:2em}.pwa-install p{margin-bottom:16px;color:#fffc}.pwa-install ol{padding-left:20px;margin-top:8px}.pwa-install ol li{margin-bottom:8px;line-height:1.2}.pwa-install .install-button{background:#007bffcc;color:#fff;border:none;padding:12px 18px;border-radius:6px;cursor:pointer;font-weight:600;font-size:1.05em;margin:0;transition:all .2s ease;box-shadow:0 2px 6px #007bff4d}.pwa-install .install-button:hover{background:#007bff;transform:translateY(-2px);box-shadow:0 4px 8px #007bff66}.pwa-install .install-subtitle{color:#fff9;font-size:.9em;margin-top:6px;font-style:italic;text-align:center}.switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#fff3;transition:.3s;border-radius:24px}.slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}input:checked+.slider{background-color:#646cff}input:checked+.slider:before{transform:translate(20px)}@keyframes slideIn{to{transform:translate(calc(100vw - 100%))}}@keyframes slideOut{0%{transform:translate(calc(100vw - 100%))}}[popover],dialog,::backdrop{transition:display var(--animation-duration) allow-discrete,overlay var(--animation-duration) allow-discrete,opacity var(--animation-duration);opacity:0}:popover-open,:popover-open::backdrop,[open],[open]::backdrop{opacity:1}@starting-style{:popover-open,:popover-open::backdrop,[open],[open]::backdrop{opacity:0}}.settings-drawer{--animation-duration: .3s;position:fixed;top:0;right:0;border:none;width:min(500px,90vw);height:100vh;margin:0;padding:0;background:#000000e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-left:1px solid rgba(255,255,255,.1);z-index:999;transform:translate(100vw);max-height:100vh;opacity:1;animation:slideOut var(--animation-duration) ease-in-out forwards}.settings-drawer[open]{animation:slideIn var(--animation-duration) cubic-bezier(.59,.8,.32,1.275) forwards}.settings-drawer::backdrop{background:#0000004d}.settings-content{width:100%;height:100%;padding:10px;display:flex;flex-direction:column;max-height:100vh}.settings-content header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;position:sticky;top:0;z-index:2;background:#000000e6;padding-bottom:10px}.settings-content h2{margin:0;font-size:1.5em;color:#ffffffe6}.settings-content header button{background:transparent;border:none;font-size:24px;color:#fff9;cursor:pointer;padding:4px 8px}.settings-content header button:hover{color:#ffffffe6}.settings-content header button:focus{outline:none}.settings-content header button:focus-visible{outline:2px solid white;outline-offset:2px}.settings-body{color:#ffffffb3;flex:1;overflow-y:auto;padding-bottom:20px}.toggle-setting{padding:16px;border-radius:8px;background:#ffffff1a;margin-bottom:16px}.settings-section{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}.settings-section h3{margin-top:0;margin-bottom:12px;font-size:1.2em;color:#ffffffd9}.update-available{margin-top:16px;padding:12px;background:#ffc10726;border-radius:4px}.update-available p{margin-top:0;margin-bottom:8px;font-weight:500;color:#ffc107e6}.update-available button{background:#ffc107cc;color:#000;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .2s}.update-available button:hover{background:#ffc107}.switch-container{display:flex;flex-direction:column;gap:8px;cursor:pointer}.switch-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.switch-title{font-weight:500;color:#ffffffe6}.switch-description{margin:0;font-size:.9em;color:#fff9}.volume-control{margin-top:16px;display:flex;align-items:center;gap:12px}.volume-control input[type=range]{flex:1;height:4px;background:#fff3;border-radius:2px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.volume-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:#fff;border-radius:50%;cursor:pointer}.volume-control input[type=range]:focus{outline:none}.volume-value{min-width:48px;text-align:right;color:#ffffffe6}.volume-control label{color:#ffffffe6}.debug-panel{position:fixed;bottom:20px;right:20px;background:#000c;color:#0f0;padding:15px;border-radius:8px;font-family:monospace;z-index:1000;width:280px;opacity:1;transition:opacity .2s ease-in-out}.debug-panel header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.debug-panel section{margin-bottom:15px}.debug-panel h3{margin:0;font-size:14px;text-transform:uppercase}.debug-panel h4{margin:5px 0;font-size:12px;opacity:.8}.close-button{background:none;border:none;color:#0f0;font-size:20px;font-weight:700;cursor:pointer;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:0;line-height:1;transition:background-color .2s}.close-button:hover{background-color:#0f03}.close-button:focus{outline:none;box-shadow:0 0 0 2px #0f06}.state-list{display:flex;flex-direction:column;gap:4px;padding:0}.state-list li{font-size:12px;padding:4px 8px;margin:0;list-style:none;background:#00ff001a;border-radius:4px;display:flex;justify-content:space-between;align-items:center}.state-list li.inactive{opacity:.5}.state-list li:not(:first-child){opacity:.6}.state-label{font-weight:700}.state-value{text-align:right;word-break:break-word;margin-left:8px;max-width:180px;overflow-wrap:break-word}.transcript-value{text-align:left;display:block;width:100%;margin-top:4px;white-space:normal;word-break:break-word;overflow-wrap:break-word;max-height:80px;overflow-y:auto}.settings-button{position:fixed;top:10px;right:10px;background:transparent;border:none;font-size:24px;cursor:pointer;padding:8px 12px;border-radius:5px;transition:background-color .2s,opacity .2s;z-index:1000;opacity:.5;-webkit-tap-highlight-color:rgba(255,255,255,.1);touch-action:manipulation;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.settings-button:hover{background:#ffffff1a;opacity:1}.settings-button:active{background:#fff3;opacity:1}.settings-button:focus{outline:none}.settings-button:focus-visible{outline:2px solid white;outline-offset:2px}@property --eye-width{syntax: "<length>"; inherits: true; initial-value: 20vw;}@property --eye-height{syntax: "<length>"; inherits: true; initial-value: 20vw;}#eyes{--eye-color: green;--eye-spacing: 6vw;--eye-x-location: 50%;--eye-y-location: 50%;--eye-radius: 15%;--eye-movement-transition-time: .15s;--eyelid-transition-time: .2s;--open-amount: .9;position:fixed;top:0;right:0;bottom:0;left:0}.loaded #eyes .eye{transition:all .3s cubic-bezier(.4,0,.2,1),left var(--eye-movement-transition-time) ease-in-out,top var(--eye-movement-transition-time) ease-in-out,translate var(--eye-movement-transition-time) ease-in-out,scale var(--eye-movement-transition-time) ease-in-out,height var(--eyelid-transition-time) ease-in-out,margin-top var(--eyelid-transition-time) ease-in-out,box-shadow var(--eyelid-transition-time) ease-in-out}.eye{position:absolute;width:var(--eye-width);height:calc(var(--eye-height) * var(--open-amount));margin:calc(var(--eye-height) * (1 - var(--open-amount)) / 2) 0;background-color:var(--eye-color);box-shadow:0 0 1vw 2vw #00ff001a;border-radius:var(--eye-radius);top:calc(var(--eye-y-location) - (var(--eye-height) / 2))}#left-eye{left:calc(var(--eye-x-location) - var(--eye-width) - (var(--eye-spacing) / 2))}#right-eye{left:calc(var(--eye-x-location) + (var(--eye-spacing) / 2))}.eye.small{--scale-amount: .8;--translate-x-amount: calc( (var(--eye-width) * (1 - var(--scale-amount))) / 2 );translate:var(--translate-x-amount);scale:var(--scale-amount)}.eye.small#right-eye{--translate-x-amount: calc( (var(--eye-width) * (1 - var(--scale-amount))) / -2 )}.eye.small.look-up{margin:calc(var(--eye-height) * (1 - var(--open-amount)) * -1 / 2) 0 0}.eye.small.look-down{margin:calc(var(--eye-height) * (1 - var(--open-amount)) * 1.5) 0 0}@keyframes blink{50%{height:0;margin:calc(var(--eye-height) * (1 - var(--open-amount)) / 2) 0;--eye-width: 25vw}}#eyes.blink .eye{animation:blink .12s ease-in-out}.tired{--open-amount: .2}.tired#left-eye{border-radius:0% 10% var(--eye-radius) var(--eye-radius) / 70% 30% var(--eye-radius) var(--eye-radius);clip-path:polygon(100% 0,100% 100%,0 100%,0 40%,90% 0)}.tired#right-eye{border-radius:10% 0% var(--eye-radius) var(--eye-radius) / 30% 70% var(--eye-radius) var(--eye-radius);clip-path:polygon(0 0,0 100%,100% 100%,100% 40%,10% 0)}#eyes.sleepy{--eyelid-transition-time: 20s;--open-amount: .6}#eyes.sleeping{--eyelid-transition-time: 20s;--open-amount: .05}@property --idx{syntax: "<length>"; inherits: true; initial-value: 0vw;}.trippy .eye{--eye-x-location: 50%;--eye-y-location: 50%;--open-amount: 1;--idx: 0vw;--gap: .5vw;border:var(--gap) solid var(--eye-color);animation:trippy .7s linear infinite;box-shadow:inset 0 0 0 calc((var(--idx) * -2) + var(--gap)) var(--page-background),inset 0 0 0 calc((var(--idx) * -1) + var(--gap)) var(--eye-color),inset 0 0 0 calc(var(--idx)) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap)) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 2) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 3) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 4) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 5) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 6) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 7) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 8) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 9) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 10) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 11) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 12) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 13) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 14) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 15) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 16) var(--page-background),inset 0 0 0 calc(var(--idx) + var(--gap) * 17) var(--eye-color),inset 0 0 0 calc(var(--idx) + var(--gap) * 18) var(--page-background)}@media (prefers-reduced-motion){.trippy .eye{animation:none}}@keyframes trippy{to{--idx: calc(var(--gap) * 2)}}:root{--page-background: #000;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:var(--page-background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden;min-width:100vw;min-height:100vh;interpolate-size:allow-keywords}a{font-weight:500;color:#646cff;text-decoration:inherit}*,*:before,*:after{box-sizing:border-box}a:hover{color:#535bf2}body{margin:0;min-width:100vh;min-height:100vh}#face-detection-video{display:none}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
