.toy-rank-open { min-height:44px; padding:9px 18px; border:1px solid #41657f; border-radius:7px; background:#11263b; color:#b5edff; font-size:12px; font-weight:700; line-height:1.35; cursor:pointer; }
.menu-overlay > .toy-rank-open { width:min(86%,360px); margin-top:12px; }
.toy-rank-open:hover { background:#193950; border-color:#6ed6f4; }
.toy-rank-open:disabled { cursor:default; opacity:.65; }
#toyRunTimer { flex:0 0 auto; font:700 11px/1.2 ui-monospace,monospace; color:#b4eaff; white-space:nowrap; }
#result { overflow-y:auto; overscroll-behavior:contain; justify-content:flex-start; padding:18px 0; }
#result > * { flex-shrink:0; }
#result .result-actions { margin-top:12px; gap:8px; }
#result .toy-upload-state { font-size:11px; line-height:1.55; color:#a2b5cf; text-align:center; }
.toy-upload-state:empty { display:none; }
.toy-run-result { width:min(84%,360px); margin-top:10px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:3px 8px; padding:10px 13px; background:#102137; border:1px solid #2b4e67; border-radius:7px; color:#a6bdd4; font-size:11px; }
.toy-run-result strong { font:800 25px/1.2 ui-monospace,monospace; color:#d2f6ff; }
.toy-run-result small { grid-column:1/-1; font-size:10px; text-align:left; }
.toy-rank-overlay { position:fixed; z-index:80; inset:0; display:grid; place-items:center; padding:14px; background:rgba(2,6,12,.94); }
.toy-rank-card { width:min(100%,510px); min-height:0; height:min(760px,calc(var(--app-height,100vh) - 28px)); max-height:calc(var(--app-height,100vh) - 28px); display:flex; flex-direction:column; padding:18px; border:1px solid #39526e; border-radius:14px; background:linear-gradient(150deg,#142239,#080f1c); color:#dce7f4; overflow:hidden; }
.toy-rank-heading { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.toy-rank-heading small { color:#72d8f1; font-size:10px; }
.toy-rank-heading h2 { margin:5px 0 12px; font-size:23px; line-height:1.3; }
.toy-rank-card button { min-height:44px; border:1px solid #365169; background:#162a40; color:#dce7f4; border-radius:7px; cursor:pointer; font-size:12px; }
.toy-rank-card button:focus-visible,.toy-rank-open:focus-visible { outline:2px solid #88e7ff; outline-offset:2px; }
.toy-rank-card button:disabled { opacity:.55; cursor:default; }
#toyRankClose { width:44px; flex:0 0 44px; align-self:flex-start; font-size:25px; background:transparent; }
.toy-rank-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.toy-rank-tabs button.selected { border-color:#67d7f7; color:#a2edff; background:#174058; }
.toy-rank-rules { color:#9aabc0; font-size:11px; line-height:1.6; margin:12px 0 8px; }
.toy-rank-local { margin:0 0 10px; color:#bdeeff; font:600 12px/1.4 ui-monospace,monospace; }
.toy-rank-tablehead,.toy-rank-row { display:grid; grid-template-columns:40px minmax(0,1fr) 102px; gap:10px; align-items:center; }
.toy-rank-tablehead { padding:8px 9px; border-bottom:1px solid #31445c; color:#94aac5; font-size:11px; }
.toy-rank-tablehead span:last-child { text-align:right; }
.toy-rank-scroll { min-height:64px; overflow-y:auto; overscroll-behavior:contain; flex:1 1 auto; }
#toyRankList { list-style:none; padding:0; margin:0; }
.toy-rank-row { min-height:48px; padding:8px 9px; border-bottom:1px solid #ffffff0e; font-size:12px; }
.toy-rank-number { color:#6fddf7; font-weight:800; }
.toy-rank-name { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.toy-rank-row strong { font:700 14px/1.2 ui-monospace,monospace; text-align:right; }
#toyRankState { margin:12px 9px; color:#acb9cb; font-size:11px; line-height:1.6; }
.toy-rank-footer { padding-top:12px; flex:0 0 auto; }
.toy-rank-footer > div { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.toy-rank-footer p { font-size:11px; color:#b4cce2; line-height:1.55; margin:9px 0; }
.toy-rank-footer small { font-size:10px; color:#7f90a7; }
@media(max-width:560px) {
  .toy-rank-overlay { padding:10px; padding-top:max(10px,env(safe-area-inset-top,0px),var(--toy-safe-top,0px)); padding-bottom:max(10px,env(safe-area-inset-bottom,0px),var(--toy-safe-bottom,0px)); }
  .toy-rank-card { padding:13px; max-height:calc(var(--app-height,100vh) - 28px - var(--toy-safe-top,0px) - var(--toy-safe-bottom,0px)); }
  .toy-rank-heading h2 { font-size:21px; }
  .toy-rank-tablehead,.toy-rank-row { grid-template-columns:30px minmax(0,1fr) 90px; gap:6px; }
}
@media(max-height:640px) {
  #result h2 { margin-top:4px; }
  #result .challenge-victory-praise { margin-top:8px; font-size:15px; }
  #result .result-actions { gap:6px; }
  .menu-overlay > .toy-rank-open { margin-top:6px; }
  .toy-rank-rules { margin-top:8px; }
}
