:root{--ink: #3b2e5a;--bg: #b9a3e8;--lav: #dccbf7;--purple: #6e5ac8;--yellow: #ffd45e;--orange: #ff9e4a;--panel: #fffdf8;--board-bg: #a6e3f6;--line: var(--ink);--text: var(--ink);--muted: #7a6a9e;--accent: #e8792a;--btn-bg: #fffdf8;--btn-bg-hover: #f3ecff;--font-body: "Trebuchet MS", "Avenir Next", system-ui, -apple-system, sans-serif;--font-mono: var(--font-body)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-tap-highlight-color:transparent}button{font-family:inherit}.app{height:100dvh;overflow:hidden;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:env(safe-area-inset-top,0px) 16px 0;padding-top:calc(8px + env(safe-area-inset-top,0px));padding-bottom:8px;background:var(--lav);border-bottom:3px solid var(--ink)}.wordmark{font-size:22px;font-weight:900;margin:0;line-height:1;letter-spacing:.5px;white-space:nowrap;color:var(--purple)}.wordmark__accent{color:var(--accent)}.topbar__stats{display:flex;gap:16px}.topbar__stat{display:flex;align-items:baseline;gap:6px;padding:2px 12px;border:3px solid var(--ink);border-radius:999px;background:var(--panel);box-shadow:0 3px 0 var(--ink);font-size:18px;font-weight:900;font-variant-numeric:tabular-nums}.topbar__stat .stat__label{font-size:11px}.topbar__actions{display:flex;align-items:center;gap:8px}.help{position:relative}.help__trigger{width:34px;height:34px;border-radius:999px;border:3px solid var(--ink);background:var(--btn-bg);color:var(--ink);font-size:16px;font-weight:900;line-height:1;cursor:pointer;box-shadow:0 3px 0 var(--ink);transition:background .15s ease}.help__trigger:hover,.help__trigger[aria-expanded=true]{background:var(--btn-bg-hover)}.help__trigger:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}.help__panel{position:absolute;top:calc(100% + 8px);right:0;width:230px;background:var(--panel);border:3px solid var(--ink);border-radius:14px;padding:14px;box-shadow:0 5px 0 var(--ink);z-index:10}.help__title{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:10px}.help__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.help__row{display:flex;align-items:center;justify-content:space-between;gap:10px}.help__keys{display:flex;gap:4px;flex:none}.help__key{min-width:22px;padding:2px 6px;border-radius:7px;border:2px solid var(--ink);background:var(--lav);color:var(--ink);font-family:inherit;font-size:11px;font-weight:800;text-align:center;box-shadow:0 2px 0 var(--ink)}.help__label{font-size:12.5px;font-weight:700;color:var(--text);text-align:right}.topbar,.footer-bar{flex:none}.layout{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}.board-shell{position:relative;aspect-ratio:1 / 2;flex:1;min-height:0;max-height:640px;max-width:94vw;border:4px solid var(--ink);border-radius:22px;overflow:hidden;background:var(--board-bg);box-shadow:0 8px 0 var(--ink);touch-action:none}.depth-badge{position:absolute;top:calc(10px + env(safe-area-inset-top,0px));right:10px;display:flex;align-items:baseline;gap:6px;padding:3px 14px;border-radius:999px;background:#fffdf8ed;border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);pointer-events:none}.depth-badge__label{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.depth-badge__value{font-size:22px;font-weight:900;color:var(--purple);font-variant-numeric:tabular-nums;line-height:1.1}.game-canvas{display:block;width:100%;height:100%;background:var(--board-bg);cursor:pointer;touch-action:none}.stats-sidebar{background:var(--panel);border:3px solid var(--ink);border-radius:18px;box-shadow:0 5px 0 var(--ink);padding:14px;display:flex;flex-direction:row;align-items:center;gap:16px}.stats-sidebar__section{flex:none;width:64px;display:flex;flex-direction:column;gap:4px}.stats-sidebar__stats{flex:1;display:flex;flex-direction:row;flex-wrap:wrap;gap:14px}.stat__value--best{font-size:26px;font-weight:900;font-variant-numeric:tabular-nums;color:var(--accent)}.stat{display:flex;flex-direction:column;gap:2px}.stat--duplicate{display:none}.stat__label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}.stat__value{font-size:26px;font-weight:900;font-variant-numeric:tabular-nums;display:inline-block}.btn{border:3px solid var(--ink);background:var(--btn-bg);color:var(--ink);border-radius:16px;padding:14px 0;flex:1;font-size:18px;font-weight:900;line-height:1;cursor:pointer;box-shadow:0 4px 0 var(--ink);transition:background .15s ease,transform .08s ease,box-shadow .08s ease}.btn:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}.btn:hover:not(:disabled){background:var(--btn-bg-hover)}.btn:disabled{opacity:.45;cursor:default}.btn--ghost{font-size:13px;padding:7px 14px;border-radius:999px;box-shadow:0 3px 0 var(--ink);flex:none}.btn--primary{background:var(--yellow);white-space:nowrap;font-size:20px;padding:12px 26px;flex:none}.btn--primary:hover:not(:disabled){background:var(--yellow);filter:brightness(1.05)}.footer-bar{padding:10px 16px calc(14px + env(safe-area-inset-bottom,0px));background:var(--lav);border-top:3px solid var(--ink);display:flex;align-items:center;gap:12px}.btn--splash{flex:1;font-size:22px;padding:14px 0;border-radius:999px;letter-spacing:1px;text-transform:uppercase}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 40%,#e9ddff8c,#b9a3e8d9);display:flex;align-items:center;justify-content:center;padding:16px}.overlay__card{background:var(--panel);border:4px solid var(--ink);border-radius:22px;box-shadow:0 8px 0 var(--ink);padding:24px 22px 22px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;max-width:300px}.overlay__card h2{margin:0;font-size:38px;font-weight:900;line-height:.95;letter-spacing:1px;color:var(--purple)}.overlay__card p{margin:0;color:var(--ink);font-size:14.5px;font-weight:700;line-height:1.4}@media (orientation: portrait) and (pointer: coarse),(max-width: 839px){.layout{padding:0;gap:0}.board-shell{aspect-ratio:auto;flex:1 1 auto;width:100%;max-width:none;max-height:none;border:none;border-radius:0;box-shadow:none}.stats-sidebar,.footer-bar{display:none}.topbar{gap:8px;padding-left:12px;padding-right:12px}.wordmark{font-size:18px}.topbar__stat{padding:1px 10px;font-size:16px}.topbar__actions .btn--ghost{padding:6px 11px}}@media (pointer: fine) and (min-width: 880px),(pointer: coarse) and (orientation: landscape) and (min-width: 840px){.layout{display:grid;grid-template-columns:minmax(0,1fr) 200px;grid-template-rows:minmax(0,1fr);align-items:center;justify-items:center;gap:16px;min-height:0;padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}.board-shell{grid-column:1;grid-row:1;flex:none;aspect-ratio:1 / 2;height:100%;width:auto;max-height:100%;max-width:100%;border:4px solid var(--ink);border-radius:22px;box-shadow:0 8px 0 var(--ink)}.depth-badge{top:10px}.footer-bar{display:flex}.stats-sidebar{grid-column:2;grid-row:1;display:flex;align-self:start;width:100%;justify-self:stretch;flex-direction:column;align-items:stretch}.stats-sidebar__section{width:auto}.stats-sidebar__stats{flex-direction:column}.stat--duplicate{display:flex}}@media (orientation: landscape) and (max-height: 560px){.layout{padding:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px));gap:10px}.topbar{padding-bottom:6px}.stats-sidebar{padding:10px}.footer-bar{padding:8px 16px calc(8px + env(safe-area-inset-bottom,0px))}.btn--splash{padding:10px 0;font-size:18px}}@media (max-width: 379px){.topbar__stat .stat__label{display:none}.wordmark{font-size:16px}}