@font-face{font-family:'Barlow Condensed';src:url('/assets/fonts/barlow-condensed-900.ttf') format('truetype');font-weight:900;font-display:swap}
@font-face{font-family:'Barlow Condensed';src:url('/assets/fonts/barlow-condensed-black-italic.ttf') format('truetype');font-style:italic;font-weight:900;font-display:swap}
*{box-sizing:border-box}html{color-scheme:dark;background:#07040f}body{margin:0;color:#f6f4ff;font-family:Arial,Helvetica,sans-serif;isolation:isolate}
/* Decorative composited layers: no video, canvas loop or per-frame requests. */
.cosmos{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1;background:#07040f;contain:strict}
.cosmos:before{content:'';position:absolute;inset:-8%;opacity:.45;background-image:radial-gradient(circle,#fff 1px,transparent 1.6px),radial-gradient(circle,#70efff 1px,transparent 1.5px);background-size:113px 179px,193px 137px;background-position:12px 35px,87px 102px;animation:stardrift 80s linear infinite alternate}
.cosmos:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 110px #07040f}
.plasma{position:absolute;width:95%;height:42%;border-radius:46% 54% 63% 37% / 61% 40% 60% 39%;filter:blur(52px);opacity:.52;will-change:transform;animation:plasma-flow 29s ease-in-out infinite alternate;background:radial-gradient(ellipse at 40% 40%,#ff2bd6,#9b12ef88 46%,transparent 70%)}
.plasma.a{left:-42%;top:3%}.plasma.b{right:-43%;top:29%;background:radial-gradient(ellipse,#00eaff,#1951fc88 45%,transparent 70%);animation-delay:-17s;animation-duration:37s}.plasma.c{left:-35%;bottom:-8%;background:radial-gradient(ellipse,#ceff1699,#1cc6a888 45%,transparent 70%);animation-delay:-8s;animation-duration:43s}
.orbit{position:absolute;left:22%;top:10%;width:130%;height:74%;border:1px solid #af7fff24;border-radius:50%;transform:rotate(-26deg);box-shadow:0 0 60px #a63cff0c,inset 0 0 50px #9d32ff0e;animation:orbit-turn 64s ease-in-out infinite alternate}.orbit.second{left:-80%;top:30%;width:160%;height:65%;border-color:#16e8ff22;animation-delay:-32s}
.display{width:100%;min-height:100svh;padding:26px 24px 20px;display:flex;flex-direction:column;gap:12px}
.masthead{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:5px 0 14px;border-bottom:1px solid #a251d75c}.masthead img{width:94px}.masthead h1{font:900 italic clamp(36px,8.8vw,68px)/.95 'Barlow Condensed',Impact,sans-serif;letter-spacing:-.035em;margin:0;text-shadow:3px 3px 0 #f52fd536}.masthead em{color:#00efff;font-style:inherit}.eyebrow{width:100%;font:900 12px 'Barlow Condensed',sans-serif;letter-spacing:.3em;color:#cbff36}.eyebrow:before{content:'✦';margin-right:9px;color:#ff2bd6}
.tools{width:100%;display:flex;flex-wrap:wrap;gap:7px;margin-top:3px}.tools a,.tools button{font:900 13px 'Barlow Condensed',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#d2cfe6;background:#0f0b1cbb;border:1px solid #584065;border-radius:5px;padding:9px 11px;min-height:36px;text-decoration:none;cursor:pointer}.tools button:hover,.tools a:hover{border-color:#00efff;color:#00efff}.tools button[aria-pressed=true]{border-color:#ceff16;color:#ceff16}button:focus-visible,a:focus-visible{outline:3px solid #dcff30;outline-offset:3px}#awakeStatus:empty{display:none}#awakeStatus{margin:0;font-size:12px;color:#b9aed1}
.status{display:flex;align-items:center;gap:10px;font-size:11px;line-height:1.4;color:#bbafd2}.status:before{content:'';width:6px;height:6px;flex-shrink:0;border-radius:50%;background:#00efff;box-shadow:0 0 12px #00efff}.status time{margin-left:auto;font:900 20px 'Barlow Condensed',sans-serif;white-space:nowrap;color:#00efff}.status.error{color:#ffbe8c}.status.error:before{background:#ffbe8c;box-shadow:none}
.period-switcher{display:flex;align-items:center;gap:10px;min-height:36px;color:#d5c5e8;font:900 12px 'Barlow Condensed',Impact,sans-serif;letter-spacing:.12em}.period-switcher select{min-width:190px;max-width:100%;min-height:34px;padding:5px 10px;background:#100b20;border:1px solid #71548e;border-radius:6px;color:#f6f4ff;font:700 14px Arial,Helvetica,sans-serif}.period-switcher select:focus-visible{outline:3px solid #dcff30;outline-offset:2px}.period-switcher span{margin-left:auto;color:#cbff36;white-space:nowrap}
#data{display:flex;flex:1;flex-direction:column;gap:12px;width:100%;counter-reset:metric}#data[hidden]{display:none}
.stat-bubble{--accent:#00efff;counter-increment:metric;position:relative;isolation:isolate;overflow:hidden;flex:1;min-height:158px;width:100%;padding:17px 27px;border:1px solid color-mix(in srgb,var(--accent) 30%,#382149);border-left:4px solid var(--accent);border-radius:9px 32px 9px 32px;background:linear-gradient(115deg,#0d081df5 5%,#10091dd9 62%,#10091d88);box-shadow:0 9px 25px #0004;display:flex;flex-direction:column;justify-content:center}
.stat-bubble:before{content:counter(metric,decimal-leading-zero);position:absolute;right:24px;top:15px;font:900 13px 'Barlow Condensed',sans-serif;letter-spacing:.17em;color:var(--accent);opacity:.5}
.stat-bubble:after{content:'';position:absolute;z-index:-1;width:330px;height:330px;border-radius:44% 56% 65% 35%;right:-185px;top:-90px;border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);background:radial-gradient(ellipse at 30% 40%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 64%);box-shadow:0 0 0 18px color-mix(in srgb,var(--accent) 4%,transparent),0 0 0 45px color-mix(in srgb,var(--accent) 3%,transparent);animation:cell-flow 19s ease-in-out infinite alternate;animation-delay:calc(var(--index)*-2.7s);pointer-events:none}
.stat-bubble small{font:900 20px/1.1 'Barlow Condensed',Impact,sans-serif;letter-spacing:.085em;color:#e7dff3;padding-right:25px}.stat-bubble strong{font:900 italic clamp(48px,12vw,88px)/.97 'Barlow Condensed',Impact,sans-serif;letter-spacing:-.025em;color:var(--accent);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin:6px 0;text-shadow:2px 3px 0 #02000b,0 0 25px color-mix(in srgb,var(--accent) 21%,transparent)}.stat-bubble span{font-size:12px;line-height:1.4;color:#bcb2ce;max-width:92%}.stat-bubble.negative{--accent:#ff928e!important}
footer{margin-top:auto;display:flex;flex-direction:column;gap:4px;padding-top:8px;font-size:10px;line-height:1.4;color:#b0a3c6;overflow-wrap:anywhere}footer:before{content:'REV PRESS / SIGNAL OVER NOISE';font:900 12px 'Barlow Condensed',sans-serif;letter-spacing:.22em;color:#b48bdd;margin-bottom:2px}body:fullscreen{overflow:auto}
@keyframes plasma-flow{0%{transform:translate3d(0,-8%,0) rotate(-15deg) scale(.85)}50%{transform:translate3d(30%,12%,0) rotate(25deg) scale(1.2)}100%{transform:translate3d(5%,34%,0) rotate(-20deg) scale(.95)}}@keyframes stardrift{to{transform:translate3d(3%,-5%,0)}}@keyframes orbit-turn{to{transform:rotate(26deg) translate3d(7%,6%,0)}}@keyframes cell-flow{to{transform:translate3d(-55px,30px,0) rotate(95deg) scale(1.1)}}
.masthead{position:relative;flex-wrap:nowrap;gap:10px;padding-bottom:12px}.masthead h1{min-width:0;flex:1;font-size:clamp(28px,7.8vw,60px)}.display-menu{flex:none;position:relative;z-index:5}.display-menu summary{display:grid;place-items:center;width:44px;height:44px;list-style:none;cursor:pointer;border:1px solid #584065;border-radius:7px;background:#100b20;color:#00efff;font:26px Arial,sans-serif}.display-menu summary::-webkit-details-marker{display:none}.display-menu summary:focus-visible{outline:3px solid #dcff30;outline-offset:3px}.display-menu[open] summary{border-color:#00efff}.display-menu .tools{position:absolute;right:0;top:52px;width:min(260px,calc(100vw - 48px));margin:0;padding:12px;display:flex;flex-direction:column;gap:8px;background:#100b20;border:1px solid #72508c;border-radius:10px;box-shadow:0 15px 40px #000a}.display-menu .tools a,.display-menu .tools button{width:100%;min-height:44px;text-align:left}.display-menu #awakeStatus{line-height:1.4}
.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}
/* Independent, slowly changing rhythms: luminous movement without flashing. */
.stat-bubble{animation:metric-float var(--float-duration,18s) ease-in-out var(--float-delay,0s) infinite alternate}
.stat-bubble strong{max-width:96%;transform-origin:left center;animation:metric-pulse var(--pulse-duration,8s) ease-in-out var(--pulse-delay,0s) infinite}
.stat-bubble small{animation:label-breathe var(--label-duration,12s) ease-in-out var(--label-delay,0s) infinite alternate}
.stat-bubble:after{animation-duration:var(--cell-duration,19s);animation-delay:var(--cell-delay,0s)}
.cosmos:before{animation:stardrift 53s linear infinite alternate,star-breathe 17s ease-in-out infinite alternate}
.plasma.a{animation-duration:21s}.plasma.b{animation-duration:29s}.plasma.c{animation-duration:33s}
.orbit{animation-duration:43s}.orbit.second{animation-duration:59s}
@keyframes metric-pulse{0%,100%{transform:scale(1);filter:brightness(1)}38%{transform:scale(var(--pulse-scale,1.025));filter:brightness(1.16)}65%{transform:scale(.992);filter:brightness(1.02)}}
@keyframes metric-float{0%{transform:translate3d(0,2px,0)}48%{transform:translate3d(var(--float-x,1px),-2px,0)}100%{transform:translate3d(0,-3px,0)}}
@keyframes label-breathe{from{opacity:.86}to{opacity:1}}
@keyframes star-breathe{from{opacity:.3}to{opacity:.65}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important}.plasma{will-change:auto}}
@media(max-width:500px){.display{padding:16px 12px}.masthead img{width:76px}.masthead h1{font-size:42px}.stat-bubble{padding:18px 20px;min-height:150px}.stat-bubble small{font-size:17px}.stat-bubble strong{font-size:clamp(45px,13.5vw,67px)}.stat-bubble span{font-size:11px}.plasma{filter:blur(32px)}.tools a,.tools button{min-height:44px}.status{flex-wrap:wrap}}
@media(max-width:500px){.masthead img{width:60px}.masthead h1{font-size:clamp(26px,7.7vw,38px)}}
@media(max-width:500px){.period-switcher{flex-wrap:wrap;gap:5px}.period-switcher select{flex:1;min-width:0}.period-switcher span{width:100%;margin-left:0}}
.stat-bubble:has(.month-comparison){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);column-gap:22px;align-content:center}
.stat-bubble:has(.month-comparison)>small{grid-column:2;grid-row:1}
.stat-bubble:has(.month-comparison)>strong{grid-column:2;grid-row:2;min-width:0}
.stat-bubble:has(.month-comparison)>span{grid-column:2;grid-row:3}
.stat-bubble .month-comparison{grid-column:1;grid-row:1 / 4;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;margin:0;padding-right:14px;border-right:1px solid #ffffff24;font:600 clamp(11px,1.5vw,18px)/1.4 system-ui,sans-serif;overflow-wrap:anywhere}
.stat-bubble .month-comparison span{font-size:inherit;color:#bbc3cf}
.month-comparison b{font-size:inherit;padding:3px 10px;border-radius:20px;background:#ffffff0a}
.month-comparison .better{color:#73ee9a}.month-comparison .worse{color:#ff7682}.month-comparison .neutral{color:#bbc3cf}
@media(max-width:500px){.stat-bubble:has(.month-comparison){column-gap:12px;grid-template-columns:minmax(0,1fr) minmax(0,2.6fr)}.stat-bubble:has(.month-comparison)>strong{font-size:clamp(32px,9vw,48px)}.stat-bubble .month-comparison{padding-right:8px}.month-comparison b{padding:3px 5px}}
