:root{font-family:Tahoma,"Leelawadee UI",sans-serif;color:#183442;background:#f4f7f8;font-size:16px;line-height:1.65}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:1px solid #d8e2e5;background:white;color:#183442;border-radius:12px;padding:9px 16px;font-weight:600}button:hover{filter:brightness(.96)}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #07857b;outline-offset:3px}button:disabled{opacity:.45;cursor:not-allowed}main{max-width:1440px;margin:auto;padding:26px 42px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #dce5e8;padding-bottom:23px}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;font-weight:800;letter-spacing:1px}.brand small{display:block;font-weight:400;letter-spacing:0;font-size:13px}.logo{background:#bef264;border-radius:14px;font-size:28px;padding:0 13px}.heading{display:flex;justify-content:space-between;align-items:center;margin:26px 0 22px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.5px;color:#57727e;margin:0 0 4px}h1{font-size:28px;line-height:1.5;margin:0}.level-pills{display:flex;gap:8px}.pill{border-radius:30px;padding:6px 15px;background:#e7edef;color:#71838a;font-size:14px}.pill.active{background:#193b47;color:white}.layout{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:24px}.play-column{min-width:0}.game-top{display:flex;justify-content:space-between;align-items:center;padding:12px 19px;background:#193b47;color:white;border-radius:20px 20px 0 0;font-size:14px}.game-top>div{display:flex;gap:17px;align-items:center}#lives{color:#bef264;letter-spacing:3px}#pause{padding:3px 10px;border:1px solid #52707b;color:white;background:transparent;font-size:13px}.stage{position:relative;background:#d9eff2;overflow:hidden}canvas{display:block;width:100%;aspect-ratio:960/500;touch-action:none}.scene-label{position:absolute;top:22px;left:25px;pointer-events:none}.scene-label span{display:block;font-size:11px;letter-spacing:3px;color:#477781}.scene-label strong{font-size:16px}.controls{display:flex;justify-content:space-between;gap:10px;align-items:center;background:white;padding:14px;border-radius:0 0 20px 20px}.controls p{font-size:12px;color:#647c86;margin:0;text-align:center}kbd{font:inherit;background:#edf2f3;padding:3px 5px;border-radius:5px}.touch{display:flex;gap:7px}.touch button{touch-action:none;user-select:none;min-width:44px;padding:10px}.touch .jump{background:#bef264;border-color:#bef264}.lesson{display:flex;gap:15px;padding:22px 4px}.lesson b{font-size:15px}.lesson p{margin:5px 0;font-size:14px;color:#607681}.lesson-icon{color:#07857b;font-size:25px}.wallet,.coverage,.ledger{background:white;border:1px solid #dfe8eb;border-radius:18px;padding:21px}.cash{display:flex;gap:10px;align-items:baseline;margin:4px 0 18px}.cash>span{font-size:38px;font-weight:800;letter-spacing:-1px}.cash small{color:#6f858f}.money-row{display:flex;justify-content:space-between;font-size:14px;margin:10px 0}.money-row b{font-weight:600}hr{border:0;border-top:1px solid #e3ebed;margin:17px 0}.goal-head{display:flex;justify-content:space-between;font-size:12px;margin-top:21px}progress{width:100%;height:9px;border:0;border-radius:8px;overflow:hidden;accent-color:#098c80}progress::-webkit-progress-bar{background:#e9eff0}progress::-webkit-progress-value{background:#098c80}#goalText{font-size:12px;color:#647c86;margin:5px 0 18px}.primary{background:#bef264;border-color:#bef264}.full{width:100%}.coverage{margin-top:13px;background:#e5f3ef;border-color:#d4e9e3;font-size:14px}.coverage p{margin:7px 0 0;color:#446b62;font-size:13px}.ledger{margin-top:13px;font-size:14px}.ledger ol{padding-left:18px;margin:8px 0 0;font-size:12px;color:#607681}.ledger li{padding-bottom:4px}footer{font-size:12px;color:#71858e;margin:20px 0;text-align:center}dialog{border:0;border-radius:24px;max-width:720px;width:calc(100% - 28px);padding:30px;max-height:90dvh;box-shadow:0 25px 100px #122f4655;color:#183442}dialog::backdrop{background:#142d3dc4;backdrop-filter:blur(5px)}dialog h2{font-size:25px;line-height:1.4;margin:6px 0 13px}dialog p{font-size:15px}dialog .tag{font-size:12px;letter-spacing:2px;color:#07857b;font-weight:700}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}.plans{display:grid;gap:10px}.plan-card{border:1px solid #dbe5e8;border-radius:13px;padding:14px;display:grid;grid-template-columns:1fr auto;gap:6px 15px}.plan-card p{font-size:13px;margin:4px 0}.plan-card button{align-self:center;font-size:14px}.transfer{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.transfer button{font-size:13px;padding:8px 10px}.summary{display:grid;grid-template-columns:1fr 1fr;gap:12px}.summary>div{background:#f1f6f6;padding:13px;border-radius:12px}.summary b{display:block;font-size:22px}.stars{font-size:36px;color:#de9d23;letter-spacing:8px}#toast{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);background:#183442ec;color:white;border-radius:30px;padding:8px 20px;font-size:14px;opacity:0;transition:opacity .15s;pointer-events:none;width:max-content;max-width:90%;text-align:center}#toast.show{opacity:1}@media(max-width:1050px){main{padding:20px}.layout{grid-template-columns:minmax(0,1fr) 250px;gap:16px}.controls p{display:none}.wallet{padding:16px}.heading h1{font-size:24px}}@media(max-width:760px){main{padding:15px}header{padding-bottom:15px}.heading{display:block;margin:19px 0 15px}.heading h1{font-size:22px}.level-pills{margin-top:12px}.layout{display:block}.game-top{padding:10px 13px}.scene-label{top:10px;left:14px}.scene-label strong{font-size:12px}.scene-label span{font-size:9px}aside{display:grid;grid-template-columns:1fr 1fr;gap:12px}.wallet{grid-column:1/-1}.coverage,.ledger{margin:0;padding:15px}.cash{margin-bottom:8px}.lesson{padding:17px 0}.controls{padding:10px}.controls button{font-size:14px}dialog{padding:22px}.plan-card{grid-template-columns:1fr}.summary{gap:8px}.brand{font-size:13px}.game-top{font-size:12px}footer{font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Full-window play keeps the world proportions while adapting the camera. */
.game-top button{padding:5px 9px;background:transparent;color:white;border:1px solid #52707b;font-size:13px;white-space:nowrap}
body.immersive{overflow:hidden;background:#193b47}
.immersive main{max-width:none;margin:0;padding:0}
.immersive header,.immersive .heading,.immersive aside,.immersive footer,.immersive .lesson{display:none}
.immersive .layout{display:block}
.immersive .play-column{height:100vh;height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.immersive .game-top{border-radius:0;padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));flex-wrap:wrap;gap:5px 12px}
.immersive .game-top>div{gap:8px;flex-wrap:wrap}
.immersive .stage{min-height:0}
.immersive canvas{width:100%;height:100%;aspect-ratio:auto}
.immersive .controls{border-radius:0;padding:10px max(14px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}
.immersive .touch button{min-height:48px;min-width:54px}
@media(max-width:760px){.game-top{flex-wrap:wrap;gap:6px}.game-top>div{gap:6px;flex-wrap:wrap}.immersive .game-top>div{gap:5px}.immersive .game-top button{font-size:12px;padding:6px 8px}.immersive .scene-label{top:12px}.immersive #lives{font-size:12px}.immersive .controls{gap:6px}}
@media(max-height:480px){.immersive .scene-label{display:none}.immersive .game-top{padding-top:4px;padding-bottom:4px}.immersive .controls{padding-top:5px;padding-bottom:5px}.immersive .touch button{min-height:42px;padding:6px 12px}}

.risk-note,.debt-story{background:#fff2df;border-left:4px solid #d68632;border-radius:10px;padding:13px 16px;margin:14px 0;font-size:14px}.debt-story{background:#edf4f8;border-color:#527f96}.risk-note p,.debt-story p{margin:8px 0}

/* Scene information stays legible against the layered landscape. */
.scene-label{padding:9px 14px;border-radius:14px;background:#f3fff1dc;box-shadow:0 5px 22px #163c4820;max-width:calc(100% - 36px)}
.health-note{padding:14px 16px;border-radius:12px;background:#e2f3ed;border-left:4px solid #07857b;font-weight:600}
.stage{box-shadow:inset 0 0 50px #244e5818}

.connection-status{padding:4px 14px;background:#193b47;color:#d4ede7;font-size:11px}.immersive .play-column{grid-template-rows:auto minmax(0,1fr) auto auto}.player-name{display:block;font-weight:600;margin-top:16px}.player-name input{display:block;width:100%;font:inherit;padding:12px;border:1px solid #bdd4d6;border-radius:10px;margin-top:6px}.privacy-note{font-size:12px;color:#56717b;background:#edf5f3;padding:12px;border-radius:10px}

/* =====================================================================
   Fantasy Edition (2026-10)
   ===================================================================== */
:root{--fx-ink:#1b1640;--fx-deep:#120f2a;--fx-violet:#4b3a8f;--fx-gold:#ffd36e;--fx-gold-d:#c9962f;--fx-mint:#7affd4;--fx-rose:#ff6b9a}
body{background:radial-gradient(1200px 600px at 80% -10%,#3b2a7a33,transparent 60%),#f4f2fb}
body.immersive{background:var(--fx-deep)}
.logo{background:linear-gradient(135deg,var(--fx-gold),#ffb347);color:var(--fx-ink)}
.pill.active{background:var(--fx-ink)}
.boss-pill{background:#3b1f4f;color:var(--fx-gold)}
.game-top{background:linear-gradient(90deg,var(--fx-deep),#2b2266)}
.game-top button{border-color:#5a4fa0}
#lives{color:var(--fx-mint)}
.stage{background:var(--fx-deep)}
.connection-status{background:var(--fx-deep);color:#cfc6ff}
.scene-label{background:#120f2acc;color:#fff;box-shadow:0 6px 24px #0006;border:1px solid #ffd36e44}
.scene-label span{color:var(--fx-gold)}
.controls{flex-wrap:wrap}
.touch .attack{background:linear-gradient(135deg,#ff9a3d,#ff6b6b);border-color:#ff8a4d;color:#fff;font-size:18px}
.touch .jump,.primary{background:var(--fx-gold);border-color:var(--fx-gold);color:var(--fx-ink)}
.touch [data-action]{background:#efeaff;border-color:#d7ccff}
.immersive .controls{background:#1b1640;color:#cfc6ff}
.immersive .controls p{color:#a99ee0}
.immersive .controls kbd{background:#2b2266;color:#fff}
.immersive .touch button:not(.attack):not(.jump){background:#2b2266;color:#fff;border-color:#4b3a8f}
.weapon-card{margin-top:13px;background:linear-gradient(135deg,#2b2266,#1b1640);color:#fff;border-radius:18px;padding:18px 21px;font-size:14px}
.weapon-card b{color:var(--fx-gold)}
.weapon-card #weaponName{font-size:17px;font-weight:700;margin:6px 0 4px}
.weapon-card .small{font-size:12px;color:#cfc6ff;margin:6px 0 0}
.power-row{display:flex;align-items:center;gap:10px;font-size:12px;color:#cfc6ff}
.power-row meter{flex:1;height:10px}
dialog{border:1px solid #e6dcff;background:linear-gradient(180deg,#fff,#fbf9ff)}
dialog::backdrop{background:#120f2ad9}
dialog .tag{color:#6b4fd0}
dialog .boss-tag{color:#c0264d}
dialog h3{font-size:17px;margin:20px 0 10px}
.muted-note{font-size:13px!important;color:#6b6a85}
.plan-card.owned{border-color:#b8a6ff;background:#f6f2ff}
.plan-card .perk{color:#4b3a8f;font-weight:600}
.plan-card .power{display:inline-block;margin-left:6px;color:var(--fx-gold-d);letter-spacing:1px}
.summary small{display:block;font-size:12px;color:#7a7894}
.weapon-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.weapon-preview>div{background:linear-gradient(135deg,#2b2266,#1b1640);color:#fff;border-radius:14px;padding:12px;text-align:center}
.weapon-preview span{font-size:28px;display:block}
.weapon-preview b{display:block;font-size:13px}
.weapon-preview small{color:var(--fx-gold);font-size:11px}
/* NPC */
.npc-head{display:flex;gap:14px;align-items:center}
.npc-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;font-size:30px;background:#efeaff;flex:none}
.npc-healer .npc-icon{background:#dff9f0}.npc-merchant .npc-icon{background:#fff0dc}.npc-knight .npc-icon{background:#e3ecff}
.npc-head h2{margin:0}
.npc-line{font-style:italic;background:#f6f2ff;border-left:4px solid #8a6bd1;padding:10px 14px;border-radius:10px}
.quiz-q{font-size:16px}
.quiz-options{display:grid;gap:8px}
.quiz-options button{text-align:left;padding:12px 16px;border-color:#d7ccff;background:#fbf9ff}
.quiz-options button:hover{background:#efeaff}
.quiz-ok,.quiz-bad{padding:12px 16px;border-radius:12px;margin:12px 0}
.quiz-ok{background:#e3f9ef;border-left:4px solid #12805c}.quiz-bad{background:#fdecef;border-left:4px solid #c0264d}
.quiz-ok p,.quiz-bad p{margin:6px 0 0}
.readiness{display:flex;gap:16px;align-items:center;background:#f6f2ff;border-radius:14px;padding:14px}
.readiness-score{display:grid;place-items:center;flex:none;width:96px;height:96px;border-radius:50%;background:conic-gradient(var(--fx-gold) 0 0,#e6dcff 0);background:radial-gradient(circle,#fff 58%,transparent 60%),linear-gradient(135deg,#6b4fd0,#ff6b9a);text-align:center;line-height:1.1}
.readiness-score b{font-size:28px;color:var(--fx-ink)}.readiness-score span{font-size:11px;color:#6b6a85}.readiness-score small{font-size:11px;font-weight:700;color:#6b4fd0}
.readiness>div:last-child{flex:1}.readiness p{margin:2px 0 8px;font-size:13px}.readiness progress{accent-color:#6b4fd0}
.ai-notes{padding-left:0;list-style:none;display:grid;gap:6px}.ai-notes li{background:#fbf9ff;border:1px solid #ece6ff;border-radius:10px;padding:8px 12px;font-size:14px}
/* Result */
.result-head{display:flex;gap:18px;align-items:center;margin:8px 0}
.result-head h2{margin:0 0 4px}
.result-head p{margin:4px 0;font-size:14px}
.grade{display:grid;place-items:center;flex:none;min-width:84px;height:84px;padding:0 12px;border-radius:22px;font-size:40px;font-weight:800;color:#fff;background:linear-gradient(135deg,#6b6a85,#3c3b52);box-shadow:0 10px 26px #1b164033}
.grade-S{background:linear-gradient(135deg,#ffd36e,#ff9a3d);color:var(--fx-ink)}.grade-A{background:linear-gradient(135deg,#7affd4,#3aa58a);color:var(--fx-ink)}.grade-B{background:linear-gradient(135deg,#8a6bd1,#4b3a8f)}.grade-C{background:linear-gradient(135deg,#ff9ab8,#c0264d)}
.result-head .grade:not([class*="grade-"]){font-size:26px}
.score-table{width:100%;border-collapse:collapse;font-size:14px}
.score-table th,.score-table td{padding:8px 10px;border-bottom:1px solid #ece6ff;text-align:left}
.score-table th small{display:block;font-weight:400;color:#7a7894;font-size:12px}
.score-table td{text-align:right;font-weight:700;color:#12805c;white-space:nowrap}
.score-table td.neg{color:#c0264d}
.score-table tfoot th,.score-table tfoot td{background:#f6f2ff;color:var(--fx-ink);font-size:15px}
.ai-advice{background:linear-gradient(135deg,#1b1640,#2b2266);color:#fff;border-radius:16px;padding:16px 18px;margin:16px 0}
.ai-advice h3{margin:0 0 10px;color:var(--fx-gold)}
.ai-advice ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.ai-advice li{font-size:14px;line-height:1.55;background:#ffffff10;border-radius:10px;padding:8px 12px}
.ai-advice .cat{display:inline-block;margin-right:8px;padding:1px 8px;border-radius:999px;background:var(--fx-gold);color:var(--fx-ink);font-size:11px;font-weight:700}
@media(max-width:760px){.weapon-preview{grid-template-columns:1fr}.result-head{flex-direction:column;align-items:flex-start}.readiness{flex-direction:column;align-items:flex-start}.weapon-card{grid-column:1/-1}.touch button{padding:9px 10px;min-width:40px}.immersive .touch button{min-width:44px}}

/* =====================================================================
   Difficulty modes + icon touch pad (Android / iOS / iPad)
   ===================================================================== */
.mode-select{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:6px 0 14px}
.mode-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:14px;border:2px solid #e6dcff;border-radius:16px;background:#fff;font-weight:400;transition:transform .15s,border-color .15s,box-shadow .15s}
.mode-card:hover{transform:translateY(-2px);filter:none;border-color:#b8a6ff}
.mode-card b{font-size:18px;color:var(--fx-ink)}
.mode-card small{font-size:12.5px;line-height:1.5;color:#5b5a75}
.mode-icon{font-size:28px;line-height:1}
.mode-tags{margin-top:auto;padding-top:6px;font-size:11.5px;font-weight:700;color:#6b4fd0}
.mode-card.selected{border-color:#6b4fd0;box-shadow:0 8px 22px #6b4fd033;background:linear-gradient(180deg,#f6f2ff,#fff)}
.mode-easy.selected{border-color:#12805c;background:linear-gradient(180deg,#e3f9ef,#fff)}.mode-easy .mode-tags{color:#12805c}
.mode-hard.selected{border-color:#c0264d;background:linear-gradient(180deg,#fdecef,#fff)}.mode-hard .mode-tags{color:#c0264d}
.mode-chip{display:inline-block;margin:0;padding:3px 12px;border-radius:999px;background:#efeaff;color:#4b3a8f;font-size:13px!important;font-weight:700}

/* Pad: ปุ่มไอคอนอย่างเดียว กดค้างได้ ไม่เลือกข้อความ ไม่ซูมเมื่อแตะสองครั้ง */
.controls{align-items:center}
.touch .pad-btn{display:inline-grid;place-items:center;width:52px;height:52px;padding:0;border-radius:16px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;min-width:0;min-height:0}
.touch .pad-btn svg{pointer-events:none}
.touch .pad-btn.big{width:64px;height:64px;border-radius:50%}
.touch .pad-btn.big .ico-big{width:30px;height:30px}
.touch .pad-btn.mini{width:44px;height:44px;border-radius:14px}
.touch .pad-btn:active,.touch .pad-btn.is-down{transform:scale(.92);filter:brightness(1.15)}
.touch .pad-btn.jump{background:var(--fx-gold);border-color:var(--fx-gold);color:var(--fx-ink)}
.touch .pad-btn.attack{background:linear-gradient(135deg,#ff9a3d,#ff5f6d);border-color:#ff7a4d;color:#fff;box-shadow:0 6px 16px #ff5f6d55}
.pad-action{align-items:center}
body.mode-easy .touch .pad-btn.talk{display:none}

/* อุปกรณ์สัมผัส (มือถือ แท็บเล็ต iPad): ปุ่มใหญ่ขึ้น ซ่อนคำอธิบายคีย์บอร์ด */
@media (hover:none) and (pointer:coarse){
  .key-hint{display:none}
  .controls{justify-content:space-between;padding:10px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
  .touch .pad-btn{width:60px;height:60px}
  .touch .pad-btn.big{width:74px;height:74px}
  .touch .pad-btn.big .ico-big{width:34px;height:34px}
  .touch .pad-btn.mini{width:48px;height:48px}
  .touch{gap:10px}
}
/* iPad / แท็บเล็ตแนวนอน: ปุ่มสองฝั่งเหมือนจอยเกม */
@media (hover:none) and (pointer:coarse) and (min-width:700px){
  .touch .pad-btn{width:68px;height:68px}.touch .pad-btn.big{width:84px;height:84px}
}
/* มือถือจอเล็ก: ปุ่มเดินอยู่ซ้าย ปุ่มต่อสู้อยู่ขวา ซ้อนปุ่มย่อยไว้แถวบน */
@media (max-width:520px){
  .mode-select{grid-template-columns:1fr}
  .controls{display:grid;grid-template-columns:auto 1fr;gap:8px}
  .pad-move{gap:6px}
  .pad-move .touch .pad-btn{width:52px;height:52px}
  .pad-action{justify-content:flex-end;flex-wrap:wrap;gap:6px}
  .touch .pad-btn.mini{width:40px;height:40px}
  .touch .pad-btn.big{width:60px;height:60px}
}
@media (max-height:480px) and (pointer:coarse){.touch .pad-btn{width:50px;height:50px}.touch .pad-btn.big{width:60px;height:60px}.touch .pad-btn.mini{width:40px;height:40px}}
.immersive .touch .pad-btn{min-width:0;min-height:0;padding:0}
.pad-minis{display:flex;gap:inherit;align-items:center}
@media (max-width:520px){
  .pad-action{display:grid;grid-template-columns:auto auto;justify-content:end;gap:6px 10px}
  .pad-minis{grid-column:1/-1;justify-content:flex-end;gap:6px}
}

/* ---------- Leaderboard (Top 5 + เหรียญ) ---------- */
.leaderboard{margin:16px 0;padding:14px 16px;border-radius:16px;background:linear-gradient(135deg,#1b1640,#2b2266);color:#fff}
.leaderboard h3{margin:0 0 10px!important;color:var(--fx-gold);font-size:16px!important}
.board-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.board-row{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:8px 12px 8px 8px;border-radius:12px;background:#ffffff12}
.board-row .medal{grid-row:1/3}
.board-name{font-weight:700;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-name small{display:inline-block;margin-left:4px;padding:0 7px;border-radius:999px;background:var(--fx-mint);color:var(--fx-ink);font-size:11px;font-weight:800}
.board-meta{grid-column:2;font-size:11.5px;color:#cfc6ff}
.board-score{grid-column:3;grid-row:1/3;font-size:18px;color:var(--fx-gold);font-variant-numeric:tabular-nums}
.board-row.rank-1{background:linear-gradient(90deg,#f2c23033,#ffffff10)}
.board-row.is-me{outline:2px solid var(--fx-mint)}
.board-empty{font-size:13.5px;color:#cfc6ff;padding:6px 2px}
.medal{position:relative;z-index:0;display:inline-grid;place-items:center;width:34px;height:34px;margin-top:8px;border-radius:50%;font-weight:800;font-size:15px;color:#3b2a00;box-shadow:inset 0 -3px 0 #0002,0 3px 8px #0003}
.medal::before{content:"";position:absolute;z-index:-1;top:-9px;left:50%;width:18px;height:12px;transform:translateX(-50%);background:linear-gradient(90deg,#c0264d 50%,#2b5fd0 50%);clip-path:polygon(0 0,100% 0,80% 100%,20% 100%)}
.medal-1{background:radial-gradient(circle at 35% 30%,#fff6c2,#f2c230 55%,#b8860b)}
.medal-2{background:radial-gradient(circle at 35% 30%,#fff,#c9d1da 55%,#8a96a3);color:#2b3540}
.medal-3{background:radial-gradient(circle at 35% 30%,#ffe1c4,#d4894a 55%,#8c4f1f);color:#3a1d05}
.medal-4{background:radial-gradient(circle at 35% 30%,#d9e6ff,#5b8def 55%,#2a4fa8);color:#fff}
.medal-5{background:radial-gradient(circle at 35% 30%,#d4fbe6,#3cbf86 55%,#16774d);color:#fff}
.board-card{margin-top:13px;background:linear-gradient(135deg,#1b1640,#2b2266);color:#fff;border-radius:18px;padding:16px 18px;font-size:14px}
.board-card>b{display:block;margin-bottom:10px;color:var(--fx-gold)}
.board-card .board-row{padding:6px 8px 6px 6px}.board-card .board-score{font-size:15px}
@media(max-width:760px){.board-card{grid-column:1/-1;margin:0}}