:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{background:#03050a;overflow:hidden}#container,#container canvas{width:100%;height:100%}.temporalPanel{z-index:4;-webkit-backdrop-filter:blur(20px)saturate(120%);backdrop-filter:blur(20px)saturate(120%);background:linear-gradient(145deg,#040811d4,#04070d94);border:1px solid #b6daff2e;border-radius:2px;width:min(390px,100vw - 40px);padding:28px 30px 24px;position:fixed;top:clamp(22px,5vw,70px);left:clamp(20px,5vw,76px);box-shadow:0 28px 90px #00000070,inset 0 1px #ffffff0d}.temporalPanel:before{content:"";background:#7ce8ff;width:82px;height:1px;position:absolute;top:-1px;left:-1px;box-shadow:0 0 20px #38cfff}.temporalEyebrow,.temporalCaption span{color:#7ce8ff;letter-spacing:.19em;text-transform:uppercase;margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;font-weight:650}.temporalPanel h1{color:#f5f7ff;letter-spacing:-.055em;margin:15px 0 13px;font-family:Georgia,Times New Roman,serif;font-size:clamp(44px,5.2vw,72px);font-weight:400;line-height:.86}.temporalIntro{color:#dce7ffad;max-width:340px;margin:22px 0 26px;font-size:12px;line-height:1.75}.temporalMetrics{background:#9dc7ff1f;grid-template-columns:repeat(3,1fr);gap:1px;margin:0 0 22px;display:grid}.temporalMetrics div{background:#040810e0;padding:12px 10px}.temporalMetrics dt{color:#bacdeb70;letter-spacing:.14em;text-transform:uppercase;font-size:8px}.temporalMetrics dd{color:#eef4ff;margin:5px 0 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.temporalActions{gap:9px;display:flex}.temporalActions button{color:#e7f0ffd1;font:inherit;letter-spacing:.09em;text-transform:uppercase;cursor:pointer;background:#1c37563b;border:1px solid #97cdff33;border-radius:999px;flex:1;padding:10px 12px;font-size:10px;transition:border-color .16s,background .16s,color .16s}.temporalActions button:hover,.temporalActions button:focus-visible{color:#fff;background:#1d6c9047;border-color:#7ce8ffb3;outline:none}.temporalActions button[aria-pressed=false]{color:#ffca82}.temporalStatus{color:#d2e2fa78;letter-spacing:.08em;text-transform:uppercase;align-items:center;gap:9px;margin-top:18px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;display:flex}.temporalPulse{background:#7ce8ff;border-radius:50%;width:5px;height:5px;box-shadow:0 0 11px #34d9ff}.temporalCaption{z-index:4;text-align:right;position:fixed;bottom:clamp(20px,4vw,48px);right:clamp(20px,4vw,62px)}.temporalCaption p{color:#dce6fa7a;letter-spacing:.04em;margin:8px 0 0;font-size:10px}.temporalGrain{z-index:3;pointer-events:none;opacity:.05;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");position:fixed;inset:0}@media (max-width:720px){.temporalPanel{width:min(330px,100vw - 32px);padding:20px;top:16px;left:16px}.temporalPanel h1{font-size:43px}.temporalIntro{margin:16px 0 18px}.temporalCaption{display:none}}
