@font-face{font-family:Archivo Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/assets/archivo-vietnamese-wdth-normal-rJmnGBSt.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Archivo Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/assets/archivo-latin-ext-wdth-normal-7khWdh9v.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Archivo Variable;font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/assets/archivo-latin-wdth-normal-DY7AcnAa.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--bg:#fff;--surf:#fff;--ink:#0a0a0a;--mut:#555;--line:#cfcfcf;--rule:#0a0a0a;--grid:#d9d9d9;--cell:#0a0a0a;--hold:#2440ff;--bad:#c4001a;--on-hold:#fff;--f:"Archivo Variable", "Helvetica Neue", Arial, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0a0a0a;--surf:#111;--ink:#f5f5f5;--mut:#a8a8a8;--line:#333;--rule:#f5f5f5;--grid:#2a2a2a;--cell:#f5f5f5;--hold:#7d92ff;--bad:#ff8a7a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#0a0a0a;--surf:#111;--ink:#f5f5f5;--mut:#a8a8a8;--line:#333;--rule:#f5f5f5;--grid:#2a2a2a;--cell:#f5f5f5;--hold:#7d92ff;--bad:#ff8a7a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:is(:root,.swatch)[data-theme=indigo]{--bg:#1d1442;--surf:#251a52;--ink:#f6f0ff;--mut:#b8acdf;--line:#3b2f7a;--rule:#ffd23f;--grid:#2f2468;--cell:#ffd23f;--hold:#ff5fa2;--on-hold:#fff;--bad:#ff7b7b;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:is(:root,.swatch)[data-theme=sunset]{--bg:#2b1030;--surf:#351439;--ink:#fff0e8;--mut:#d8b3c6;--line:#4d2453;--rule:#ff7a45;--grid:#3e1b45;--cell:#ff7a45;--hold:#ffd166;--on-hold:#2b1030;--bad:#ff8a7a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:is(:root,.swatch)[data-theme=sky]{--bg:#eaf3ff;--surf:#f4f8ff;--ink:#0d2240;--mut:#4d6280;--line:#b9cde9;--rule:#0d2240;--grid:#cfe0f7;--cell:#2f6fed;--hold:#ff7a1a;--on-hold:#fff;--bad:#c4001a;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:is(:root,.swatch)[data-theme=paper]{--bg:#f6efe3;--surf:#fbf6ee;--ink:#2b2118;--mut:#6d5d4b;--line:#d6c8b1;--rule:#2b2118;--grid:#e3d7c3;--cell:#d1495b;--hold:#00798c;--on-hold:#fff;--bad:#b3261e;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}body{background:var(--bg);color:var(--ink);font:400 16px/1.45 var(--f);margin:0}a{color:inherit}main{max-width:520px;margin:0 auto;padding:14px 16px 40px}header{border-bottom:4px solid var(--rule);padding:0 44px 10px 0;position:relative}h1{font:900 clamp(48px, 16.5vw, 78px) / .86 var(--f);letter-spacing:-.045em;margin:0 0 10px -3px;font-stretch:125%}.sub{font-variant-numeric:tabular-nums;min-height:1.45em;margin:0;font-size:14px;font-weight:600}.gear{border:2px solid var(--ink);width:38px;height:38px;color:var(--ink);cursor:pointer;background:0 0;place-items:center;display:grid;position:absolute;top:0;right:0}.gear:hover{background:var(--ink);color:var(--bg)}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--hold);outline-offset:2px}.tabs{gap:6px;display:flex}.tabs button,.tabs a{color:var(--ink);font:700 13px var(--f);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:0 0;border:2px solid #0000;padding:6px 10px;text-decoration:none}.tabs button:hover,.tabs a:hover{border-color:var(--ink)}.tabs .p{background:var(--ink);color:var(--bg);border-color:var(--ink)}.tabs.nav{border-bottom:2px solid var(--rule);flex-wrap:wrap;gap:4px;margin-bottom:14px;padding:12px 0}@media (width<=480px){.tabs.nav{gap:0}.tabs.nav a{letter-spacing:.02em;padding:6px;font-size:12px}}dialog.drawer{border:0;border-left:4px solid var(--rule);background:var(--bg);width:min(380px,100vw);max-width:none;height:100dvh;max-height:none;color:var(--ink);transition:transform .2s ease-out, display .2s allow-discrete, overlay .2s allow-discrete;margin:0;padding:0;position:fixed;inset:0 0 0 auto}dialog.drawer[open]{transform:none}@starting-style{dialog.drawer[open]{transform:translate(100%)}}dialog.drawer::backdrop{background:#00000073}.drawer-body{height:100%;padding:calc(14px + env(safe-area-inset-top,0px)) 16px 24px;overflow-y:auto}.drawer-head{justify-content:space-between;align-items:center;display:flex}.drawer-head h2{font:900 30px/1 var(--f);letter-spacing:-.04em;margin:0;font-stretch:115%}.drawer-head .close{border:2px solid var(--ink);width:38px;height:38px;color:var(--ink);font:700 16px var(--f);cursor:pointer;background:0 0}.drawer-head .close:hover{background:var(--ink);color:var(--bg)}.drawer .card{margin-top:14px}@media (prefers-reduced-motion:reduce){dialog.drawer{transition:none}}.hud{align-items:stretch;gap:16px;margin-bottom:14px;display:flex}.big{border-right:2px solid var(--rule);min-width:96px;padding-right:16px}.big b{font:900 92px/.85 var(--f);letter-spacing:-.05em;font-variant-numeric:tabular-nums;margin-bottom:6px;font-stretch:110%;display:block}.big span{font-size:13px;font-weight:700}.side{flex-direction:column;flex:1;justify-content:space-between;gap:6px;display:flex}.line{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:8px;padding-bottom:5px;font-size:13px;font-weight:600;display:flex}.line:last-child{border-bottom:0;padding-bottom:0}.line b{font-variant-numeric:tabular-nums;font-weight:800}.tray,.pips{flex-wrap:wrap;justify-content:flex-end;gap:4px;display:flex}.slot{border:2px solid var(--ink);width:15px;height:15px}.slot.f{background:var(--hold);border-color:var(--hold)}.pip{border:2px solid var(--ink);width:7px;height:7px}.pip.f{background:var(--ink)}.board{background:var(--grid);border:4px solid var(--ink);touch-action:manipulation;gap:1px;display:grid}.cell{aspect-ratio:1;background:var(--surf);cursor:pointer;-webkit-tap-highlight-color:transparent;border:0;padding:0;position:relative}.cell:before,.cell:after{content:"";background:var(--cell);opacity:0;pointer-events:none;position:absolute;inset:0}.cell:after{transition:opacity .15s,transform .15s;transform:scale(.7)}.cell.on:after{opacity:1;transform:none}.cell.born:after{animation:.35s ease-out born}.cell.died:before{animation:.4s ease-out die}.cell.hl{outline:4px solid var(--hold);outline-offset:-4px;z-index:1}@keyframes born{0%{opacity:.2;transform:scale(.2)}to{opacity:1;transform:none}}@keyframes die{0%{opacity:.4;transform:scale(1)}to{opacity:0;transform:scale(.4)}}@media (hover:hover){.board--holding .cell:not(.on):hover{outline:3px solid var(--hold);outline-offset:-3px}.board--edit .cell:not(.on):hover:after{opacity:.2;transform:none}.board--play .cell.on:hover:after{transform:scale(.8)}}@media (prefers-reduced-motion:reduce){.cell:after{transition:none}.cell.born:after,.cell.died:before{animation:none}}.btns{gap:8px;margin:14px 0;display:flex}button.b{border:2px solid var(--ink);color:var(--ink);font:800 14px var(--f);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:0 0;flex:1;padding:12px}button.b:hover:not(:disabled),button.b.p{background:var(--ink);color:var(--bg)}button.b.p:hover:not(:disabled){background:var(--hold);border-color:var(--hold);color:var(--on-hold)}button.b:disabled{opacity:.3;cursor:default}.msg{min-height:26px;color:var(--mut);font-size:14px;font-weight:500}.msg.win{color:var(--ink);font:900 28px/1.05 var(--f);letter-spacing:-.03em;font-stretch:110%}.note{margin-top:6px;font-size:15px;font-weight:600}.after{flex-direction:column;gap:8px;margin-top:10px;display:flex}.card{border-top:4px solid var(--rule);margin:20px 0;padding:12px 0 4px}header+.card,.banner+.card,.nav+.card{border-top:0;margin-top:0;padding-top:0}.card h2{font:900 22px/1 var(--f);letter-spacing:-.03em;margin:0 0 12px;font-stretch:110%}.how{color:var(--mut);font-size:14px}.how b{color:var(--ink)}.row{flex-wrap:wrap;gap:8px 12px;margin-bottom:8px;display:flex}.row label{flex:38%;font-size:13px;font-weight:700}input{font:600 16px var(--f);border:0;border-bottom:2px solid var(--ink);color:var(--ink);background:0 0;border-radius:0;width:100%;margin-top:2px;padding:8px 2px}.setting{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;font-size:14px;font-weight:700;display:flex}.swatches{--page-ink:var(--ink);--page-line:var(--line);gap:8px;display:flex}.swatch{background:var(--bg);border:2px solid var(--page-line);cursor:pointer;place-items:center;width:38px;height:38px;padding:0;display:grid}.swatch i{background:var(--cell);width:14px;height:14px;box-shadow:6px 6px 0 -2px var(--hold)}.swatch:hover{border-color:var(--page-ink)}.swatch[aria-pressed=true]{outline:3px solid var(--page-ink);outline-offset:2px}.setting .tabs button{padding:4px 8px;font-size:12px}.archive{margin:8px 0 14px;padding:0;list-style:none}.archive a{border-top:1px solid var(--line);font-variant-numeric:tabular-nums;gap:12px;padding:8px 0;font-weight:600;text-decoration:none;display:flex}.archive li:first-child a{border-top:0}.archive a:hover{color:var(--hold)}.archive .num{min-width:3.5em;font-weight:800}.archive b{margin-left:auto}.account .btns{margin-top:6px}a.b{text-align:center;border:2px solid var(--ink);font:800 14px var(--f);letter-spacing:.06em;text-transform:uppercase;padding:12px;text-decoration:none;display:block}a.b.p{background:var(--ink);color:var(--bg)}a.b.p:hover{background:var(--hold);border-color:var(--hold);color:var(--on-hold)}.card h2.spaced{margin-top:22px}.field-error{color:var(--bad);margin-top:4px;font-weight:600;display:block}.confirm{border:2px solid var(--bad);padding:10px 12px;font-size:14px}.confirm p{margin:0}button.b.danger,button.b.danger:hover:not(:disabled){background:var(--bad);border-color:var(--bad);color:#fff}.banner{border:2px solid var(--bad);justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;padding:8px 12px;font-size:14px;font-weight:600;display:flex}.banner button{color:var(--ink);font:800 13px var(--f);text-transform:uppercase;cursor:pointer;background:0 0;border:0}.ranks{font-variant-numeric:tabular-nums;margin:0 0 12px;padding:0;list-style:none}.ranks li{border-top:1px solid var(--line);grid-template-columns:2.5em 1fr auto auto;align-items:baseline;gap:10px;padding:7px 0;font-weight:600;display:grid}.ranks li:first-child{border-top:0}.ranks li.me{color:var(--hold)}.ranks li.gap{border-top:2px dashed var(--line)}.ranks .rank,.ranks .moves{font-weight:800}.ranks .moves small{color:var(--mut);margin-left:4px;font-weight:600}.ranks a{font-size:13px}.chips{flex-wrap:wrap;gap:6px;margin-bottom:12px;display:flex}.chips a{border:2px solid var(--ink);font:700 13px var(--f);padding:4px 10px;text-decoration:none}.chips a.p{background:var(--ink);color:var(--bg)}