@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap";#root{min-height:100vh}body{margin:0}:root{--bg:#f2eee6;--bg-2:#e8e0d0;--ink:#1a1916;--muted:#5c574f;--panel:#fffdf9;--line:#d6c8ad;--accent:#8a3b2f;--accent-2:#bb8a2c;--ok:#2f7d32;--error:#8f1d1d;--shadow:0 18px 44px #2d1f0a2b}*{box-sizing:border-box}body{color:var(--ink);background:radial-gradient(circle at 20% 10%, #fdf8ed 0%, transparent 38%), radial-gradient(circle at 80% 18%, #ffe9cf 0%, transparent 26%), linear-gradient(180deg, var(--bg), var(--bg-2));min-height:100vh;margin:0;font-family:Space Grotesk,Trebuchet MS,sans-serif}.app-shell{min-height:100vh;position:relative;overflow:hidden}.grain{pointer-events:none;opacity:.13;background-image:radial-gradient(#7d6f5b .55px,#0000 .55px);background-size:4px 4px;position:absolute;inset:0}.board-page{z-index:1;max-width:1120px;margin:0 auto;padding:34px 20px 28px;position:relative}.topbar h1{letter-spacing:.05em;text-transform:uppercase;margin:0;font-size:clamp(1.5rem,2.5vw,2.3rem)}.topbar{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.top-left{display:block}.top-right{margin-left:auto}.topbar p{color:var(--muted);margin:6px 0 0;font-size:.92rem}.auth-controls{margin-top:2px}.auth-loading{color:var(--muted);text-align:right;margin:8px 0 0;font-size:.86rem}.user-chip-wrap{position:relative}.user-chip{color:#3d2c1b;cursor:pointer;background:linear-gradient(145deg,#fff7ea,#f4dfba);border:2px solid #ebd8bb;border-radius:999px;place-items:center;width:42px;height:42px;font:700 .92rem/1 Space Grotesk,Trebuchet MS,sans-serif;display:grid;box-shadow:0 8px 18px #2a1c092e}.user-chip img{border-radius:inherit;object-fit:cover;width:100%;height:100%}.user-menu{border:1px solid var(--line);z-index:5;background:#fffdf8;border-radius:12px;min-width:128px;padding:8px;position:absolute;top:calc(100% + 10px);right:0;box-shadow:0 12px 28px #21140738}.user-menu .btn{width:100%;padding:9px 12px}.user-menu-item{color:#362617;text-align:left;cursor:pointer;background:#fff8e9;border:1px solid #e6d5bb;border-radius:10px;width:100%;margin-bottom:8px;padding:9px 12px;font:600 .86rem/1 Space Grotesk,Trebuchet MS,sans-serif}.user-menu-item:hover{background:#f8e6c5}.history-page{border:1px solid var(--line);box-shadow:var(--shadow);background:radial-gradient(circle at 90% 8%,#d88f261f,#0000 36%),#fffaf2;border-radius:22px;gap:14px;margin-top:24px;padding:16px;display:grid}.history-toolbar{justify-content:space-between;align-items:center;gap:12px;display:flex}.history-toolbar h2{text-transform:uppercase;margin:0}.history-actions{gap:8px;display:flex}.history-actions .btn{margin-top:0}.history-filters{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.history-filters label{color:#5c5243;text-transform:uppercase;letter-spacing:.03em;gap:6px;font-size:.84rem;display:grid}.history-filters select,.history-filters input{color:#2f2518;background:#fffdf7;border:1px solid #dfccaf;border-radius:10px;padding:10px;font:500 .9rem/1 Space Grotesk,Trebuchet MS,sans-serif}.search-field{grid-column:span 1}.history-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:12px;min-height:460px;display:grid}.history-list-panel,.history-detail-panel{background:#fffdf7;border:1px solid #e5d4ba;border-radius:14px;padding:12px}.history-detail-panel{gap:10px;display:grid}.history-detail-panel h3{text-transform:uppercase;margin:0;font-size:1.02rem}.history-summary{color:#665a4a;justify-content:space-between;align-items:center;gap:8px;font-size:.84rem;display:flex}.move-lines{background:#fff8ee;border:1px solid #ecdcc5;border-radius:12px;gap:6px;max-height:260px;padding:10px;display:grid;overflow:auto}.move-line{color:#3f3327;font-family:IBM Plex Mono,Consolas,monospace;font-size:.83rem}.setup-card{border:1px solid var(--line);box-shadow:var(--shadow);background:radial-gradient(circle at 88% 12%,#dcad5426,#0000 35%),linear-gradient(145deg,#fffaf0,#fffef9);border-radius:22px;margin-top:26px;padding:26px;animation:.45s rise}.mode-card{text-align:left}.home-stage{min-height:72vh;box-shadow:var(--shadow);background:radial-gradient(circle at 16% 12%,#d098483d,#0000 34%),radial-gradient(circle at 84% 86%,#6e36282e,#0000 38%),linear-gradient(140deg,#fffcf5bd,#f4ebdccc);border:1px solid #a084563d;border-radius:26px;place-items:center;margin-top:24px;display:grid;position:relative;overflow:hidden}.home-stage:before{content:"";opacity:.24;z-index:0;background-color:#0000;background-image:linear-gradient(90deg,#6a533414 1px,#0000 1px),linear-gradient(#6a533414 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:52px 52px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle,#000 36%,#0000 100%);mask-image:radial-gradient(circle,#000 36%,#0000 100%)}.home-card{z-index:2;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-color:#916f4273;width:min(560px,100%);margin-top:0;position:relative;box-shadow:0 30px 60px #311e0a38}.mode-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px;display:grid}.mode-actions-vertical{grid-template-columns:1fr}.mode-actions-vertical .btn{border-radius:16px;width:100%;min-height:60px;margin-top:0;font-size:1rem}.chess-floaters{pointer-events:none;z-index:1;position:absolute;inset:0}.piece{opacity:.2;filter:blur(.2px);text-shadow:0 8px 24px #3a291433;font-size:clamp(2rem,4vw,3.4rem);animation:15s ease-in-out infinite drift;position:absolute}.p1{transform:translate(calc(var(--tilt-x,0px) * -.7), calc(var(--tilt-y,0px) * -.7));animation-duration:14s;top:8%;left:7%}.p2{transform:translate(calc(var(--tilt-x,0px) * .8), calc(var(--tilt-y,0px) * -.8));animation-duration:17s;animation-delay:.8s;top:16%;right:10%}.p3{transform:translate(calc(var(--tilt-x,0px) * -.6), calc(var(--tilt-y,0px) * .9));animation-duration:16s;animation-delay:1.2s;bottom:18%;left:14%}.p4{transform:translate(calc(var(--tilt-x,0px) * .6), calc(var(--tilt-y,0px) * .7));animation-duration:13s;animation-delay:.5s;bottom:10%;right:7%}.p5{transform:translate(calc(var(--tilt-x,0px) * -.9), calc(var(--tilt-y,0px) * .35));animation-duration:18s;animation-delay:1.4s;top:44%;left:2%}.p6{transform:translate(calc(var(--tilt-x,0px) * .9), calc(var(--tilt-y,0px) * -.35));animation-duration:15s;animation-delay:1.1s;top:52%;right:2%}.setup-card h2{margin:0;font-size:1.45rem}.setup-card p{color:var(--muted);margin:8px 0 0}.setup-subtitle{letter-spacing:.06em;text-transform:uppercase;color:#5f5445;margin:16px 0 8px;font-size:.92rem}.selection-hint{color:#6a5f51;margin-top:8px;font-size:.85rem}.setup-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px;display:grid}.btn{cursor:pointer;border:0;border-radius:14px;padding:13px 16px;font:600 .95rem/1 Space Grotesk,Trebuchet MS,sans-serif;transition:transform .16s,box-shadow .16s,opacity .16s}.btn:disabled{opacity:.55;cursor:not-allowed}.btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 20px #140e0529}.btn.is-selected{box-shadow:0 0 0 3px #d88f2673}.btn-light{color:#2e2416;background:#f3dfb8}.btn-dark{color:#fff6e7;background:#2f2518}.difficulty-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:6px;display:grid}.time-control-actions{grid-template-columns:repeat(5,minmax(0,1fr))}.btn-difficulty{color:#342a1d;background:#efe4d0;border:1px solid #d9c7aa}.btn-start{color:#fff;background:linear-gradient(120deg,#5f2a21,#aa7c22);width:100%;margin-top:16px}.btn-reset{background:linear-gradient(120deg, var(--accent), var(--accent-2));color:#fff;width:100%;margin-top:14px}.game-grid{grid-template-columns:minmax(0,1fr) 330px;align-items:start;gap:18px;margin-top:24px;animation:.45s rise;display:grid}.board-wrap{border:1px solid var(--line);box-shadow:var(--shadow);background:#fffbf2e6;border-radius:22px;padding:16px}.board-wrap>div{width:100%;max-width:760px;margin:0 auto}.panel{border:1px solid var(--line);background:radial-gradient(circle at 95% 8%, #d88f2614, transparent 36%), var(--panel);box-shadow:var(--shadow);border-radius:20px;padding:16px}.panel h2{margin:0 0 10px;font-size:1.12rem}.row{border-bottom:1px dashed #e7d9c3;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;display:flex}.row span{color:var(--muted);font-size:.95rem}.row strong{text-align:right;font-size:.95rem}.clock-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px;display:grid}.clock-box{background:#f8efe0;border:1px solid #e7d6bc;border-radius:12px;gap:4px;padding:10px;display:grid}.clock-box span{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem}.clock-box strong{color:#2f2518;font-family:IBM Plex Mono,Consolas,monospace;font-size:1.14rem}.clock-box.is-active{border-color:#d88f26;box-shadow:0 0 0 2px #d88f263d}.fen-block{gap:8px;margin-top:12px;display:grid}.fen-block span{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:.8rem}.fen-block code{color:#31261b;word-break:break-word;background:#f8efe0;border:1px solid #e7d6bc;border-radius:10px;padding:10px;font-family:IBM Plex Mono,Consolas,monospace;font-size:.76rem;line-height:1.35}.error-box{color:var(--error);background:#ffe5e5;border:1px solid #f7b4b4;border-radius:10px;margin-top:12px;padding:10px;font-size:.88rem}.hint-line{color:#544c42;margin-top:14px;font-size:.9rem}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:30;background:#110c0885;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.auth-backdrop{z-index:34;background:#0b080594}.auth-modal{text-align:center;background:radial-gradient(circle at 50% -30%,#bb8a2c42,#0000 44%),#fff8ec;width:min(480px,100%)}.auth-login-wrap{place-items:center;margin-top:14px;display:grid}.result-modal{background:#fff8ec;border:1px solid #ecdac1;border-radius:20px;width:min(420px,100%);padding:20px;animation:.2s rise;box-shadow:0 24px 60px #110b0559}.history-empty{color:#5a4f3f;margin:10px 0 2px}.history-list{flex-direction:column;gap:10px;display:flex}.history-card{text-align:left;cursor:pointer;background:#fffdf8;border:1px solid #ebd7ba;border-radius:12px;gap:10px;width:100%;padding:12px;display:grid}.history-card.is-active{border-color:#d88f26;box-shadow:0 0 0 2px #d88f263d}.history-card:hover{background:#fff8eb}.history-topline{color:#665a4a;justify-content:space-between;align-items:center;gap:8px;font-size:.82rem;display:flex}.result-pill{text-transform:uppercase;letter-spacing:.04em;border-radius:999px;padding:4px 10px;font-size:.76rem;font-weight:700}.result-win{color:#1f6f24;background:#e8f7e8}.result-loss{color:#8f1d1d;background:#ffe5e5}.result-draw{color:#8a5a16;background:#fff3db}.result-aborted{color:#5e554b;background:#eceae6}.history-meta{color:#554b3d;gap:6px;font-size:.88rem;display:grid}.result-modal h2{text-transform:uppercase;margin:0;font-size:1.5rem}.result-modal p{color:#534a40;margin:10px 0 0}.modal-actions{gap:10px;margin-top:16px;display:flex}.modal-actions .btn{width:100%;margin-top:0}.corner-orb{filter:blur(1px);background:radial-gradient(circle at 30% 30%,#d88f2673,#d88f2600);border-radius:999px;width:280px;height:280px;position:absolute;top:-80px;right:-90px}.orb-two{background:radial-gradient(circle at 30% 30%,#ad2e2452,#ad2e2400);width:220px;height:220px;top:auto;bottom:-80px;left:-80px}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes drift{0%{transform:translateY(0)translate(0)rotate(0)}50%{transform:translateY(-14px)translate(8px)rotate(4deg)}to{transform:translateY(0)translate(0)rotate(0)}}@media (width<=960px){.game-grid{grid-template-columns:1fr}.panel{width:100%}}@media (width<=680px){.board-page{padding:20px 14px 18px}.topbar{flex-direction:column;align-items:stretch}.top-right{align-self:flex-end}.mode-actions{grid-template-columns:1fr}.home-stage{border-radius:20px;min-height:64vh}.auth-controls{align-self:flex-end}.setup-actions,.difficulty-actions{grid-template-columns:1fr}.time-control-actions{grid-template-columns:1fr 1fr}.board-wrap{padding:10px}.history-filters{grid-template-columns:1fr 1fr}.history-layout{grid-template-columns:1fr;min-height:0}.topbar p,.hint-line,.row span,.row strong{font-size:.88rem}}