/* Refinement layer, loaded last. Keeps the Polus aurora world and fixes
   readability, hierarchy and the browser surfaces the earlier layers left default. */
:root{--ease-out:cubic-bezier(.23,1,.32,1);--meta:#a9b8cc;--crew:#83b8ff;--imp:#fc8b98}
::selection{background:#8acaff47;color:#fff}
html{scrollbar-color:#2c3f5a #0a1020;scrollbar-width:thin}
a{text-underline-offset:3px}
.rating-number,.placement-number,.rating-grid strong,.summary-bottom b,.record-row b,td{font-variant-numeric:tabular-nums}

/* Readable minimums: the 8–10px letter-spaced labels were below comfortable reading size. */
small{font-size:12px;letter-spacing:.2px;color:var(--meta)}
.panel small{letter-spacing:.2px}
footer,footer span{font-size:12px;letter-spacing:.3px}
.tag{font-size:12px}
.intro{font-size:15px;line-height:1.6;color:#b8c9dd}
.record-note{font-size:12px;line-height:1.6;color:var(--meta)}
body>aside>.eyebrow,#nav>.eyebrow{font-size:11px;letter-spacing:1.2px;color:#8196b3;text-transform:uppercase}
.brand:after{content:none}

/* Header carries account controls only; the kicker line is gone. */
header{display:flex;align-items:center;justify-content:space-between}
header>small{display:none}
.top-actions{margin-left:auto;display:flex;justify-content:flex-end}
#account{min-width:0}

/* One icon family, drawn as SVG. */
.icon{width:1em;height:1em;flex:none;vertical-align:-.15em}
.text-link{display:inline-flex;align-items:center;gap:6px;color:var(--accent);font-weight:600;text-decoration:none}
.text-link .icon{transition:transform 160ms var(--ease-out)}
.text-link:hover .icon{transform:translateX(3px)}
a.text-link[target=_blank]:hover .icon{transform:translate(2px,-2px)}
#account summary .icon{margin-left:4px;opacity:.7}
#menu-toggle .icon{width:18px;height:18px;vertical-align:middle}

/* Press feedback on every button. */
button,.button{transition:background-color 150ms var(--ease-out),border-color 150ms var(--ease-out),color 150ms var(--ease-out),transform 120ms var(--ease-out)}
button:active:not(:disabled),.button:active{transform:scale(.97)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px}

/* App pages get a calmer backdrop so data reads clearly; home keeps the full scene. */
body[data-page=app] .scene{background:linear-gradient(180deg,#050d18d9,#050d18f2 60%),url('/assets/polus-aurora.webp?v=1') center/cover}
body[data-page=app] .panel{background:#0c1a2ccc}

/* Home */
.home-feature-row article{border-left:0;padding-left:0}
.home-feature-row h2{font-size:17px}
.home-feature-row p{font-size:13px}

/* Match history: whole row is the link, result stated in words. */
.match-list-row{display:grid;grid-template-columns:136px minmax(0,1fr) auto;align-items:center;gap:20px;padding:18px 12px;margin:0 -12px;border-radius:8px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none;transition:background-color 150ms var(--ease-out)}
.match-list-row:hover{background:#ffffff08}
.match-list-row:last-child{border-bottom:0}
.match-list-row b{font-size:15px;color:var(--ink)}
.match-list-row small{display:block;margin-top:4px}
.result-chip{justify-self:start;font-size:12px;font-weight:600;padding:5px 10px;border-radius:999px;border:1px solid #9cafc433;color:#c4d1e0;background:#9cafc414;white-space:nowrap}
.result-chip.crew{color:var(--crew);border-color:#83b8ff4d;background:#83b8ff14}
.result-chip.imp{color:var(--imp);border-color:#fc8b984d;background:#fc8b9814}
.match-open{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--accent)}
.match-open .icon{transition:transform 160ms var(--ease-out)}
.match-list-row:hover .match-open .icon{transform:translateX(3px)}

/* Profile: placement progress instead of three "Hidden" values. */
.placement-progress{display:grid;gap:10px;margin-bottom:22px}
.placement-progress>div{display:flex;justify-content:space-between;align-items:baseline}
.placement-progress b{font-size:14px;color:var(--ink)}
.placement-progress span{font-size:13px;color:var(--meta);font-variant-numeric:tabular-nums}
.placement-progress i{height:6px;border-radius:999px;background:linear-gradient(90deg,var(--accent) var(--progress),#ffffff14 var(--progress))}
.rating-grid.is-pending strong{color:#6f819b!important}

/* Download */
.download-head{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.download-head h2{margin:0 0 6px}
.download-head p{margin:0;color:var(--meta)}
.install-steps{list-style:none;counter-reset:step;margin:26px 0 8px;padding:0;display:grid;gap:16px}
.install-steps li{counter-increment:step;display:grid;grid-template-columns:28px 1fr;column-gap:14px;row-gap:3px}
.install-steps li:before{content:counter(step);grid-row:1/3;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#8acaff1f;color:var(--accent);font:600 13px Inter,sans-serif}
.install-steps li>b,.install-steps li>span{grid-column:2}
.install-steps b{color:var(--ink);font-size:14px}
.install-steps span{color:var(--meta);font-size:13px;line-height:1.55}

@media(max-width:780px){
  .match-list-row{grid-template-columns:minmax(0,1fr) auto;gap:8px 14px}
  .match-list-row>.result-chip{grid-column:1/-1}
  .match-list-row>span{display:inline-flex!important}
}
@media(prefers-reduced-motion:reduce){.text-link .icon,.match-open .icon{transition:none}}

/* Public reading/recovery pages and shared accessible controls. */
:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.skip-link{position:fixed;left:20px;top:12px;z-index:200;padding:12px 18px;background:#8acaff;color:#0a1020;border-radius:8px;transform:translateY(-180%)}
.skip-link:focus{transform:none}
.reading-page{max-width:72ch;margin:0 auto;padding:0 0 36px}
.reading-page h1{margin:0 0 30px}
.reading-page h2{margin:36px 0 12px;font-size:25px}
.reading-page p,.reading-page li,.reading-page dd{font-size:16px;line-height:1.75;color:#b8c9dd}
.reading-page ul{padding-left:24px}
.reading-page li{margin:12px 0}
.reading-page dt{font-size:17px;font-weight:650;color:var(--ink);margin-top:24px}
.reading-page dd{margin:8px 0 20px}
.reading-page a,.policy-links a{text-decoration:underline;text-underline-offset:4px}
.reading-page code{font-size:.95em;color:var(--ink)}
.error-page{padding-top:48px;min-height:50vh}
.error-page .actions{gap:24px}
.error-page .button{text-decoration:none}
footer{font-size:14px;letter-spacing:0}
footer nav,.policy-links{display:flex;gap:24px;flex-wrap:wrap}
footer nav a{display:inline-flex;align-items:center;min-height:44px;padding:0;font-size:14px;color:var(--muted);margin:0}
footer nav a:hover{color:var(--ink);background:transparent}
.event-icon .icon{width:20px;height:20px}
.kill-tick .icon{width:12px;height:12px}
.replay-page-head .back-link,.vote-grid i{display:inline-flex;align-items:center;gap:7px}
.replay-toolbar button .icon,.map-controls .icon,.transport .icon{width:18px;height:18px}
.role-indicator{letter-spacing:0;text-transform:none}
@media(max-width:780px){.reading-page h1{margin-bottom:24px}.reading-page h2{margin-top:30px}.reading-page p,.reading-page li,.reading-page dd{font-size:15px}.reading-page{max-width:100%}footer nav{margin:0}.error-page{padding-top:20px}.role-indicator{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.text-link:hover .icon,a.text-link[target=_blank]:hover .icon,button:active:not(:disabled),.button:active{transform:none}}
