/* Shared desktop UI kit (.uk-). One visual language for every page: night-blue, antique gold, carved grey stone, element gems.
   Only desktop (body.desktop-game) uses these parts; the phone layout never renders them. */
@font-face{font-family:"RuneSerif";src:url("./assets/pages/_kit/fonts/rune-serif-bold.woff2") format("woff2");font-weight:500 900;font-style:normal;font-display:swap}
body.desktop-game{
  --uk-ink:#07101b;--uk-ink-2:#0b1622;
  --uk-stone-1:#2a2f37;--uk-stone-2:#4a4f57;--uk-stone-3:#6b6f76;
  --uk-gold:#d4b477;--uk-gold-hi:#f1d896;--uk-gold-lo:#8a6a32;
  --uk-text:#ede7d8;--uk-muted:#a8b3b9;--uk-title-a:#f6e2a8;--uk-title-b:#c9a25a;--uk-btn-ink:#3a2410;
  --uk-fire:#e2552f;--uk-water:#3d8fe0;--uk-wood:#3fae5a;--uk-light:#e8c45a;--uk-dark:#9b5bd6;
  --uk-r6:#f0b43c;--uk-r5:#a86ad8;--uk-r4:#9fb8d6;--uk-r3:#b07a4a;
  --uk-up:#6fd36f;--uk-down:#e0584a;
  --uk-header:68px;
  /* 1u = (window height - top bar) / 100: ~10px at 1080p, ~7px at 768. */
  --pg-u:calc((100vh - var(--uk-header)) / 100);
  --uk-serif:"RuneSerif","Noto Serif SC","Noto Serif CJK SC","Source Han Serif SC","Songti SC",serif;
  --uk-sans:"Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC","Microsoft YaHei",sans-serif;
  --uk-body:clamp(13px,calc(var(--pg-u)*1.6),22px);
  --uk-pad:calc(var(--pg-u)*2.4);--uk-gap:calc(var(--pg-u)*1.6);
  --uk-kit:url("./assets/pages/_kit/");
}
@media (min-width:1900px){body.desktop-game{--uk-header:76px}}
/* Text floor: 12px on 1366/1440 windows, 14px from 1080p up (card badges keep their own card-relative size). */
@media (min-width:1900px) and (min-height:1000px){body.desktop-game{--uk-min:14px}}
body.desktop-game .fire{--uk-el:var(--uk-fire)}body.desktop-game .water{--uk-el:var(--uk-water)}body.desktop-game .wood{--uk-el:var(--uk-wood)}body.desktop-game .light{--uk-el:var(--uk-light)}body.desktop-game .dark{--uk-el:var(--uk-dark)}

