:root{color:#f5f7ff;font-family:Trebuchet MS,Avenir Next,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{min-height:100vh}html[data-bg-style=clean] body{background:linear-gradient(180deg,#040a1657,#02071194),url(/images/space.jpg) center center / cover no-repeat fixed}html[data-bg-style=moodier] body{background:radial-gradient(circle at 22% 14%,rgba(120,186,246,.12),transparent 34%),linear-gradient(180deg,#01040b94,#000207db),url(/images/space.jpg) center center / cover no-repeat fixed}img{display:block;max-width:100%}button,canvas{font:inherit}.page-shell{min-height:100vh;padding:32px 20px 28px}.page-frame{max-width:1120px;margin:0 auto}.hero{text-align:center;margin-bottom:24px}.hero h1{margin:0;font-size:clamp(2.2rem,4vw,4rem);letter-spacing:.06em;text-transform:uppercase}.hero p{margin:10px auto 0;max-width:680px;color:#ebf1ffd1;line-height:1.5}.status-panel,.telemetry-panel,.settings-panel,.leaderboard-panel,.side-card,.control-panel,.canvas-card{border:1px solid rgba(164,220,255,.26);background:#060e1cb8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 18px 36px #00000047}.status-panel{margin-bottom:18px;border-radius:24px;padding:18px 20px;display:grid;gap:14px}.status-copy p{margin:0;color:#ebf1ffc2;text-align:center;font-size:1.02rem;letter-spacing:.02em}.status-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:end}.callsign-field{display:grid;gap:6px;min-width:170px}.callsign-field span{color:#b7e9ff;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.callsign-field input{border:1px solid rgba(183,233,255,.35);border-radius:12px;padding:10px 12px;color:#f5f7ff;background:#08111ff0}.cog-button{width:42px;min-width:42px;height:42px;padding:0;display:grid;place-items:center;font-size:1.1rem;line-height:1}button{border:1px solid rgba(183,233,255,.5);border-radius:999px;padding:10px 16px;color:#f5f7ff;background:linear-gradient(180deg,#1e4c74d1,#0b1e36eb);cursor:pointer;transition:transform .12s ease,opacity .12s ease}button:hover:not(:disabled){transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.6}.telemetry-panel{margin-bottom:20px;border-radius:24px;padding:14px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.telemetry-panel[hidden]{display:none!important}.telemetry-item{padding:12px;border-radius:16px;background:#0b162ac7}.telemetry-item strong{display:block;margin-bottom:6px;font-size:.78rem;color:#b7e9ff;letter-spacing:.08em;text-transform:uppercase}.telemetry-item span{display:block;font-size:1.12rem}.settings-panel{margin-bottom:20px;border-radius:24px;padding:18px 20px}.settings-panel[hidden]{display:none!important}.leaderboard-panel{margin-bottom:20px;border-radius:24px;padding:18px 20px}.leaderboard-panel[hidden]{display:none!important}.settings-header{margin-bottom:14px}.settings-header h2{margin:0;text-transform:uppercase;letter-spacing:.08em;font-size:1rem}.settings-header p{margin:8px 0 0;color:#ebf1ffc2}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.setting-control{display:block;padding:14px;border-radius:16px;background:#0b162ac7}.setting-control span{display:block;margin-bottom:10px;color:#b7e9ff;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}select,input[type=range]{width:100%}select{border:1px solid rgba(183,233,255,.35);border-radius:12px;padding:10px 12px;color:#f5f7ff;background:#08111ff0}.range-group{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}output{min-width:52px;text-align:right}.leaderboard-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}.leaderboard-entry,.leaderboard-empty{padding:12px 14px;border-radius:16px;background:#0b162ac7}.leaderboard-entry{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) minmax(0,1fr);gap:10px;text-transform:capitalize}.leaderboard-entry span:first-child{color:#b7e9ff;font-weight:700}.leaderboard-empty{color:#ebf1ffc2}.game-layout{display:grid;grid-template-columns:minmax(140px,180px) minmax(300px,600px) minmax(140px,180px);gap:20px;align-items:center;justify-content:center;margin:0 auto 22px}.side-card{border-radius:20px;padding:18px 14px;text-align:center}.side-card img{margin:0 auto 12px}.side-card h2{margin:0 0 6px;font-size:1.1rem;letter-spacing:.08em;text-transform:uppercase}.side-card p{margin:0;color:#ebf1ffb8}.canvas-card{padding:14px;border-radius:24px}canvas{width:100%;display:block;border-radius:14px;border:2px solid rgba(182,236,255,.8);background:#000}.control-panel{margin-top:22px;border-radius:24px;padding:14px 16px;text-align:center}.control-panel h2{margin:0;text-transform:uppercase;letter-spacing:.08em;font-size:.92rem}.controls-hint{margin:6px 0 12px;color:#ebf1ffad;font-size:.82rem}.controls-legend{display:grid;grid-template-columns:repeat(2,minmax(240px,320px));grid-template-rows:repeat(4,auto);grid-auto-flow:column;gap:8px 14px;max-width:680px;margin:0 auto;justify-content:center;justify-items:stretch}.control-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;justify-content:flex-start;text-align:left;width:100%}.control-key{min-width:58px;text-align:center;padding:4px 8px;border-radius:999px;border:1px solid rgba(183,233,255,.42);background:#081222db;color:#b7e9ff;font-size:.78rem;letter-spacing:.04em;font-weight:700}.control-action{color:#ebf1ffd1;font-size:.9rem}@media(max-width:920px){.status-panel{flex-direction:column;align-items:flex-start}.status-actions{justify-content:flex-start}.telemetry-panel{grid-template-columns:repeat(3,minmax(0,1fr))}.settings-grid,.game-layout{grid-template-columns:1fr}.side-card{max-width:420px;margin:0 auto}.controls-legend{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row}}@media(max-width:520px){.page-shell{padding:20px 12px}.telemetry-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.leaderboard-entry{grid-template-columns:1fr}}