/* Оформления сайта. Каждое переопределяет те же токены, что и :root в style.css (хаки — оформление по умолчанию).
   Селектор html:root[data-skin] специально тяжелее, чем :root:not([data-theme=dark]) из style.css, иначе светлая тема системы перебивала бы выбор.
   В токене --amber у каждого оформления лежит цвет действия (кнопка «Играть», выбранная вкладка, закрепление), даже если он не янтарный. */

/* ---------- Стим 2004: олива, острые углы, «выпуклые» кнопки ---------- */
html:root[data-skin=steam]{
  --leaf-1:#c8b640;--leaf-2:#d98a3a;--leaf-3:#a3452c;--leaf-4:#7f9a3a;
  --bg:#465140;--raise:#3b4334;--raise-2:#454f3d;--line:#6f7d64;--text:#e8ede2;--mut:#c8d1bb;
  --amber:#d9c94a;--on-amber:#26290f;--on-rust:#2b1205;--lime:#9ee05a;--rust:#e8896a;--slate:#9bbad0;
  --plate-bg:linear-gradient(165deg,#cdd5bf 0%,#a9b49a 100%);--plate-fg:#20241b;--plate-hole:#465140;
  --shadow:0 1px 0 #0003;
  --display:Tahoma,Verdana,"DejaVu Sans",sans-serif;--body:Tahoma,Verdana,"DejaVu Sans",sans-serif;
  color-scheme:dark;
}
html[data-skin=steam] :is(.play,#add-btn,#files-close,.ghost,.icon,.files,.chip,.pin,.hint-tag,.toast,.hint,.pick,dialog,.skin-menu,.skin-opt,.skin-opt .sw,.gamepanel,.pad-btn,#pad-cmd,.amber,.danger,.card,.tags li,#mirror-go,#mirror-key,input,select,textarea){border-radius:0}
html[data-skin=steam] :is(.tablewrap,.quick,.banner,dialog,.skin-menu,.adm-login,.card){box-shadow:inset 1px 1px 0 #8b9a7f,inset -1px -1px 0 #2a3025}
html[data-skin=steam] :is(.play,#add-btn,#files-close,.amber){box-shadow:inset 1px 1px 0 #fff7,inset -1px -1px 0 #0005}
html[data-skin=steam] :is(.ghost,.files,.icon,.chip,.pick){box-shadow:inset 1px 1px 0 #ffffff26,inset -1px -1px 0 #0004}
html[data-skin=steam] .top,html[data-skin=steam] .adm-top{background:var(--raise);border-bottom:1px solid #2a3025;box-shadow:0 1px 0 #6f7d64}
html[data-skin=steam] th{background:#333b2d}
html[data-skin=steam] .tag,html[data-skin=steam] .gnick{clip-path:none}

/* ---------- Тёмный оранж: почти чёрный фон, оранжевое действие ---------- */
html:root[data-skin=ember]{
  --leaf-1:#ff7a1a;--leaf-2:#ffae42;--leaf-3:#e0432a;--leaf-4:#b8742a;
  --bg:#121214;--raise:#1b1b1f;--raise-2:#25252a;--line:#34343b;--text:#ececec;--mut:#a4a4ae;
  --amber:#ff7a1a;--on-amber:#1a0b00;--on-rust:#1f0805;--lime:#7ddc6a;--rust:#ff6b5e;--slate:#6fb0ff;
  --plate-bg:linear-gradient(165deg,#ff9440 0%,#e3650f 100%);--plate-fg:#1a0b00;--plate-hole:#121214;
  --shadow:0 1px 0 #0006;
  --display:"Segoe UI Semibold","Trebuchet MS","DejaVu Sans",Tahoma,sans-serif;--body:"Segoe UI",Tahoma,"DejaVu Sans",system-ui,sans-serif;
  color-scheme:dark;
}
html[data-skin=ember] .top,html[data-skin=ember] .adm-top{border-bottom:2px solid var(--amber)}
html[data-skin=ember] .brand{letter-spacing:.04em}
html[data-skin=ember] .quick{border-left-color:var(--amber);background:linear-gradient(90deg,#2a1c10 0%,var(--raise) 55%)}

/* ---------- Синий неон: ночной синий, голубая подсветка ---------- */
html:root[data-skin=neon]{
  --leaf-1:#35d0ff;--leaf-2:#6f8bff;--leaf-3:#9b6bff;--leaf-4:#3fe0b8;
  --bg:#0b1220;--raise:#121b2e;--raise-2:#1a2640;--line:#2a3a5c;--text:#e6edf8;--mut:#95a6c4;
  --amber:#35d0ff;--on-amber:#031a24;--on-rust:#2a0710;--lime:#52e0a0;--rust:#ff7a8a;--slate:#8aa8ff;
  --plate-bg:linear-gradient(165deg,#2b66e8 0%,#1d44c0 100%);--plate-fg:#ffffff;--plate-hole:#0b1220;
  --shadow:0 1px 0 #0008;
  --display:"Segoe UI Semibold","Trebuchet MS","DejaVu Sans",Tahoma,sans-serif;--body:"Segoe UI",Tahoma,"DejaVu Sans",system-ui,sans-serif;
  color-scheme:dark;
}
html[data-skin=neon] .tag input{text-shadow:none}
html[data-skin=neon] :is(.tab.active){box-shadow:0 3px 12px -3px var(--amber)}
html[data-skin=neon] :is(.play,#add-btn,#files-close,.amber){box-shadow:0 0 16px -4px var(--amber)}
html[data-skin=neon] :is(.quick,.tablewrap,.banner,dialog,.skin-menu){border-color:#2a3a5c;box-shadow:0 0 0 1px #35d0ff1f,0 8px 28px -12px #000}
html[data-skin=neon] .top,html[data-skin=neon] .adm-top{background:linear-gradient(180deg,#16223a 0%,var(--raise) 100%);border-bottom:1px solid #35d0ff55}

/* ---------- Светлый: белые панели, синее действие ---------- */
html:root[data-skin=snow]{
  --leaf-1:#d9531e;--leaf-2:#e69a1f;--leaf-3:#b3342a;--leaf-4:#8f7a1c;
  --bg:#eef1f5;--raise:#ffffff;--raise-2:#f1f4f9;--line:#d3dae6;--text:#1c2430;--mut:#566275;
  --amber:#1f6feb;--on-amber:#ffffff;--on-rust:#ffffff;--lime:#2a7d2e;--rust:#c4401f;--slate:#2b6a9c;
  --plate-bg:linear-gradient(165deg,#34445e 0%,#1b2738 100%);--plate-fg:#f3f6fb;--plate-hole:#eef1f5;
  --shadow:0 1px 2px #1e2f4a14;
  --display:"Segoe UI Semibold","Trebuchet MS","DejaVu Sans",Tahoma,sans-serif;--body:"Segoe UI",Tahoma,"DejaVu Sans",system-ui,sans-serif;
  color-scheme:light;
}
html[data-skin=snow] .tag input{text-shadow:none}
html[data-skin=snow] :is(.tablewrap,.quick,.banner,.skin-menu,.card){box-shadow:0 1px 2px #1e2f4a14}
html[data-skin=snow] .top,html[data-skin=snow] .adm-top{box-shadow:0 1px 3px #1e2f4a14}
html[data-skin=snow] .toast{background:#1c2430;color:#f3f6fb}
html[data-skin=snow] .logbox{background:#1e2733;color:#e3e9f2}

/* ---------- Терминал: консоль CS, зелёный люминофор на чёрном, моноширинный шрифт ---------- */
html:root[data-skin=term]{
  --leaf-1:#5af58c;--leaf-2:#2fbf62;--leaf-3:#a6ff7a;--leaf-4:#1d8f48;
  --bg:#070c08;--raise:#0d150f;--raise-2:#15251b;--line:#24402f;--text:#c9f2d2;--mut:#86b894;
  --amber:#5af58c;--on-amber:#03130a;--on-rust:#1a0603;--lime:#8dff9a;--rust:#ff8f6b;--slate:#6fd0e6;
  --plate-bg:linear-gradient(165deg,#5af58c 0%,#2fbf62 100%);--plate-fg:#03130a;--plate-hole:#070c08;
  --shadow:none;
  --display:ui-monospace,"Cascadia Mono","SF Mono",Consolas,"DejaVu Sans Mono","Liberation Mono",monospace;--body:ui-monospace,"Cascadia Mono","SF Mono",Consolas,"DejaVu Sans Mono","Liberation Mono",monospace;
  color-scheme:dark;
}
html[data-skin=term] :is(.play,#add-btn,#files-close,.ghost,.icon,.files,.chip,.pin,.hint-tag,.toast,.hint,.pick,dialog,.skin-menu,.skin-opt,.skin-opt .sw,.tag,.tab,.mapb,.gamepanel,.pad-btn,#pad-cmd,.amber,.danger,.card,.tags li,#mirror-go,#mirror-key,input,select,textarea,.banner,.quick,.tablewrap,.logbox,.acct-go,.invite-go,.acct-item,.acct-del,code,kbd){border-radius:0}
html[data-skin=term] .tag input,html[data-skin=term] .gnick{text-shadow:none}
html[data-skin=term] .toast{background:var(--amber);color:var(--on-amber)}
html[data-skin=term] .top,html[data-skin=term] .adm-top{background:var(--raise);border-bottom:1px dashed var(--line)}

/* ---------- Пульт: графит, красные LED-цифры, жёлто-чёрная предупредительная лента ---------- */
html:root[data-skin=panel]{
  --leaf-1:#ff4d3a;--leaf-2:#ffcf1f;--leaf-3:#ff8a2a;--leaf-4:#c92f23;
  --bg:#16181c;--raise:#1f2227;--raise-2:#2a2e35;--line:#3a3f48;--text:#e9ebee;--mut:#a9afba;
  --amber:#ff4d3a;--on-amber:#1a0402;--on-rust:#1f1200;--lime:#6be08a;--rust:#ffb02e;--slate:#7db7ff;
  --plate-bg:linear-gradient(165deg,#ff5a47 0%,#e03a28 100%);--plate-fg:#1a0402;--plate-hole:#16181c;
  --shadow:0 1px 0 #0007;
  --display:Bahnschrift,"Arial Narrow","DejaVu Sans Condensed","Roboto Condensed",Tahoma,sans-serif;--body:"Segoe UI",Tahoma,"DejaVu Sans",system-ui,sans-serif;
  color-scheme:dark;
}
html[data-skin=panel] :is(.top,.adm-top){position:relative;padding-bottom:20px;background:#101215;border-bottom:0}
html[data-skin=panel] :is(.top,.adm-top)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:7px;background:repeating-linear-gradient(135deg,#ffcf1f 0 12px,#101215 12px 24px)}
html[data-skin=panel] :is(.play,#add-btn,#files-close,.amber,.acct-go,.invite-go,#mirror-go){box-shadow:0 3px 0 #8a1d12}
html[data-skin=panel] :is(.play,#add-btn,#files-close,.amber,.acct-go,.invite-go,#mirror-go):active{transform:translateY(2px);box-shadow:0 1px 0 #8a1d12}
html[data-skin=panel] .toast{background:#f1f3f6;color:#16181c}

/* ---------- Чертёж: синька, белые линии, жёлтые пометки ---------- */
html:root[data-skin=plan]{
  --leaf-1:#ffd23f;--leaf-2:#eaf3ff;--leaf-3:#7fc3ff;--leaf-4:#ffb347;
  --bg:#0d3566;--raise:#12437f;--raise-2:#18508f;--line:#5f8ec4;--text:#eaf3ff;--mut:#b6d0ec;
  --amber:#ffd23f;--on-amber:#13243d;--on-rust:#1d0c04;--lime:#8ff0b4;--rust:#ffa07a;--slate:#9fd0ff;
  --plate-bg:linear-gradient(165deg,#eaf3ff 0%,#c9dcf3 100%);--plate-fg:#0d2a52;--plate-hole:#0d3566;
  --shadow:none;
  --display:Bahnschrift,"DIN Alternate","Arial Narrow","DejaVu Sans Condensed","Roboto Condensed",Tahoma,sans-serif;--body:"Segoe UI",Tahoma,"DejaVu Sans",system-ui,sans-serif;
  color-scheme:dark;
}
html[data-skin=plan] :is(.play,#add-btn,#files-close,.ghost,.icon,.files,.chip,.pin,.hint-tag,.toast,.hint,.pick,dialog,.skin-menu,.skin-opt,.skin-opt .sw,.tag,.mapb,.gamepanel,.pad-btn,#pad-cmd,.amber,.danger,.card,.tags li,#mirror-go,#mirror-key,input,select,textarea,.logbox,.acct-go,.invite-go,.acct-item,.acct-del,code,kbd){border-radius:0}
html[data-skin=plan] .tag input,html[data-skin=plan] .gnick{text-shadow:none}
html[data-skin=plan] .toast{background:var(--text);color:#0d2a52}
html[data-skin=plan] :is(.top,.adm-top){background:var(--raise);border-bottom:1px solid var(--mut);box-shadow:0 4px 0 var(--bg),0 5px 0 var(--mut)}
html[data-skin=plan] :is(.tablewrap,.quick,.banner,dialog,.skin-menu,.adm-login,.card){border-color:var(--mut)}

/* ---------- Листопад: сливовые сумерки, календула и клён; углы «листом» ---------- */
html:root[data-skin=leaf]{
  --leaf-1:#f0a030;--leaf-2:#d7432f;--leaf-3:#f6c453;--leaf-4:#b5532a;
  --bg:#1d1522;--raise:#2a1d2e;--raise-2:#36263a;--line:#4b3550;--text:#f6e9d8;--mut:#cdb7a4;
  --amber:#f0a030;--on-amber:#2a1500;--on-rust:#2a0a04;--lime:#b8d65c;--rust:#ff7a5c;--slate:#8fb5d6;
  --plate-bg:linear-gradient(165deg,#f6c453 0%,#e0762c 100%);--plate-fg:#2a1500;--plate-hole:#1d1522;
  --shadow:0 1px 0 #0006;
  --display:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua","DejaVu Serif",Georgia,serif;--body:"Segoe UI",Tahoma,"DejaVu Sans",system-ui,sans-serif;
  color-scheme:dark;
}
/* листовая форма: два противоположных угла круглые, два — почти острые */
html[data-skin=leaf] :is(.play,#add-btn,#files-close,.amber,.acct-go,.invite-go,#mirror-go){border-radius:18px 4px 18px 4px}
html[data-skin=leaf] :is(.ghost,.files,.chip,.pick,.hint-tag,.pin){border-radius:99px}
html[data-skin=leaf] :is(.quick,.tablewrap,dialog,.skin-menu,.adm-login,.card,.gamepanel){border-radius:22px 6px 22px 6px;border-color:var(--line)}
html[data-skin=leaf] .skin-opt{border-radius:14px 4px 14px 4px}
html[data-skin=leaf] .toast{background:var(--text);color:#2a1500}
html[data-skin=leaf] .tag input,html[data-skin=leaf] .gnick{text-shadow:none}
html[data-skin=leaf] :is(.top,.adm-top){position:relative;background:linear-gradient(180deg,#33223a 0%,var(--raise) 100%);border-bottom:0}
html[data-skin=leaf] :is(.top,.adm-top)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,transparent 0,#f0a030 14%,#d7432f 42%,#f6c453 70%,#b5532a 88%,transparent 100%);opacity:.85}