@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#23332e;background:#f5f6f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,select,textarea{font:inherit}button,select{cursor:pointer}button{border:0;background:transparent;color:inherit;border-radius:8px}button:hover{background:#e6ebe5}button:focus-visible,select:focus-visible{outline:3px solid #d5a545;outline-offset:2px}header{height:86px;background:#fff;border-bottom:1px solid #e4e8e0;padding:0 5%;display:flex;align-items:center;justify-content:space-between}.brand{text-decoration:none;color:#1e3931;font-family:Manrope,sans-serif;font-size:27px;font-weight:800;letter-spacing:-1px;display:flex;align-items:center;gap:10px}.brandmark{background:#203e33;color:white;width:39px;height:42px;border-radius:10px;font-size:31px;text-align:center}.branddot{color:#b99551;margin-left:-9px}.header-right{display:flex;align-items:center;gap:10px;font-size:13px;color:#778078}.live-dot{width:7px;height:7px;background:#779982;border-radius:50%}.icon{border:1px solid #d7ded5;border-radius:50%;margin-left:19px;width:25px;height:25px}main{max-width:1260px;margin:auto;padding:39px 40px 20px}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.eyebrow,.card-label{font-size:10px;font-weight:700;letter-spacing:1.6px;color:#7b847a}h1{font-family:Manrope,sans-serif;font-weight:600;font-size:32px;letter-spacing:-1.2px;margin:8px 0 7px}.intro p{color:#81877d;font-size:14px;margin:0}.engine-pill{border:1px solid #d9e2d5;color:#5a745e;background:#edf1e9;border-radius:30px;padding:9px 14px;font-size:11px}.workspace{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,1fr);gap:30px;align-items:start}.board-panel{min-width:0}.board-top,.board-bottom{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:0 0 14px 27px}.board-bottom{padding-top:15px}.avatar{display:inline-flex;justify-content:center;align-items:center;background:#263d33;border-radius:7px;width:32px;height:32px;color:#fff;font-size:25px;margin-right:10px;vertical-align:middle}.avatar.light{color:#2b3d31;background:#e9e8df;border:1px solid #d4d8cf}.muted{color:#92978e}.turn-pill{font-size:11px;background:white;border:1px solid #e2e6dd;border-radius:5px;padding:7px 10px}.board-wrap{display:flex;gap:10px}.eval-track{width:17px;border-radius:5px;overflow:hidden;background:#293c33;position:relative;flex-shrink:0}.eval-track>div{position:absolute;bottom:0;width:100%;height:50%;background:#fdfdf9;transition:height .5s}.eval-track>span{position:absolute;bottom:6px;width:100%;text-align:center;font-size:9px;writing-mode:vertical-rl;color:#485a46}.board-box{position:relative;width:100%;aspect-ratio:1;box-shadow:0 12px 30px #293d3010;border-radius:5px;overflow:hidden}#board{display:grid;grid-template-columns:repeat(8,1fr);height:100%;width:100%}.square{position:relative;border:0;border-radius:0;padding:0;display:flex;align-items:center;justify-content:center;aspect-ratio:1;touch-action:manipulation;background:#eceddc}.square.dark{background:#829a7c}.square:hover{box-shadow:inset 0 0 0 4px #ffffff35;background:#eceddc}.square.dark:hover{background:#829a7c}.square.selected{background:#e3cf78!important}.square.last{background:#c8cb8a}.square.dark.last{background:#a9b170}.square .piece{font-family:'DejaVu Sans','Segoe UI Symbol',serif;font-size:clamp(26px,4.5vw,58px);line-height:1;z-index:1;user-select:none;filter:drop-shadow(0 2px 1px #0003)}.piece.white{color:#fffdf2;-webkit-text-stroke:1px #343d32}.piece.black{color:#24382e;-webkit-text-stroke:.7px #0e2119}.coord{position:absolute;font-size:10px;font-weight:600;color:#5f795a;line-height:1}.dark .coord{color:#f1f1df}.file{right:4px;bottom:3px}.rank{left:4px;top:4px}.legal::after{content:'';position:absolute;width:25%;height:25%;background:#203e3740;border-radius:50%}.legal.capture::after{width:87%;height:87%;border:5px solid #203e3740;background:none}.check{box-shadow:inset 0 0 20px #ba443a!important}#arrows{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.board-actions{display:flex;gap:5px}.board-actions button{padding:7px;color:#65745f;font-size:17px}.board-actions span{font-size:11px}.board-hint{font-size:11px;color:#959b90;text-align:center;margin:10px 0}#error{color:#a34435;font-size:12px;text-align:center;min-height:17px}aside{display:grid;gap:15px}.card{background:#fff;border:1px solid #e2e7dd;border-radius:13px;padding:20px}.segmented{background:#f1f3ed;border:1px solid #e9ece3;border-radius:8px;display:flex;padding:4px;margin-top:13px}.segmented button{flex:1;padding:9px 4px;font-size:12px;color:#7f8979}.segmented button.active{background:#fff;color:#2f4a36;box-shadow:0 2px 5px #00000009}.control-row{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#87907f;margin-top:16px}select{border:0;background:#f5f6f1;padding:7px;border-radius:6px;color:#5c6f53;font-size:11px}.recommendation{background:#203d32;color:#fff;border:0;padding:23px}.card-heading{display:flex;justify-content:space-between;align-items:center}.recommendation .card-label{color:#a8baab}.status{font-size:10px;color:#c1d2bd}.recommendation #bestMove{font-family:Manrope,sans-serif;font-size:53px;font-weight:500;letter-spacing:-2px;margin:16px 0 0}#moveDescription{font-size:12px;color:#c5d2c2;margin-top:2px;min-height:16px}.move-meta{display:flex;justify-content:space-between;align-items:center;margin:19px 0;font-size:10px;color:#bacab7}#moveBadge{color:#e5c97f}.continuation{border-top:1px solid #ffffff20;padding-top:17px}.continuation p{font-size:13px;line-height:1.8;margin:8px 0 0;min-height:23px;color:#e3e8df}.subtle{font-size:10px;color:#9bA390}#candidates{margin:13px 0}.candidate{display:flex;align-items:center;padding:10px 0;border-bottom:1px solid #f1f3ed;gap:13px}.candidate .number{font-size:11px;color:#a4ad9d}.candidate strong{font-size:15px;width:64px}.candidate .tag{font-size:9px;background:#e8f2e9;color:#547657;border-radius:4px;padding:3px 5px}.candidate .score{margin-left:auto;font-size:12px;font-weight:600}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding-top:4px;font-size:12px}.toggle-row small{display:block;font-size:10px;color:#92998c;margin-top:4px}input[type=checkbox]{accent-color:#365e42;width:17px;height:17px}.fineprint{font-size:10px;color:#9ba293;line-height:1.6;margin:12px 0 0}.text-button{font-size:10px;color:#5d795c}.history{font-size:12px;color:#72816b;line-height:1.9;margin:14px 0;max-height:88px;overflow:auto}.position-actions{display:flex;gap:10px}.position-actions button{background:#f3f5ef;border:1px solid #e7ebe1;flex:1;font-size:11px;padding:8px}.empty{color:#8f9987;font-size:12px;padding:10px 0}footer{display:flex;justify-content:space-between;border-top:1px solid #e2e6dd;margin-top:34px;padding-top:18px;font-size:10px;color:#929a89}footer button{font-size:10px;margin-left:10px}dialog{border:1px solid #dce2d5;border-radius:16px;padding:26px;width:min(520px,92vw);color:#2b4032;box-shadow:0 20px 80px #0003}dialog::backdrop{background:#152d2466;backdrop-filter:blur(3px)}.dialog-top{display:flex;align-items:center;justify-content:space-between}.dialog-top h2{margin:0 0 15px;font-size:20px}.dialog-top button{font-size:25px}#modalBody p{font-size:13px;line-height:1.7}#modalBody a{color:#476b47}textarea{width:100%;height:110px;padding:12px;border:1px solid #ccd7c7;border-radius:7px;font-size:12px}#modalBody .primary{background:#284a37;color:#fff;padding:10px 20px;margin-top:12px}#setupBar{position:sticky;bottom:10px;z-index:5;margin:20px auto;width:min(1100px,95vw);padding:16px;background:#fff;border:1px solid #bbcbb5;border-radius:12px;box-shadow:0 5px 40px #0002;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;font-size:12px}#setupBar[hidden]{display:none}#palette{display:flex;gap:1px}#palette button{font-size:25px;padding:3px}#palette .active{background:#dce8d1}.rights{display:flex;align-items:center;gap:5px}#setupStatus{width:100%;text-align:center;color:#79856e}#doneSetup{background:#284c37;color:white;padding:8px 12px}@media(min-width:1400px){.square .piece{font-size:61px}}@media(max-width:850px){main{padding:25px 20px}.workspace{gap:20px;grid-template-columns:1.2fr 1fr}.card{padding:16px}.intro h1{font-size:27px}.engine-pill{max-width:160px}.square .piece{font-size:5vw}.board-actions span{display:none}.header-right{font-size:11px}}@media(max-width:680px){header{height:66px;padding:0 20px}.header-right{font-size:0}.header-right .icon{font-size:13px}.intro{margin-bottom:24px;align-items:flex-start;gap:10px}.intro h1{font-size:25px}.intro .eyebrow{font-size:8px}.intro p{font-size:12px}.engine-pill{font-size:9px;padding:7px 9px;max-width:110px}.workspace{display:block}aside{margin-top:20px}.square .piece{font-size:9vw}.board-actions span{display:inline}.board-top,.board-bottom{font-size:12px}.board-hint{font-size:10px}footer{gap:10px;line-height:1.7}footer>span:first-child{display:none}#palette{flex-wrap:wrap;justify-content:center}}
/* Chessculator: the supplied mint, orchid, plum, aubergine and ink palette. */
:root{--mint:#e2fcef;--orchid:#9b287b;--plum:#5c164e;--aubergine:#402039;--ink:#170f11;background:var(--ink);color:var(--mint)}
header{background:#170f11;border-color:#402039}.brand{color:#e2fcef;font-size:25px;letter-spacing:-.9px}.brandmark{width:43px;height:49px;background:none;border-radius:0}.header-right{color:#c6b9c2}.live-dot{background:#9b287b}.icon{border-color:#9b287b}button:hover{background:#5c164e}.intro p,.muted,.board-hint{color:#bba8b5}.eyebrow,.card-label{color:#c3a6ba}.engine-pill{background:#402039;color:#e2fcef;border-color:#5c164e}.card{background:#402039;border-color:#5c164e}.segmented{background:#170f11;border-color:#5c164e}.segmented button{color:#c9afbf}.segmented button.active{background:#e2fcef;color:#402039}.control-row{color:#d3bdca}select{background:#170f11;color:#e2fcef}.recommendation{background:#5c164e;border:1px solid #9b287b}.recommendation .card-label{color:#e2fcef}.status,#moveDescription,.move-meta{color:#d6c8d0}#moveBadge{color:#e2fcef}.continuation p{color:#e2fcef}.candidate{width:100%;text-align:left;color:#e2fcef;border-bottom-color:#5c164e;border-radius:5px}.candidate:hover,.candidate.selected-candidate{background:#5c164e;box-shadow:inset 3px 0 #e2fcef}.candidate .tag{background:#e2fcef;color:#5c164e}.candidate .number,.subtle,.empty,.fineprint,.toggle-row small{color:#c7b2c0}.candidate .score{color:#e2fcef}.position-actions button{background:#170f11;border-color:#5c164e;color:#e2fcef}.history,.text-button{color:#e2fcef}.turn-pill{color:#e2fcef;background:#402039;border-color:#5c164e}.avatar{background:#5c164e;color:#e2fcef}.avatar.light{background:#e2fcef;color:#402039;border-color:#9b287b}.board-actions button{color:#e2fcef}.square,.square:hover{background:#e2fcef}.square.dark,.square.dark:hover{background:#9b287b}.square.last{background:#b5dec8}.square.dark.last{background:#ba579a}.square.selected{background:#d0a1cc!important}.coord{color:#5c164e}.dark .coord{color:#e2fcef}.legal::after{background:#5c164e65}.legal.capture::after{border-color:#5c164e75}.check{box-shadow:inset 0 0 22px #ef5769!important}.square .piece{width:94%;height:94%;font-size:0;filter:drop-shadow(0 2px 1px #170f1140);-webkit-text-stroke:0;display:flex;align-items:center;justify-content:center}.piece svg{width:100%;height:100%;pointer-events:none}.piece.white,.piece.black{-webkit-text-stroke:0}.eval-track{background:#5c164e}.eval-track>div{background:#e2fcef}.eval-track>span{color:#402039}#error{color:#f3b3d8}input[type=checkbox]{accent-color:#9b287b}footer{border-color:#402039;color:#bba8b5}dialog{background:#402039;color:#e2fcef;border-color:#9b287b}dialog::backdrop{background:#170f11bb}#modalBody a{color:#e2fcef}textarea{background:#170f11;color:#e2fcef;border-color:#9b287b}#modalBody .primary{background:#9b287b;color:#e2fcef}#setupBar{background:#402039;color:#e2fcef;border-color:#9b287b}#palette button{width:36px;height:42px;padding:0}#palette svg{width:100%;height:100%}#palette .active{background:#9b287b}#setupStatus{color:#e2fcef}#doneSetup{background:#9b287b;color:#e2fcef}#soundToggle{font-size:11px;color:#e2fcef;border:1px solid #5c164e;padding:7px 10px;margin-left:10px}#previewBack{display:block;margin:12px auto 0;padding:9px 16px;font-size:12px;background:#9b287b;color:#e2fcef}#previewBack[hidden]{display:none}.motion-layer{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:visible}.moving-piece{position:absolute;width:12.5%;height:12.5%;z-index:2;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 4px 2px #170f1144)}.moving-piece svg{width:94%;height:94%}.captured-motion{z-index:1}.board-box{overflow:visible}#board{border-radius:5px;overflow:hidden}#promotionChoices{display:flex;gap:8px;flex-wrap:wrap}#promotionChoices button{display:flex;flex-direction:column;align-items:center;padding:6px 10px!important}#promotionChoices svg{width:52px;height:52px}#promotionChoices span{font-size:10px}@media(max-width:680px){.brand{font-size:21px}.brandmark{width:33px;height:40px}.header-right{gap:2px}#soundToggle{font-size:10px;margin:0;padding:7px}.icon{margin-left:8px}.header-right .live-dot{display:none}#setupBar{bottom:0;gap:8px}#palette button{width:30px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}}

/* A light halo and ink edge keep the warm arrow distinct on either board color. */
#arrows{z-index:3;overflow:visible;pointer-events:none}
.recommendation-arrow{pointer-events:none}
.arrow-halo{fill:#e2fcef;stroke:#e2fcef;stroke-width:9;stroke-linejoin:round;stroke-linecap:round;opacity:.94}
.arrow-core{fill:#ffd780;stroke:#170f11;stroke-width:3.5;stroke-linejoin:round;stroke-linecap:round}
