:root {
  --black: #020509;
  --ink: #06101a;
  --navy: #003865;
  --blue: #009fdf;
  --ice: #71c5e8;
  --white: #eff8ff;
  --mist: #91a8b6;
  --red: #1668d5;
  --green: #39f0bc;
  --amber: #ffb14a;
  --display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --mono: "DM Mono", ui-monospace, monospace;
  --header-h: clamp(54px, 7.1vh, 78px);
  --footer-h: clamp(116px, 16.5vh, 178px);
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #000; }
body { color: var(--white); font-family: var(--display); }
button, input, select { font: inherit; }
button { cursor: pointer; }

.performance-system {
  position: relative;
  width: 100vw;
  height: 100vh;
  min-width: 960px;
  min-height: 540px;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 50% 34%, rgba(0, 70, 122, .25), transparent 38%),
    radial-gradient(ellipse at 50% 90%, rgba(0, 159, 223, .12), transparent 35%),
    linear-gradient(180deg, #02060b 0%, #03080e 55%, #010306 100%);
}

.ambient { position: absolute; inset: 0; z-index: -4; pointer-events: none; overflow: hidden; }
.ambient-grid {
  position: absolute; inset: 7% 2% 15%; opacity: .2;
  background-image:
    linear-gradient(rgba(113,197,232,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(113,197,232,.06) 1px, transparent 1px);
  background-size: 58px 58px;
  transform: perspective(760px) rotateX(64deg) translateY(26%);
  mask-image: linear-gradient(transparent, #000 34%, #000 68%, transparent);
  animation: grid-drive 7s linear infinite;
}
.ambient-scan {
  position: absolute; inset: -30% 0; opacity: .22;
  background: linear-gradient(180deg, transparent 42%, rgba(113,197,232,.3) 49.8%, rgba(255,255,255,.6) 50%, transparent 50.4%);
  animation: scan-screen 7s ease-in-out infinite;
}
.ambient-orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .18; }
.orb-a { width: 36vw; height: 36vw; left: -18vw; top: 18%; background: var(--blue); animation: orb-breathe 9s ease-in-out infinite; }
.orb-b { width: 28vw; height: 28vw; right: -12vw; top: 30%; background: var(--red); animation: orb-breathe 11s ease-in-out infinite reverse; }
.speed-lines {
  position: absolute; inset: 12% 20% 12%; opacity: .18;
  background: repeating-conic-gradient(from 90deg at 50% 52%, transparent 0deg 3deg, rgba(0,159,223,.26) 3.1deg 3.2deg);
  mask-image: radial-gradient(ellipse, #000, transparent 70%);
  animation: speed-pulse 4.8s ease-in-out infinite;
}

.instrument-frame { position: absolute; inset: 6px 10px calc(var(--footer-h) - 4px); z-index: -1; pointer-events: none; }
.instrument-frame::before {
  content: ""; position: absolute; inset: 0;
  border: 1px solid rgba(113,197,232,.27);
  clip-path: polygon(5% 0, 37% 0, 40% 3%, 60% 3%, 63% 0, 95% 0, 100% 8%, 100% 92%, 95% 100%, 5% 100%, 0 92%, 0 8%);
  box-shadow: inset 0 0 60px rgba(0,159,223,.05), 0 0 20px rgba(0,159,223,.07);
}
.instrument-frame::after {
  content: ""; position: absolute; inset: 9px 13px;
  border-top: 2px solid rgba(0,159,223,.38); border-bottom: 1px solid rgba(113,197,232,.14);
  clip-path: polygon(0 0, 33% 0, 36% 100%, 64% 100%, 67% 0, 100% 0, 100% 100%, 0 100%);
}
.frame-corner { position: absolute; width: 8.5vw; height: 3px; background: linear-gradient(90deg, transparent, var(--blue)); box-shadow: 0 0 14px var(--blue); }
.fc-1 { left: 2%; top: 3.2%; transform: rotate(-7deg); }.fc-2 { right: 2%; top: 3.2%; transform: rotate(7deg) scaleX(-1); }
.fc-3 { left: 3%; bottom: 2%; transform: rotate(5deg); }.fc-4 { right: 3%; bottom: 2%; transform: rotate(-5deg) scaleX(-1); }
.frame-pulse { position: absolute; top: 16%; bottom: 12%; width: 3px; background: linear-gradient(transparent, var(--blue), transparent); box-shadow: 0 0 12px var(--blue); animation: frame-pulse 3.5s ease-in-out infinite; }
.frame-pulse.left { left: 1px; }.frame-pulse.right { right: 1px; animation-delay: -1.7s; }

.system-header {
  height: var(--header-h); margin: 0 clamp(20px, 3vw, 58px); padding: 0 clamp(8px, 1vw, 18px);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  border-bottom: 1px solid rgba(113,197,232,.17); position: relative; z-index: 20;
}
.system-header::after { content: ""; position: absolute; left: 38%; right: 38%; bottom: -1px; height: 2px; background: var(--blue); box-shadow: 0 0 17px var(--blue); }
.brand-lockup { display: flex; align-items: center; gap: 12px; min-width: 0; }
.brand-lockup img { width: clamp(38px, 3.4vw, 58px); height: clamp(38px, 3.4vw, 58px); object-fit: contain; object-position: center; filter: drop-shadow(0 0 9px rgba(0,159,223,.32)); }
.brand-lockup div { display: grid; line-height: .86; border-left: 1px solid rgba(113,197,232,.24); padding-left: 12px; }
.brand-lockup b { font-size: clamp(14px, 1.35vw, 23px); letter-spacing: .18em; font-weight: 800; }
.brand-lockup span { font: 500 clamp(7px, .58vw, 10px)/1.5 var(--mono); letter-spacing: .26em; color: var(--ice); }
.mode-lockup { text-align: center; display: grid; justify-items: center; gap: 1px; min-width: clamp(220px, 28vw, 500px); }
.mode-lockup span { font: 500 clamp(7px, .65vw, 11px)/1 var(--mono); letter-spacing: .26em; color: var(--mist); }
.mode-lockup strong { font-size: clamp(17px, 1.75vw, 30px); font-weight: 700; font-style: italic; letter-spacing: .14em; }
.mode-lockup i { width: 60%; height: 2px; margin-top: 4px; background: linear-gradient(90deg, transparent, var(--blue), transparent); box-shadow: 0 0 10px var(--blue); }
.live-lockup { justify-self: end; display: flex; align-items: center; gap: clamp(9px, 1.2vw, 22px); font-family: var(--mono); white-space: nowrap; }
.header-loop { height:30px;padding:0 9px;border:1px solid rgba(113,197,232,.25);background:rgba(2,8,14,.75);color:var(--mist);display:flex;align-items:center;gap:6px;border-radius:4px;font:500 clamp(6px,.5vw,8px)/1 var(--mono);letter-spacing:.08em; }
.header-loop i { width:7px;height:7px;border-radius:50%;background:#40515d; }.header-loop.active{color:var(--green);border-color:rgba(57,240,188,.36)}.header-loop.active i{background:var(--green);box-shadow:0 0 8px var(--green)}
.live-badge { color: white; background: rgba(22,104,213,.13); border: 1px solid rgba(113,197,232,.52); padding: 6px 10px; transform: skew(-10deg); font-size: clamp(9px, .8vw, 13px); font-weight: 700; box-shadow: 0 0 18px rgba(0,159,223,.16); }
.live-badge i { display: inline-block; width: 7px; height: 7px; background: var(--red); border-radius: 50%; margin-right: 5px; box-shadow: 0 0 11px var(--red); animation: live-blink 1.6s infinite; }
.data-link { font-size: clamp(7px, .58vw, 10px); color: var(--mist); letter-spacing: .08em; }
.data-link.online { color: var(--green); }.data-link.retrying { color: var(--amber); }
.system-date { font-size: clamp(8px, .65vw, 11px); color: var(--mist); letter-spacing: .12em; }
.system-clock { font-size: clamp(12px, 1vw, 17px); letter-spacing: .07em; padding-left: 13px; border-left: 1px solid rgba(113,197,232,.2); }

.screens { position: absolute; left: 0; right: 0; top: var(--header-h); bottom: var(--footer-h); overflow: hidden; }
.mode-screen {
  position: absolute; inset: 0; padding: clamp(12px, 1.7vh, 24px) clamp(26px, 3vw, 60px) clamp(8px, 1vh, 14px);
  opacity: 0; visibility: hidden; transform: scale(.985) translateX(22px); filter: blur(8px);
  transition: opacity .65s ease, transform .8s cubic-bezier(.2,.75,.15,1), filter .65s ease, visibility .65s;
}
.mode-screen.active { opacity: 1; visibility: visible; transform: none; filter: none; z-index: 2; }
.mode-screen.leaving { opacity: 0; transform: scale(1.02) translateX(-26px); filter: blur(7px); }
.screen-glow { position: absolute; inset: 0; pointer-events: none; z-index: -1; }
.glow-red { background: radial-gradient(circle at 48% 48%, rgba(0,159,223,.13), transparent 32%), radial-gradient(circle at 17% 50%, rgba(22,104,213,.12), transparent 24%); }
.glow-blue { background: radial-gradient(circle at 50% 38%, rgba(0,159,223,.18), transparent 40%); }
.glow-split { background: linear-gradient(90deg, rgba(0,159,223,.1), transparent 42%, transparent 58%, rgba(22,104,213,.11)); }
.glow-values { background: radial-gradient(ellipse at 50% 44%, rgba(0,159,223,.15), transparent 55%); }
.panel-glass { background: linear-gradient(145deg, rgba(8,19,31,.91), rgba(3,8,14,.7)); border: 1px solid rgba(113,197,232,.18); box-shadow: inset 0 0 35px rgba(0,159,223,.035), 0 20px 55px rgba(0,0,0,.35); }

/* Company power */
.company-stage { height:100%;display:grid;grid-template-columns:minmax(245px,1fr) minmax(300px,1.15fr) minmax(245px,1fr);grid-template-rows:auto 1fr auto;gap:clamp(10px,1.3vw,24px);position:relative; }
.company-heading { grid-column:1 / 4;text-align:center;padding:.2vh 0 .8vh; }
.company-heading span { font:500 clamp(7px,.62vw,10px)/1 var(--mono);letter-spacing:.24em;color:var(--ice); }
.company-heading h1 { margin:2px 0 0;font-size:clamp(32px,4vw,70px);line-height:.82;font-style:italic;letter-spacing:.04em; }.company-heading h1 em{color:var(--blue);font-style:inherit}.company-heading p{margin:7px 0 0;font:500 clamp(7px,.6vw,10px)/1 var(--mono);letter-spacing:.16em;color:var(--mist)}
.company-core { grid-column:2;grid-row:2;align-self:center;justify-self:center;width:min(28vw,43vh);aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;background:radial-gradient(circle,rgba(0,159,223,.17),rgba(2,8,14,.82) 52%,transparent 68%); }
.company-core>img{width:27%;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 0 14px rgba(0,159,223,.48));z-index:2}.company-core>small{font:500 clamp(6px,.54vw,9px)/1 var(--mono);letter-spacing:.16em;color:var(--mist);z-index:2;margin-top:5px}.company-core>strong{font-size:clamp(50px,6vw,104px);line-height:.8;font-style:italic;z-index:2}.company-core>span{font-size:clamp(12px,1.1vw,19px);color:var(--blue);font-weight:800;font-style:italic;z-index:2}
.company-rings{position:absolute;inset:0}.company-rings i{position:absolute;inset:0;border-radius:50%;border:4px solid;border-color:var(--blue) transparent var(--ice);filter:drop-shadow(0 0 8px var(--blue));animation:gauge-rotate 12s linear infinite}.company-rings i:nth-child(2){inset:11%;border-width:1px;border-style:dashed;animation-duration:18s;animation-direction:reverse}.company-rings i:nth-child(3){inset:23%;border-color:rgba(113,197,232,.35) transparent;animation-duration:8s}
.company-metrics { grid-column:1;grid-row:2;display:grid;grid-template-columns:1fr 1fr;gap:clamp(7px,1vh,12px);align-self:stretch; }
.company-metric { border:1px solid rgba(113,197,232,.2);background:linear-gradient(145deg,rgba(7,21,34,.92),rgba(2,7,12,.64));padding:clamp(8px,1vw,16px);display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;clip-path:polygon(7% 0,100% 0,100% 88%,93% 100%,0 100%,0 12%)}
.company-metric::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 25%,rgba(113,197,232,.09),transparent 65%);animation:card-sweep 4.6s linear infinite}.company-metric span{font-size:clamp(12px,1.2vw,20px);font-weight:800;font-style:italic;color:var(--blue)}.company-metric strong{font-size:clamp(36px,4vw,70px);line-height:.85;font-style:italic}.company-metric small{font:500 clamp(6px,.5vw,8px)/1 var(--mono);color:var(--mist);letter-spacing:.1em;margin-top:5px}.company-metric i{display:block;height:3px;margin-top:8px;background:linear-gradient(90deg,var(--blue) var(--w),rgba(113,197,232,.1) var(--w));box-shadow:0 0 7px rgba(0,159,223,.4)}
.company-markets { grid-column:3;grid-row:2;border-left:1px solid rgba(113,197,232,.16);padding-left:clamp(12px,1.4vw,24px); }
.company-markets-head{display:grid;padding-bottom:1vh;border-bottom:1px solid rgba(113,197,232,.14)}.company-markets-head b{font-size:clamp(18px,1.8vw,31px);font-style:italic}.company-markets-head span{font:500 clamp(6px,.5vw,8px)/1 var(--mono);color:var(--mist);letter-spacing:.12em}.company-market-bars{display:grid;gap:clamp(6px,.85vh,10px);padding-top:1.2vh}.market-power-row div{display:flex;justify-content:space-between;align-items:baseline}.market-power-row b{font-size:clamp(11px,1vw,17px)}.market-power-row span{font:500 clamp(7px,.56vw,9px)/1 var(--mono);color:var(--ice)}.market-power-row i{display:block;height:4px;margin-top:4px;background:linear-gradient(90deg,var(--blue) var(--w),rgba(113,197,232,.09) var(--w));box-shadow:0 0 7px rgba(0,159,223,.32)}
.company-conversion { grid-column:1 / 4;grid-row:3;display:grid;grid-template-columns:repeat(4,1fr);gap:8px; }
.conversion-module{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:6px 10px;border-top:1px solid rgba(113,197,232,.2);background:rgba(3,10,17,.6)}.conversion-module>span{font:500 clamp(7px,.55vw,9px)/1 var(--mono);color:var(--mist)}.conversion-module i{height:3px;background:linear-gradient(90deg,var(--blue) var(--w),rgba(113,197,232,.1) var(--w))}.conversion-module b{font-size:clamp(15px,1.5vw,25px);color:var(--ice)}

/* Company top 10 championship */
#screen-ranking { display:block; }
.ranking-championship{height:100%;display:grid;grid-template-rows:auto 1fr;gap:clamp(8px,1vh,13px)}
.championship-heading{display:flex;align-items:flex-end;justify-content:space-between;border-bottom:1px solid rgba(113,197,232,.15);padding:0 1vw .7vh}.championship-heading>div span{font:500 clamp(7px,.6vw,10px)/1 var(--mono);letter-spacing:.22em;color:var(--ice)}.championship-heading h1{margin:0;font-size:clamp(34px,4.2vw,74px);line-height:.78;font-style:italic}.championship-heading h1 em{color:var(--blue);font-style:inherit}.championship-heading p{margin:0;display:grid;text-align:right;gap:5px}.championship-heading p strong{font-size:clamp(20px,2vw,34px);font-style:italic}.championship-heading p span{font:500 clamp(7px,.56vw,9px)/1 var(--mono);letter-spacing:.13em;color:var(--mist)}
.ranking-arena{min-height:0;display:grid;grid-template-columns:1.13fr .9fr .92fr;gap:clamp(10px,1.3vw,22px)}
.top-three{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1.15fr .85fr;gap:clamp(7px,.8vw,12px);min-height:0}
.podium-card{position:relative;overflow:hidden;border:1px solid rgba(113,197,232,.25);background:linear-gradient(145deg,rgba(8,24,39,.94),rgba(2,7,12,.72));color:white;text-align:left;padding:0;clip-path:polygon(5% 0,95% 0,100% 8%,100% 92%,95% 100%,5% 100%,0 92%,0 8%)}.podium-card.place-1{grid-column:1 / 3;border-color:rgba(113,197,232,.62);box-shadow:inset 0 0 30px rgba(0,159,223,.08)}.podium-card::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 25%,rgba(113,197,232,.12),transparent 65%);animation:card-sweep 4.5s linear infinite;pointer-events:none}.podium-card.active{outline:2px solid var(--blue);outline-offset:-3px}.podium-image{position:absolute;inset:0 43% 0 0;background:#071522}.place-2 .podium-image,.place-3 .podium-image{right:54%}.podium-image img{width:100%;height:100%;object-fit:cover;object-position:center 22%;filter:saturate(.9)}.podium-image .initials{width:100%;height:100%;display:grid;place-items:center;font-size:4vw;font-weight:900;color:var(--ice)}.podium-image::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 45%,rgba(2,7,12,.95))}.podium-copy{position:absolute;z-index:2;right:4%;top:50%;width:51%;transform:translateY(-50%)}.place-2 .podium-copy,.place-3 .podium-copy{width:51%;right:2%}.podium-rank{display:block;font-size:clamp(27px,3.2vw,56px);line-height:.8;font-weight:900;font-style:italic;color:var(--blue);text-shadow:0 0 13px rgba(0,159,223,.4)}.podium-copy b{display:block;font-size:clamp(15px,1.55vw,28px);line-height:.92;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.podium-copy small{display:block;font:500 clamp(6px,.5vw,8px)/1.5 var(--mono);color:var(--ice)}.podium-points{display:flex;align-items:baseline;gap:5px;margin-top:5px}.podium-points strong{font-size:clamp(22px,2.4vw,42px);line-height:.8}.podium-points span{font-size:clamp(9px,.8vw,14px);color:var(--mist)}.podium-move{position:absolute;right:3%;top:7%;z-index:3;font:500 clamp(7px,.55vw,9px)/1 var(--mono);color:var(--green)}
.rank-inspector{min-height:0;border:1px solid rgba(113,197,232,.2);background:radial-gradient(circle at 50% 28%,rgba(0,159,223,.17),rgba(2,7,12,.82) 67%);display:grid;grid-template-rows:1.35fr auto auto;align-items:end;position:relative;overflow:hidden;clip-path:polygon(7% 0,93% 0,100% 7%,100% 93%,93% 100%,7% 100%,0 93%,0 7%)}.inspector-photo{position:absolute;left:7%;right:7%;top:2%;height:56%;overflow:hidden;clip-path:polygon(14% 0,86% 0,100% 16%,91% 100%,9% 100%,0 16%);background:#071522}.inspector-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%}.inspector-photo>div{width:100%;height:100%;display:grid;place-items:center;font-size:6vw;font-weight:900;color:rgba(113,197,232,.35)}.inspector-photo i{position:absolute;left:0;right:0;top:10%;height:2px;background:var(--ice);box-shadow:0 0 12px var(--blue);animation:portrait-scan 4.5s ease-in-out infinite}.inspector-copy{grid-row:2;text-align:center;z-index:2;padding:5px 8px}.inspector-copy>span{font:500 clamp(7px,.58vw,10px)/1 var(--mono);color:var(--blue);letter-spacing:.13em}.inspector-copy h2{margin:3px 0 0;font-size:clamp(23px,2.5vw,44px);line-height:.85;font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inspector-copy p{margin:5px 0 0;font:500 clamp(7px,.58vw,10px)/1 var(--mono);color:var(--ice);letter-spacing:.12em}.inspector-copy>strong{display:block;font-size:clamp(34px,4vw,68px);line-height:.82;margin-top:6px}.inspector-copy>small{font:500 clamp(6px,.5vw,8px)/1 var(--mono);color:var(--mist)}.inspector-metrics{grid-row:3;display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:0 7px 8px;z-index:2}.inspector-metric{padding:5px 2px;text-align:center;background:rgba(5,17,28,.84);border-top:1px solid rgba(113,197,232,.2)}.inspector-metric strong{display:block;font-size:clamp(17px,1.75vw,30px);line-height:.9}.inspector-metric span{font:500 clamp(5px,.43vw,7px)/1 var(--mono);color:var(--mist)}
.rank-chasers{min-height:0;padding:clamp(8px,.9vw,14px);display:grid;grid-template-rows:auto 1fr;border-radius:8px}.chasers-head{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:7px;border-bottom:1px solid rgba(113,197,232,.13)}.chasers-head b{font-size:clamp(19px,1.9vw,33px);font-style:italic}.chasers-head span{font:500 clamp(6px,.5vw,8px)/1 var(--mono);color:var(--mist)}.rank-chasers #rank-list{display:grid;grid-template-rows:repeat(7,1fr);gap:4px;padding-top:6px;min-height:0}.chaser-row{min-height:0;display:grid;grid-template-columns:clamp(28px,2.5vw,42px) clamp(30px,2.7vw,46px) 1fr auto;align-items:center;gap:7px;padding:3px 6px;border:1px solid rgba(113,197,232,.1);background:rgba(4,13,22,.66);color:white;text-align:left;border-radius:5px}.chaser-row.active{border-color:var(--blue);background:rgba(0,56,101,.24)}.chaser-row>.rank-position{font-size:clamp(18px,1.8vw,31px)}.chaser-row .rank-avatar{width:clamp(30px,2.7vw,46px);height:clamp(30px,2.7vw,46px)}.chaser-info{min-width:0}.chaser-info b{display:block;font-size:clamp(10px,.9vw,15px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chaser-info span{font:500 clamp(5px,.45vw,7px)/1 var(--mono);color:var(--ice)}.chaser-score{text-align:right}.chaser-score strong{display:block;font-size:clamp(13px,1.2vw,21px)}.chaser-score small{font:500 clamp(5px,.4vw,7px)/1 var(--mono);color:var(--mist)}

/* Ranking */
#screen-ranking { display: grid; grid-template-columns: minmax(270px, 27vw) 1fr minmax(265px, 26vw); gap: clamp(12px, 1.6vw, 30px); }
.ranking-rail { border-radius: 11px; padding: clamp(12px, 1.5vw, 24px); position: relative; overflow: hidden; }
.ranking-rail::before { content: ""; position: absolute; left: 0; top: 0; width: 3px; height: 28%; background: var(--red); box-shadow: 0 0 15px var(--red); }
.panel-heading { height: clamp(48px, 7.2vh, 75px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(113,197,232,.12); }
.panel-heading div { display: flex; align-items: baseline; gap: 7px; font-style: italic; }
.panel-heading span { color: var(--blue); font-size: clamp(22px, 2.1vw, 38px); font-weight: 700; }
.panel-heading strong { color: white; font-size: clamp(37px, 3.5vw, 62px); font-weight: 900; line-height: .8; }
.panel-heading p { margin: 0; font: 500 clamp(7px, .61vw, 10px)/1 var(--mono); letter-spacing: .17em; color: var(--mist); }
.rank-list { display: grid; height: calc(100% - clamp(76px, 10vh, 104px)); gap: clamp(4px, .65vh, 8px); padding-top: clamp(8px, 1vh, 12px); }
.rank-entry {
  min-height: 0; display: grid; grid-template-columns: clamp(36px, 3.5vw, 58px) clamp(38px, 3.5vw, 60px) 1fr auto; align-items: center; gap: clamp(7px, .8vw, 13px);
  padding: 4px clamp(7px, .8vw, 13px); border: 1px solid rgba(113,197,232,.11); border-radius: 7px;
  background: linear-gradient(90deg, rgba(8,24,39,.84), rgba(4,10,17,.3)); position: relative; overflow: hidden;
  animation: rank-entry-in .6s both;
}
.rank-entry::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: var(--rank-width, 0%); background: linear-gradient(90deg, var(--blue), var(--ice)); box-shadow: 0 0 8px var(--blue); transition: width 1s ease; }
.rank-entry.is-first { border-color: rgba(77,145,237,.46); background: linear-gradient(90deg, rgba(12,50,102,.42), rgba(6,12,20,.6)); }
.rank-entry.is-first::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 20%, rgba(77,145,237,.1) 48%, transparent 72%); animation: card-sweep 4s linear infinite; }
.rank-position { font-size: clamp(26px, 2.7vw, 48px); font-weight: 900; font-style: italic; color: rgba(145,168,182,.48); line-height: 1; }
.is-first .rank-position { color: var(--red); text-shadow: 0 0 16px rgba(77,145,237,.42); }
.rank-avatar { width: clamp(34px, 3.2vw, 56px); height: clamp(34px, 3.2vw, 56px); border-radius: 7px; overflow: hidden; border: 1px solid rgba(113,197,232,.36); background: #0b1b2a; position: relative; }
.rank-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center 24%; }
.rank-avatar .initials { display: grid; place-items: center; width: 100%; height: 100%; color: var(--ice); font-weight: 800; font-size: 16px; }
.rank-info { min-width: 0; position: relative; }
.rank-info b { display: block; font-size: clamp(13px, 1.1vw, 19px); line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: .02em; }
.rank-info span { font: 500 clamp(7px, .58vw, 10px)/1.7 var(--mono); color: var(--ice); letter-spacing: .11em; }
.rank-entry output { font-size: clamp(16px, 1.45vw, 25px); font-weight: 800; color: white; }
.rank-entry output small { font: 500 8px/1 var(--mono); color: var(--mist); }
.rank-pager { height: 24px; display: flex; align-items: center; justify-content: space-between; font: 500 8px/1 var(--mono); color: var(--mist); letter-spacing: .17em; }
.rank-pager i { width: 42%; height: 2px; background: linear-gradient(90deg, rgba(0,159,223,.2), var(--blue)); animation: pager-pulse 2.6s ease-in-out infinite; }

