:root{color-scheme:only light;font-family:Orbitron,Trebuchet MS,sans-serif;--bg: #9c9c9c;--panel: #121212;--panel-edge: #2a2a2a;--panel-highlight: #2a2a2a;--panel-shadow: #050505;--digit: #f5f5f5;--accent: #f4b860;--muted: #3a3a3a}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#b9b9b9,var(--bg));display:flex;align-items:center;justify-content:center;padding:48px 24px;color:#121212}.page{width:min(1100px,100%);display:grid;gap:36px;justify-items:center;text-align:center}.hero{display:grid;gap:12px}.strap{text-transform:uppercase;letter-spacing:.4rem;font-size:.85rem;font-weight:600;color:#3c3c3c}.title{margin:0;font-size:clamp(1.6rem,3vw,2.4rem);font-weight:600}.scoreboard{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:24px;width:100%;align-items:end}.scoreboard.is-hidden{display:none}.map-panel{width:min(980px,100%);display:none;flex-direction:column;gap:16px}.map-panel.is-visible{display:flex}.map-status{margin:0;font-size:.95rem;color:#2f2f2f;letter-spacing:.08rem;text-transform:uppercase;font-weight:600}.flight-map{width:100%;height:clamp(280px,45vw,460px);border-radius:24px;overflow:hidden;background:#0d141c;border:1px solid #313131;box-shadow:inset 0 2px 8px #ffffff1a,inset 0 -4px 12px #00000073,0 16px 32px #00000059}.flight-map .leaflet-control-attribution{background:#0a1018a6;color:#d4d9df;font-family:Orbitron,Trebuchet MS,sans-serif;font-size:.6rem}.flight-map .leaflet-control-attribution a{color:#f4b860}.flight-icon{background:transparent;border:none}.flight-icon .airliner{width:44px;height:44px;display:grid;place-items:center;font-size:40px;transform-origin:center;transition:transform .3s ease;filter:drop-shadow(0 2px 2px rgba(0,0,0,.45))}.unit{position:relative;background:linear-gradient(180deg,#bfbfbf,#a1a1a1);border-radius:22px;padding:22px 18px;box-shadow:inset 0 2px 8px #ffffff73,inset 0 -4px 10px #0006,0 14px 28px #0000004d}.unit:before,.unit:after{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,#dcdcdc,#8b8b8b 70%);box-shadow:inset 0 1px 2px #fff9,inset 0 -1px 2px #0006;top:10px}.unit:before{left:12px}.unit:after{right:12px}.digits{display:flex;justify-content:center;gap:6px}.digit{position:relative;width:clamp(54px,7.2vw,72px);height:clamp(76px,9.5vw,98px);border-radius:12px;background:var(--panel);border:1px solid var(--panel-edge);box-shadow:inset 0 3px 4px #ffffff14,inset 0 -5px 6px #000000bf,0 8px 16px #00000073;overflow:hidden}.digit:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#ffffff14,#00000059);pointer-events:none}.digit:after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);box-shadow:0 -1px #00000080,0 1px #000000b3;opacity:.9}.digit-split{position:absolute;left:0;right:0;height:50%;display:flex;align-items:center;justify-content:center;font-size:clamp(2rem,4.2vw,2.8rem);font-weight:700;color:var(--digit);text-shadow:0 2px 2px rgba(0,0,0,.75)}.digit-split.top{top:0;background:linear-gradient(180deg,#2f2f2f,var(--panel));border-bottom:1px solid #050505}.digit-split.bottom{bottom:0;background:linear-gradient(0deg,#050505,#101010);border-top:1px solid #000}.digit-split span{transform:translateY(-3px)}.digit-split.bottom span{transform:translateY(7px)}.unit-label{margin-top:12px;text-transform:uppercase;letter-spacing:.25rem;font-size:.72rem;color:var(--muted);font-weight:600}.status{margin:0;font-size:.95rem;color:#1f1f1f}@media (max-width: 900px){.scoreboard{grid-template-columns:repeat(2,minmax(140px,1fr))}}@media (max-width: 600px){body{padding:36px 16px}.scoreboard{grid-template-columns:repeat(2,minmax(120px,1fr));gap:16px}.unit{padding:14px 12px 16px}}.digit{position:relative;width:clamp(54px,7.2vw,72px);height:clamp(76px,9.5vw,98px);perspective:800px;border-radius:12px;background:transparent;border:none;box-shadow:none}.digit .card,.digit .flip{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px}.card-face,.flip-face{position:absolute;left:0;right:0;height:50%;display:flex;align-items:center;justify-content:center;font-size:clamp(2rem,4.2vw,2.8rem);font-weight:700;color:var(--digit);text-shadow:0 2px 2px rgba(0,0,0,.75);overflow:hidden}.card-face.top,.flip-top{top:0;background:linear-gradient(180deg,#3a3a3a,#141414),repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 2px,transparent 2px 4px);border:1px solid #262626;border-bottom:1px solid #050505;border-radius:12px 12px 6px 6px}.card-face.bottom,.flip-bottom{bottom:0;background:linear-gradient(0deg,#050505,#1a1a1a),repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 2px,transparent 2px 4px);border:1px solid #1b1b1b;border-top:1px solid #000;border-radius:6px 6px 12px 12px}.card-face span,.flip-face span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);line-height:1}.card-face.top span,.flip-top span{transform:translate(-50%,-50%) translateY(50%)}.card-face.bottom span,.flip-bottom span{transform:translate(-50%,-50%) translateY(-50%)}.digit:after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);box-shadow:0 -1px #0009,0 1px #000000bf;z-index:3}.digit:before{content:"";position:absolute;left:6px;right:6px;top:50%;height:4px;transform:translateY(-50%);background:linear-gradient(90deg,#0000001a,#ffffff26,#0003);border-radius:999px;box-shadow:inset 0 1px 1px #ffffff40,inset 0 -1px 1px #00000073;opacity:.7;z-index:2}.flip{z-index:4;pointer-events:none}.flip-top{transform-origin:bottom;backface-visibility:hidden}.flip-bottom{transform-origin:top;transform:rotateX(90deg);backface-visibility:hidden}.digit.is-flipping .flip-top{animation:flipTop .45s ease-in forwards}.digit.is-flipping .flip-bottom{animation:flipBottom .45s ease-out .45s forwards}@keyframes flipTop{0%{transform:rotateX(0)}to{transform:rotateX(-90deg)}}@keyframes flipBottom{0%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.hinge{position:absolute;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:radial-gradient(circle,#bfbfbf,#6c6c6c 70%);box-shadow:inset 0 1px 1px #fff9,inset 0 -1px 1px #00000080;z-index:5}.hinge.left{left:-4px}.hinge.right{right:-4px}
