:root{ color-scheme:dark; --bg:#030d25;--panel:#081a36;--panel2:#0b2447;--line:#173b66;--line2:#245584; --text:#eff7ff;--muted:#8fa9c7;--soft:#c9d9ec;--blue:#187fe0;--cyan:#28caff; --gold:#eabd73;--red:#ff7b83;--white:#f5ead6;--black:#061832; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; font-synthesis:none;text-rendering:optimizeLegibility } *{box-sizing:border-box} html{min-height:100%;background:var(--bg);scroll-behavior:smooth} body{margin:0;min-height:100vh;color:var(--text);font-size:15px;line-height:1.5;background:radial-gradient(ellipse at 76% 2%,rgba(0,119,255,.25),transparent 37%),radial-gradient(ellipse at 4% 28%,rgba(0,194,255,.09),transparent 34%),linear-gradient(180deg,#030b21,#06152d 58%,#020a1d)} button,input{font:inherit}button{color:inherit} .site-head{height:72px;border-bottom:1px solid #76baff20;display:flex;align-items:center;justify-content:space-between;padding:0 max(20px,calc((100vw - 1400px)/2));background:rgba(3,12,32,.88);backdrop-filter:blur(12px);position:relative;z-index:3} .brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none} .brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(145deg,#f7e6c8,#c9a66c);color:#061631;font-size:29px;line-height:1;box-shadow:0 6px 24px #25bfff35,inset 0 1px 0 #fff} .brand-copy{display:grid;line-height:1.1;gap:5px}.brand-copy strong{font-size:16px;letter-spacing:.15em}.brand-copy strong span{color:var(--cyan)}.brand-copy small{font-size:8px;letter-spacing:.19em;color:#91abc9;font-weight:800} .head-note{font-size:9px;font-weight:800;letter-spacing:.16em;color:#c1d4e8;display:flex;align-items:center;gap:9px} .live-dot,.turn-dot{width:8px;height:8px;border-radius:50%;background:#54dbad;box-shadow:0 0 0 4px #54dbad20;display:inline-block;flex:none} .brand-hero{width:min(1400px,100%);margin:18px auto 0;padding:0 22px;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,390px);align-items:center;gap:24px} .hero-copy{padding:13px 0}.eyebrow{margin:0 0 7px;color:var(--cyan);font-size:9px;font-weight:850;letter-spacing:.2em}.hero-copy h2{font-size:clamp(26px,3.4vw,39px);line-height:1.05;letter-spacing:-.045em;margin:0;font-weight:850}.hero-copy h2 span{color:var(--cyan)}.hero-copy>p:last-child{margin:10px 0 0;color:#a6bdd7;font-size:12px;max-width:580px} .brand-hero img{width:100%;height:180px;object-fit:cover;object-position:center 46%;border:1px solid #3c76a65c;border-radius:15px;box-shadow:0 12px 38px #0008,0 0 35px #087bcc23} .layout{width:min(1400px,100%);margin:0 auto;padding:20px 22px 42px;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(330px,.88fr);gap:25px;align-items:start} .game-column{min-width:0}.game-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin:0 0 15px}.heading-copy{min-width:0}.game-heading .eyebrow{margin-bottom:4px}.game-heading h1{margin:0;font-size:clamp(24px,2.6vw,34px);line-height:1.12;letter-spacing:-.045em;font-weight:850}.game-heading h1 span{color:var(--cyan)}.intro{margin:6px 0 0;color:#9eb5cf;font-size:11px;max-width:510px} .turn-chip{flex:none;display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid #2d587d;border-radius:999px;background:linear-gradient(140deg,#0d2a4d,#071933);color:#d9eafc;font-size:10px;font-weight:750;white-space:nowrap;box-shadow:0 4px 17px #0003}.turn-chip.thinking .turn-dot{background:#f4bd5e;box-shadow:0 0 0 4px #f4bd5e20;animation:pulse 1.1s infinite}.turn-chip.warning .turn-dot{background:#ff737d;box-shadow:0 0 0 4px #ff737d20} @keyframes pulse{50%{opacity:.4}} .player-strip{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:linear-gradient(100deg,#0a1e3b,#0a2343);border:1px solid #1b406b;border-radius:10px;box-shadow:0 7px 22px #0003}.player-top{border-bottom-left-radius:5px;border-bottom-right-radius:5px}.player-bottom{border-top-left-radius:5px;border-top-right-radius:5px}.player-ident{display:flex;align-items:center;gap:10px}.player-ident>span:last-child{display:grid;gap:1px}.player-ident b{font-size:10px;letter-spacing:.15em}.player-ident small{color:#93abc7;font-size:9px}.player-disc{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;font-size:22px;line-height:1}.black-disc{background:linear-gradient(145deg,#133a69,#061329);color:#07152a;-webkit-text-stroke:.8px #83c9ee;box-shadow:inset 0 1px 4px #78ceff70}.white-disc{background:linear-gradient(145deg,#fff3d9,#d6b981);color:#fff9ea;-webkit-text-stroke:.6px #6a4c28;box-shadow:inset 0 1px 4px #fff}.player-points{display:grid;text-align:right;gap:1px}.player-points small{font-size:8px;letter-spacing:.14em;color:#809cba;font-weight:800}.player-points strong{font:800 18px ui-monospace,SFMono-Regular,Consolas,monospace;color:#6bdcff} .board-shell{position:relative;margin:0;overflow:hidden;border:1px solid #1b568a;border-top:0;border-bottom:0;background:radial-gradient(ellipse at 52% 62%,#0b4c80 0%,#061d42 43%,#030d25 78%);box-shadow:inset 0 0 52px #007cc044,0 20px 44px #0008;min-height:520px;contain:layout paint} .scene-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 70%,#00aaff18,transparent 58%),linear-gradient(180deg,#0a2d5500,#020c23a6)} .scene3d{display:block;width:100%;height:610px;position:relative;z-index:1;touch-action:none;outline:none;cursor:grab;user-select:none;-webkit-user-select:none}.scene3d:active{cursor:grabbing} .scene-status{position:absolute;z-index:2;left:50%;bottom:9px;transform:translateX(-50%);padding:5px 9px;border-radius:99px;background:#030d25b8;border:1px solid #1b578366;color:#8acfeb;white-space:nowrap;font-size:8px;font-weight:800;letter-spacing:.13em;pointer-events:none;backdrop-filter:blur(5px)} .webgl-notice{position:absolute;z-index:4;inset:12px;display:grid;place-items:center;text-align:center;padding:28px;border:1px solid #2a5c83;border-radius:14px;background:#061630;color:#c4d8ed;font-size:13px}.webgl-unavailable .scene3d{opacity:0}.webgl-fallback .scene3d{opacity:1;cursor:pointer} .result-overlay{position:absolute;z-index:5;inset:0;display:grid;place-items:center;background:#020916b8;backdrop-filter:blur(5px);padding:18px}.result-overlay[hidden]{display:none}.result-card{width:min(340px,100%);padding:24px;border:1px solid #3c78a9;border-radius:17px;background:linear-gradient(150deg,#102c4d,#07162c);box-shadow:0 20px 70px #0009;text-align:center}.result-kicker{color:var(--cyan);font-size:9px;font-weight:850;letter-spacing:.2em}.result-card h2{margin:6px 0;font-size:26px}.result-card p{color:#a8bfd9;font-size:12px;margin:0 0 16px} .view-actions{display:flex;align-items:center;gap:8px;margin:9px 1px 13px}.view-button{display:flex;align-items:center;gap:6px;border:1px solid #28547d;border-radius:8px;background:#0a2140;color:#bcd3ea;padding:7px 10px;font-size:10px;font-weight:750;cursor:pointer}.view-button:hover,.view-button.active{border-color:#2bcaff;color:#f2fbff;background:#0d3454}.view-hint{margin-left:auto;color:#7894b4;font-size:9px} .dash-status-row{display:flex;justify-content:space-between;gap:10px;margin:11px 2px 8px;color:#7995b2;font-size:8px;letter-spacing:.1em;font-weight:800}.dash-status-row b{color:#5ce0ba;margin-left:4px}.taken-row{display:flex;justify-content:space-between;gap:12px;padding:7px 3px 11px}.taken-block{min-width:0}.taken-right{text-align:right}.taken-label{font-size:8px;letter-spacing:.13em;color:#7f9ab9;font-weight:850}.taken-pieces{display:flex;gap:5px;flex-wrap:wrap;min-height:26px;margin-top:4px}.taken-right .taken-pieces{justify-content:flex-end}.taken-piece{display:inline-flex;align-items:center;gap:2px;color:#e8f1fd;font-size:16px;line-height:1}.taken-piece.taken-white{color:#fff2d8;-webkit-text-stroke:.5px #795a2b}.taken-piece.taken-black{color:#0b1c34;-webkit-text-stroke:.5px #70cfff}.taken-piece small{font:700 8px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--cyan)}.empty-taken{font-size:11px;color:#607995} .game-actions{display:flex;gap:9px}.button{border-radius:9px;border:1px solid #2b5b82;padding:10px 14px;font-size:11px;font-weight:800;letter-spacing:.02em;cursor:pointer;transition:transform .12s ease,background .12s ease,border-color .12s ease}.button:hover:not(:disabled){transform:translateY(-1px);border-color:#61d7ff}.button:disabled{opacity:.4;cursor:not-allowed}.button.primary{background:linear-gradient(100deg,#087cde,#08a9d7);border-color:#159bdb;color:#fff;box-shadow:0 6px 19px #1682dd35}.button.secondary{background:#0a1e3b;color:#dceafa}.game-actions .button{flex:1}.game-footnote{min-height:20px;margin:9px 2px 0;color:#8da7c4;font-size:10px} .side-column{display:grid;gap:13px;min-width:0}.side-card{border:1px solid #1a3e68;background:linear-gradient(150deg,#0d2342,#07162e);border-radius:13px;padding:16px;box-shadow:0 10px 30px #0004}.card-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:13px}.card-heading .eyebrow{margin-bottom:3px}.card-heading h2{font-size:17px;letter-spacing:-.025em;margin:0}.card-icon{width:32px;height:32px;border:1px solid #28537a;background:#103155;display:grid;place-items:center;border-radius:9px;color:var(--cyan)}.side-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}.choice{height:45px;display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid #2a5075;border-radius:9px;background:#081a33;color:#b6c9de;font-size:11px;font-weight:750;cursor:pointer}.choice.active{border-color:#2aadeb;background:#10365b;color:#fff;box-shadow:inset 0 0 0 1px #299ce955}.choice-piece{font-family:"Segoe UI Symbol","Noto Sans Symbols 2",serif;font-size:22px}.visual-mode-control{display:grid;gap:7px;margin:0 0 15px;padding:11px;border:1px solid #1d4771;border-radius:10px;background:linear-gradient(145deg,#0a1c37,#0a2746)}.visual-mode-control label{font-size:10px;font-weight:800;color:#d9e9f8}.visual-select{width:100%;min-height:40px;padding:0 10px;border:1px solid #2b6390;border-radius:8px;background:#06162e;color:#eaf6ff;font:700 10px system-ui,sans-serif;outline:none}.visual-select:focus{border-color:#39d0ff;box-shadow:0 0 0 3px #20bfff22}.visual-mode-control .hint-text{margin:0;line-height:1.45}.difficulty-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;font-weight:750}.difficulty-heading strong{font:700 10px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--cyan)}input[type=range]{width:100%;margin:12px 0 2px;accent-color:#29bdf5;cursor:pointer}.range-ends{display:flex;justify-content:space-between;color:#7f96b1;font-size:8px}.hint-text{margin:8px 0 0;color:#91a8c4;font-size:9px}.rule-count,.move-count{font:700 8px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.12em;color:#91abc8;border:1px solid #204469;padding:6px 8px;border-radius:6px}.rule-intro{border-left:2px solid var(--cyan);padding:2px 0 2px 11px;margin:-2px 0 12px;color:#b1c4d9;font-size:10px}.rule-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}.rule-list li{display:grid;grid-template-columns:25px 1fr;gap:8px;align-items:start}.rule-number{padding-top:1px;color:var(--cyan);font:700 9px ui-monospace,SFMono-Regular,Consolas,monospace}.rule-list b{font-size:10px;color:#eff6ff}.rule-list p{margin:3px 0 0;color:#9db1c8;font-size:9px;line-height:1.48}.piece-key{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;border-top:1px solid #193a60;margin-top:12px;padding-top:10px}.piece-key>div{display:grid;justify-items:center;gap:1px}.piece-key span{font-family:"Segoe UI Symbol","Noto Sans Symbols 2",serif;font-size:21px;color:#e9f1fb}.piece-key b{font:800 11px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--cyan)}.piece-key small{font-size:8px;color:#8fa7c4}.history-card{min-height:130px}.move-log{max-height:185px;overflow:auto}.log-empty{margin:0;color:#8097b3;font-size:10px}.move-row{display:grid;grid-template-columns:27px 1fr 1fr;gap:8px;padding:5px 0;border-bottom:1px solid #20395980;font:10px ui-monospace,SFMono-Regular,Consolas,monospace}.move-row:last-child{border-bottom:0}.move-index{color:#718ba7}.move-row span:not(.move-index){color:#dce9f7} .site-foot{width:min(1400px,100%);margin:0 auto;padding:0 22px 24px;display:flex;justify-content:space-between;gap:12px;color:#7087a2;font-size:8px;letter-spacing:.08em}.site-foot i{color:var(--cyan);font-style:normal;margin:0 5px} @media(min-width:1050px){.rules-card{position:sticky;top:14px}.side-column{align-self:stretch}} @media(max-width:1049px){.layout{grid-template-columns:minmax(0,1fr);max-width:800px;gap:20px}.game-column{max-width:760px;margin:0 auto;width:100%}.side-column{grid-template-columns:1fr 1fr;align-items:start}.rules-card{grid-row:span 2}.site-foot{max-width:800px}.brand-hero{max-width:800px}} @media(max-width:650px){.site-head{height:63px;padding:0 14px}.head-note{font-size:7px;letter-spacing:.07em}.brand-mark{width:37px;height:37px;font-size:25px}.brand-copy strong{font-size:13px}.brand-copy small{font-size:7px}.brand-hero{padding:0 13px;margin-top:12px;grid-template-columns:minmax(0,1fr) 128px;gap:10px}.hero-copy{padding:3px 0}.hero-copy h2{font-size:23px}.hero-copy>p:last-child{font-size:9px;line-height:1.35}.brand-hero img{height:94px;border-radius:9px}.layout{padding:18px 12px 30px;gap:17px}.game-heading{display:block;margin-bottom:12px}.game-heading h1{font-size:27px}.turn-chip{display:inline-flex;margin-top:10px}.player-strip{padding:8px 10px}.board-shell{min-height:0}.scene3d{height:clamp(370px,112vw,470px)}.scene-status{font-size:7px;letter-spacing:.08em}.view-actions{flex-wrap:wrap}.view-hint{width:100%;margin-left:2px}.side-column{grid-template-columns:1fr}.rules-card{grid-row:auto}.side-card{padding:14px}.taken-row{margin:5px 0 8px}.site-foot{padding:0 13px 20px;display:grid;gap:4px}.game-actions{gap:8px}.button{padding:10px 11px}.dash-status-row{font-size:7px}} @media(max-width:380px){.head-note{display:none}.brand-hero{grid-template-columns:minmax(0,1fr) 104px}.brand-hero img{height:86px}.layout{padding-left:9px;padding-right:9px}.scene3d{height:390px}.scene-status{max-width:94%;overflow:hidden;text-overflow:ellipsis}.player-points small{font-size:7px}.view-button{min-height:38px}.button,.choice,.visual-select{min-height:44px}} @media(hover:none) and (pointer:coarse){.view-button,.button,.choice,.visual-select{min-height:44px}.visual-select{font-size:12px}.scene3d{touch-action:none}.side-card{box-shadow:0 6px 18px #0003}} @media(prefers-reduced-motion:reduce){.scene3d{cursor:pointer}} @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}} /* Original ChessNew theme skins. Board geometry is shared; these variables recolour the UI and renderer without downloading third-party artwork. */ .theme-control{display:grid;gap:7px;margin:0 0 15px;padding:11px;border:1px solid var(--line2);border-radius:10px;background:linear-gradient(145deg,var(--panel),var(--panel2))} .theme-control>label{font-size:10px;font-weight:800;color:var(--text)} .theme-origin{color:var(--muted);font-size:8px;line-height:1.45} body[data-theme="ivory"]{--bg:#20180e;--panel:#2b2116;--panel2:#382a1b;--line:#5b4328;--line2:#896238;--text:#fff4df;--muted:#c5ad8b;--soft:#ead7b7;--blue:#a86c27;--cyan:#e6b65e;--gold:#f0cd8b;--white:#fff1d4;--black:#20170e;background:radial-gradient(ellipse at 76% 2%,#96652b55,transparent 38%),radial-gradient(ellipse at 4% 28%,#c38c3c18,transparent 34%),linear-gradient(180deg,#1b140c,#2b2116 58%,#120d08)} body[data-theme="ember"]{--bg:#170b0e;--panel:#241014;--panel2:#35151a;--line:#54232b;--line2:#8b3b37;--text:#fff0e8;--muted:#c6a09a;--soft:#efd0c5;--blue:#bb4e22;--cyan:#ff7837;--gold:#ffc06e;--white:#fff0d8;--black:#18090d;background:radial-gradient(ellipse at 76% 2%,#b93c1d55,transparent 38%),radial-gradient(ellipse at 4% 28%,#e05a281c,transparent 34%),linear-gradient(180deg,#13080c,#261015 58%,#0b0609)} body[data-theme="verdant"]{--bg:#081a13;--panel:#10251b;--panel2:#183326;--line:#24523a;--line2:#38764f;--text:#eff9e9;--muted:#9cb99f;--soft:#d0e5ca;--blue:#287f50;--cyan:#65d58d;--gold:#d7bb70;--white:#f2f1d8;--black:#071b14;background:radial-gradient(ellipse at 76% 2%,#1a744944,transparent 38%),radial-gradient(ellipse at 4% 28%,#60b06d1c,transparent 34%),linear-gradient(180deg,#07160f,#10251b 58%,#050e09)} body[data-theme="violet"]{--bg:#100a20;--panel:#1b1230;--panel2:#281943;--line:#3c2a60;--line2:#654397;--text:#f7f0ff;--muted:#b6a5d0;--soft:#e3d6f5;--blue:#7544c5;--cyan:#b28aff;--gold:#e4b9ff;--white:#f3eaff;--black:#0d071a;background:radial-gradient(ellipse at 76% 2%,#6c35ba55,transparent 38%),radial-gradient(ellipse at 4% 28%,#a35be522,transparent 34%),linear-gradient(180deg,#0d081a,#1b1230 58%,#080510)} body[data-theme="ivory"] .site-head,body[data-theme="ember"] .site-head,body[data-theme="verdant"] .site-head,body[data-theme="violet"] .site-head{background:color-mix(in srgb,var(--bg) 88%,transparent);border-bottom-color:var(--line)} body[data-theme="ivory"] .player-strip,body[data-theme="ivory"] .side-card,body[data-theme="ivory"] .visual-mode-control,body[data-theme="ivory"] .theme-control,body[data-theme="ivory"] .turn-chip,body[data-theme="ivory"] .result-card,body[data-theme="ivory"] .button.secondary,body[data-theme="ivory"] .view-button,body[data-theme="ivory"] .visual-select{background:linear-gradient(145deg,#382a1b,#21180f);border-color:#795631} body[data-theme="ember"] .player-strip,body[data-theme="ember"] .side-card,body[data-theme="ember"] .visual-mode-control,body[data-theme="ember"] .theme-control,body[data-theme="ember"] .turn-chip,body[data-theme="ember"] .result-card,body[data-theme="ember"] .button.secondary,body[data-theme="ember"] .view-button,body[data-theme="ember"] .visual-select{background:linear-gradient(145deg,#35161b,#1b0c10);border-color:#703038} body[data-theme="verdant"] .player-strip,body[data-theme="verdant"] .side-card,body[data-theme="verdant"] .visual-mode-control,body[data-theme="verdant"] .theme-control,body[data-theme="verdant"] .turn-chip,body[data-theme="verdant"] .result-card,body[data-theme="verdant"] .button.secondary,body[data-theme="verdant"] .view-button,body[data-theme="verdant"] .visual-select{background:linear-gradient(145deg,#183326,#0c1c14);border-color:#326548} body[data-theme="violet"] .player-strip,body[data-theme="violet"] .side-card,body[data-theme="violet"] .visual-mode-control,body[data-theme="violet"] .theme-control,body[data-theme="violet"] .turn-chip,body[data-theme="violet"] .result-card,body[data-theme="violet"] .button.secondary,body[data-theme="violet"] .view-button,body[data-theme="violet"] .visual-select{background:linear-gradient(145deg,#281943,#140d25);border-color:#574078} body[data-theme="ivory"] .board-shell{background:radial-gradient(ellipse at 52% 62%,#9b7447 0%,#4b301d 46%,#20160d 80%);border-color:#8b6438} body[data-theme="ember"] .board-shell{background:radial-gradient(ellipse at 52% 62%,#83341f 0%,#3e1519 46%,#17090d 80%);border-color:#93402f} body[data-theme="verdant"] .board-shell{background:radial-gradient(ellipse at 52% 62%,#276744 0%,#123c29 46%,#071a12 80%);border-color:#387b50} body[data-theme="violet"] .board-shell{background:radial-gradient(ellipse at 52% 62%,#5d3489 0%,#2a174b 46%,#10091e 80%);border-color:#6a4a9b} body[data-theme="ivory"] .scene-glow{background:radial-gradient(ellipse at 50% 70%,#ffd58d20,transparent 58%),linear-gradient(180deg,#fff0d000,#100a04a6)} body[data-theme="ember"] .scene-glow{background:radial-gradient(ellipse at 50% 70%,#ff5a2525,transparent 58%),linear-gradient(180deg,#ff5a2500,#100406b0)} body[data-theme="verdant"] .scene-glow{background:radial-gradient(ellipse at 50% 70%,#4de18c20,transparent 58%),linear-gradient(180deg,#0a442000,#04130ba6)} body[data-theme="violet"] .scene-glow{background:radial-gradient(ellipse at 50% 70%,#b777ff25,transparent 58%),linear-gradient(180deg,#5a2c8700,#090515b0)} body[data-theme="ivory"] .brand-mark{background:linear-gradient(145deg,#fff1d3,#c79a52);color:#2b1b0b} body[data-theme="ember"] .brand-mark{background:linear-gradient(145deg,#ffce8a,#b84e25);color:#260b0c} body[data-theme="verdant"] .brand-mark{background:linear-gradient(145deg,#e4e7ba,#6ba66a);color:#092017} body[data-theme="violet"] .brand-mark{background:linear-gradient(145deg,#f2dfff,#986bd8);color:#1c1032} body[data-theme="ivory"] .button.primary{background:linear-gradient(100deg,#9a5c20,#d8a34c);border-color:#e1b968} body[data-theme="ember"] .button.primary{background:linear-gradient(100deg,#a72d20,#ed6c25);border-color:#f38a3c} body[data-theme="verdant"] .button.primary{background:linear-gradient(100deg,#17633b,#3cae69);border-color:#65d58d} body[data-theme="violet"] .button.primary{background:linear-gradient(100deg,#5931a6,#9a62de);border-color:#b28aff} body[data-theme="ivory"] .live-dot,body[data-theme="ivory"] .turn-dot{background:#7a9d44;box-shadow:0 0 0 4px #7a9d4420} body[data-theme="ember"] .live-dot,body[data-theme="ember"] .turn-dot{background:#ff7837;box-shadow:0 0 0 4px #ff783720} body[data-theme="verdant"] .live-dot,body[data-theme="verdant"] .turn-dot{background:#65d58d;box-shadow:0 0 0 4px #65d58d20} body[data-theme="violet"] .live-dot,body[data-theme="violet"] .turn-dot{background:#b28aff;box-shadow:0 0 0 4px #b28aff20} .offline-banner{width:min(1400px,calc(100% - 44px));margin:18px auto 0;padding:17px 20px;display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--line2);border-radius:14px;background:linear-gradient(120deg,var(--panel),var(--panel2));box-shadow:0 12px 30px #0003} .offline-copy{min-width:0}.offline-copy .eyebrow{margin-bottom:4px}.offline-copy h2{margin:0;font-size:clamp(18px,2vw,24px);letter-spacing:-.035em}.offline-copy h2 span{color:var(--cyan)}.offline-copy p:not(.eyebrow){margin:4px 0;color:var(--soft);font-size:11px}.offline-copy small{color:var(--muted);font-size:9px}.offline-actions{display:flex;gap:8px;flex-wrap:wrap;flex:none}.offline-actions .button{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:42px}.install-dialog{max-width:min(420px,calc(100vw - 28px));width:100%;border:1px solid var(--line2);border-radius:16px;padding:0;background:var(--panel);color:var(--text);box-shadow:0 30px 90px #0009}.install-dialog::backdrop{background:#020611c9;backdrop-filter:blur(4px)}.install-dialog-inner{padding:22px}.install-dialog-inner h2{margin:0 0 8px;font-size:22px}.install-dialog-inner p:not(.eyebrow){color:var(--soft);font-size:13px;line-height:1.55} body[data-theme="ivory"] .offline-banner{background:linear-gradient(120deg,#382a1b,#21180f);border-color:#795631}body[data-theme="ember"] .offline-banner{background:linear-gradient(120deg,#35161b,#1b0c10);border-color:#703038}body[data-theme="verdant"] .offline-banner{background:linear-gradient(120deg,#183326,#0c1c14);border-color:#326548}body[data-theme="violet"] .offline-banner{background:linear-gradient(120deg,#281943,#140d25);border-color:#574078} @media(max-width:700px){.offline-banner{width:calc(100% - 24px);margin-top:13px;padding:14px;display:grid}.offline-actions{display:grid;grid-template-columns:1fr}.offline-actions .button{width:100%;min-height:46px}.offline-copy p:not(.eyebrow){font-size:10px}} /* ChessNew 1.2.0 — force readable native dropdown menus on desktop and mobile. Some platforms render