.leader-stage { position: relative; min-width: 0; overflow: hidden; display: flex; align-items: flex-end; justify-content: center; }
.leader-stage::before { content: ""; position: absolute; left: 7%; right: 7%; bottom: 3%; height: 23%; background: radial-gradient(ellipse, rgba(0,159,223,.24), transparent 65%); filter: blur(18px); }
.leader-gauge { position: absolute; width: min(42vw, 68vh); aspect-ratio: 1; left: 50%; top: 47%; transform: translate(-50%, -50%); border-radius: 50%; }
.gauge-ring { position: absolute; border-radius: 50%; inset: 0; border: 1px solid rgba(113,197,232,.18); }
.ring-a { inset: 4%; border-width: 4px; border-color: var(--blue) transparent rgba(113,197,232,.18); filter: drop-shadow(0 0 8px var(--blue)); animation: gauge-rotate 13s linear infinite; }
.ring-b { inset: 13%; border: 2px dashed rgba(113,197,232,.38); animation: gauge-rotate 20s linear infinite reverse; }
.ring-c { inset: 23%; border-width: 1px; border-color: rgba(77,145,237,.4) transparent; animation: gauge-rotate 7s linear infinite; }
.gauge-sweep { position: absolute; inset: 1%; border-radius: 50%; background: conic-gradient(from 220deg, transparent 0deg 220deg, rgba(0,159,223,.08) 260deg, var(--blue) 294deg, transparent 298deg); filter: drop-shadow(0 0 10px var(--blue)); animation: gauge-breathe 3s ease-in-out infinite; }
.gauge-scale { position: absolute; inset: 0; font: 500 clamp(7px, .62vw, 10px)/1 var(--mono); color: rgba(239,248,255,.65); }
.gauge-scale i { position: absolute; font-style: normal; }.gauge-scale i:nth-child(1){left:2%;top:52%}.gauge-scale i:nth-child(2){left:15%;top:17%}.gauge-scale i:nth-child(3){left:48%;top:1%}.gauge-scale i:nth-child(4){right:13%;top:18%}.gauge-scale i:nth-child(5){right:0;top:52%}
.leader-photo-shell { position: absolute; width: min(30vw, 48vh); height: 78%; bottom: 6%; left: 50%; transform: translateX(-50%); overflow: hidden; clip-path: polygon(18% 0, 82% 0, 100% 18%, 92% 100%, 8% 100%, 0 18%); filter: drop-shadow(0 18px 25px rgba(0,0,0,.55)); }
.leader-photo-shell::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 38%, rgba(2,5,9,.2) 66%, #020509 96%); }
.leader-photo-shell img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; display: block; filter: contrast(1.04) saturate(.9); }
.portrait-fallback { position: absolute; inset: 0; display: grid; place-items: center; font-size: 8vw; font-weight: 900; color: rgba(113,197,232,.2); background: radial-gradient(circle, rgba(0,159,223,.2), #06101a 68%); }
.portrait-scan { position: absolute; left: 0; right: 0; height: 2px; top: 25%; background: var(--ice); box-shadow: 0 0 14px var(--blue); opacity: .35; animation: portrait-scan 5s ease-in-out infinite; }
.leader-plate { position: relative; z-index: 4; width: min(92%, 650px); text-align: center; margin-bottom: 0; padding: 8px 8% 3px; clip-path: polygon(9% 0, 91% 0, 100% 28%, 91% 100%, 9% 100%, 0 28%); background: linear-gradient(180deg, rgba(10,25,39,.95), rgba(3,8,14,.97)); border-top: 1px solid rgba(113,197,232,.65); filter: drop-shadow(0 0 16px rgba(0,159,223,.18)); }
.leader-rank { color: var(--red); font-size: clamp(17px, 1.7vw, 30px); font-weight: 900; font-style: italic; text-shadow: 0 0 14px rgba(77,145,237,.42); }
.leader-plate h1 { margin: -2px 0 0; font-size: clamp(30px, 3.25vw, 58px); line-height: .92; font-weight: 900; font-style: italic; letter-spacing: .02em; white-space: nowrap; }
.leader-plate p { margin: 4px 0 0; font: 600 clamp(9px, .95vw, 16px)/1 var(--mono); color: var(--blue); letter-spacing: .13em; }
.leader-score { display: flex; align-items: baseline; justify-content: center; gap: 8px; margin-top: 4px; }
.leader-score strong { font-size: clamp(34px, 4vw, 68px); line-height: .9; font-style: italic; }
.leader-score span { font-size: clamp(16px, 1.5vw, 26px); color: var(--blue); font-weight: 800; font-style: italic; }

.metric-stack { display: grid; grid-template-rows: repeat(4,1fr); gap: clamp(6px, .9vh, 12px); align-self: stretch; }
.metric-card { position: relative; overflow: hidden; display: grid; grid-template-columns: clamp(42px, 4.2vw, 68px) 1fr minmax(50px, 7vw); align-items: center; gap: clamp(8px, .8vw, 14px); padding: clamp(8px, .8vw, 14px); background: linear-gradient(105deg, rgba(7,19,31,.94), rgba(2,7,12,.82)); border: 1px solid rgba(113,197,232,.22); clip-path: polygon(4% 0, 95% 0, 100% 25%, 96% 100%, 4% 100%, 0 75%, 0 20%); }
.metric-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(113,197,232,.07), transparent 70%); transform: translateX(-100%); animation: card-sweep 4.8s linear infinite; }
.metric-icon { aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; color: var(--ice); border: 2px solid rgba(0,159,223,.65); box-shadow: inset 0 0 18px rgba(0,159,223,.12), 0 0 12px rgba(0,159,223,.15); font-size: clamp(17px, 1.8vw, 30px); font-weight: 800; }
.metric-copy { display: grid; align-content: center; }
.metric-copy span { font-size: clamp(13px, 1.35vw, 23px); font-style: italic; font-weight: 800; color: var(--blue); line-height: 1; }
.metric-copy strong { font-size: clamp(32px, 3.7vw, 65px); line-height: .86; font-style: italic; }
.spark-bars { height: 60%; display: flex; align-items: flex-end; gap: 2px; border-bottom: 1px solid rgba(113,197,232,.25); }
.spark-bars i { flex: 1; height: var(--h); background: linear-gradient(var(--ice), var(--blue)); box-shadow: 0 0 5px rgba(0,159,223,.45); animation: spark-rise 1s both; transform-origin: bottom; }

