*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
[data-theme="classic"]{--bg:#080604;--panel:#110e08;--panel2:#1a150a;--border:#2e2416;--gold:#c9a535;--gold2:#e8c96a;--ivory:#f0e6d3;--cream:#c8b89a;--dim:#6a5840;--bl:#f0d9b5;--bd:#b58863;--pw:#f8f0e0;--pb:#1a1008;--psw:0 2px 6px rgba(0,0,0,.9),0 0 10px rgba(0,0,0,.5);--psb:0 2px 4px rgba(255,255,255,.1);--bshadow:0 0 60px rgba(0,0,0,.9),0 0 0 1px rgba(201,165,53,.15);--topbg:linear-gradient(180deg,#1a1208,#110e08);--panelAcc:rgba(201,165,53,.07)}
[data-theme="cosmic"]{--bg:#020410;--panel:#050916;--panel2:#08102a;--border:#0e1a3a;--gold:#7eb8ff;--gold2:#a0d0ff;--ivory:#d0e8ff;--cream:#8ab0d8;--dim:#2a4a6a;--bl:#1a2a50;--bd:#0e1a3a;--pw:#e0f0ff;--pb:#05080f;--psw:0 0 12px rgba(120,180,255,.6);--psb:0 0 10px rgba(80,140,255,.4);--bshadow:0 0 60px rgba(0,10,40,.9),0 0 0 1px rgba(100,160,255,.15);--topbg:linear-gradient(180deg,#060a18,#050916);--panelAcc:rgba(100,160,255,.06)}
[data-theme="medieval"]{--bg:#0c0804;--panel:#1a1208;--panel2:#261a0c;--border:#3e2c18;--gold:#d4862a;--gold2:#e8a050;--ivory:#f0d8b0;--cream:#c8a878;--dim:#7a5830;--bl:#e8c890;--bd:#8b5e3c;--pw:#faf0d8;--pb:#1c0c04;--psw:0 3px 8px rgba(0,0,0,.95);--psb:0 2px 6px rgba(255,220,150,.15);--bshadow:0 0 50px rgba(20,8,0,.9),0 0 0 2px rgba(180,110,40,.2);--topbg:linear-gradient(180deg,#261608,#1a1208);--panelAcc:rgba(180,110,40,.07)}
[data-theme="nature"]{--bg:#020c04;--panel:#061408;--panel2:#0c200e;--border:#143018;--gold:#4cae5c;--gold2:#6ece7a;--ivory:#d0f0d8;--cream:#90c898;--dim:#2a5830;--bl:#c8e8a0;--bd:#5a8840;--pw:#f0faf0;--pb:#020c04;--psw:0 2px 8px rgba(0,0,0,.9);--psb:0 0 8px rgba(100,220,100,.2);--bshadow:0 0 50px rgba(0,20,0,.9),0 0 0 1px rgba(60,180,60,.12);--topbg:linear-gradient(180deg,#0c200e,#061408);--panelAcc:rgba(60,180,60,.07)}
[data-theme="ice"]{--bg:#060a14;--panel:#0a1220;--panel2:#10182c;--border:#182438;--gold:#80d8f0;--gold2:#a8eaff;--ivory:#d8f0ff;--cream:#90c8e0;--dim:#2a4a6a;--bl:#c0e4f8;--bd:#6898c0;--pw:#f0faff;--pb:#04080c;--psw:0 0 16px rgba(140,220,255,.5);--psb:0 0 10px rgba(100,200,255,.3);--bshadow:0 0 60px rgba(0,20,60,.9),0 0 0 1px rgba(120,210,255,.15);--topbg:linear-gradient(180deg,#101e34,#0a1220);--panelAcc:rgba(120,210,255,.06)}
[data-theme="infernal"]{--bg:#080000;--panel:#120202;--panel2:#1e0404;--border:#3a0808;--gold:#e05020;--gold2:#ff7040;--ivory:#ffd8c8;--cream:#c89080;--dim:#6a2818;--bl:#f0b090;--bd:#a84030;--pw:#fff0e8;--pb:#0c0000;--psw:0 0 14px rgba(240,80,30,.5);--psb:0 0 10px rgba(200,40,20,.3);--bshadow:0 0 60px rgba(40,0,0,.95),0 0 0 1px rgba(200,60,30,.15);--topbg:linear-gradient(180deg,#1e0606,#120202);--panelAcc:rgba(200,60,30,.07)}
html,body{width:100%;height:100%;background:var(--bg);color:var(--ivory);font-family:Georgia, "Times New Roman", "Palatino", serif,serif;overflow:hidden;transition:background .5s}
::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--panel)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.screen{position:fixed;inset:0;display:flex;flex-direction:column;overflow:hidden}.hidden{display:none!important}
#particles{position:fixed;inset:0;z-index:0;pointer-events:none}
/* MENU */
#s-menu{align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--panel) 80%,transparent) 0%,var(--bg) 100%)}
.menu-inner{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.5rem;padding:1.5rem;position:relative;z-index:1;max-height:100vh;overflow:auto}
.menu-crown{font-size:4rem;line-height:1;filter:drop-shadow(0 0 30px var(--gold));animation:mglow 3s ease-in-out infinite}
@keyframes mglow{0%,100%{filter:drop-shadow(0 0 20px var(--gold))}50%{filter:drop-shadow(0 0 50px var(--gold2))}}
.menu-title{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:2.2rem;font-weight:700;color:var(--gold2);text-shadow:0 0 40px color-mix(in srgb,var(--gold) 40%,transparent)}
.menu-sub{font-size:.85rem;color:var(--dim);letter-spacing:.2em;font-style:italic}
.menu-cols{display:flex;gap:2rem;flex-wrap:wrap;justify-content:center}
.menu-col{display:flex;flex-direction:column;gap:.5rem;min-width:190px}
.menu-col-title{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--dim);text-align:center;margin-bottom:.2rem}
.menu-btn{padding:.75rem 1.4rem;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.85rem;letter-spacing:.1em;border:1px solid var(--gold);background:rgba(0,0,0,.2);color:var(--gold);cursor:pointer;transition:all .22s;position:relative;overflow:hidden;clip-path:polygon(10px 0%,100% 0%,100% calc(100% - 10px),calc(100% - 10px) 100%,0% 100%,0% 10px)}
.menu-btn::before{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .22s;z-index:0}
.menu-btn:hover::before{transform:scaleX(1)}
.menu-btn:hover{color:var(--bg)}.menu-btn span{position:relative;z-index:1}
.menu-btn.sec{border-color:var(--border);color:var(--dim)}.menu-btn.sec:hover{border-color:var(--gold);color:var(--bg)}
.sel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.3rem}
.sel-btn{padding:.45rem .4rem;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.6rem;letter-spacing:.05em;border:1px solid var(--border);background:transparent;color:var(--dim);cursor:pointer;transition:all .2s;text-align:center;line-height:1.4}
.sel-btn:hover{border-color:var(--gold);color:var(--gold)}
.sel-btn.active{border-color:var(--gold);color:var(--gold2);background:var(--panelAcc)}
.var-desc{font-size:.7rem;color:var(--dim);font-style:italic;text-align:center;min-height:2rem;line-height:1.5;transition:opacity .2s}
/* TOPBAR */
.game-topbar{display:flex;align-items:center;justify-content:space-between;padding:.48rem 1rem;background:var(--topbg);border-bottom:1px solid var(--border);flex-shrink:0;position:relative;z-index:10}
.game-topbar::after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.35}
.topbar-mode{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.68rem;letter-spacing:.16em;color:var(--gold)}
.topbar-status{font-size:.92rem;font-weight:500;color:var(--ivory)}
.topbar-status.check{color:#ff8080;animation:ckp .7s ease-in-out infinite}
@keyframes ckp{0%,100%{opacity:1}50%{opacity:.6}}
.topbar-btns{display:flex;gap:.4rem;align-items:center}
.tbtn{padding:.26rem .6rem;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.65rem;letter-spacing:.08em;background:transparent;border:1px solid var(--border);color:var(--dim);cursor:pointer;transition:all .18s}
.tbtn:hover{border-color:var(--gold);color:var(--gold)}.tbtn.pri{border-color:var(--gold);color:var(--gold)}
.tbtn.pri:hover{background:var(--gold);color:var(--bg)}.tbtn.dan:hover{border-color:#ef4444;color:#ef4444}
.think-wrap{display:flex;gap:3px;align-items:center}
.td{width:5px;height:5px;border-radius:50%;background:var(--gold);opacity:0}
.td.show{animation:tda 1.2s ease-in-out infinite}.td:nth-child(2).show{animation-delay:.2s}.td:nth-child(3).show{animation-delay:.4s}
@keyframes tda{0%,100%{opacity:.15;transform:scale(.7)}50%{opacity:1;transform:scale(1.2)}}
.check-cnt{font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.65rem;color:var(--gold);padding:.1rem .3rem;border:1px solid var(--border);background:var(--panelAcc)}
/* GAME BODY */
.game-body{flex:1;display:flex;overflow:hidden;min-height:0}
.panel-l,.panel-r{width:205px;flex-shrink:0;background:var(--panel);display:flex;flex-direction:column;overflow:hidden;transition:background .5s}
.panel-l{border-right:1px solid var(--border)}.panel-r{border-left:1px solid var(--border)}
.board-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.8rem;background:var(--bg);min-width:0;position:relative}
/* BOARD */
.board-outer{position:relative;padding:20px;background:color-mix(in srgb,var(--panel) 90%,var(--gold) 10%);border:1px solid var(--border);box-shadow:var(--bshadow)}
.board-outer::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--gold) 6%,transparent) 0%,transparent 60%);pointer-events:none}
.coord-f,.coord-r{position:absolute;display:flex;font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.6rem;color:var(--dim)}
.coord-f{bottom:4px;left:20px;right:20px;justify-content:space-around}.coord-r{left:4px;top:20px;bottom:20px;flex-direction:column;justify-content:space-around;align-items:center}
#board,#tuto-board{display:grid;grid-template-columns:repeat(8,1fr);position:relative}
/* SQUARES */
.sq{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:filter .1s}
.sq.light{background:var(--bl)}.sq.dark{background:var(--bd)}
.sq::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.055),transparent 70%);pointer-events:none;z-index:1}
.sq.dark::before{background:radial-gradient(circle at 70% 70%,rgba(0,0,0,.1),transparent 70%)}
.sq.sel{outline:3px solid var(--gold)!important;outline-offset:-3px;background:color-mix(in srgb,var(--gold) 32%,var(--bl))!important}
.sq.sel.dark{background:color-mix(in srgb,var(--gold) 28%,var(--bd))!important}
.sq.lmf{background:color-mix(in srgb,var(--gold) 26%,var(--bl))!important}.sq.lmf.dark{background:color-mix(in srgb,var(--gold) 20%,var(--bd))!important}
.sq.lmt{background:color-mix(in srgb,var(--gold) 40%,var(--bl))!important}.sq.lmt.dark{background:color-mix(in srgb,var(--gold) 33%,var(--bd))!important}
.sq.incheck{background:radial-gradient(circle,rgba(220,20,20,.7) 0%,rgba(220,20,20,.3) 70%,transparent 100%)!important;animation:ckglow .8s ease-in-out infinite}
@keyframes ckglow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.3)}}
.sq.legal::after{content:"";position:absolute;width:30%;height:30%;border-radius:50%;background:color-mix(in srgb,var(--gold) 45%,rgba(0,0,0,.2));pointer-events:none;z-index:2;animation:legf .2s ease}
.sq.legal.cap::after{width:92%;height:92%;border-radius:50%;background:transparent;border:4px solid color-mix(in srgb,var(--gold) 40%,rgba(0,0,0,.25))}
@keyframes legf{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
.sq:hover:not(.sel){filter:brightness(1.08)}
.sq.hi{box-shadow:inset 0 0 0 3px var(--gold2)!important}
/* PIECES */
.piece{font-size:2.4rem;line-height:1;z-index:3;position:relative;pointer-events:none;transition:transform .08s;-webkit-font-smoothing:antialiased;user-select:none}
.piece.white{color:var(--pw);text-shadow:var(--psw)}.piece.black{color:var(--pb);text-shadow:var(--psb)}
.sq:hover .piece{transform:scale(1.1) translateY(-2px)}.sq.sel .piece{transform:scale(1.12) translateY(-3px)}
/* ARROWS SVG */
#board-svg,#tuto-svg{position:absolute;top:0;left:0;pointer-events:none;z-index:20;overflow:visible}
/* MOVE ANIMATION */
.piece-ghost{position:fixed;pointer-events:none;z-index:100;line-height:1;display:flex;align-items:center;justify-content:center;transition:left .18s cubic-bezier(.25,.46,.45,.94),top .18s cubic-bezier(.25,.46,.45,.94);opacity:0}
.piece-ghost.fly{opacity:1}.piece-ghost.land{animation:land .25s ease forwards}
@keyframes land{0%{transform:scale(1.2)}60%{transform:scale(.88)}100%{transform:scale(1)}}
.cap-burst{position:fixed;pointer-events:none;z-index:99;animation:burst .4s ease forwards}
@keyframes burst{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(2.8) rotate(25deg)}}
/* LEFT PANEL */
.player-card{padding:.55rem .8rem;border-bottom:1px solid var(--border);background:var(--panelAcc)}
.pname{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.76rem;letter-spacing:.1em;color:var(--cream);display:flex;align-items:center;gap:.4rem}
.pdot{width:6px;height:6px;border-radius:50%;background:var(--border);flex-shrink:0}
.pdot.active{background:var(--gold);box-shadow:0 0 7px var(--gold);animation:pdota 1.5s ease-in-out infinite}
@keyframes pdota{0%,100%{opacity:1}50%{opacity:.3}}
.p-caps{display:flex;flex-wrap:wrap;gap:1px;margin-top:.28rem;min-height:22px;font-size:.95rem;line-height:1}
.mat-adv{font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.62rem;color:var(--gold);margin-top:.18rem}
.eval-wrap{padding:.5rem .8rem;border-bottom:1px solid var(--border)}
.eval-lr{display:flex;justify-content:space-between;font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.58rem;color:var(--dim);margin-bottom:.28rem}
.eval-bar{height:5px;background:var(--panel2);border-radius:3px;overflow:hidden}
.eval-fill{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));border-radius:3px;transition:width .5s cubic-bezier(.4,0,.2,1)}
/* RIGHT PANEL */
.sect{padding:.5rem .75rem;border-bottom:1px solid var(--border)}
.sect-lbl{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-bottom:.45rem}
.diff-grid{display:grid;grid-template-columns:1fr 1fr;gap:.22rem}
.dbtn{padding:.26rem .32rem;font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.58rem;border:1px solid var(--border);background:transparent;color:var(--dim);cursor:pointer;transition:all .18s;text-align:center}
.dbtn:hover{border-color:var(--gold);color:var(--gold)}.dbtn.active{background:var(--panelAcc);border-color:var(--gold);color:var(--gold2)}
.hist-sect{flex:1;overflow:hidden;display:flex;flex-direction:column;padding:.5rem .75rem .3rem}
#move-list{flex:1;overflow-y:auto;font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.66rem;display:grid;grid-template-columns:24px 1fr 1fr;gap:2px 3px;align-content:start}
.mv-num{color:var(--dim);padding:.1rem 0}.mv-w,.mv-b{padding:.1rem .28rem;cursor:pointer;border-radius:2px;transition:background .15s;color:var(--cream)}
.mv-w:hover,.mv-b:hover{background:var(--panel2)}.mv-w.cur,.mv-b.cur{background:var(--panelAcc);color:var(--gold2)}
.ctrl-sect{padding:.48rem .75rem;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:.28rem;flex-shrink:0}
.ctrl-row{display:flex;gap:.25rem}
.cbtn{flex:1;padding:.32rem .45rem;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.72rem;letter-spacing:.06em;border:1px solid var(--border);background:transparent;color:var(--dim);cursor:pointer;transition:all .18s}
.cbtn:hover{border-color:var(--gold);color:var(--gold)}.cbtn.pri{border-color:var(--gold);color:var(--gold);background:var(--panelAcc)}
.cbtn.pri:hover{background:var(--gold);color:var(--bg)}
.chal-sect{padding:.48rem .75rem;border-top:1px solid var(--border);font-size:.7rem;line-height:1.7}
.c-habit{color:var(--cream);margin-bottom:.18rem}.c-habit span{color:var(--gold)}
.c-stat-row{display:flex;justify-content:space-between;font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.58rem;color:var(--dim)}.c-stat-val{color:var(--ivory)}
/* TUTORIAL */
#s-tuto{flex-direction:row;overflow:hidden}
.tuto-sb{width:215px;flex-shrink:0;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column}
.tuto-sb-hdr{padding:.75rem .9rem;border-bottom:1px solid var(--border);font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.7rem;letter-spacing:.18em;color:var(--gold)}
.lesson-list{flex:1;overflow-y:auto;padding:.3rem}
.litem{display:flex;align-items:center;gap:.45rem;padding:.42rem .5rem;cursor:pointer;transition:all .18s;border-left:2px solid transparent;border-radius:2px;margin-bottom:2px}
.litem:hover{background:var(--panel2)}.litem.active{background:var(--panelAcc);border-left-color:var(--gold)}
.litem.done .lnum{background:var(--gold);color:var(--bg);border-color:var(--gold)}
.lnum{width:19px;height:19px;border-radius:50%;border:1px solid var(--border);font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.56rem;display:flex;align-items:center;justify-content:center;color:var(--dim);flex-shrink:0}
.ltitle{font-size:.76rem;color:var(--cream);line-height:1.3}.litem.active .ltitle{color:var(--gold)}
.lcat-hdr{padding:.28rem .5rem .1rem;font-size:.52rem;letter-spacing:.2em;color:var(--dim);font-family:Georgia, "Times New Roman", "Palatino", serif,serif;text-transform:uppercase;margin-top:.3rem}
.tuto-main{flex:1;display:flex;overflow:hidden}
.tuto-board-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;background:var(--bg);padding:1rem}
.tuto-info{width:285px;flex-shrink:0;background:var(--panel);border-left:1px solid var(--border);display:flex;flex-direction:column;padding:1.2rem;overflow:hidden}
.tuto-cat{font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-bottom:.4rem;padding:.1rem .4rem;border:1px solid var(--border);display:inline-block;font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace}
.tuto-title{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:1.05rem;color:var(--gold2);margin-bottom:.6rem}
.step-progress{font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace,monospace;font-size:.58rem;color:var(--dim);margin-bottom:.6rem;display:flex;align-items:center;gap:.5rem}
.step-dots{display:flex;gap:.28rem}
.sdot{width:7px;height:7px;border-radius:50%;background:var(--border);transition:all .3s}
.sdot.done{background:var(--gold)}.sdot.cur{background:var(--gold2);width:10px;border-radius:2px}
.tuto-desc{font-size:.86rem;line-height:1.85;color:var(--cream);margin-bottom:.9rem;flex:1;overflow-y:auto}
.tuto-desc b{color:var(--gold2)}
.tuto-task{background:var(--panelAcc);border:1px solid color-mix(in srgb,var(--gold) 25%,transparent);padding:.55rem .75rem;font-size:.8rem;color:var(--ivory);font-style:italic;margin-bottom:.6rem;line-height:1.6}
.tuto-task::before{content:"270B ";color:var(--gold)}
.tuto-fb{height:24px;font-size:.78rem;text-align:center;font-style:italic;transition:opacity .2s}
.tuto-fb.ok{color:#5eead4}.tuto-fb.err{color:#f87171}
.tuto-nav{display:flex;justify-content:space-between;align-items:center;gap:.45rem;padding-top:.75rem;border-top:1px solid var(--border)}
.tnbtn{padding:.42rem .85rem;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.7rem;letter-spacing:.1em;border:1px solid var(--border);background:transparent;color:var(--dim);cursor:pointer;transition:all .18s}
.tnbtn:hover{border-color:var(--gold);color:var(--gold)}.tnbtn.pri{border-color:var(--gold);color:var(--gold)}
.tnbtn.pri:hover{background:var(--gold);color:var(--bg)}
.hint-btn{padding:.35rem .65rem;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.62rem;border:1px solid var(--border);background:transparent;color:var(--dim);cursor:pointer;transition:all .18s}
.hint-btn:hover{border-color:var(--gold2);color:var(--gold2)}
.tuto-back-btn{align-self:flex-start;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.62rem;letter-spacing:.1em;color:var(--dim);cursor:pointer;padding:.25rem .55rem;border:1px solid var(--border);transition:all .18s;flex-shrink:0}
.tuto-back-btn:hover{color:var(--gold);border-color:var(--gold)}
/* MODALS */
.modal-ov{position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:200;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.modal-box{background:var(--panel);border:1px solid var(--gold);padding:1.4rem 1.8rem;text-align:center;clip-path:polygon(14px 0%,100% 0%,100% calc(100% - 14px),calc(100% - 14px) 100%,0% 100%,0% 14px)}
.modal-title{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.95rem;letter-spacing:.14em;color:var(--gold2);margin-bottom:1.1rem}
.promo-row{display:flex;gap:.85rem;justify-content:center}
.promo-btn{width:70px;height:70px;font-size:2.8rem;background:var(--panel2);border:1px solid var(--border);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.promo-btn:hover{border-color:var(--gold);background:var(--panelAcc);transform:scale(1.08)}
.promo-btn.wp{color:var(--pw);text-shadow:var(--psw)}.promo-btn.bp{color:var(--pb);text-shadow:var(--psb)}
.go-title{font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:1.4rem;font-weight:700;margin-bottom:.4rem;color:var(--gold2)}
.go-sub{color:var(--cream);font-size:.9rem;margin-bottom:1.4rem;font-style:italic}
.go-btns{display:flex;gap:.75rem;justify-content:center}
.go-btn{padding:.5rem 1.3rem;font-family:Georgia, "Times New Roman", "Palatino", serif,serif;font-size:.8rem;letter-spacing:.1em;border:1px solid;cursor:pointer;transition:all .2s}
.go-btn.pri{border-color:var(--gold);background:var(--panelAcc);color:var(--gold)}.go-btn.pri:hover{background:var(--gold);color:var(--bg)}
.go-btn.sec{border-color:var(--border);color:var(--dim);background:transparent}.go-btn.sec:hover{border-color:var(--cream);color:var(--cream)}
@media(max-width:960px){.panel-l,.panel-r{width:170px}.piece{font-size:2rem}}
@media(max-width:720px){.panel-l{display:none}.panel-r{width:155px}}

/* ═══════════════════════════════════════════════════════
   THEME-SPECIFIC PIECE VISUALS — each theme is truly distinct
   ═══════════════════════════════════════════════════════ */

/* ── CLASSIC — Ivoire sculpte & Ebene polie ── */
[data-theme="classic"] .piece{font-size:inherit;transition:transform .08s,filter .15s}
[data-theme="classic"] .piece.white{
  color:#fdf4e3;
  text-shadow:0 1px 0 #b8860b, 1px 1px 2px #8b6914, 0 3px 8px rgba(0,0,0,.95), 0 0 16px rgba(0,0,0,.35);
  filter:drop-shadow(1px 3px 4px rgba(0,0,0,.85));
}
[data-theme="classic"] .piece.black{
  color:#1c0e04;
  text-shadow:0 -1px 0 rgba(201,165,53,.28), 1px 1px 0 rgba(100,60,20,.5), 0 3px 7px rgba(0,0,0,.98);
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.85));
}
[data-theme="classic"] .sq.light{background:linear-gradient(135deg,#f5deb3 0%,#e8c870 100%)}
[data-theme="classic"] .sq.dark{background:linear-gradient(135deg,#a0522d 0%,#7a3a1a 100%)}

/* ── COSMIC — Hologrammes energetiques ── */
[data-theme="cosmic"] .piece{transition:transform .08s,filter .2s;font-style:normal}
[data-theme="cosmic"] .piece.white{
  color:#00ffff;
  text-shadow:0 0 4px #00ffff, 0 0 10px rgba(0,230,255,.9), 0 0 20px rgba(0,180,255,.7), 0 0 40px rgba(0,120,255,.4);
  filter:drop-shadow(0 0 10px rgba(0,220,255,.9)) brightness(1.25);
  animation:cosmicW 2s ease-in-out infinite;
}
[data-theme="cosmic"] .piece.black{
  color:#df80ff;
  text-shadow:0 0 4px #df80ff, 0 0 10px rgba(200,80,255,.9), 0 0 20px rgba(150,40,255,.7), 0 0 40px rgba(100,0,255,.4);
  filter:drop-shadow(0 0 10px rgba(180,60,255,.9)) brightness(1.2);
  animation:cosmicB 2.3s ease-in-out infinite;
}
@keyframes cosmicW{0%,100%{filter:drop-shadow(0 0 8px rgba(0,220,255,.7)) brightness(1.1)}50%{filter:drop-shadow(0 0 18px rgba(0,240,255,1)) brightness(1.4)}}
@keyframes cosmicB{0%,100%{filter:drop-shadow(0 0 8px rgba(180,60,255,.7)) brightness(1.1)}50%{filter:drop-shadow(0 0 18px rgba(200,80,255,1)) brightness(1.35)}}
[data-theme="cosmic"] .sq.light{background:radial-gradient(circle at 40% 40%,#1e3070 0%,#0e1a50 100%)!important}
[data-theme="cosmic"] .sq.dark{background:radial-gradient(circle at 60% 60%,#070f2a 0%,#040a1a 100%)!important}
[data-theme="cosmic"] #board{box-shadow:0 0 60px rgba(0,10,40,.95),0 0 0 1px rgba(0,200,255,.2),0 0 80px rgba(60,0,255,.15)!important}

/* ── MEDIEVAL — Or forge & Fer noir ── */
[data-theme="medieval"] .piece{font-weight:bold;transition:transform .08s}
[data-theme="medieval"] .piece.white{
  color:#ffd700;
  text-shadow:0 1px 0 #8b6914, 1px 2px 2px #5a4010, -1px -1px 0 rgba(255,220,80,.4), 0 3px 10px rgba(0,0,0,.9), 0 0 14px rgba(180,120,0,.35);
  filter:drop-shadow(1px 3px 5px rgba(0,0,0,.9)) sepia(0.15);
}
[data-theme="medieval"] .piece.black{
  color:#2a1000;
  text-shadow:0 -1px 0 rgba(160,100,30,.4), 1px 1px 0 rgba(80,50,10,.6), 0 3px 7px rgba(0,0,0,.98);
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.9));
}
[data-theme="medieval"] .sq.light{background:linear-gradient(160deg,#f0d080 0%,#d4aa50 50%,#c09030 100%)}
[data-theme="medieval"] .sq.dark{background:linear-gradient(160deg,#7a4828 0%,#603818 50%,#4a2a0a 100%)}
[data-theme="medieval"] .board-outer{border:2px solid #8b6914;box-shadow:0 0 0 4px #3a2408,0 0 40px rgba(0,0,0,.9),inset 0 0 20px rgba(0,0,0,.4)!important}

/* ── NATURE — Feuille vivante & Racine sombre ── */
[data-theme="nature"] .piece{transition:transform .1s,filter .2s}
[data-theme="nature"] .piece.white{
  color:#39e07a;
  text-shadow:0 0 6px rgba(57,224,122,.8), 0 1px 0 #0d5c26, 0 2px 6px rgba(0,0,0,.85), 0 0 20px rgba(50,200,80,.3);
  filter:drop-shadow(0 0 7px rgba(57,220,100,.7)) brightness(1.1);
  animation:leafpulse 3s ease-in-out infinite;
}
[data-theme="nature"] .piece.black{
  color:#0d3a18;
  text-shadow:0 1px 0 rgba(57,224,122,.35), 0 0 10px rgba(15,80,30,.8), 0 3px 6px rgba(0,0,0,.95);
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.9));
}
@keyframes leafpulse{0%,100%{filter:drop-shadow(0 0 5px rgba(57,220,100,.6)) brightness(1.05)}50%{filter:drop-shadow(0 0 12px rgba(80,230,120,.85)) brightness(1.2)}}
[data-theme="nature"] .sq.light{background:linear-gradient(135deg,#d4f0a0 0%,#b8dc70 100%)}
[data-theme="nature"] .sq.dark{background:linear-gradient(135deg,#508040 0%,#386228 100%)}
[data-theme="nature"] .board-outer{border:2px solid #2d6a1a;box-shadow:0 0 50px rgba(0,20,0,.95),0 0 0 3px #143010,0 0 30px rgba(30,140,30,.15)!important}

/* ── ICE — Cristal de glace ── */
[data-theme="ice"] .piece{transition:transform .08s,filter .2s}
[data-theme="ice"] .piece.white{
  color:#ffffff;
  text-shadow:0 0 8px rgba(180,240,255,.95), 0 0 16px rgba(140,220,255,.8), 0 0 32px rgba(100,200,255,.5), 0 2px 4px rgba(0,40,80,.6);
  filter:drop-shadow(0 0 10px rgba(180,235,255,.85)) brightness(1.15);
  animation:icepulse 2.5s ease-in-out infinite;
}
[data-theme="ice"] .piece.black{
  color:#0a1828;
  text-shadow:0 0 6px rgba(80,160,255,.5), 1px 1px 0 rgba(120,190,255,.25), 0 3px 6px rgba(0,0,0,.9);
  filter:drop-shadow(0 0 6px rgba(60,140,255,.45));
}
@keyframes icepulse{0%,100%{filter:drop-shadow(0 0 7px rgba(180,235,255,.7)) brightness(1.1)}50%{filter:drop-shadow(0 0 16px rgba(200,245,255,.95)) brightness(1.25)}}
[data-theme="ice"] .sq.light{background:linear-gradient(160deg,#dff2ff 0%,#c0e4ff 100%)}
[data-theme="ice"] .sq.dark{background:linear-gradient(160deg,#5880a8 0%,#3a6090 100%)}
[data-theme="ice"] .board-outer{border:1px solid rgba(180,230,255,.4);box-shadow:0 0 60px rgba(0,20,60,.95),0 0 0 2px rgba(140,210,255,.25),0 0 80px rgba(80,160,255,.2)!important}
[data-theme="ice"] #board{filter:contrast(1.05) saturate(0.85)}

/* ── INFERNAL — Feu vif & Tenebres ── */
[data-theme="infernal"] .piece{transition:transform .08s}
[data-theme="infernal"] .piece.white{
  color:#ff8020;
  text-shadow:0 0 4px #ff4000, 0 0 10px rgba(255,80,0,.95), 0 0 20px rgba(255,60,0,.7), 0 0 40px rgba(200,30,0,.4), 0 2px 6px rgba(0,0,0,.8);
  filter:drop-shadow(0 0 12px rgba(255,80,0,.9));
  animation:firepulse 1.3s ease-in-out infinite;
}
[data-theme="infernal"] .piece.black{
  color:#100000;
  text-shadow:0 0 5px rgba(200,20,0,.55), 0 -1px 0 rgba(150,30,0,.4), 1px 1px 0 rgba(80,10,0,.5), 0 3px 7px rgba(0,0,0,.98);
  filter:drop-shadow(0 0 6px rgba(160,10,0,.6));
}
@keyframes firepulse{
  0%,100%{text-shadow:0 0 4px #ff4000, 0 0 10px rgba(255,80,0,.85), 0 0 20px rgba(255,50,0,.6);filter:drop-shadow(0 0 10px rgba(255,70,0,.8))}
  33%{text-shadow:0 0 6px #ff6600, 0 0 14px rgba(255,120,0,.95), 0 0 30px rgba(255,80,0,.7);filter:drop-shadow(0 0 16px rgba(255,110,0,.95))}
  66%{text-shadow:0 0 3px #ff2000, 0 0 8px rgba(255,50,0,.85), 0 0 18px rgba(200,20,0,.55);filter:drop-shadow(0 0 8px rgba(220,50,0,.75))}
}
[data-theme="infernal"] .sq.light{background:linear-gradient(135deg,#f0a080 0%,#d07050 100%)}
[data-theme="infernal"] .sq.dark{background:linear-gradient(135deg,#982820 0%,#6a1808 100%)}
[data-theme="infernal"] .board-outer{border:1px solid rgba(200,60,20,.4);box-shadow:0 0 70px rgba(50,0,0,.98),0 0 0 2px rgba(180,40,10,.3),0 0 100px rgba(200,30,0,.25)!important}

/* ── Hover & selection effects adapt to theme ── */
[data-theme="cosmic"] .sq.sel .piece,[data-theme="cosmic"] .sq:hover .piece{filter:drop-shadow(0 0 20px rgba(0,240,255,1)) brightness(1.5)!important}
[data-theme="infernal"] .sq.sel .piece,[data-theme="infernal"] .sq:hover .piece{filter:drop-shadow(0 0 20px rgba(255,100,0,1))!important;animation:none!important}
[data-theme="medieval"] .sq.sel .piece,[data-theme="medieval"] .sq:hover .piece{filter:drop-shadow(1px 2px 4px rgba(0,0,0,.9)) drop-shadow(0 0 10px rgba(255,200,50,.7)) sepia(0)!important}
[data-theme="ice"] .sq.sel .piece,[data-theme="ice"] .sq:hover .piece{filter:drop-shadow(0 0 16px rgba(200,245,255,1)) brightness(1.3)!important;animation:none!important}
[data-theme="nature"] .sq.sel .piece,[data-theme="nature"] .sq:hover .piece{filter:drop-shadow(0 0 14px rgba(80,230,120,.95)) brightness(1.25)!important;animation:none!important}

/* ── Ghost animation inherits theme piece color ── */
[data-theme="cosmic"] .piece-ghost.white{text-shadow:0 0 10px rgba(0,240,255,.9), 0 0 25px rgba(0,200,255,.7)!important}
[data-theme="infernal"] .piece-ghost.white{text-shadow:0 0 10px rgba(255,80,0,.9), 0 0 25px rgba(255,50,0,.6)!important}

/* ── PIECE ANIMATION EFFECTS ── */
.piece-ghost{will-change:transform,left,top}
/* Landing types */
.land-pawn{animation:landPawn .22s ease forwards}
.land-knight{animation:landKnight .35s cubic-bezier(.18,.89,.32,1.28) forwards}
.land-bishop{animation:landBishop .28s ease forwards}
.land-rook{animation:landRook .25s cubic-bezier(.6,-.28,.74,.05) forwards}
.land-queen{animation:landQueen .4s cubic-bezier(.34,1.56,.64,1) forwards}
.land-king{animation:landKing .3s ease forwards}
.land-capture{animation:landCapture .18s ease forwards}
@keyframes landPawn{0%{transform:scale(1.1) translateY(-6px)}60%{transform:scale(.95) translateY(2px)}100%{transform:scale(1)}}
@keyframes landKnight{0%{transform:scale(1.4) rotate(-8deg)}50%{transform:scale(.9) rotate(4deg)}75%{transform:scale(1.05) rotate(-2deg)}100%{transform:scale(1) rotate(0)}}
@keyframes landBishop{0%{transform:scale(1.15) rotate(8deg)}60%{transform:scale(.96) rotate(-2deg)}100%{transform:scale(1) rotate(0)}}
@keyframes landRook{0%{transform:scale(1.08) translateY(-4px)}40%{transform:scale(1.02) translateY(3px)}70%{transform:scale(.98) translateY(-1px)}100%{transform:scale(1)}}
@keyframes landQueen{0%{transform:scale(1.35) rotate(5deg)}40%{transform:scale(.92) rotate(-3deg)}65%{transform:scale(1.08) rotate(1deg)}85%{transform:scale(.97)}100%{transform:scale(1) rotate(0)}}
@keyframes landKing{0%{transform:scale(1.2) translateY(-8px)}50%{transform:scale(.95) translateY(3px)}75%{transform:scale(1.04)}100%{transform:scale(1)}}
@keyframes landCapture{0%{transform:scale(1.25)}50%{transform:scale(.85)}100%{transform:scale(1)}}
/* Knight arc (mid-point waypoint) */
.ghost-knight{transition:none!important}
/* Queen trail */
.queen-trail{position:fixed;pointer-events:none;z-index:98;border-radius:50%;animation:trailFade .45s ease forwards}
@keyframes trailFade{from{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(.1)}}
/* Capture burst enhanced */
.cap-burst-pawn{font-size:1rem!important;animation:burstPawn .4s ease forwards}
.cap-burst-rook{font-size:2rem!important;animation:burstRook .5s ease forwards}
.cap-burst-queen{font-size:2.5rem!important;animation:burstQueen .6s cubic-bezier(.2,0,.8,1) forwards}
.cap-burst-knight{animation:burstKnight .45s ease forwards}
@keyframes burstPawn{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(2.2) rotate(15deg)}}
@keyframes burstRook{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(3) rotate(45deg)}}
@keyframes burstQueen{0%{opacity:1;transform:scale(1)}30%{opacity:1;transform:scale(2)}100%{opacity:0;transform:scale(4) rotate(30deg)}}
@keyframes burstKnight{0%{opacity:1;transform:scale(1) rotate(0)}100%{opacity:0;transform:scale(2.5) rotate(120deg)}}
/* Check flash */
@keyframes checkShake{0%,100%{transform:translateX(0)}15%,45%,75%{transform:translateX(-6px)}30%,60%,90%{transform:translateX(6px)}}
.incheck-shake{animation:checkShake .4s ease!important}