/* Colour schemes. LOCKED 2026-10-31 17:41: default = 6 Graphite Silver. Players pick 1..6 in the lobby / in-game menu
   (saved in localStorage.ofc_theme); ?theme=0..6 overrides without saving; 0 = old purple/gold look (no data-theme).
   Colours only, table shape/layout untouched. */
html[data-theme="1"]{ /* Emerald Felt */
  --bg1:#1f7a4d; --bg2:#06261a; --gold:#e3bd5c; --gold2:#f8e4a4; --accink:#2a1a05; --ink:#f0f8f2; --mute:#a8cdb8;
  --panel:rgba(0,0,0,.20); --line:rgba(227,189,92,.40); --btnbg:rgba(0,0,0,.22); --rowbg:rgba(0,0,0,.16); --rowline:rgba(255,255,255,.10);
  --slot:rgba(255,255,255,.22); --tray:rgba(0,0,0,.28); --back1:#7a1e2a; --back2:#5c1520; --sheet1:#164f34; --sheet2:#071f15; --face1:#fffef8; --face2:#efe9d6; }
html[data-theme="2"]{ /* Midnight Sapphire */
  --bg1:#1f3f7a; --bg2:#040a1a; --gold:#46c8e6; --gold2:#a9eeff; --accink:#03202a; --ink:#eaf2ff; --mute:#9db2d8;
  --panel:rgba(120,170,255,.07); --line:rgba(70,200,230,.40); --btnbg:rgba(120,170,255,.10); --rowbg:rgba(120,170,255,.06); --rowline:rgba(120,170,255,.14);
  --slot:rgba(169,238,255,.22); --tray:rgba(0,8,30,.45); --back1:#1c3f8c; --back2:#132c66; --sheet1:#18305c; --sheet2:#060c1c; --face1:#fbfdff; --face2:#e3ebf5; }
html[data-theme="3"]{ /* Crimson Velvet */
  --bg1:#7a1428; --bg2:#1a0308; --gold:#e8b65a; --gold2:#f8dc9a; --accink:#2a1205; --ink:#fdeff2; --mute:#d8aab4;
  --panel:rgba(0,0,0,.20); --line:rgba(232,182,90,.40); --btnbg:rgba(0,0,0,.25); --rowbg:rgba(0,0,0,.18); --rowline:rgba(255,200,210,.12);
  --slot:rgba(255,220,225,.20); --tray:rgba(0,0,0,.32); --back1:#2b2b2b; --back2:#1a1a1a; --sheet1:#5a0f1e; --sheet2:#1a0308; --face1:#fffaf3; --face2:#f1e6d6; }
html[data-theme="4"]{ /* Sakura Light */
  --bg1:#fff4f7; --bg2:#f3cfdc; --gold:#e0507c; --gold2:#ff9dbb; --accink:#ffffff; --ink:#3b1d2b; --mute:#8d6274;
  --panel:rgba(255,255,255,.60); --line:rgba(224,80,124,.35); --btnbg:rgba(255,255,255,.75); --rowbg:rgba(255,255,255,.55); --rowline:rgba(224,80,124,.18);
  --slot:rgba(141,98,116,.35); --tray:rgba(224,80,124,.10); --back1:#e0507c; --back2:#c63c67; --sheet1:#fff4f7; --sheet2:#f6dbe5; --face1:#ffffff; --face2:#fbf3f5; }
html[data-theme="5"]{ /* Neon Cyber */
  --bg1:#2d0c56; --bg2:#04010c; --gold:#ff3fb4; --gold2:#ff9be0; --accink:#1a0012; --ink:#eafcff; --mute:#96b8cc;
  --panel:rgba(0,240,255,.05); --line:rgba(0,240,255,.45); --btnbg:rgba(0,240,255,.08); --rowbg:rgba(0,240,255,.04); --rowline:rgba(0,240,255,.25);
  --slot:rgba(0,240,255,.35); --tray:rgba(255,63,180,.08); --back1:#1a0538; --back2:#00b8c8; --sheet1:#22093f; --sheet2:#05010d; --face1:#f8ffff; --face2:#e4f2f7; }
html[data-theme="6"]{ /* Graphite Silver */
  --bg1:#3d434c; --bg2:#0e1013; --gold:#c4ccd6; --gold2:#ffffff; --accink:#15181c; --ink:#f2f4f7; --mute:#a2aab5;
  --panel:rgba(255,255,255,.05); --line:rgba(196,204,214,.35); --btnbg:rgba(255,255,255,.07); --rowbg:rgba(255,255,255,.04); --rowline:rgba(255,255,255,.10);
  --slot:rgba(255,255,255,.18); --tray:rgba(0,0,0,.30); --back1:#4a525d; --back2:#2c3138; --sheet1:#2c3138; --sheet2:#0e1013; --face1:#ffffff; --face2:#e9ecf0; }

/* shared overrides, only active when a theme is set */
html[data-theme] .btn,html[data-theme] .icon-btn,html[data-theme] .seg button{background:var(--btnbg)}
html[data-theme] .btn.gold,html[data-theme] .seg button.on{background:linear-gradient(180deg,var(--gold2),var(--gold));color:var(--accink);border-color:var(--gold2)}
html[data-theme] .avatar{color:var(--accink)}
html[data-theme] .opp{border-color:var(--rowline)}
html[data-theme] .opp.turn{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset,0 0 18px color-mix(in srgb,var(--gold) 30%,transparent)}
html[data-theme] .board.me .row{background:var(--rowbg);border-color:var(--rowline)}
html[data-theme] .board.me .row.drop{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 14%,transparent)}
html[data-theme] .board.me .row.target{border-color:color-mix(in srgb,var(--gold) 60%,transparent)}
html[data-theme] .row .roy{background:color-mix(in srgb,var(--gold) 20%,transparent)}
html[data-theme] .slot{border-color:var(--slot)}
html[data-theme] #hand{background:var(--tray)}
html[data-theme] .tbar{background:color-mix(in srgb,var(--ink) 10%,transparent)}
html[data-theme] .card{background:linear-gradient(180deg,var(--face1),var(--face2))}
html[data-theme] .card.back{background:repeating-linear-gradient(45deg,var(--back1) 0 5px,var(--back2) 5px 10px);border-color:var(--gold)}
html[data-theme] .card.back::after{border-color:color-mix(in srgb,var(--gold) 60%,transparent)}
html[data-theme] .sheet{background:linear-gradient(180deg,var(--sheet1),var(--sheet2))}
html[data-theme] .fld select,html[data-theme] .fld input,html[data-theme] .joinrow input,html[data-theme] .fld .fixed{background-color:var(--btnbg)} /* background-color only: keeps the ▼ chevron background-image from style.css */
html[data-theme] .fld select option{background:var(--sheet2);color:var(--ink)}
html[data-theme] .round i{background:color-mix(in srgb,var(--ink) 18%,transparent)}
html[data-theme] .round i.on{background:var(--gold)}
html[data-theme="1"] #app{background:radial-gradient(120% 80% at 50% 30%,var(--bg1),var(--bg2) 75%)}
html[data-theme="4"] .card{box-shadow:0 2px 0 rgba(120,40,70,.18),0 4px 10px rgba(120,40,70,.18)}
html[data-theme="4"] .title-img{filter:drop-shadow(0 6px 14px rgba(120,40,70,.35))}
html[data-theme="5"] .board.me .row,html[data-theme="5"] .opp{box-shadow:0 0 10px rgba(0,240,255,.10) inset}
html[data-theme="5"] #status{text-shadow:0 0 8px rgba(255,63,180,.55)}
html[data-theme="4"] #modeLbl,html[data-theme="4"] .ochips,html[data-theme="4"] .chipbtn,html[data-theme="4"] .title,html[data-theme="4"] .sheet h3,html[data-theme="4"] .row .roy,html[data-theme="4"] .wait b,html[data-theme="4"] .link,html[data-theme="4"] .roytbl h4{color:#c23a66}
