/* SHO arena: shell insignia and compact landscape layout. */
@font-face { font-family:'Sho Ranked Tibetan'; src:url('../sho-runtime/assets/fonts/bo-cn-gjzhuza.TTF') format('truetype'); font-display:swap; }
.sho-ranked[lang="bo-CN"] { font-family:'Sho Ranked Tibetan',sans-serif; line-height:1.8; }
.sho-ranked[lang="bo-CN"] .rank-emblem h2 { font-size:22px; line-height:1.7; letter-spacing:0; }
.sho-ranked .rank-candidate strong,.sho-ranked .rank-queue-title h3 { overflow-wrap:anywhere; }
.sho-ranked .rank-match-footer button { flex-shrink:0; max-width:100%; white-space:normal; }
.sho-ranked { --rank-ink:#143e38; --rank-green:#20584f; --rank-gold:#bc9654; --rank-paper:#f4f7f3; --rank-line:#d2ded7; color:var(--rank-ink); background:var(--rank-paper); padding:18px; max-width:1120px; margin:auto; font-family:inherit; box-sizing:border-box; border-radius:20px; }
.sho-ranked * { box-sizing:border-box; }
.sho-ranked h2,.sho-ranked h3,.sho-ranked p { margin:0; }
.sho-ranked button,.sho-ranked select { font:inherit; min-height:44px; padding:9px 16px; border:1px solid var(--rank-line); color:var(--rank-ink); border-radius:10px; background:white; cursor:pointer; }
.sho-ranked button:disabled { opacity:.5; cursor:default; }
.sho-ranked button:focus-visible,.sho-ranked select:focus-visible { outline:3px solid var(--rank-gold); outline-offset:2px; }
.sho-ranked .rank-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.sho-ranked .rank-tabs { display:flex; gap:4px; flex-wrap:wrap; }
.sho-ranked .rank-tabs button { border-color:transparent; background:transparent; font-size:14px; padding-inline:12px; }
.sho-ranked .rank-tabs [aria-selected="true"] { background:var(--rank-ink); color:white; }
.sho-ranked .rank-heading select { font-size:12px; padding-inline:10px; max-width:170px; }
.sho-ranked .rank-arena { display:grid; grid-template-columns:minmax(210px,.82fr) minmax(0,1.65fr); gap:16px; align-items:stretch; }
.sho-ranked .rank-hero { background:var(--rank-ink); color:#f1e6ce; border-radius:18px; padding:22px; display:flex; flex-direction:column; justify-content:center; gap:22px; position:relative; overflow:hidden; }
.sho-ranked .rank-hero::after { content:""; position:absolute; width:220px; height:220px; border:1px solid #bc965428; border-radius:50%; right:-145px; top:-130px; pointer-events:none; }
.sho-ranked .rank-emblem { display:flex; align-items:center; gap:18px; }
.sho-ranked .rank-emblem svg { width:90px; height:100px; flex-shrink:0; fill:none; stroke:var(--rank-gold); stroke-width:1.4; }
.sho-ranked .rank-emblem .rank-shell { fill:#bc965426; stroke-width:2; }
.sho-ranked .rank-emblem .rank-shell-line { stroke:#f1e6ce; stroke-width:2; stroke-linecap:round; }
.sho-ranked .rank-emblem h2 { font-size:30px; font-weight:750; margin-bottom:8px; letter-spacing:.02em; }
.sho-ranked .rank-emblem p { font-size:12px; color:#d5e1d8; }
.sho-ranked .rank-emblem strong { font-size:20px; font-variant-numeric:tabular-nums; color:#f1e6ce; }
.sho-ranked .rank-growth p { font-size:13px; margin-bottom:8px; }
.sho-ranked .rank-growth small { font-size:11px; color:#bdcfc6; display:block; margin-top:6px; }
.sho-ranked .rank-progress { display:block; width:100%; height:5px; border:0; accent-color:var(--rank-gold); background:#ffffff24; border-radius:5px; overflow:hidden; }
.sho-ranked .rank-progress::-webkit-progress-bar { background:#ffffff24; }
.sho-ranked .rank-progress::-webkit-progress-value { background:var(--rank-gold); }
.sho-ranked .rank-stats { display:flex; justify-content:space-between; gap:10px; border-top:1px solid #ffffff25; padding-top:14px; }
.sho-ranked .rank-stats span { font-size:11px; color:#bdcfc6; }
.sho-ranked .rank-stats strong { display:block; font-size:19px; font-weight:600; color:white; font-variant-numeric:tabular-nums; margin-bottom:4px; }
.sho-ranked .rank-queue { background:white; border:1px solid var(--rank-line); border-radius:18px; padding:22px; min-width:0; display:flex; flex-direction:column; justify-content:space-between; gap:16px; }
.sho-ranked .rank-queue-title { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.sho-ranked h3 { font-size:21px; line-height:1.3; font-weight:750; }
.sho-ranked .rank-queue-title p { font-size:12px; color:#5f756b; margin-top:8px; line-height:1.5; }
.sho-ranked .rank-clock { flex-shrink:0; text-align:right; font-size:25px; font-weight:600; font-variant-numeric:tabular-nums; color:var(--rank-green); }
.sho-ranked .rank-clock small { display:block; font-size:10px; color:#5f756b; font-weight:400; margin-top:3px; }
.sho-ranked .rank-candidates { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.sho-ranked .rank-candidate { padding:14px 5px; border:1px dashed #c2d0c8; border-radius:12px; display:flex; flex-direction:column; align-items:center; gap:7px; color:#60766b; text-align:center; }
.sho-ranked .rank-candidate.is-found { border-style:solid; border-color:#aac9b8; background:#edf5ee; color:var(--rank-green); }
.sho-ranked .rank-candidate.is-optional { border-color:#e1ded5; background:#fcfbf8; color:#827452; }
.sho-ranked .rank-seat-symbol { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; border:1px solid currentColor; font-size:22px; }
.sho-ranked .rank-candidate strong { font-size:13px; font-weight:600; }
.sho-ranked .rank-candidate small { font-size:10px; }
.sho-ranked .rank-match-footer,.sho-ranked .rank-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.sho-ranked .rank-match-footer p { font-size:11px; line-height:1.6; color:#5f756b; max-width:38ch; }
.sho-ranked button.rank-primary { background:var(--rank-green); color:white; border-color:var(--rank-green); font-weight:700; min-width:128px; white-space:nowrap; box-shadow:0 3px 0 #123e36; }
.sho-ranked .rank-footnote { display:block; font-size:10px; color:#68786e; line-height:1.5; }
.sho-ranked .rank-error { padding:10px 14px; color:#923d35; border:1px solid #d5a29a; background:#fff7f3; border-radius:10px; margin-bottom:12px; font-size:13px; }
.sho-ranked .rank-room-seats { display:grid; grid-template-columns:repeat(var(--seats,3),minmax(0,1fr)); gap:10px; }
.sho-ranked .rank-room-seat { border-bottom:2px solid #cad9ce; padding:4px; text-align:center; min-width:0; }
.sho-ranked .rank-room-seat img { width:64px; height:64px; object-fit:contain; display:block; margin:auto auto 6px; }
.sho-ranked .rank-room-seat strong { display:block; font-size:13px; overflow-wrap:anywhere; }
.sho-ranked .rank-room-seat strong small { color:#8b6b31; }
.sho-ranked .rank-room-seat p { font-size:11px; color:#61766a; margin-top:4px; }
.sho-ranked .rank-ready-state { display:inline-block; font-size:10px; padding:3px 9px; border-radius:12px; background:#f1f0e9; color:#7c7054; margin-top:5px; }
.sho-ranked .rank-ready-state.is-ready { color:#20584f; background:#e3f0e6; }
.sho-ranked .rank-equipment { display:flex; gap:12px; }
.sho-ranked .rank-equipment label { flex:1; display:grid; gap:5px; min-width:0; font-size:11px; color:#61766a; }
.sho-ranked .rank-equipment select { width:100%; font-size:12px; min-height:40px; padding:8px; }
.sho-ranked .rank-records { min-height:230px; border:1px solid var(--rank-line); border-radius:16px; padding:22px; background:white; }
.sho-ranked .rank-empty { text-align:center; padding:20px; }
.sho-ranked .rank-empty>span { display:block; font-size:36px; color:var(--rank-gold); margin-bottom:12px; }
.sho-ranked .rank-empty p { font-size:13px; color:#60766b; margin:12px 0 20px; }
.sho-ranked .rank-rules { line-height:1.8; font-size:13px; max-width:75ch; }
.sho-ranked .rank-rules li { margin:8px 0; }
.sho-ranked .rank-rules ul { padding-left:20px; }
.sho-ranked .rank-table-wrap { overflow:auto; }
.sho-ranked .rank-table { border-collapse:collapse; width:100%; text-align:left; font-size:13px; }
.sho-ranked .rank-table td,.sho-ranked .rank-table th { padding:12px 9px; border-bottom:1px solid var(--rank-line); white-space:nowrap; }
.sho-ranked .rank-table td:nth-child(2) { white-space:normal; overflow-wrap:anywhere; }
.sho-ranked .rank-positive { color:#17704f; font-weight:700; }
.sho-ranked .rank-negative { color:#a23b36; font-weight:700; }
.sho-ranked .rank-page { display:flex; align-items:center; justify-content:flex-end; gap:12px; padding-top:16px; font-size:12px; }
@media(max-width:600px) { .sho-ranked { padding:12px; } .sho-ranked .rank-heading { flex-wrap:wrap; } .sho-ranked .rank-arena { grid-template-columns:1fr; } .sho-ranked .rank-hero { gap:14px; } .sho-ranked .rank-emblem svg { width:64px; height:70px; } .sho-ranked .rank-stats { padding-top:10px; } .sho-ranked .rank-match-footer { flex-wrap:wrap; } .sho-ranked .rank-tabs button { padding-inline:10px; font-size:12px; } }
@media(prefers-reduced-motion:reduce) { .sho-ranked * { scroll-behavior:auto; } }
