:root{--bg:#f8f4ec;--surface:#fff;--line:#e3dccd;--fg:#0d113d;--muted:#5c5f80;--accent:#4b368a;--accent-fg:#fff;--hit:#2f9a62;--near:#f0bf4c;--miss:#de5a52;--tile-fg:#fff;--near-fg:#3b2b00;--glow:#4b368a1a;--ring:#4b368a24;--shadow-sm:0 1px 2px #0d113d0f, 0 1px 1px #0d113d0a;--shadow:0 2px 6px #0d113d0f, 0 8px 24px #0d113d0f;--shadow-lg:0 12px 40px #0d113d24;--f-display:"Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;--f-cond:"Barlow Condensed", "Arial Narrow", sans-serif;--f-body:"Outfit", system-ui, -apple-system, "Segoe UI", sans-serif}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#101336;--surface:#1a1e4c;--line:#2c3170;--fg:#f7f2ea;--muted:#a4a7cf;--accent:#8e74ea;--accent-fg:#0d0f2e;--hit:#2e9560;--near:#e6b94a;--miss:#d35850;--tile-fg:#fff;--near-fg:#2e2200;--glow:#8e74ea29;--ring:#8e74ea38;--shadow-sm:0 1px 2px #00000040;--shadow:0 4px 16px #00000040;--shadow-lg:0 16px 48px #0006;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#101336;--surface:#1a1e4c;--line:#2c3170;--fg:#f7f2ea;--muted:#a4a7cf;--accent:#8e74ea;--accent-fg:#0d0f2e;--hit:#2e9560;--near:#e6b94a;--miss:#d35850;--tile-fg:#fff;--near-fg:#2e2200;--glow:#8e74ea29;--ring:#8e74ea38;--shadow-sm:0 1px 2px #00000040;--shadow:0 4px 16px #00000040;--shadow-lg:0 16px 48px #0006;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.logo-dark{display:none}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .logo-light{display:none}:root:not([data-theme=light]) .logo-dark{display:block}}:root[data-theme=dark] .logo-light{display:none}:root[data-theme=dark] .logo-dark{display:block}*{box-sizing:border-box}:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}body{margin:0}[hidden]{display:none!important}body{background:var(--bg);color:var(--fg);font-family:var(--f-body);padding-left:max(16px, env(safe-area-inset-left,0px));padding-right:max(16px, env(safe-area-inset-right,0px));background-image:radial-gradient(1200px 520px at 50% -180px, var(--glow), transparent 70%);background-repeat:no-repeat;min-height:100vh;padding-block:32px 64px;font-size:15px;line-height:1.5}.wrap{flex-direction:column;gap:24px;max-width:1040px;margin:0 auto;display:flex}header{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:12px 24px;display:flex}h1{margin:0;line-height:0}h1 img{width:auto;height:clamp(56px,13vw,88px)}.tagline{color:var(--muted);max-width:40ch;margin:10px 0 0;font-size:16px}.meta{color:var(--muted);text-align:right;font-size:13px}.meta strong{font-family:var(--f-display);color:var(--fg);font-size:34px;font-weight:800;line-height:1.1;display:block}.meta .streak{background:var(--surface);color:var(--fg);box-shadow:var(--shadow-sm);border-radius:999px;margin:6px 0 0 auto;padding:3px 10px;font-weight:600;display:table}.modes{background:var(--surface);box-shadow:var(--shadow-sm);border-radius:999px;grid-template-columns:1fr 1fr;padding:4px;display:inline-grid;position:relative}.modes:before{content:"";background:var(--accent);width:calc(50% - 4px);box-shadow:0 2px 8px var(--ring);border-radius:999px;transition:transform .35s cubic-bezier(.34,1.3,.5,1);position:absolute;top:4px;bottom:4px;left:4px}.modes[data-mode=free]:before{transform:translate(100%)}.modes button{font:500 14px var(--f-body);color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:7px 22px;transition:color .3s;position:relative}.modes button[aria-pressed=true]{color:var(--accent-fg)}.modes.small{padding:3px}.modes.small:before{width:calc(50% - 3px);top:3px;bottom:3px;left:3px}.modes.small button{padding:6px 16px;font-size:13px}@media (prefers-reduced-motion:reduce){.modes:before{transition:none}}.bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.bar .right{flex-wrap:wrap;gap:8px;display:flex}.ghost{font:500 14px var(--f-body);background:var(--surface);color:var(--fg);cursor:pointer;box-shadow:var(--shadow-sm);border:0;border-radius:999px;padding:8px 16px;transition:box-shadow .2s}.ghost:hover{box-shadow:var(--shadow)}.search{position:relative}.search input{width:100%;font:500 19px var(--f-body);color:var(--fg);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;padding:16px 124px 16px 20px;transition:border-color .2s,box-shadow .2s}.search input::placeholder{color:var(--muted)}.search input:focus{border-color:var(--accent);box-shadow:var(--shadow), 0 0 0 4px var(--ring);outline:none}.search .go{font:600 16px var(--f-body);background:var(--accent);color:var(--accent-fg);cursor:pointer;border:0;border-radius:12px;padding:0 20px;transition:opacity .2s;position:absolute;top:8px;bottom:8px;right:8px}.search .go:disabled{opacity:.4;cursor:default}.suggest{z-index:5;background:var(--surface);border:1px solid var(--line);max-height:300px;box-shadow:var(--shadow-lg);border-radius:16px;margin:8px 0 0;padding:6px;list-style:none;position:absolute;left:0;right:0;overflow-y:auto}.suggest li{cursor:pointer;border-radius:10px;justify-content:space-between;gap:12px;padding:10px 12px;display:flex}.suggest li small{color:var(--muted);font-size:13px}.suggest li[aria-selected=true],.suggest li:hover{background:var(--ring)}.legend{color:var(--muted);flex-wrap:wrap;gap:6px 18px;font-size:14px;display:flex}.legend i{vertical-align:0;border-radius:50%;width:10px;height:10px;margin-right:7px;display:inline-block}.board{padding:4px 2px 8px;overflow-x:auto}.grid{grid-template-columns:136px repeat(8,minmax(88px,1fr));gap:8px;min-width:880px;display:grid}.head{font:600 12px var(--f-body);letter-spacing:.03em;color:var(--muted);align-items:end;padding:0 6px 4px;display:flex}.tile{text-align:center;min-height:80px;font:600 14px/1.2 var(--f-body);color:var(--tile-fg);box-shadow:inset 0 1px 0 #ffffff2e, var(--shadow-sm);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:10px 8px;display:flex;position:relative}.tile.hit{background:var(--hit)}.tile.near{background:var(--near);color:var(--near-fg)}.tile.miss{background:var(--miss)}.tile.name{background:var(--surface);color:var(--fg);text-align:left;box-shadow:var(--shadow-sm);align-items:flex-start;font-size:15px;font-weight:600}.tile .arrow{font:600 18px/1 var(--f-display);opacity:.9}.tile .sub{opacity:.8;font-size:11px;font-weight:500}.tile .club{opacity:.8;font-size:12px;font-weight:500}.tile .club.shared{opacity:1;text-underline-offset:3px;font-weight:700;text-decoration:underline}.flag{font-size:20px;line-height:1}.new .tile{animation:.7s cubic-bezier(.22,.8,.32,1) both reveal}@keyframes reveal{0%{opacity:0;transform:perspective(700px)rotateX(-85deg)scale(.96)}60%{opacity:1}to{opacity:1;transform:none}}.row{display:contents}button.tile{cursor:pointer;font:600 14px/1.2 var(--f-body);border:0}button.tile:hover{filter:brightness(1.04)}.tile.picked{box-shadow:0 0 0 3px var(--bg), 0 0 0 6px var(--accent)}.tile .nth{color:var(--muted);font-size:11px;font-weight:500}.board-wrap{flex-direction:column;gap:10px;display:flex}.why{color:var(--muted);background:var(--surface);box-shadow:var(--shadow-sm);border-radius:12px;min-height:42px;margin:0;padding:10px 14px;font-size:14px}.why.on{color:var(--fg)}.howto{background:var(--surface);box-shadow:var(--shadow);border-radius:24px;padding:22px 24px}.howto-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.howto h2{font:800 24px var(--f-display);margin:0}.howto ol{gap:4px;margin:12px 0 18px;padding-left:20px;display:grid}.examples{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;display:grid}.examples figure{grid-template-columns:96px 1fr;align-items:center;gap:12px;margin:0;display:grid}.examples .tile{min-height:72px}.examples figcaption{color:var(--muted);font-size:14px}.examples figcaption strong{color:var(--fg)}.howto .note{color:var(--muted);margin:16px 0 0;font-size:13px}.pitch{z-index:-1;pointer-events:none;opacity:.045;background:var(--fg);position:fixed;inset:0;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 640' fill='none' stroke='black' stroke-width='3'%3E%3Crect x='20' y='20' width='960' height='600' rx='4'/%3E%3Cline x1='500' y1='20' x2='500' y2='620'/%3E%3Ccircle cx='500' cy='320' r='90'/%3E%3Ccircle cx='500' cy='320' r='4' fill='black'/%3E%3Crect x='20' y='170' width='150' height='300'/%3E%3Crect x='20' y='250' width='50' height='140'/%3E%3Crect x='830' y='170' width='150' height='300'/%3E%3Crect x='930' y='250' width='50' height='140'/%3E%3Cpath d='M170 260a75 75 0 0 1 0 120M830 260a75 75 0 0 0 0 120'/%3E%3C/svg%3E") 50% 140px/min(1400px,140vw) no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 640' fill='none' stroke='black' stroke-width='3'%3E%3Crect x='20' y='20' width='960' height='600' rx='4'/%3E%3Cline x1='500' y1='20' x2='500' y2='620'/%3E%3Ccircle cx='500' cy='320' r='90'/%3E%3Ccircle cx='500' cy='320' r='4' fill='black'/%3E%3Crect x='20' y='170' width='150' height='300'/%3E%3Crect x='20' y='250' width='50' height='140'/%3E%3Crect x='830' y='170' width='150' height='300'/%3E%3Crect x='930' y='250' width='50' height='140'/%3E%3Cpath d='M170 260a75 75 0 0 1 0 120M830 260a75 75 0 0 0 0 120'/%3E%3C/svg%3E") 50% 140px/min(1400px,140vw) no-repeat}.win{background:var(--accent);color:var(--accent-fg);box-shadow:var(--shadow-lg);border-radius:24px;flex-direction:column;gap:20px;padding:24px 28px;display:flex;position:relative}.win-top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 28px;display:flex}.stats{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px 32px;display:grid}.stats dl{grid-template-columns:repeat(4,1fr);gap:8px;margin:0;display:grid}.stats dt{opacity:.8;font-size:12px}.stats dd{font:800 28px/1.1 var(--f-display);margin:0}.dist{gap:4px;display:grid}.bar-row{grid-template-columns:36px 1fr;align-items:center;gap:8px;font-size:12px;display:grid}.bar-row i{text-align:right;background:color-mix(in srgb, var(--accent-fg) 22%, transparent);border-radius:6px;padding:1px 6px;font-style:normal;font-weight:600}.bar-row.today i{background:var(--hit);color:#fff}.win .yesterday{font-size:14px}.confetti{pointer-events:none;position:absolute;inset:0;overflow:visible}.confetti i{opacity:0;border-radius:2px;width:7px;height:11px;animation:1.8s cubic-bezier(.25,.6,.4,1) forwards fall;position:absolute;top:-8px}.confetti i.wide{width:11px;height:6px}@keyframes fall{0%{opacity:1;transform:translate(0)rotate(0)}to{opacity:0;transform:translate(var(--drift), 260px) rotate(var(--spin))}}.win.late{animation:.6s cubic-bezier(.22,.8,.32,1) both rise}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.win h2{font-family:var(--f-display);margin:0 0 4px;font-size:36px;font-weight:800;line-height:1.05}.win p{opacity:.85;margin:0}.win .actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.win button{font:600 15px var(--f-body);cursor:pointer;background:var(--accent-fg);color:var(--accent);border:0;border-radius:999px;padding:10px 20px}.win .clock{opacity:.8;font-variant-numeric:tabular-nums;font-size:14px}.win textarea{position:absolute;left:-9999px}@media (prefers-reduced-motion:reduce){.new .tile,.win.late{animation:none}.confetti{display:none}}button:focus-visible,a:focus-visible{outline:3px solid var(--ring);outline-offset:2px}a{color:var(--accent)}a.ghost{text-decoration:none;display:inline-block}.site-head{justify-content:space-between;align-items:center;gap:16px;display:flex}.site-head .home{line-height:0}.site-head img{width:auto;height:clamp(44px,10vw,64px)}.page{background:var(--surface);box-shadow:var(--shadow);border-radius:24px;max-width:76ch;padding:clamp(20px,4vw,40px)}.page h1{font:800 clamp(28px, 6vw, 40px)/1.1 var(--f-display);margin:0 0 12px}.page h2{font:700 20px var(--f-display);margin:28px 0 8px}.page p,.page li{color:var(--fg)}.page .lead{color:var(--muted);font-size:17px}.page ul{gap:6px;padding-left:20px;display:grid}.foot-wrap{margin-top:40px}.site-foot{border-top:1px solid var(--line);color:var(--muted);padding-top:16px;font-size:13px}.site-foot nav{flex-wrap:wrap;gap:6px 18px;margin-bottom:8px;display:flex}.site-foot nav a{color:var(--fg);font-weight:500;text-decoration:none}.site-foot nav a:hover{text-decoration:underline}.site-foot p{max-width:80ch;margin:0}.site-foot p a{color:inherit}
