:root{--device-bg:#000;--device-fg:#e0e0e0;--device-grad-1:#fff;--device-grad-2:#666;--device-glow-color:hsla(0,0%,100%,.4);--device-panel:hsla(0,0%,4%,.85);--device-panel-border:#1a1a1a;--device-pad-off:#0a0a0a;--device-pad-on:#151515;--device-pad-border:#111;--device-fader-track:#040404;--device-fader-thumb:#d4d4d4;--device-pastel-1:transparent;--device-pastel-2:transparent}.device-page{position:fixed;top:0;left:0;width:100%;height:100dvh;background-color:var(--device-bg);color:var(--device-fg);font-family:var(--font-geist-sans),"Helvetica Neue",Arial,sans-serif;overflow:hidden;touch-action:none;user-select:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent}.ambient-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 20%,var(--device-pastel-1) 0,transparent 60%),radial-gradient(circle at 80% 80%,var(--device-pastel-2) 0,transparent 60%);mix-blend-mode:screen;z-index:0;transition:background 1.5s ease-in-out;will-change:background}.ambient-bg,.noise{pointer-events:none}.noise{position:fixed;top:-50%;left:-50%;right:-50%;bottom:-50%;width:200vw;height:200vh;z-index:9999;opacity:.85;mix-blend-mode:overlay;background:url('data:image/svg+xml;utf8,%3Csvg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noiseFilter"%3E%3CfeTurbulence type="fractalNoise" baseFrequency="1.8" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noiseFilter)"/%3E%3C/svg%3E');animation:grain .15s steps(2) infinite}@keyframes grain{0%,to{transform:translate(0)}10%{transform:translate(-5%,-10%)}30%{transform:translate(3%,-15%)}50%{transform:translate(12%,9%)}70%{transform:translate(9%,4%)}90%{transform:translate(-1%,7%)}}.device-header{position:absolute;top:2rem;left:2rem;z-index:100;mix-blend-mode:difference;display:flex;align-items:center;gap:15px}.device-header .icon,.device-header .wordmark{height:75px;width:auto;filter:contrast(200%) grayscale(100%)}.device-header .wordmark{margin-top:-5px}.void-space{display:flex;justify-content:center;align-items:center;background:var(--device-bg);overflow:hidden;z-index:1;will-change:filter,background-color}.strobe-flash,.void-space{position:absolute;top:0;left:0;width:100%;height:100%}.strobe-flash{background:var(--device-fg);opacity:0;z-index:10;pointer-events:none;mix-blend-mode:exclusion;will-change:opacity}.art-rig{position:absolute;top:50%;left:50%;width:0;height:0;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center;z-index:2;transition:transform 0s}.ch-h,.ch-v,.core-dot,.ring{position:absolute;top:50%;left:50%;mix-blend-mode:screen;transition:background 1.5s ease;pointer-events:none;transform-origin:center;will-change:transform,opacity}.ch-h{background:linear-gradient(90deg,var(--device-grad-1),var(--device-grad-2));width:200vw;height:2px;margin-left:-100vw;margin-top:-1px}.ch-h,.ch-v{box-shadow:0 0 15px var(--device-glow-color)}.ch-v{background:linear-gradient(180deg,var(--device-grad-1),var(--device-grad-2));width:2px;height:200vh;margin-left:-1px;margin-top:-100vh}.ring{width:100vw;height:100vw;margin-left:-50vw;margin-top:-50vw;-webkit-mask:radial-gradient(ellipse,transparent 63%,#000 65%);mask:radial-gradient(ellipse,transparent 63%,#000 65%)}.core-dot,.ring{border-radius:50%;opacity:0}.core-dot{background:radial-gradient(circle,var(--device-grad-1) 0,var(--device-grad-2) 100%);width:20vw;height:20vw;margin-left:-10vw;margin-top:-10vw}.shard-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100vw;height:100vh;display:flex;justify-content:center;align-items:center}.shard{background:linear-gradient(to bottom right,var(--device-grad-1),var(--device-grad-2));transform-origin:center;mix-blend-mode:screen;transition:background 1.5s ease;border-radius:1px;box-shadow:0 0 8px var(--device-glow-color);will-change:transform,opacity}.imprint-modal,.shard{position:absolute;opacity:0}.imprint-modal{bottom:calc(100% + 20px);left:0;width:100%;max-height:50vh;background:hsla(0,0%,8%,.95);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid var(--device-panel-border);border-radius:8px;padding:24px;color:#b0b0b0;font-size:.85rem;line-height:1.6;overflow-y:auto;z-index:90;pointer-events:none;transform:translateY(15px);transition:all .3s cubic-bezier(.1,.9,.2,1);box-shadow:0 30px 60px rgba(0,0,0,.9);text-align:left}.imprint-modal.show{opacity:1;pointer-events:auto;transform:translateY(0)}.imprint-modal h1,.imprint-modal h2{color:var(--device-fg);margin-bottom:1rem;font-family:monospace;text-transform:uppercase}.imprint-modal h3{color:var(--device-fg);margin-bottom:.5rem;font-family:monospace}.imprint-modal p{margin-bottom:1rem}.imprint-modal .close-btn{position:absolute;top:15px;right:15px;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;opacity:.5}.imprint-modal .close-btn:hover{opacity:1}.device-panel{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);z-index:100;background:var(--device-panel);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid var(--device-panel-border);padding:24px;border-radius:8px;display:flex;align-items:stretch;gap:24px;box-shadow:0 40px 80px rgba(0,0,0,.9),inset 0 1px 2px hsla(0,0%,100%,.05);width:92vw;max-width:550px}.matrix{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:clamp(6px,1.5vw,12px);flex:1}.pad{width:100%;height:100%;min-height:60px;background:var(--device-pad-off);border:1px solid var(--device-pad-border);border-radius:4px;color:#222;font-size:clamp(9px,2.2vw,12px);font-weight:700;font-family:var(--font-geist-mono),monospace;text-transform:uppercase;letter-spacing:.5px;display:flex;justify-content:center;align-items:center;box-shadow:inset 0 2px 5px rgba(0,0,0,.5);transition:all .2s cubic-bezier(.1,.9,.2,1)}.pad.active{color:#888;background:var(--device-pad-on);border-color:#333;cursor:pointer;box-shadow:inset 0 2px 5px rgba(0,0,0,.8),0 0 5px hsla(0,0%,100%,.02);text-align:center;line-height:1.2}.pad.active:hover{background:#1f1f1f;color:#aaa;border-color:#555}.pad.active:active{background:var(--device-grad-1);color:var(--device-bg);box-shadow:0 0 20px var(--device-glow-color);transition:all 0s}.pad.prominent-btn{background:var(--device-fg)!important;color:var(--device-bg)!important;border-color:#fff!important;animation:invertPulse 2.5s ease-in-out infinite alternate;text-shadow:none;box-shadow:inset 0 0 0 transparent!important}.pad.prominent-btn:active{transform:scale(.95);animation:none!important;background:#aaa!important;box-shadow:0 0 30px var(--device-glow-color)!important}@keyframes invertPulse{0%{box-shadow:0 0 10px hsla(0,0%,100%,.3);transform:scale(1)}to{box-shadow:0 0 25px hsla(0,0%,100%,.8);transform:scale(1.05)}}.fader-module{width:90px;background:#050505;border:1px solid var(--device-panel-border);border-radius:6px;display:flex;justify-content:center;align-items:center;position:relative;box-shadow:inset 0 5px 15px rgba(0,0,0,.9)}.fader-module input[type=range]{-webkit-appearance:none;appearance:none;width:120px;height:70px;background:transparent;transform:rotate(-90deg);outline:none!important;margin:0;z-index:5}.fader-module input[type=range]::-webkit-slider-runnable-track{width:100%;height:22px;background:var(--device-fader-track);border:1px solid #111;border-radius:3px;box-shadow:inset 0 3px 8px #000}.fader-module input[type=range]::-moz-range-track{width:100%;height:22px;background:var(--device-fader-track);border:1px solid #111;border-radius:3px;box-shadow:inset 0 3px 8px #000}.fader-module input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:48px;width:38px;background:var(--device-fader-thumb);border:3px solid #000;border-radius:4px;margin-top:-14px;box-shadow:0 6px 12px rgba(0,0,0,.9),inset 0 1px 2px hsla(0,0%,100%,.8);cursor:ns-resize;transition:box-shadow .2s ease-out}.fader-module input[type=range]::-moz-range-thumb{height:48px;width:38px;background:var(--device-fader-thumb);border:3px solid #000;border-radius:4px;box-shadow:0 6px 12px rgba(0,0,0,.9),inset 0 1px 2px hsla(0,0%,100%,.8);cursor:ns-resize;transition:box-shadow .2s ease-out}.fader-module input[type=range].glow-active::-webkit-slider-thumb{animation:thumbPulse 1.2s infinite alternate!important}.fader-module input[type=range].glow-active::-moz-range-thumb{animation:thumbPulse 1.2s infinite alternate!important}@keyframes thumbPulse{0%{box-shadow:0 6px 12px rgba(0,0,0,.9),inset 0 1px 2px hsla(0,0%,100%,.8),0 0 5px hsla(0,0%,100%,.1)}to{box-shadow:0 6px 12px rgba(0,0,0,.9),inset 0 1px 2px #fff,0 0 30px 10px hsla(0,0%,100%,.6)}}.fader-indicator{position:absolute;right:8px;top:20%;width:24px;height:24px;color:#fff;pointer-events:none;transition:opacity .4s ease-out;opacity:0;z-index:2}.fader-indicator.show-indicator{animation:arrowBounce 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes arrowBounce{0%{transform:translateY(10px);opacity:.2;filter:drop-shadow(0 0 5px rgba(255,255,255,.3))}50%{transform:translateY(-10px);opacity:1;filter:drop-shadow(0 0 15px rgba(255,255,255,1))}to{transform:translateY(10px);opacity:.2;filter:drop-shadow(0 0 5px rgba(255,255,255,.3))}}.login-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.7);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);display:flex;justify-content:center;align-items:center;z-index:9999;opacity:0;pointer-events:none;transition:opacity .4s ease}.login-overlay.show{opacity:1;pointer-events:auto}.login-panel{background:var(--device-panel);border:1px solid var(--device-panel-border);padding:40px;border-radius:8px;text-align:center;width:90%;max-width:400px;box-shadow:0 30px 60px rgba(0,0,0,.9);position:relative;transform:translateY(20px) scale(.95);transition:transform .4s cubic-bezier(.1,.9,.2,1)}.login-overlay.show .login-panel{transform:translateY(0) scale(1)}.login-close{position:absolute;top:15px;right:15px;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;opacity:.5}.login-close:hover{opacity:1}.login-logo{display:flex;justify-content:center;align-items:center;margin-bottom:25px;gap:15px}.login-logo .icon,.login-logo .wordmark{height:60px;width:auto}.login-form{display:flex;flex-direction:column;gap:15px}.login-form input{background:#000;border:1px solid #333;color:#fff;padding:14px;border-radius:4px;font-family:var(--font-geist-mono),monospace;outline:none;text-align:center;font-size:1rem}.login-form input:focus{border-color:#777}.login-form button{background:var(--device-fg);color:var(--device-bg);border:none;padding:14px;font-weight:700;font-family:var(--font-geist-mono),monospace;cursor:pointer;border-radius:4px;text-transform:uppercase;font-size:1rem;transition:background .2s,box-shadow .2s}.login-form button:hover{background:#fff;box-shadow:0 0 15px hsla(0,0%,100%,.4)}.login-form button:disabled{cursor:not-allowed;opacity:.5}.login-form .login-error{text-align:center;font-size:.875rem;color:#f87171}@media (max-width:600px){.device-header{top:1.5rem;left:1.5rem;gap:10px}.device-header .icon,.device-header .wordmark{height:45px}.device-panel{bottom:25px;padding:16px;gap:12px}.fader-module{width:75px}.pad{min-height:50px;font-size:10px}.fader-indicator{right:4px;width:20px;height:20px;top:15%}.imprint-modal{max-height:60vh;font-size:.75rem;padding:16px;bottom:calc(100% + 15px)}.login-logo .icon,.login-logo .wordmark{height:45px}}