/* Text roles */
body.desktop-game .uk-serif{font-family:var(--uk-serif);font-weight:700}
body.desktop-game .uk-num{font-family:var(--uk-serif);font-variant-numeric:tabular-nums lining-nums}
body.desktop-game .uk-gold-text{background:linear-gradient(180deg,var(--uk-title-a),var(--uk-title-b));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 1px #000a)}
body.desktop-game .uk-body{font:400 var(--uk-body)/1.55 var(--uk-sans);color:var(--uk-text)}

/* Title plaque: the pillar's stone-and-gold plaque, text written by code. Always page top-left. */
body.desktop-game .uk-plaque{position:relative;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;margin:0;min-width:calc(var(--pg-u)*22);height:calc(var(--pg-u)*7.6);padding:0 calc(var(--pg-u)*7.4);border-style:solid;border-width:calc(var(--pg-u)*7.6*120/635) calc(var(--pg-u)*7.6*620/635);border-image:url("./assets/desktop/nav/plaque.webp") 120 620 fill / calc(var(--pg-u)*7.6*120/635) calc(var(--pg-u)*7.6*620/635) stretch;border-color:transparent;filter:drop-shadow(0 6px 10px #000b);white-space:nowrap}
body.desktop-game .uk-plaque-text{font:700 calc(var(--pg-u)*4.2)/1 var(--uk-serif);letter-spacing:.14em;text-indent:.14em;background:linear-gradient(180deg,var(--uk-title-a),var(--uk-title-b));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 #1b0f04) drop-shadow(0 2px 2px #000c)}
body.desktop-game .uk-plaque-sub{font:400 max(var(--uk-min,12px),calc(var(--pg-u)*1.4))/1.2 var(--uk-sans);color:#d9c9a0;margin-top:calc(var(--pg-u)*.3);letter-spacing:.08em}
body.desktop-game .uk-nameplate{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:max(22px,calc(var(--pg-u)*3.2));padding:0 calc(var(--pg-u)*2.6);border-style:solid;border-color:transparent;border-width:calc(max(22px,var(--pg-u)*3.2)*120/635) calc(max(22px,var(--pg-u)*3.2)*620/635);border-image:url("./assets/desktop/nav/plaque.webp") 120 620 fill / calc(max(22px,var(--pg-u)*3.2)*120/635) calc(max(22px,var(--pg-u)*3.2)*620/635) stretch;font:700 max(var(--uk-min,12px),calc(var(--pg-u)*1.8))/1 var(--uk-serif);color:#f3dfae;letter-spacing:.08em;white-space:nowrap;text-shadow:0 1px 2px #000}

/* Stone panel (9-slice). The 2752px source covers panels up to ~1170 CSS px wide at DPR2 without enlargement. */
body.desktop-game .uk-panel{--uk-pb:clamp(26px,calc(var(--pg-u)*4.2),46px);position:relative;box-sizing:border-box;border-style:solid;border-color:transparent;border-width:var(--uk-pb);border-image:url("./assets/pages/_kit/panel.webp") 200 fill / var(--uk-pb) stretch;padding:calc(var(--uk-pad)*.35);color:var(--uk-text);font:400 var(--uk-body)/1.55 var(--uk-sans);filter:drop-shadow(0 10px 18px #0009)}
body.desktop-game .uk-panel-title{margin:0 0 calc(var(--pg-u)*1);font:700 calc(var(--pg-u)*2.4)/1.2 var(--uk-serif);letter-spacing:.08em;background:linear-gradient(180deg,var(--uk-title-a),var(--uk-title-b));-webkit-background-clip:text;background-clip:text;color:transparent}

/* Page frame: thin carved gold frame drawn once by the page host. Corners ≤48px at 1080p. */
body.desktop-game :where(.uk-frame){position:relative}
body.desktop-game .uk-frame::after{content:"";position:absolute;inset:calc(var(--pg-u)*.6);pointer-events:none;z-index:50;border-style:solid;border-color:transparent;border-width:clamp(24px,calc(var(--pg-u)*4.4),56px);border-image:url("./assets/pages/_kit/frame.webp") 240 / clamp(24px,calc(var(--pg-u)*4.4),56px) round;filter:drop-shadow(0 0 6px #000)}

/* Buttons: thick slab, pointed ends, gem stud each end. Only the gem/face colour differs. */
body.desktop-game .uk-btn{--uk-bh:clamp(40px,calc(var(--pg-u)*5.4),66px);--uk-bimg:url("./assets/pages/_kit/btn-secondary.webp");position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:calc(var(--uk-bh)*3.4);height:var(--uk-bh);margin:0;padding:0 calc(var(--uk-bh)*.5);border-style:solid;border-color:transparent;border-width:calc(var(--uk-bh)*120/423) calc(var(--uk-bh)*200/423);border-image-source:var(--uk-bimg);border-image-slice:120 200 fill;border-image-width:calc(var(--uk-bh)*120/423) calc(var(--uk-bh)*200/423);border-image-repeat:stretch;background:none;color:var(--uk-gold-hi)!important;font:700 clamp(14px,calc(var(--uk-bh)*.36),24px)/1 var(--uk-serif)!important;letter-spacing:.12em;text-indent:.12em;white-space:nowrap;cursor:pointer;text-shadow:0 1px 2px #000c;transition:transform .16s ease,filter .16s ease;filter:drop-shadow(0 4px 6px #000a);overflow:visible}
body.desktop-game .uk-btn-label{position:relative;z-index:1}
body.desktop-game .uk-btn--sm{--uk-bh:clamp(32px,calc(var(--pg-u)*4.2),50px)}
body.desktop-game .uk-btn--lg{--uk-bh:clamp(48px,calc(var(--pg-u)*6.8),82px)}
body.desktop-game .uk-btn--primary{--uk-bimg:url("./assets/pages/_kit/btn-primary.webp");color:var(--uk-btn-ink)!important;text-shadow:0 1px 0 #f6e2a880}
body.desktop-game .uk-btn--blue{--uk-bimg:url("./assets/pages/_kit/btn-blue.webp")}
body.desktop-game .uk-btn--amber{--uk-bimg:url("./assets/pages/_kit/btn-amber.webp")}
body.desktop-game .uk-btn--red{--uk-bimg:url("./assets/pages/_kit/btn-red.webp")}
body.desktop-game .uk-btn--violet{--uk-bimg:url("./assets/pages/_kit/btn-violet.webp")}
body.desktop-game .uk-btn--moon{--uk-bimg:url("./assets/pages/_kit/btn-moon.webp")}
body.desktop-game .uk-btn::after{content:"";position:absolute;inset:8% 6%;border-radius:3px;pointer-events:none;background:linear-gradient(105deg,transparent 35%,#fff6d955 50%,transparent 65%) -150% 0/250% 100% no-repeat;opacity:0}
body.desktop-game .uk-btn:not(:disabled):not(.uk-btn--disabled):hover{transform:translateY(-2px);filter:brightness(1.12) drop-shadow(0 6px 8px #000a)}
body.desktop-game .uk-btn:not(:disabled):not(.uk-btn--disabled):hover::after{opacity:1;animation:uk-sweep .7s ease-out 1}
body.desktop-game .uk-btn:not(:disabled):not(.uk-btn--disabled):active{transform:translateY(1px);filter:brightness(.96) drop-shadow(0 2px 3px #000a)}
body.desktop-game .uk-btn:disabled,body.desktop-game .uk-btn.uk-btn--disabled{--uk-bimg:url("./assets/pages/_kit/btn-disabled.webp");color:#34312c!important;text-shadow:0 1px 0 #e6e1d655;cursor:default;filter:brightness(.8) saturate(.45) drop-shadow(0 3px 4px #0009)}
body.desktop-game :is(.uk-btn,.uk-round,.uk-tab,.uk-gem,.uk-card):disabled{opacity:1}
body.desktop-game .uk-btn:focus-visible{outline:2px solid var(--uk-gold-hi);outline-offset:4px}
body.desktop-game .uk-btn-wrap{display:inline-flex;flex-direction:column;align-items:center;gap:calc(var(--pg-u)*.4)}
body.desktop-game .uk-btn-reason{font:400 max(var(--uk-min,12px),calc(var(--pg-u)*1.3))/1.2 var(--uk-sans);color:var(--uk-down);text-shadow:0 1px 2px #000;white-space:nowrap}

/* Round medallion buttons (i / page arrows / close / back) — same family as the pillar medallions. */
body.desktop-game .uk-round{--uk-rs:clamp(34px,calc(var(--pg-u)*4.8),58px);position:relative;display:inline-grid;place-items:center;flex:none;width:var(--uk-rs);height:var(--uk-rs);margin:0;padding:0;border:0;border-radius:50%;background:url("./assets/pages/_kit/icon-medal.webp") center/contain no-repeat;color:var(--uk-gold-hi)!important;font:700 calc(var(--uk-rs)*.44)/1 var(--uk-serif)!important;cursor:pointer;filter:drop-shadow(0 3px 5px #000b);transition:transform .16s,filter .16s}
body.desktop-game .uk-round--sm{--uk-rs:clamp(28px,calc(var(--pg-u)*3.8),46px)}
body.desktop-game .uk-round--lg{--uk-rs:clamp(44px,calc(var(--pg-u)*6.4),76px)}
body.desktop-game .uk-round--info>span{font-style:italic;font-family:Georgia,var(--uk-serif)}
body.desktop-game .uk-round:not(:disabled):hover{transform:scale(1.06);filter:brightness(1.12) drop-shadow(0 0 8px #ffd27a99)}
body.desktop-game .uk-round:disabled{filter:grayscale(.8) brightness(.55);cursor:default}
body.desktop-game .uk-round.is-active,body.desktop-game .uk-round[aria-pressed="true"]{filter:drop-shadow(0 0 12px #ffd27acc) drop-shadow(0 4px 6px #000c)}

/* Element gems (the board's own orb art) in a gold bezel. Selected: gold halo + 1.08. */
body.desktop-game .uk-gem{--uk-gs:clamp(26px,calc(var(--pg-u)*3.8),48px);position:relative;display:inline-grid;place-items:center;flex:none;box-sizing:border-box;width:var(--uk-gs);height:var(--uk-gs);margin:0;padding:calc(var(--uk-gs)*.08);border:0;border-radius:50%;background:radial-gradient(circle,#0b1622 54%,transparent 56%),conic-gradient(from 210deg,#8a6a32,#f1d896,#b48a43,#f6e2a8,#8a6a32);box-shadow:0 2px 5px #000b,inset 0 0 0 1px #f6e2a855;cursor:default;transition:transform .16s,box-shadow .16s}
body.desktop-game button.uk-gem{cursor:pointer}
body.desktop-game .uk-gem img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}
body.desktop-game .uk-gem--sm{--uk-gs:clamp(20px,calc(var(--pg-u)*2.6),34px)}
body.desktop-game .uk-gem--lg{--uk-gs:clamp(36px,calc(var(--pg-u)*5.4),70px)}
body.desktop-game .uk-gem-all{font:700 max(12px,calc(var(--uk-gs)*.3))/1 var(--uk-serif);white-space:nowrap;color:var(--uk-gold-hi);letter-spacing:.02em}
body.desktop-game .uk-gem.is-selected{transform:scale(1.08);box-shadow:0 0 0 2px var(--uk-gold-hi),0 0 14px 3px #f1d89688,0 2px 5px #000b}
body.desktop-game button.uk-gem:not(.is-selected):hover{transform:scale(1.04);filter:brightness(1.12)}

/* Stat icons — fixed meanings across all pages. */
body.desktop-game .uk-icon{--uk-is:clamp(16px,calc(var(--pg-u)*2.4),32px);display:inline-block;flex:none;width:var(--uk-is);height:var(--uk-is);background:center/contain no-repeat;vertical-align:middle;font-style:normal}
body.desktop-game .uk-icon--sm{--uk-is:clamp(13px,calc(var(--pg-u)*1.7),22px)}
body.desktop-game .uk-icon--lg{--uk-is:clamp(22px,calc(var(--pg-u)*3.4),44px)}
body.desktop-game .uk-icon--hp{background-image:url("./assets/pages/_kit/icon-heart.webp")}
body.desktop-game .uk-icon--attack{background-image:url("./assets/pages/_kit/icon-sword.webp")}
body.desktop-game .uk-icon--recovery{background-image:url("./assets/pages/_kit/icon-leaf.webp")}
body.desktop-game .uk-icon--time{background-image:url("./assets/pages/_kit/icon-hourglass.webp")}
body.desktop-game .uk-icon--xp{background-image:url("./assets/pages/_kit/icon-xp.webp")}
body.desktop-game .uk-icon--gem{background-image:url("./assets/pages/_kit/icon-gem.webp")}
body.desktop-game .uk-icon--shard{background-image:url("./assets/pages/_kit/icon-shard.webp")}
body.desktop-game .uk-icon--leader{background-image:url("./assets/pages/_kit/icon-crown.webp")}
body.desktop-game .uk-icon--active{background-image:url("./assets/pages/_kit/icon-hourglass.webp");border-radius:50%;box-shadow:0 0 0 2px #8a6a32,inset 0 0 0 100px #0b162288;background-size:72%}
body.desktop-game .uk-icon--up{background-image:url("./assets/pages/_kit/icon-up.webp")}
body.desktop-game .uk-icon--defense{background-image:url("./assets/pages/_kit/icon-shield.webp")}
body.desktop-game .uk-stat{display:inline-flex;align-items:center;gap:calc(var(--pg-u)*.6);white-space:nowrap;color:var(--uk-text)}
body.desktop-game .uk-stat b{font:700 calc(var(--pg-u)*2.6)/1 var(--uk-serif);color:#f3ead2;font-variant-numeric:tabular-nums}
body.desktop-game .uk-stat small{font:400 max(var(--uk-min,12px),calc(var(--pg-u)*1.3))/1 var(--uk-sans);color:var(--uk-muted)}
body.desktop-game .uk-delta{font:700 max(var(--uk-min,12px),calc(var(--pg-u)*1.5))/1 var(--uk-serif);font-style:normal}
body.desktop-game .uk-delta.up{color:var(--uk-up)}body.desktop-game .uk-delta.down{color:var(--uk-down)}

/* Parts for text inside a stone panel (never a flat dark box): .uk-tablet = a small raised stone tablet (same 9-slice stone,
   gold filigree and corner gems as .uk-panel); .uk-groove = a row carved into the stone (bevel: dark top lip, gold-lit lower lip). */
body.desktop-game .uk-tablet{--uk-tb:clamp(10px,calc(var(--pg-u)*1.3),18px);box-sizing:border-box;border:var(--uk-tb) solid transparent;border-image:url("./assets/pages/_kit/panel.webp") 200 fill / var(--uk-tb) stretch;border-radius:0;background:none;box-shadow:none;filter:drop-shadow(0 3px 4px #0009)}
body.desktop-game .uk-groove{border-radius:calc(var(--pg-u)*.5);background:linear-gradient(180deg,#1a1e24b0,#2f343c80 70%,#3a3f4766);box-shadow:inset 0 2px 3px #000c,inset 0 -1px 0 #f1d89647,0 1px 0 #ffffff14}

/* Mechanic medallions (ui-kit mechMedal): one set for the preparation gate and the enemy bestiary. Size comes from the page. */
body.desktop-game .uk-mech{position:relative;display:block;flex:none;border-radius:50%}
body.desktop-game .uk-mech>img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain}
body.desktop-game .uk-mech.is-ring{background:url("./assets/pages/_kit/icon-medal.webp") center/contain no-repeat}
body.desktop-game .uk-mech.is-ring>img:first-child{inset:24%;width:52%;height:52%}
body.desktop-game .uk-mech.is-ring>img:last-child{inset:16%;width:68%;height:68%}

/* Stone tabs */
body.desktop-game .uk-tabs{display:inline-flex;gap:calc(var(--pg-u)*.8)}
body.desktop-game .uk-tab{--uk-bh:clamp(30px,calc(var(--pg-u)*4),48px);height:var(--uk-bh);min-width:calc(var(--uk-bh)*2.8);padding:0 calc(var(--uk-bh)*.4);border-style:solid;border-color:transparent;border-width:calc(var(--uk-bh)*120/423) calc(var(--uk-bh)*200/423);border-image:url("./assets/pages/_kit/btn-secondary.webp") 120 200 fill / calc(var(--uk-bh)*120/423) calc(var(--uk-bh)*200/423) stretch;background:none;color:#cdbf9c!important;font:700 clamp(13px,calc(var(--uk-bh)*.36),20px)/1 var(--uk-serif)!important;letter-spacing:.1em;cursor:pointer;filter:brightness(.82) drop-shadow(0 2px 4px #000a);transition:filter .16s,transform .16s}
body.desktop-game .uk-tab.is-active{border-image-source:url("./assets/pages/_kit/btn-moon.webp");color:#fff1c9!important;filter:brightness(1.1) drop-shadow(0 0 8px #ffd27a88)}
body.desktop-game .uk-tab:not(.is-active):hover{filter:brightness(1) drop-shadow(0 2px 4px #000a)}

/* Stars, ribbon, pager, page header */
body.desktop-game .uk-stars{color:#f6d27a;letter-spacing:-.06em;text-shadow:0 0 4px #000,0 1px 1px #000;font-family:var(--uk-serif);white-space:nowrap}
/* Ribbon = three-slice: the two folded tails (170 of the 570×190 art) keep their shape, only the flat front stretches.
   The text sits on the front face between its two gold rims (rim inner edges at y 22 / 109 of 190 → centre ≈ 64/190),
   so the height is tied to the font (2.5em) and the bottom padding lifts the line onto that face. 190px art → the
   ribbon height never exceeds its source pixels (2.5em ≤ 95 CSS px at DPR 2 for every text size used). */
body.desktop-game .uk-ribbon{--rb-h:2.5em;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:var(--rb-h);max-width:none;padding:0 .3em calc(var(--rb-h)*62/190);border-style:solid;border-color:transparent;border-width:0 calc(var(--rb-h)*170/190);border-image:url("./assets/pages/_kit/icon-ribbon.webp") 0 170 fill / 0 calc(var(--rb-h)*170/190) stretch;background:none;color:#f4f0e2;font:700 max(var(--uk-min,12px),calc(var(--pg-u)*1.4))/1 var(--uk-serif);text-shadow:0 1px 1px #001028,0 0 4px #001a3acc;white-space:nowrap}
/* uifix4: the three slices meet on fractional pixels, which left two faint vertical hairlines either side of the text. A 2 px
   strip of the ribbon's own cross-section (sampled at the slice columns) sits under each join, so a gap shows ribbon, not page. */
body.desktop-game .uk-ribbon:not(.uk-ribbon--gold){--rb-seam:linear-gradient(180deg,transparent 2.6%,#4a7cd0 3.2%,#4a7cd0 7%,#e2b874 8%,#e2b874 11.6%,#62606a 12.6%,#3d66bd 14%,#3d66bd 55.5%,#59627f 56.8%,#dca464 58.4%,#dca464 61.6%,#384977 63.2%,#416bbe 64.7%,#416bbe 66.8%,#24418a 67.9%,transparent 69.5%);background:var(--rb-seam) calc(var(--rb-h)*170/190 - 1px) 0/2px 100% no-repeat border-box,var(--rb-seam) calc(100% - var(--rb-h)*170/190 + 1px) 0/2px 100% no-repeat border-box}
body.desktop-game .uk-ribbon--gold{height:auto;padding:.15em 1.2em .3em;border:0;border-image:none;background:url("./assets/pages/_kit/icon-ribbon-gold.webp") center/100% 100% no-repeat;color:#3a2410;text-shadow:0 1px 0 #f6e2a880}
body.desktop-game .uk-pager{display:inline-flex;align-items:center;gap:calc(var(--pg-u)*1)}
body.desktop-game .uk-pager-count{font:700 max(var(--uk-min,12px),calc(var(--pg-u)*1.6))/1 var(--uk-serif);color:#d9c9a0;font-variant-numeric:tabular-nums}
body.desktop-game .uk-page-head{display:flex;align-items:center;gap:var(--uk-gap)}
body.desktop-game .uk-page-head-tools{display:flex;align-items:center;gap:calc(var(--pg-u)*1.2);flex:none}
body.desktop-game .uk-page-head-mid{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:var(--uk-gap)}

/* Hero card: frame = rarity, element = top-left gem + bottom glow. */
body.desktop-game .uk-card{--uk-cw:clamp(96px,calc(var(--pg-u)*14),180px);position:relative;display:block;flex:none;box-sizing:border-box;width:var(--uk-cw);aspect-ratio:630/825;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:default;transition:transform .2s ease,filter .2s ease;isolation:isolate}
body.desktop-game button.uk-card{cursor:pointer}
/* Narrow cards (< ~141px) cannot fit a 12px star row + Lv: they show 「6★」 instead (container = the card itself). */
body.desktop-game .uk-card:not(.uk-card--xs){container:uk-card / inline-size}
@container uk-card (max-width:140px){body.desktop-game .uk-card-foot .uk-stars{display:none}body.desktop-game .uk-card-foot .uk-stars-n{display:inline}}
body.desktop-game .uk-card--xs{--uk-cw:clamp(56px,calc(var(--pg-u)*7.8),104px)}
body.desktop-game .uk-card--sm{--uk-cw:clamp(72px,calc(var(--pg-u)*10.4),136px)}
body.desktop-game .uk-card--lg{--uk-cw:clamp(120px,calc(var(--pg-u)*19),240px)}
body.desktop-game .uk-card-glow{position:absolute;inset:6% 6% 9%;z-index:0;background:linear-gradient(0deg,color-mix(in srgb,var(--uk-el,#d4b477) 55%,transparent),transparent 55%),radial-gradient(ellipse at 50% 30%,#1b2a3a,#070d16 75%)}
body.desktop-game .uk-card .uk-card-art.collection-portrait{position:absolute;inset:6.2% 6.3% 10.5%;z-index:1;height:auto;border-radius:0;overflow:hidden;background-color:transparent}
body.desktop-game .uk-card-frame{position:absolute;inset:0;z-index:2;background:url("./assets/pages/_kit/card-3.webp") center/100% 100% no-repeat;pointer-events:none;filter:drop-shadow(0 4px 6px #000b)}
body.desktop-game .uk-r4 .uk-card-frame{background-image:url("./assets/pages/_kit/card-4.webp")}
body.desktop-game .uk-r5 .uk-card-frame{background-image:url("./assets/pages/_kit/card-5.webp")}
body.desktop-game .uk-r6 .uk-card-frame{background-image:url("./assets/pages/_kit/card-6.webp");inset:-4.6% -3.6% -5.2% -3.6%;filter:drop-shadow(0 0 8px #f0b43c66) drop-shadow(0 4px 6px #000b)}
body.desktop-game .uk-card .uk-card-gem{--uk-gs:calc(var(--uk-cw)*.17);position:absolute;left:1.3%;top:.9%;z-index:3;padding:calc(var(--uk-gs)*.04);background:radial-gradient(circle,#0b1622 60%,transparent 62%);box-shadow:none}
body.desktop-game .uk-card-foot{position:absolute;left:8%;right:8%;bottom:1.6%;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:2px;height:9%;font-size:max(12px,calc(var(--uk-cw)*.1));line-height:1}
body.desktop-game .uk-card-foot .uk-stars{font-size:max(12px,calc(var(--uk-cw)*.085))}
body.desktop-game .uk-stars-n{display:none;font:700 max(12px,calc(var(--uk-cw)*.1))/1 var(--uk-serif);color:#f6d27a;text-shadow:0 1px 2px #000,0 0 4px #000}
body.desktop-game .uk-card--sm .uk-card-foot .uk-stars{display:none}body.desktop-game .uk-card--sm .uk-stars-n{display:inline}
body.desktop-game .uk-card-lv{font:700 max(12px,calc(var(--uk-cw)*.1))/1 var(--uk-serif);color:#fff1c9;text-shadow:0 1px 2px #000,0 0 4px #000}
body.desktop-game .uk-card-crown{position:absolute;left:50%;top:-14%;z-index:5;width:46%;aspect-ratio:1.3;transform:translateX(-50%);background:url("./assets/pages/_kit/icon-crown.webp") center/contain no-repeat;filter:drop-shadow(0 0 8px #ffd27a)}
body.desktop-game .uk-card.is-leader .uk-card-glow{box-shadow:0 0 calc(var(--uk-cw)*.18) calc(var(--uk-cw)*.04) #f1d89666}
body.desktop-game .uk-card-ribbon{position:absolute;left:50%;top:-5%;z-index:5;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;width:84%;height:14%;background:url("./assets/pages/_kit/icon-ribbon.webp") center/100% 100% no-repeat;color:#f4f0e2;font:700 max(12px,calc(var(--uk-cw)*.1))/1 var(--uk-serif);letter-spacing:.2em;text-indent:.2em;text-shadow:0 1px 2px #001a3a;padding-bottom:2%}
body.desktop-game .uk-card-sigil{position:absolute;left:50%;bottom:-9%;z-index:0;width:60%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,#3d8fe088,#3d8fe022 55%,transparent 70%);pointer-events:none}
body.desktop-game .uk-card-wax{position:absolute;right:6%;bottom:12%;z-index:4;width:30%;aspect-ratio:1;background:url("./assets/pages/_kit/icon-wax.webp") center/contain no-repeat;filter:drop-shadow(0 2px 3px #000a)}
body.desktop-game .uk-card.is-unowned .uk-card-art{filter:grayscale(1) brightness(.45) contrast(1.1)}
body.desktop-game .uk-card.is-unowned .uk-card-glow{filter:grayscale(.8) brightness(.6)}
body.desktop-game .uk-card-up{position:absolute;right:3%;top:2%;z-index:5;width:20%;aspect-ratio:.8;background:url("./assets/pages/_kit/icon-up.webp") center/contain no-repeat;filter:drop-shadow(0 0 5px #6fd36f) drop-shadow(0 2px 2px #000)}
/* 升华 (heroCard asc / limit): code-drawn metal rim inside the frame + roman badge; 突破 「+N」 after the level. bronze/silver/gold/radiant. */
body.desktop-game .uk-card{--uk-asc-a:#c98a52;--uk-asc-b:#7a4a24}
body.desktop-game .uk-card.is-asc-silver{--uk-asc-a:#eef3f8;--uk-asc-b:#8c98a6}
body.desktop-game .uk-card.is-asc-gold{--uk-asc-a:#ffe08a;--uk-asc-b:#b7862e}
body.desktop-game .uk-card.is-asc-radiant{--uk-asc-a:#fffbe6;--uk-asc-b:#f0b43c}
body.desktop-game .uk-card-ascrim{position:absolute;inset:5.4% 5.6% 9.8%;z-index:3;pointer-events:none;border-radius:3px;box-shadow:inset 0 0 0 max(1.5px,calc(var(--uk-cw)*.016)) var(--uk-asc-a),inset 0 0 calc(var(--uk-cw)*.08) color-mix(in srgb,var(--uk-asc-b) 70%,transparent)}
body.desktop-game .uk-card.is-asc-radiant .uk-card-ascrim{box-shadow:inset 0 0 0 max(1.5px,calc(var(--uk-cw)*.018)) var(--uk-asc-a),inset 0 0 calc(var(--uk-cw)*.12) #f0b43ccc,0 0 calc(var(--uk-cw)*.08) #ffe08a99}
body.desktop-game .uk-card-asc{position:absolute;left:3%;bottom:11.5%;z-index:5;display:grid;place-items:center;min-width:max(22px,calc(var(--uk-cw)*.22));height:max(15px,calc(var(--uk-cw)*.15));padding:0 calc(var(--uk-cw)*.04);box-sizing:border-box;clip-path:polygon(18% 0,82% 0,100% 50%,82% 100%,18% 100%,0 50%);background:linear-gradient(180deg,var(--uk-asc-a),var(--uk-asc-b));font:700 max(12px,calc(var(--uk-cw)*.1))/1 var(--uk-serif);color:#2a1806;letter-spacing:0;filter:drop-shadow(0 1px 2px #000)}
body.desktop-game .uk-card-plus{margin-left:1px;font:inherit;font-style:normal;color:#ffe08a;letter-spacing:-.02em}
body.desktop-game .uk-card:not(.uk-card--lg):has(.uk-card-plus) .uk-card-foot :is(.uk-stars,.uk-stars-n){display:none}
body.desktop-game .uk-card:not(.uk-card--lg):has(.uk-card-plus) .uk-card-foot{justify-content:flex-end}
body.desktop-game .uk-card.is-selected{transform:translateY(-4px)}
body.desktop-game .uk-card.is-selected::after{content:"";position:absolute;inset:-3%;z-index:6;border-radius:6px;pointer-events:none;box-shadow:0 0 0 2px #f1d896,0 0 16px 4px #f1d89688;animation:uk-breathe 2.4s ease-in-out infinite}
body.desktop-game button.uk-card:not(.is-selected):hover{transform:translateY(-2px);filter:brightness(1.12)}
body.desktop-game button.uk-card:focus-visible{outline:2px solid var(--uk-gold-hi);outline-offset:3px}
body.desktop-game .uk-cardbox{display:inline-flex;flex-direction:column;align-items:center;gap:calc(var(--pg-u)*.6);margin:0}
body.desktop-game .uk-cardbox .uk-card-name{max-width:calc(var(--uk-cw,140px)*1.2)}

/* Entrance motion (style guide §9): content rises 12px, 320ms, 40ms stagger via style="--uk-i:n". */
body.desktop-game .uk-reveal{animation:uk-rise .32s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--uk-i,0) * 40ms)}
body.desktop-game .uk-fade-in{animation:uk-fade .24s ease-out both}
body.desktop-game .uk-spin-slow{animation:uk-spin 36s linear infinite}
@keyframes uk-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes uk-fade{from{opacity:0}to{opacity:1}}
@keyframes uk-spin{to{transform:rotate(360deg)}}
@keyframes uk-sweep{from{background-position:-150% 0}to{background-position:250% 0}}
@keyframes uk-breathe{0%,100%{opacity:.55}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){body.desktop-game :is(.uk-reveal,.uk-fade-in,.uk-spin-slow,.uk-card.is-selected::after,.uk-btn::after){animation:none!important}body.desktop-game :is(.uk-btn,.uk-card,.uk-round,.uk-gem){transition:none!important}}

/* Dialog skins (ui-registry skinDialog): the original children stay in the DOM for tests/scripts but are hidden. */
body.desktop-game dialog[data-ui-skinned]>:not([data-ui-skin]){display:none!important}