/* 云存档：首次起名对话框、冲突提示、「另一个窗口」横幅（.rc-）+ 齿轮旁的同步小牌、资料卡（.cs-）。
   .rc- 部分在游戏启动前就会出现（那时 body 还没有 desktop-game），所以不依赖 ui-kit 的作用域，只借用它的石板/按钮美术。 */
.rc-modal{--rc-gold:#f1d896;--rc-gold-lo:#c9a25a;--rc-text:#ede7d8;--rc-muted:#a8b3b9;--rc-serif:"RuneSerif","Noto Serif SC","Noto Serif CJK SC","Source Han Serif SC","Songti SC",serif;--rc-sans:"Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC","Microsoft YaHei",sans-serif;
  width:min(700px,calc(100vw - 24px));max-height:calc(100vh - 24px);box-sizing:border-box;padding:0;margin:auto;border:0;background:none;color:var(--rc-text);overflow:visible}
.rc-modal::backdrop{background:radial-gradient(ellipse at 50% 40%,#0d1a2bf2,#03070dfc)}
.rc-panel{position:relative;box-sizing:border-box;max-height:calc(100vh - 24px);overflow:auto;padding:clamp(18px,3vh,30px) clamp(18px,3vw,34px);border-style:solid;border-color:transparent;border-width:clamp(22px,3.6vh,38px);border-image:url("./assets/pages/_kit/panel.webp") 200 fill / clamp(22px,3.6vh,38px) stretch;background:linear-gradient(#0b1622f2,#07101bf2) padding-box;filter:drop-shadow(0 18px 40px #000c);text-align:center}
.rc-title{margin:0 0 10px;font:700 clamp(24px,3.6vh,34px)/1.2 var(--rc-serif);letter-spacing:.14em;background:linear-gradient(180deg,#f6e2a8,#c9a25a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 1px #000a)}
.rc-lead{margin:0 auto 14px;max-width:30em;font:400 clamp(14px,1.9vh,17px)/1.6 var(--rc-sans);color:var(--rc-text)}
.rc-notice,.rc-warn{margin:0 auto 12px;max-width:32em;padding:8px 12px;border-radius:6px;font:400 clamp(13px,1.8vh,16px)/1.5 var(--rc-sans)}
.rc-notice{background:#3a1d1599;color:#ffd9c4;box-shadow:inset 0 0 0 1px #e0584a88}
.rc-warn{background:#2f261099;color:#f6e2a8;box-shadow:inset 0 0 0 1px #c9a25a88}
.rc-field{display:flex;align-items:center;justify-content:center;gap:12px;margin:6px auto 2px;font:700 clamp(15px,2vh,18px)/1 var(--rc-serif);color:var(--rc-gold);letter-spacing:.1em}
.rc-input{width:min(300px,60vw);height:clamp(38px,5vh,48px);box-sizing:border-box;padding:0 14px;border:1px solid #c9a25a99;border-radius:6px;background:#050b13;color:#fff4dc;font:700 clamp(17px,2.3vh,21px)/1 var(--rc-sans);letter-spacing:.06em;outline:none;box-shadow:inset 0 2px 6px #000c}
.rc-input:focus{border-color:var(--rc-gold);box-shadow:inset 0 2px 6px #000c,0 0 0 2px #f1d89655}
.rc-code-input{text-transform:uppercase;letter-spacing:.24em;text-align:center;font-family:var(--rc-serif)}
.rc-msg{min-height:1.5em;margin:4px 0 8px;font:400 clamp(13px,1.8vh,15px)/1.5 var(--rc-sans);color:var(--rc-muted)}
.rc-msg.is-ok{color:#8fe08f}.rc-msg.is-bad{color:#ff9c8c}
.rc-avatars{display:flex;justify-content:center;gap:clamp(8px,1.2vw,16px);margin:4px 0 12px;flex-wrap:wrap}
.rc-avatar{--s:clamp(56px,9vh,88px);position:relative;width:var(--s);height:var(--s);padding:0;border:0;border-radius:50%;background:radial-gradient(circle,#1a2b40,#07101b);cursor:pointer;box-shadow:0 0 0 3px #8a6a32,0 6px 14px #000b;transition:transform .16s ease,box-shadow .16s ease}
.rc-avatar img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;pointer-events:none}
.rc-avatar:hover{transform:translateY(-3px)}
.rc-avatar:focus-visible{outline:2px solid #fff;outline-offset:5px}
.rc-avatar.is-picked{box-shadow:0 0 0 4px #f1d896,0 0 22px #ffd27acc,0 6px 14px #000b;transform:translateY(-3px) scale(1.06)}
.rc-avatar.is-picked::after{content:"✓";position:absolute;right:-4px;bottom:-4px;display:grid;place-items:center;width:28%;aspect-ratio:1;border-radius:50%;background:#d4b477;color:#3a2410;font:900 clamp(12px,1.8vh,18px)/1 var(--rc-sans);box-shadow:0 2px 4px #000a}
.rc-progress{margin:0 auto 14px;max-width:32em;font:400 clamp(13px,1.8vh,15px)/1.5 var(--rc-sans);color:#d9c9a0}
.rc-small{margin:12px auto 0;max-width:32em;font:400 clamp(12px,1.6vh,14px)/1.5 var(--rc-sans);color:var(--rc-muted)}
.rc-actions{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:6px}
.rc-btn{--h:clamp(42px,5.8vh,58px);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:calc(var(--h)*3.6);height:var(--h);padding:0 calc(var(--h)*.5);border-style:solid;border-color:transparent;border-width:calc(var(--h)*120/423) calc(var(--h)*200/423);border-image:url("./assets/pages/_kit/btn-secondary.webp") 120 200 fill / calc(var(--h)*120/423) calc(var(--h)*200/423) stretch;background:none;color:var(--rc-gold);font:700 clamp(15px,calc(var(--h)*.34),21px)/1 var(--rc-serif);letter-spacing:.12em;text-indent:.12em;white-space:nowrap;cursor:pointer;text-shadow:0 1px 2px #000c;filter:drop-shadow(0 4px 6px #000a);transition:transform .16s ease,filter .16s ease}
.rc-btn--primary{border-image-source:url("./assets/pages/_kit/btn-primary.webp");color:#3a2410;text-shadow:0 1px 0 #f6e2a880;min-width:calc(var(--h)*4.4)}
.rc-btn:not(:disabled):hover{transform:translateY(-2px);filter:brightness(1.12) drop-shadow(0 6px 8px #000a)}
.rc-btn:disabled{border-image-source:url("./assets/pages/_kit/btn-disabled.webp");color:#9aa0a4;text-shadow:none;cursor:not-allowed}
.rc-btn:focus-visible,.rc-link:focus-visible{outline:2px solid #fff;outline-offset:3px}
.rc-link{padding:4px 8px;border:0;background:none;color:#9fc7ff;font:400 clamp(13px,1.8vh,15px)/1.4 var(--rc-sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.rc-who{display:flex;align-items:center;justify-content:center;gap:14px;margin:4px 0 12px}
.rc-who img{width:clamp(56px,8vh,80px);height:clamp(56px,8vh,80px);border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #d4b477,0 6px 14px #000b}
.rc-who b{font:700 clamp(20px,3vh,28px)/1 var(--rc-serif);color:#fff2d2;letter-spacing:.08em}
.rc-code{display:flex;align-items:center;justify-content:center;gap:16px;margin:0 0 14px}
.rc-code b{white-space:nowrap;padding:8px 18px;border-radius:6px;background:#050b13;box-shadow:inset 0 0 0 1px #c9a25a99;font:700 clamp(24px,3.6vh,34px)/1 var(--rc-serif);letter-spacing:.2em;color:#fff2d2;user-select:all}
.rc-banner{position:fixed;left:50%;top:10px;z-index:2147483000;transform:translateX(-50%);display:flex;align-items:center;gap:14px;max-width:calc(100vw - 24px);box-sizing:border-box;padding:10px 12px 10px 18px;border-radius:8px;background:#2f2610f2;box-shadow:inset 0 0 0 1px #c9a25a,0 8px 24px #000c;color:#f6e2a8;font:400 15px/1.4 "Noto Sans SC","Microsoft YaHei",sans-serif}
.rc-banner button{flex:none;width:28px;height:28px;border:0;border-radius:50%;background:#0006;color:#f6e2a8;font:700 18px/1 sans-serif;cursor:pointer}
@media (prefers-reduced-motion:reduce){.rc-avatar,.rc-btn{transition:none}}

/* ---------------- 桌面版（游戏启动后，ui-kit 作用域内）：顶栏小牌、资料卡、结算页排行徽章 ---------------- */
body.desktop-game .cs-chip{flex:none;display:flex;align-items:center;gap:8px;height:calc(var(--ds-header,58px)*.68);max-width:220px;box-sizing:border-box;padding:0 12px 0 4px;border:0;border-radius:999px;background:linear-gradient(90deg,#0b1622,#13202ecc);box-shadow:inset 0 0 0 1px #c9a25a88,0 3px 8px #0008;color:#f1dfb3;cursor:pointer;font:700 14px/1 var(--uk-serif,serif);transition:filter .16s ease}
body.desktop-game .cs-chip:hover{filter:brightness(1.15)}
body.desktop-game .cs-chip:focus-visible{outline:2px solid #f1d896;outline-offset:2px}
body.desktop-game .cs-chip-ava{flex:none;width:calc(var(--ds-header,58px)*.56);height:calc(var(--ds-header,58px)*.56);border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #d4b477}
body.desktop-game .cs-chip-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:.06em}
body.desktop-game .cs-chip-state{flex:none;display:flex;align-items:center;gap:5px;font:400 12px/1 var(--uk-sans,sans-serif);color:#a8b3b9;letter-spacing:.04em}
body.desktop-game .cs-chip-state i{width:8px;height:8px;border-radius:50%;background:#6fd36f;box-shadow:0 0 6px #6fd36f}
body.desktop-game .cs-chip.is-syncing .cs-chip-state i{background:none;box-shadow:inset 0 0 0 2px #e8c45a;animation:cs-spin 1s linear infinite}
body.desktop-game .cs-chip.is-offline .cs-chip-state i{background:none;box-shadow:inset 0 0 0 2px #a8b3b9}
body.desktop-game .cs-chip.is-error .cs-chip-state i{background:#e0584a;box-shadow:0 0 6px #e0584a}
@keyframes cs-spin{50%{opacity:.35}}
@media (min-width:1900px){body.desktop-game .cs-chip{max-width:260px;font-size:16px}body.desktop-game .cs-chip-state{font-size:14px}}
@media (max-width:1400px){body.desktop-game .cs-chip-name{max-width:5.5em}}

body.desktop-game dialog.cs-profile{--pg-u:min(calc((100vh - var(--uk-header,68px)) / 100),calc(100vw / 150));width:min(calc(var(--pg-u)*118),calc(100vw - 40px));max-height:calc(100vh - 24px);box-sizing:border-box;margin:auto;padding:0;border:0;background:none;color:var(--uk-text);overflow:visible}
body.desktop-game dialog.cs-profile::backdrop{background:#03070dcc}
body.desktop-game .cs-card{position:relative;display:flex;flex-direction:column;gap:calc(var(--pg-u)*1.2);padding:calc(var(--pg-u)*2) calc(var(--pg-u)*2.4);border-radius:10px;background:radial-gradient(ellipse at 50% 0%,#162a3df5,#07101bf8 70%);box-shadow:inset 0 0 0 1px #c9a25a99,0 20px 60px #000d}
body.desktop-game .cs-head{display:flex;align-items:center;justify-content:space-between;gap:var(--uk-gap)}
body.desktop-game .cs-cols{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--pg-u)*1.6)}
body.desktop-game .cs-col{display:flex;flex-direction:column;gap:calc(var(--pg-u)*1.4);min-width:0}
body.desktop-game .cs-block h3{margin:0 0 calc(var(--pg-u)*.6);font:700 max(var(--uk-min,12px),calc(var(--pg-u)*1.9))/1.2 var(--uk-serif);letter-spacing:.1em;color:#f1d896}
body.desktop-game .cs-who{display:flex;align-items:center;gap:calc(var(--pg-u)*1.6)}
body.desktop-game .cs-ava{flex:none;width:calc(var(--pg-u)*11);height:calc(var(--pg-u)*11);padding:0;border:0;border-radius:50%;background:#07101b;cursor:pointer;box-shadow:0 0 0 3px #d4b477,0 6px 14px #000b}
body.desktop-game .cs-ava img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
body.desktop-game .cs-ava:focus-visible{outline:2px solid #fff;outline-offset:4px}
body.desktop-game .cs-who-text,.cs-rename{display:flex;flex-direction:column;gap:calc(var(--pg-u)*.8);min-width:0}
body.desktop-game .cs-name{font:700 max(16px,calc(var(--pg-u)*3))/1.1 var(--uk-serif);color:#fff2d2;letter-spacing:.06em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.desktop-game .cs-row{display:flex;align-items:center;gap:calc(var(--pg-u)*.8);flex-wrap:wrap}
body.desktop-game .cs-input{height:max(34px,calc(var(--pg-u)*4.4));box-sizing:border-box;min-width:0;width:calc(var(--pg-u)*22);padding:0 12px;border:1px solid #c9a25a99;border-radius:6px;background:#050b13;color:#fff4dc;font:700 max(14px,calc(var(--pg-u)*1.9))/1 var(--uk-sans);outline:none}
body.desktop-game .cs-input:focus{border-color:#f1d896;box-shadow:0 0 0 2px #f1d89655}
body.desktop-game .cs-code-input{text-transform:uppercase;letter-spacing:.2em;font-family:var(--uk-serif)}
body.desktop-game .cs-avatars{display:flex;gap:calc(var(--pg-u)*1.2);justify-content:center}
body.desktop-game .cs-ava-pick{width:calc(var(--pg-u)*7.6);height:calc(var(--pg-u)*7.6);padding:0;border:0;border-radius:50%;background:#07101b;cursor:pointer;box-shadow:0 0 0 2px #8a6a32,0 4px 10px #000b;transition:transform .15s ease}
body.desktop-game .cs-ava-pick img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
body.desktop-game .cs-ava-pick:hover{transform:translateY(-2px)}
body.desktop-game .cs-ava-pick.is-picked{box-shadow:0 0 0 3px #f1d896,0 0 16px #ffd27acc}
body.desktop-game .cs-code{display:flex;align-items:center;gap:calc(var(--pg-u)*1.2)}
body.desktop-game .cs-code b{padding:calc(var(--pg-u)*.6) calc(var(--pg-u)*1.4);border-radius:6px;background:#050b13;box-shadow:inset 0 0 0 1px #c9a25a99;font:700 max(18px,calc(var(--pg-u)*3))/1 var(--uk-serif);letter-spacing:.18em;color:#fff2d2;user-select:all}
body.desktop-game .cs-muted,.cs-hint,.cs-status,.cs-warn,.cs-msg{margin:0;font:400 max(var(--uk-min,12px),calc(var(--pg-u)*1.5))/1.5 var(--uk-sans);color:#a8b3b9}
body.desktop-game .cs-status{color:#ede7d8;display:flex;align-items:center;gap:8px}
body.desktop-game .cs-dot{width:10px;height:10px;border-radius:50%;flex:none;background:#6fd36f;box-shadow:0 0 6px #6fd36f}
body.desktop-game .cs-dot.is-offline{background:none;box-shadow:inset 0 0 0 2px #a8b3b9}
body.desktop-game .cs-dot.is-syncing{background:none;box-shadow:inset 0 0 0 2px #e8c45a}
body.desktop-game .cs-dot.is-error{background:#e0584a;box-shadow:0 0 6px #e0584a}
body.desktop-game .cs-hint.is-ok{color:#8fe08f}body.desktop-game .cs-hint.is-bad,body.desktop-game .cs-msg.is-bad{color:#ff9c8c}
body.desktop-game .cs-warn{color:#f6e2a8}
body.desktop-game .cs-msg{min-height:1.5em;text-align:center;color:#d9c9a0}
body.desktop-game .cs-ranks,body.desktop-game .cs-backups{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:calc(var(--pg-u)*.6)}
body.desktop-game .cs-ranks li{display:grid;grid-template-columns:calc(var(--pg-u)*3.4) calc(var(--pg-u)*14) 1fr;align-items:center;gap:calc(var(--pg-u)*.8);font:400 max(var(--uk-min,12px),calc(var(--pg-u)*1.5))/1.3 var(--uk-sans)}
body.desktop-game .cs-ranks img{width:calc(var(--pg-u)*3.4);height:calc(var(--pg-u)*3.4);object-fit:contain}
body.desktop-game .cs-ranks span{color:#d9c9a0;font-family:var(--uk-serif);font-weight:700}
body.desktop-game .cs-ranks b{color:#fff2d2;font-weight:400;min-width:0}
body.desktop-game .cs-backups li{display:flex;align-items:center;gap:calc(var(--pg-u)*1);flex-wrap:wrap;font:400 max(var(--uk-min,12px),calc(var(--pg-u)*1.5))/1.3 var(--uk-sans)}
body.desktop-game .cs-backup-when{color:#fff2d2}
body.desktop-game .cs-backup-sum{color:#a8b3b9;flex:1}

/* Result page rank badge: lives inside the 1600×1000 result board (board px), right of the stage plaque.
   Art keeps its proportions: winged medal 640×597 (avatar socket ⌀234 at 321,260; rank ribbon centre y≈81%),
   「新纪录」 burst 800×658 (ribbon text band x 22–78 %, centre y≈53 %). Shown far below native size. */
body.desktop-game .pg-result-cloud{position:absolute;right:40px;top:calc(150px - var(--dy,0px));z-index:6;display:flex;align-items:center;gap:6px;max-width:470px;box-sizing:border-box;filter:drop-shadow(0 8px 14px #000c)}
body.desktop-game .pg-result-cloud[hidden]{display:none}
body.desktop-game .cs-medal{position:relative;flex:none;width:176px;aspect-ratio:640/597}
body.desktop-game .cs-medal-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
body.desktop-game .cs-medal-face{position:absolute;left:32.9%;top:25.05%;width:34.5%;height:37%;border-radius:50%;object-fit:cover}
body.desktop-game .cs-medal-rank{position:absolute;left:24%;right:24%;top:81%;transform:translateY(-50%);text-align:center;font:700 19px/1 var(--uk-serif);color:#fff2d2;letter-spacing:.06em;white-space:nowrap;text-shadow:0 1px 2px #000,0 0 6px #0a1a33}
body.desktop-game .cs-rank-side{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}
body.desktop-game .cs-burst{position:relative;width:200px;aspect-ratio:800/658;flex:none;margin:-18px 0 -14px}
body.desktop-game .cs-burst img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
body.desktop-game .cs-burst b{position:absolute;left:22%;right:22%;top:53%;transform:translateY(-50%);text-align:center;font:700 22px/1 var(--uk-serif);letter-spacing:.2em;color:#fff4e6;text-shadow:0 1px 2px #5a0a10,0 0 6px #8e1a10}
body.desktop-game .cs-rank-wait{font:400 20px/1.3 var(--uk-sans);color:#d9c9a0;text-shadow:0 1px 3px #000}
body.desktop-game .cs-rank-lines{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
body.desktop-game .cs-rank-line{font:700 21px/1.2 var(--uk-serif);color:#fff2d2;white-space:nowrap;text-shadow:0 1px 2px #000,0 0 8px #000}
body.desktop-game .cs-rank-line.is-up b{color:#ffe7a0}