/* Pipeline */
.pipeline-stage { height: 100%; display: grid; grid-template-columns: 1fr minmax(220px, 26vw); grid-template-rows: auto 1fr; gap: clamp(12px, 1.5vw, 28px); position: relative; }
.pipeline-headline { align-self: start; padding: 1vh 1vw; }
.pipeline-headline span, .values-heading span { font: 500 clamp(8px, .68vw, 12px)/1 var(--mono); color: var(--ice); letter-spacing: .22em; }
.pipeline-headline h2, .values-heading h2 { margin: 2px 0 0; font-size: clamp(32px, 4vw, 72px); line-height: .9; font-style: italic; letter-spacing: .03em; }
.pipeline-headline h2 em, .values-heading h2 em { color: var(--blue); font-style: inherit; }
.pipeline-headline p, .values-heading p { margin: 8px 0 0; color: var(--mist); font-size: clamp(12px, 1vw, 18px); letter-spacing: .05em; }
.velocity-cluster { position: absolute; width: min(29vw, 38vh); aspect-ratio: 1; top: 43%; left: 17%; transform: translate(-50%,-50%); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-direction: column; background: radial-gradient(circle, rgba(0,159,223,.14), transparent 64%); }
.velocity-cluster small { font: 500 clamp(7px,.65vw,11px)/1 var(--mono); letter-spacing: .2em; color: var(--mist); }
.velocity-cluster strong { font-size: clamp(58px, 7.5vw, 132px); line-height: .88; font-style: italic; text-shadow: 0 0 22px rgba(0,159,223,.22); }
.velocity-cluster>span:last-child { color: var(--blue); font-size: clamp(18px, 1.7vw, 30px); font-weight: 800; }
.velocity-orbit { position: absolute; inset: 6%; border: 4px solid var(--blue); border-color: var(--blue) transparent rgba(113,197,232,.2); border-radius: 50%; filter: drop-shadow(0 0 8px var(--blue)); animation: gauge-rotate 9s linear infinite; }
.velocity-orbit.v2 { inset: 18%; border-width: 1px; border-style: dashed; animation: gauge-rotate 16s linear infinite reverse; }
.pipeline-flow { grid-column: 1; grid-row: 2; align-self: end; height: 47%; margin-left: clamp(150px, 15vw, 290px); display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; position: relative; }
.pipeline-flow::before { content: ""; position: absolute; left: 8%; right: 8%; top: 50%; height: 4px; background: linear-gradient(90deg, var(--blue), var(--ice), var(--blue)); box-shadow: 0 0 18px var(--blue); animation: flow-line 2.2s linear infinite; }
.flow-stage { position: relative; z-index: 2; display: grid; justify-items: center; gap: 5px; }
.flow-node { width: clamp(66px, 7vw, 116px); aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle, rgba(10,34,53,.98), #02060b 66%); border: 2px solid var(--blue); box-shadow: 0 0 25px rgba(0,159,223,.22), inset 0 0 25px rgba(0,159,223,.1); position: relative; }
.flow-node::before { content: ""; position: absolute; inset: -9px; border: 1px dashed rgba(113,197,232,.4); border-radius: 50%; animation: gauge-rotate 10s linear infinite; }
.flow-node strong { font-size: clamp(31px, 3.2vw, 56px); line-height: 1; }
.flow-stage b { font-size: clamp(12px, 1.15vw, 20px); font-style: italic; letter-spacing: .08em; }
.flow-stage span { font: 500 clamp(7px,.58vw,10px)/1 var(--mono); color: var(--mist); }
.pipeline-leaders { grid-column: 2; grid-row: 1 / 3; border-left: 1px solid rgba(113,197,232,.15); padding-left: clamp(14px, 1.5vw, 26px); align-self: stretch; }
.pipeline-leaders-head { padding: 1vh 0 1.5vh; border-bottom: 1px solid rgba(113,197,232,.14); display: grid; }
.pipeline-leaders-head span { font-size: clamp(20px,2vw,34px); font-weight:800; font-style:italic; }
.pipeline-leaders-head small { font:500 clamp(7px,.6vw,10px)/1 var(--mono); color:var(--mist); letter-spacing:.12em; }
.flow-leader { display:grid; grid-template-columns: 32px clamp(35px,3vw,52px) 1fr auto; align-items:center; gap:9px; min-height: clamp(54px,7vh,80px); border-bottom:1px solid rgba(113,197,232,.1); }
.flow-leader>span { font-size: clamp(20px,2vw,34px); font-weight:900; color:rgba(145,168,182,.5); font-style:italic; }
.flow-leader .rank-avatar { width:clamp(35px,3vw,52px);height:clamp(35px,3vw,52px); }
.flow-leader div b { display:block;font-size:clamp(12px,1.05vw,18px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.flow-leader div small { font:500 clamp(7px,.55vw,9px)/1 var(--mono);color:var(--ice); }
.flow-leader output { font-size:clamp(16px,1.5vw,26px);font-weight:800;color:var(--blue); }

/* Regional */
.regional-stage { height:100%; display:grid; grid-template-columns:1fr minmax(230px,24vw) 1fr; gap:clamp(16px,2vw,36px); align-items:stretch; }
.region-module { padding: clamp(16px,1.5vw,28px); border:1px solid rgba(113,197,232,.18); background:linear-gradient(150deg,rgba(7,20,32,.88),rgba(2,7,12,.48)); position:relative; overflow:hidden; clip-path:polygon(0 0,94% 0,100% 8%,100% 100%,7% 100%,0 92%); }
.region-south { clip-path:polygon(6% 0,100% 0,100% 92%,93% 100%,0 100%,0 8%); border-color:rgba(77,145,237,.28); }
.region-north { background:radial-gradient(circle at 78% 45%,rgba(113,197,232,.13),transparent 37%),repeating-radial-gradient(ellipse at 83% 44%,transparent 0 11px,rgba(113,197,232,.045) 12px 13px),linear-gradient(150deg,rgba(7,20,32,.92),rgba(2,7,12,.58)); }
.region-south { background:radial-gradient(circle at 22% 48%,rgba(22,104,213,.18),transparent 38%),linear-gradient(rgba(22,104,213,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(22,104,213,.035) 1px,transparent 1px),linear-gradient(210deg,rgba(7,20,32,.92),rgba(2,7,12,.58));background-size:auto,26px 26px,26px 26px,auto; }
.region-map{position:absolute;right:1%;top:14%;width:46%;height:72%;opacity:.48;z-index:0}.region-south .region-map{right:auto;left:1%;transform:scaleX(-1)}.california-shape{position:absolute;left:25%;top:2%;width:54%;height:94%;clip-path:polygon(21% 0,59% 4%,58% 26%,70% 46%,83% 69%,100% 92%,76% 100%,54% 80%,37% 63%,20% 45%,3% 20%);background:linear-gradient(155deg,rgba(113,197,232,.06),rgba(0,159,223,.28));border-left:2px solid var(--ice);filter:drop-shadow(0 0 10px rgba(0,159,223,.35))}.region-south .california-shape{background:linear-gradient(155deg,rgba(22,104,213,.08),rgba(22,104,213,.38));filter:drop-shadow(0 0 12px rgba(22,104,213,.48))}.map-node{position:absolute;z-index:2;font-style:normal}.map-node b{display:block;width:9px;height:9px;border:2px solid var(--ice);border-radius:50%;background:var(--blue);box-shadow:0 0 10px var(--blue);animation:live-blink 2s infinite}.map-node span{position:absolute;left:12px;top:-1px;font:500 6px/1 var(--mono);color:var(--ice);white-space:nowrap;letter-spacing:.08em}.map-node.node-1{left:47%;top:18%}.map-node.node-2{left:55%;top:47%}.map-node.node-3{left:63%;top:72%}.region-south .map-node{transform:scaleX(-1)}
.region-title,.region-hero,.region-score,.city-list-title,.city-row{position:relative;z-index:2}
.region-module::before { content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent,rgba(0,159,223,.07),transparent);transform:translateX(-100%);animation:card-sweep 5s linear infinite; }
.region-south::before { background:linear-gradient(110deg,transparent,rgba(77,145,237,.1),transparent);animation-delay:-2.4s; }
.region-title { display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(113,197,232,.13);padding-bottom:1vh; }
.region-title span { font:500 clamp(7px,.65vw,11px)/1 var(--mono);letter-spacing:.18em;color:var(--mist); }
.region-title h2 { margin:0;font-size:clamp(26px,2.8vw,49px);font-style:italic;color:var(--ice); }
.region-south .region-title h2 { color:#4d91ed; }
.region-hero { display:grid;grid-template-columns:clamp(58px,6vw,104px) 1fr;gap:clamp(10px,1vw,18px);align-items:center;padding:1.4vh 0; }
.region-hero .rank-avatar { width:clamp(58px,6vw,104px);height:clamp(58px,6vw,104px);border-radius:50%; }
.region-hero h3 { margin:0;font-size:clamp(20px,2vw,35px);line-height:.92; }
.region-hero p { margin:5px 0 0;font:500 clamp(7px,.62vw,10px)/1 var(--mono);color:var(--mist);letter-spacing:.13em; }
.region-score { display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:1vh 0 1.4vh; }
.region-stat { padding:8px;border:1px solid rgba(113,197,232,.11);background:rgba(2,8,14,.45); }
.region-stat strong { display:block;font-size:clamp(28px,3vw,52px);line-height:.9; }
.region-stat span { font:500 clamp(7px,.57vw,9px)/1 var(--mono);color:var(--mist); }
.city-list-title { font:500 clamp(7px,.64vw,11px)/1 var(--mono);letter-spacing:.2em;color:var(--mist);border-bottom:1px solid rgba(113,197,232,.12);padding-bottom:7px; }
.city-row { padding:clamp(7px,1vh,12px) 0;border-bottom:1px solid rgba(113,197,232,.08); }
.city-row div { display:flex;justify-content:space-between;align-items:baseline; }
.city-row b { font-size:clamp(14px,1.35vw,23px); }.city-row span { font:500 clamp(7px,.62vw,10px)/1 var(--mono);color:var(--mist); }
.city-row i { display:block;height:3px;margin-top:5px;background:linear-gradient(90deg,var(--blue) var(--w),rgba(113,197,232,.1) var(--w));box-shadow:0 0 7px rgba(0,159,223,.35); }
.region-south .city-row i { background:linear-gradient(90deg,var(--red) var(--w),rgba(77,145,237,.09) var(--w));box-shadow:0 0 7px rgba(77,145,237,.3); }
.regional-core { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(9px,1.2vh,16px);position:relative; }
.regional-gauge { width:min(17vw,25vh);aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle,rgba(8,25,40,.95),#020509 68%);border:2px solid rgba(113,197,232,.36);box-shadow:0 0 32px rgba(0,159,223,.12);position:relative; }
.regional-ring { position:absolute;inset:-10px;border-radius:50%;border:4px solid;border-color:var(--blue) var(--red) var(--red) var(--blue);filter:drop-shadow(0 0 7px rgba(0,159,223,.4));animation:gauge-rotate 9s linear infinite; }
.regional-gauge small { font:500 clamp(7px,.58vw,10px)/1 var(--mono);letter-spacing:.14em;color:var(--mist); }
.regional-gauge strong { font-size:clamp(42px,5vw,88px);line-height:.8;font-style:italic; }
.regional-gauge>span:last-child { color:var(--red);font-size:clamp(10px,1vw,17px);font-weight:800; }
.regional-lead { padding:6px 13px;border:1px solid rgba(113,197,232,.2);font:500 clamp(8px,.7vw,12px)/1 var(--mono);letter-spacing:.14em;color:var(--ice); }
.regional-bars { width:100%;display:grid;gap:clamp(8px,1vh,13px); }
.comparison-row span { display:block;text-align:center;font:500 clamp(7px,.58vw,10px)/1 var(--mono);color:var(--mist);margin-bottom:4px; }
.comparison-track { display:flex;height:5px;gap:3px;background:rgba(113,197,232,.08); }
.comparison-track i:first-child { background:var(--blue);box-shadow:0 0 8px var(--blue); }.comparison-track i:last-child { background:var(--red);box-shadow:0 0 8px var(--red); }
.comparison-nums { display:flex;justify-content:space-between;font-size:clamp(11px,1vw,17px);font-weight:700; }.comparison-nums b:first-child{color:var(--ice)}.comparison-nums b:last-child{color:var(--red)}

/* Values */
.values-stage { height:100%; display:grid; grid-template-rows:auto 1fr; }
.values-heading { text-align:center;padding:.5vh 0 1.2vh; }
.values-heading h2 { font-size:clamp(34px,4.2vw,74px); }.values-heading p{margin-top:4px}
.values-grid { min-height:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.3vw,24px);align-items:stretch; }
.value-module { border:1px solid rgba(113,197,232,.18);background:linear-gradient(155deg,rgba(8,23,37,.9),rgba(2,7,12,.68));position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(10px,1vw,18px);clip-path:polygon(7% 0,93% 0,100% 7%,100% 93%,93% 100%,7% 100%,0 93%,0 7%);transition:.35s; }
.value-module:not(.empty):hover { transform:translateY(-5px);border-color:rgba(113,197,232,.55); }
.value-module::before { content:attr(data-number);position:absolute;right:4%;top:-3%;font-size:clamp(80px,10vw,180px);font-weight:900;color:rgba(113,197,232,.025);line-height:1; }
.value-module::after { content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(113,197,232,.09),transparent 68%);animation:card-sweep 5s linear infinite; }
.value-module button { position:absolute;inset:0;background:none;border:0;z-index:3; }
.value-label { font:500 clamp(8px,.75vw,13px)/1 var(--mono);letter-spacing:.18em;color:var(--ice);text-align:center;z-index:1; }
.value-photo-ring { width:min(13vw,22vh);aspect-ratio:1;margin:1.2vh 0;border-radius:50%;padding:8px;border:3px solid;border-color:var(--blue) transparent var(--ice);filter:drop-shadow(0 0 12px rgba(0,159,223,.4));position:relative;z-index:1; }
.value-photo { width:100%;height:100%;border-radius:50%;overflow:hidden;background:#081624; }
.value-photo img { width:100%;height:100%;object-fit:cover;object-position:center 24%; }.value-photo .initials{width:100%;height:100%;display:grid;place-items:center;font-size:34px;font-weight:900;color:var(--ice)}
.value-name { font-size:clamp(18px,1.8vw,31px);font-weight:800;font-style:italic;text-align:center;z-index:1; }.value-city{font:500 clamp(7px,.62vw,10px)/1 var(--mono);color:var(--mist);letter-spacing:.13em;z-index:1;margin-top:4px}
.value-module.empty { opacity:.68; }.value-module.empty .value-photo-ring { border-color:rgba(113,197,232,.24) transparent;filter:none; }

/* Footer */
.system-footer { position:absolute;left:0;right:0;bottom:0;height:var(--footer-h);z-index:20;background:linear-gradient(180deg,rgba(3,9,15,.86),#010305 34%);border-top:1px solid rgba(113,197,232,.23);box-shadow:0 -12px 32px rgba(0,0,0,.45);display:grid;grid-template-rows:1fr clamp(34px,4.8vh,52px); }
.mini-pipeline { display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(8px,1vw,16px);align-items:center;padding:clamp(7px,1vh,12px) clamp(30px,4.2vw,80px) clamp(4px,.6vh,8px);position:relative; }
.mini-pipeline::before { content:"";position:absolute;left:8%;right:8%;top:51%;height:2px;background:linear-gradient(90deg,transparent,var(--blue),var(--ice),var(--blue),transparent);box-shadow:0 0 10px rgba(0,159,223,.45); }
.mini-stage { position:relative;z-index:1;display:grid;grid-template-columns:clamp(30px,3vw,48px) 1fr auto;align-items:center;gap:clamp(7px,.8vw,14px);padding:5px 8px;background:linear-gradient(90deg,rgba(6,19,31,.96),rgba(2,7,12,.9));border:1px solid rgba(113,197,232,.16);clip-path:polygon(5% 0,95% 0,100% 50%,95% 100%,5% 100%,0 50%); }
.mini-stage>i { width:clamp(28px,2.8vw,46px);aspect-ratio:1;border-radius:50%;border:2px solid var(--blue);box-shadow:0 0 9px rgba(0,159,223,.3);display:grid;place-items:center;font-style:normal;font-size:clamp(12px,1.2vw,20px); }
.mini-stage div { min-width:0; }.mini-stage div b{display:block;font-size:clamp(10px,1vw,17px);font-style:italic;letter-spacing:.04em}.mini-stage div span{display:block;height:3px;margin-top:4px;background:linear-gradient(90deg,var(--blue) var(--w),rgba(113,197,232,.12) var(--w));}
.mini-stage strong { font-size:clamp(20px,2vw,35px);font-style:italic; }
.control-deck { position:absolute;left:50%;bottom:clamp(38px,5.2vh,58px);transform:translateX(-50%);display:flex;align-items:center;gap:12px; }
.mode-nav { display:flex;gap:4px;padding:4px;background:rgba(2,7,12,.9);border:1px solid rgba(113,197,232,.15);border-radius:7px; }
.mode-button { width:clamp(78px,7.8vw,138px);height:clamp(28px,3.5vh,38px);border:1px solid transparent;background:transparent;color:rgba(145,168,182,.62);display:flex;align-items:center;justify-content:center;gap:7px;font:500 clamp(7px,.6vw,10px)/1 var(--mono);letter-spacing:.13em;border-radius:5px; }
.mode-button i { width:5px;height:5px;border-radius:50%;background:currentColor; }.mode-button.active{color:white;border-color:var(--blue);box-shadow:0 0 12px rgba(0,159,223,.22),inset 0 0 12px rgba(0,159,223,.1);}.mode-button.active i{background:var(--blue);box-shadow:0 0 7px var(--blue)}
.rotation-track { width:clamp(45px,5vw,80px);height:3px;background:rgba(113,197,232,.14); }.rotation-track i{display:block;width:0;height:100%;background:var(--blue);box-shadow:0 0 8px var(--blue)}
.fullscreen-button { height:clamp(28px,3.5vh,38px);padding:0 12px;border:1px solid rgba(113,197,232,.18);background:transparent;color:var(--mist);font:500 clamp(7px,.57vw,9px)/1 var(--mono);letter-spacing:.1em;border-radius:5px; }
.ticker { display:grid;grid-template-columns:clamp(120px,12vw,210px) 1fr;border-top:1px solid rgba(113,197,232,.12);overflow:hidden; }
.ticker-label { display:flex;align-items:center;padding-left:clamp(30px,4vw,72px);font-size:clamp(15px,1.5vw,26px);font-weight:800;font-style:italic;color:var(--blue);background:linear-gradient(90deg,rgba(0,56,101,.35),transparent);letter-spacing:.05em; }
.ticker-window { overflow:hidden;position:relative; }.ticker-window::before,.ticker-window::after{content:"";position:absolute;top:0;bottom:0;width:50px;z-index:2}.ticker-window::before{left:0;background:linear-gradient(90deg,#010305,transparent)}.ticker-window::after{right:0;background:linear-gradient(270deg,#010305,transparent)}
.ticker-track { display:flex;align-items:center;width:max-content;height:100%;animation:ticker-move 32s linear infinite; }
.ticker-item { display:flex;align-items:center;gap:9px;padding:0 clamp(24px,3vw,54px);font:500 clamp(9px,.78vw,13px)/1 var(--mono);letter-spacing:.07em;white-space:nowrap;color:var(--white);border-right:1px solid rgba(113,197,232,.2); }.ticker-item b{color:var(--blue)}.ticker-item i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 7px var(--red)}

/* Overlays */
.recognition-overlay { position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle,rgba(0,56,101,.72),rgba(1,4,7,.97) 60%);opacity:0;visibility:hidden;transform:scale(1.03);transition:.5s; }
.recognition-overlay.open{opacity:1;visibility:visible;transform:none}.recognition-overlay>button{position:absolute;right:3vw;top:3vh;background:transparent;border:1px solid rgba(113,197,232,.3);color:var(--mist);font:500 9px/1 var(--mono);letter-spacing:.15em;padding:10px 14px}.recognition-rings{position:absolute;width:min(50vw,70vh);aspect-ratio:1}.recognition-rings i{position:absolute;inset:0;border-radius:50%;border:4px solid;border-color:var(--blue) transparent var(--ice);animation:gauge-rotate 13s linear infinite;filter:drop-shadow(0 0 11px var(--blue))}.recognition-rings i:nth-child(2){inset:10%;border-width:1px;border-style:dashed;animation-duration:18s;animation-direction:reverse}.recognition-rings i:nth-child(3){inset:22%;border-color:var(--red) transparent;animation-duration:8s}.recognition-overlay>p{z-index:2;font:500 clamp(9px,.8vw,14px)/1 var(--mono);letter-spacing:.27em;color:var(--ice)}.recognition-photo{z-index:2;width:min(20vw,31vh);aspect-ratio:1;border-radius:50%;overflow:hidden;background:#071521;border:2px solid var(--ice);box-shadow:0 0 35px rgba(0,159,223,.35);position:relative}.recognition-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 24%}.recognition-photo div{width:100%;height:100%;display:grid;place-items:center;font-size:5vw;font-weight:900;color:var(--ice)}.recognition-overlay h2{z-index:2;margin:1vh 0 0;font-size:clamp(42px,6vw,108px);line-height:.9;font-style:italic}.recognition-overlay>span{z-index:2;font:500 clamp(9px,.8vw,14px)/1 var(--mono);letter-spacing:.2em;color:var(--blue);margin-top:8px}
.admin-overlay{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;background:rgba(0,3,7,.9);backdrop-filter:blur(12px)}.admin-overlay.open{display:flex}.admin-panel{width:min(92vw,520px);max-height:88vh;overflow:auto;padding:28px;background:linear-gradient(145deg,#091928,#03080e);border:1px solid rgba(113,197,232,.3);box-shadow:0 25px 80px rgba(0,0,0,.7);position:relative}.admin-panel>span,.admin-panel>p{font:500 9px/1 var(--mono);letter-spacing:.2em;color:var(--blue)}.admin-panel h2{margin:3px 0 20px;font-size:34px;font-style:italic}.admin-close{position:absolute;right:13px;top:10px;background:none;border:0;color:var(--mist);font-size:25px}.admin-panel label{display:grid;gap:5px;margin:10px 0;font:500 9px/1 var(--mono);letter-spacing:.1em;color:var(--mist)}.admin-panel input,.admin-panel select{width:100%;height:38px;background:#02070c;border:1px solid rgba(113,197,232,.22);color:white;padding:0 10px;font:500 11px/1 var(--mono)}.admin-panel hr{border:0;border-top:1px solid rgba(113,197,232,.15);margin:18px 0}.admin-actions{display:flex;gap:8px}.admin-actions button,.admin-save{border:1px solid rgba(0,159,223,.5);background:rgba(0,159,223,.1);color:var(--ice);padding:10px 14px;font:500 9px/1 var(--mono);letter-spacing:.1em}.admin-save{width:100%;margin-top:18px}.admin-check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center}.admin-check input{width:auto;height:auto}.system-toast{position:fixed;right:2vw;bottom:2vh;z-index:150;padding:10px 14px;background:#06131f;border:1px solid rgba(113,197,232,.3);color:var(--ice);font:500 9px/1 var(--mono);letter-spacing:.12em;opacity:0;transform:translateY(12px);transition:.35s}.system-toast.show{opacity:1;transform:none}

/* Boot */
.boot-sequence { position:fixed;inset:0;z-index:200;background:#000;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;transition:opacity .75s ease,visibility .75s; }
.boot-sequence.exit { opacity:0;visibility:hidden; }.boot-shell{width:min(92vw,1500px);height:min(55vw,68vh);position:relative;display:flex;align-items:center;justify-content:center}.boot-core{width:min(37vw,57vh);aspect-ratio:1;border-radius:50%;position:relative;display:grid;place-items:center;background:radial-gradient(circle,rgba(0,159,223,.13),transparent 62%)}.boot-core img{width:52%;max-height:31%;object-fit:contain;z-index:3;opacity:0;animation:boot-logo 1s .65s forwards}.boot-ring{position:absolute;border-radius:50%;border:4px solid var(--blue);border-color:var(--blue) transparent var(--ice);filter:drop-shadow(0 0 10px var(--blue));animation:gauge-rotate 3s linear infinite,boot-ring-in .8s both}.boot-ring.r1{inset:0}.boot-ring.r2{inset:12%;border-width:1px;border-style:dashed;animation-direction:reverse;animation-duration:4s}.boot-ring.r3{inset:25%;border-color:var(--red) transparent;animation-duration:2.4s}.boot-wing{position:absolute;width:38%;height:62%;top:19%;border:2px solid rgba(113,197,232,.5);box-shadow:inset 0 0 35px rgba(0,159,223,.05),0 0 18px rgba(0,159,223,.12);overflow:hidden;opacity:0;animation:boot-wing-in .8s .15s forwards}.boot-wing-left{left:0;clip-path:polygon(0 22%,18% 0,100% 11%,83% 89%,18% 100%,0 78%)}.boot-wing-right{right:0;clip-path:polygon(100% 22%,82% 0,0 11%,17% 89%,82% 100%,100% 78%)}.boot-wing i{position:absolute;left:12%;right:12%;height:4px;background:linear-gradient(90deg,transparent,var(--blue),transparent);box-shadow:0 0 14px var(--blue);animation:boot-charge 1.4s ease-in-out infinite}.boot-wing i:nth-child(1){top:25%}.boot-wing i:nth-child(2){top:50%;animation-delay:-.45s}.boot-wing i:nth-child(3){top:75%;animation-delay:-.9s}.boot-copy{position:absolute;left:0;right:0;bottom:15%;display:grid;justify-items:center;gap:5px;opacity:0;animation:boot-copy .6s 1s forwards}.boot-copy strong{font-size:clamp(24px,3vw,52px);letter-spacing:.12em}.boot-copy span{font:500 clamp(9px,.8vw,14px)/1 var(--mono);letter-spacing:.25em;color:var(--ice)}.boot-copy small{font:500 clamp(8px,.7vw,12px)/1 var(--mono);letter-spacing:.18em;color:var(--blue)}.boot-pipeline{position:absolute;left:18%;right:18%;bottom:8%;display:flex;align-items:center;justify-content:center;gap:10px;font:500 clamp(7px,.62vw,10px)/1 var(--mono);color:var(--mist);opacity:0;animation:boot-copy .6s 1.25s forwards}.boot-pipeline i{flex:1;height:1px;background:rgba(113,197,232,.22);position:relative}.boot-pipeline i::after{content:"";position:absolute;left:0;top:-1px;height:3px;width:0;background:var(--blue);box-shadow:0 0 8px var(--blue);animation:boot-line 1.4s 1.25s forwards}.boot-node{position:relative}.boot-node::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;border:1px solid currentColor;margin-right:6px}.boot-node.active{color:var(--ice);text-shadow:0 0 8px var(--blue)}
.boot-core img{width:46%;max-height:54%;filter:drop-shadow(0 0 17px rgba(0,159,223,.42))}
.boot-enter{position:absolute;left:50%;bottom:1.5%;transform:translate(-50%,10px);min-width:clamp(210px,20vw,340px);padding:10px 30px 9px;display:grid;gap:3px;justify-items:center;border:1px solid rgba(113,197,232,.58);color:white;background:linear-gradient(110deg,rgba(0,56,101,.65),rgba(2,8,14,.94));clip-path:polygon(7% 0,93% 0,100% 50%,93% 100%,7% 100%,0 50%);box-shadow:0 0 24px rgba(0,159,223,.2),inset 0 0 20px rgba(0,159,223,.09);opacity:0;pointer-events:none;transition:.45s}
.boot-enter span{font-size:clamp(16px,1.55vw,27px);font-weight:800;font-style:italic;letter-spacing:.1em}.boot-enter small{font:500 clamp(6px,.52vw,9px)/1 var(--mono);color:var(--ice);letter-spacing:.14em}.boot-sequence.ready .boot-enter{opacity:1;pointer-events:auto;transform:translate(-50%,0);animation:enter-pulse 2.2s ease-in-out infinite}.boot-sequence.ready{cursor:pointer}.boot-enter:hover,.boot-enter:focus-visible{filter:brightness(1.35);outline:none}

@keyframes grid-drive{to{background-position:0 58px,58px 0}}
@keyframes scan-screen{0%,20%{transform:translateY(-38%)}70%,100%{transform:translateY(38%)}}
@keyframes orb-breathe{50%{opacity:.28;transform:scale(1.15)}}
@keyframes speed-pulse{50%{opacity:.3;transform:scale(1.04)}}
@keyframes frame-pulse{0%,100%{opacity:.18;transform:translateY(-20%)}50%{opacity:1;transform:translateY(20%)}}
@keyframes live-blink{50%{opacity:.25;box-shadow:0 0 3px var(--red)}}
@keyframes rank-entry-in{from{opacity:0;transform:translateX(-18px)}}
@keyframes card-sweep{0%{transform:translateX(-120%)}60%,100%{transform:translateX(120%)}}
@keyframes pager-pulse{50%{opacity:.35;transform:scaleX(.7);transform-origin:right}}
@keyframes gauge-rotate{to{transform:rotate(360deg)}}
@keyframes gauge-breathe{50%{opacity:.65;transform:scale(1.02)}}
@keyframes portrait-scan{0%,15%{top:15%;opacity:0}40%{opacity:.45}70%,100%{top:88%;opacity:0}}
@keyframes spark-rise{from{transform:scaleY(0)}}
@keyframes flow-line{to{filter:hue-rotate(25deg);background-position:160px 0}}
@keyframes ticker-move{to{transform:translateX(-50%)}}
@keyframes boot-logo{from{opacity:0;transform:scale(.8);filter:blur(12px)}to{opacity:1;transform:none;filter:none}}
@keyframes boot-ring-in{from{opacity:0;transform:scale(.6) rotate(-130deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes boot-wing-in{from{opacity:0;transform:scaleX(.6)}to{opacity:1;transform:none}}
@keyframes boot-charge{50%{opacity:.3;transform:translateX(18%)}}
@keyframes boot-copy{to{opacity:1}}
@keyframes boot-line{to{width:100%}}
@keyframes enter-pulse{50%{box-shadow:0 0 36px rgba(0,159,223,.38),inset 0 0 26px rgba(0,159,223,.14)}}

/* Specificity guards for the championship layout */
#screen-ranking{display:block}
.rank-chasers #rank-list{height:auto;padding-top:6px;display:grid;grid-template-rows:repeat(7,minmax(0,1fr));gap:4px}

@media (max-aspect-ratio: 4/3) {
  .brand-lockup div,.data-link,.system-date{display:none}
  #screen-ranking{grid-template-columns:minmax(250px,31vw) 1fr minmax(240px,29vw)}
  .leader-plate h1{font-size:clamp(25px,3.4vw,42px)}
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
}
