:root{--bg:#fff6e0;--ink:#2a1c18;--muted:#6b5a52;--card:#fff;--line:#2a1c18;--a0:#ef4b5e;--a1:#2f80ed;--a2:#f2b200;--a3:#1fae66;--aink:#fff;--ok:#1fae66;--no:#e0475a;--late:#6b6484;--acc:#ef4b5e;--r:22px;--bw:3px;--shadow:0 6px 0 var(--line);--f-ui:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN",system-ui,sans-serif;--f-disp:"Mochiy Pop One","Hiragino Maru Gothic ProN",system-ui,sans-serif;color-scheme:light}body[data-style=s1]{--bg:#fff8ec}body[data-style=s2]{--bg:#fff6ef;--ink:#4a352d;--line:#4a352d;--a0:#ff8597;--a1:#6fb1ff;--a2:#ffc94d;--a3:#62cf92;--aink:#3e2a24;--r:30px;--bw:2.5px;--shadow:inset 0 -6px 0 rgba(74,53,45,.14)}body[data-style=s3]{--bg:#fff3c4;--a0:#ff3d6e;--a1:#2d7bff;--a2:#ffbf00;--a3:#00c27a;--line:#fff;--bw:4px;--shadow:0 8px 0 rgba(43,29,63,.35);--acc:#7c3aed}body[data-style=s4]{--bg:#fff4d6;--a0:#f0555a;--a1:#3f8fe0;--a2:#f6c343;--a3:#4cbf73;--line:#3a2420;--r:26px;--shadow:0 5px 0 rgba(58,36,32,.4);--acc:#3f8fe0}body[data-style=s5]{--bg:#fff;--line:#111;--a0:#ff3b5c;--a1:#2f6bff;--a2:#f5b700;--a3:#16a864;--r:10px;--bw:4px;--shadow:6px 6px 0 #111;--acc:#111}body[data-style=s6]{--bg:#efe3c8;--ink:#231c18;--line:#231c18;--a0:#d9432f;--a1:#2e4f86;--a2:#d9a441;--a3:#5f8f4e;--aink:#f6ecd6;--r:8px;--bw:2px;--shadow:inset 0 0 0 5px rgba(246,236,214,.28),0 4px 0 #231c18;--acc:#c8322a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;position:fixed;inset:0;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--f-ui);font-size:17px;overscroll-behavior:none}#app{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;display:block}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}h1{font-family:var(--f-disp);font-weight:400;font-size:clamp(26px,8vw,38px);margin:.2em 0;text-align:center;line-height:1.15;text-wrap:balance}.screen{flex:1;display:flex;flex-direction:column;gap:14px;padding:calc(env(safe-area-inset-top,0px) + 16px) 16px calc(env(safe-area-inset-bottom,0px) + 16px);max-width:560px;margin:0 auto;width:100%;min-height:100%}.center{justify-content:center;align-items:center}.stack{display:flex;flex-direction:column;align-items:center;gap:10px;flex:1;justify-content:center;text-align:center}.title{font-size:56px;margin:0}.logo{margin-bottom:-6px}.lbl{font-weight:800;font-size:15px;color:var(--muted);letter-spacing:.02em}.sub{color:var(--muted);margin:0;max-width:30ch}.sub.light{color:#ffffffe6}.err{background:#ffe1e5;color:#8a1c2c;border-radius:14px;padding:10px 14px;margin:0;font-weight:800;text-align:center}.send{appearance:none;border:var(--bw) solid var(--line);background:var(--ink);color:#fff;font-family:var(--f-disp);font-size:22px;border-radius:999px;min-height:64px;padding:0 28px;width:100%;box-shadow:0 5px #00000040}body[data-style=s3] .send{background:#7c3aed;border-color:#fff}.send:disabled{opacity:.45;box-shadow:none}.send:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px #00000040}.link{appearance:none;background:none;border:0;color:var(--muted);text-decoration:underline;font-size:15px;padding:12px}.codebox{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;width:100%;max-width:380px}.codebox span{aspect-ratio:3/4;border:var(--bw) solid var(--line);border-radius:14px;background:#fff;display:grid;place-items:center;font-family:var(--f-disp);font-size:clamp(28px,9vw,40px)}.codebox span.cur{outline:4px solid var(--acc);outline-offset:1px}.codebox input{position:absolute;inset:0;opacity:0;font-size:16px}.profile{gap:12px}.back{appearance:none;background:none;border:0;align-self:flex-start;font-weight:800;color:var(--muted);padding:6px 0}.preview{display:grid;place-items:center;height:170px;animation:bob 2.4s ease-in-out infinite}.name{font:inherit;font-size:24px;font-weight:800;text-align:center;border:var(--bw) solid var(--line);border-radius:16px;padding:14px;background:#fff;width:100%}.namebox{position:relative}.namebox .name{padding:14px 58px}.emobtn{position:absolute;right:8px;top:50%;transform:translateY(-50%);appearance:none;border:0;background:#f1ece4;border-radius:12px;width:44px;height:44px;font-size:24px;display:grid;place-items:center}.emobtn.on{background:var(--acc)}.count{margin:-6px 4px 0;text-align:right;font-size:13px;font-weight:800;color:var(--muted)}.count.full{color:#c2410c}.emoji{background:#fff;border:var(--bw) solid var(--line);border-radius:16px;overflow:hidden}.etabs{display:flex;border-bottom:2px solid #eee;overflow-x:auto}.etabs button{appearance:none;border:0;background:none;flex:1;min-width:44px;height:44px;font-size:22px;opacity:.55}.etabs button.on{opacity:1;box-shadow:inset 0 -3px 0 var(--acc)}.egrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));max-height:200px;overflow-y:auto;padding:6px}.egrid button{appearance:none;border:0;background:none;height:44px;font-size:28px;border-radius:10px;touch-action:manipulation}.egrid button:active{background:#f1ece4;transform:scale(1.2)}.egrid.full button{opacity:.35}.pick{border:0;padding:0;margin:0}.pick legend{font-weight:800;font-size:14px;color:var(--muted);margin-bottom:6px}.pick .opts{display:flex;gap:8px;flex-wrap:wrap}.pick button{appearance:none;border:2px solid transparent;background:#fff;border-radius:14px;min-width:48px;min-height:48px;padding:4px;display:grid;place-items:center}.pick button.on{border-color:var(--line);box-shadow:0 0 0 3px var(--acc)}.pick .dot{width:34px;height:34px;border-radius:50%;border:2px solid rgba(0,0,0,.25);display:block}.pick .mini{display:grid;justify-items:center;gap:0;padding:2px 6px}.pick small{font-size:11px;color:var(--muted)}.quick .stack{gap:14px;width:100%}.qname{font-family:var(--f-disp);font-size:clamp(30px,9vw,44px);margin:0;line-height:1.1;word-break:break-word}.notme{appearance:none;border:0;background:none;color:var(--muted);font-weight:700;text-decoration:underline;padding:8px}.dice{appearance:none;border:2px dashed var(--muted);background:none;border-radius:999px;padding:10px;font-weight:800;color:var(--muted)}.game{gap:10px}.bar{display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:800;font-size:14px;min-height:36px}.bar .who{display:flex;align-items:center;gap:6px;max-width:40%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.bar .qn{font-family:var(--f-disp);font-weight:400;font-size:15px}.bar .net{position:fixed;top:calc(env(safe-area-inset-top,0px) + 6px);left:50%;transform:translate(-50%);background:#2a1c18;color:#fff;border-radius:999px;padding:4px 12px;font-size:13px}.count{font-weight:800}.bob{animation:bob 2.2s ease-in-out infinite}.bob.wobble{animation:wob .9s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-10px)}}@keyframes wob{25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}.answer{flex:1;display:flex;flex-direction:column;gap:10px}.hint{text-align:center;font-weight:800;color:var(--muted)}.grid{flex:1;display:grid;gap:12px;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;min-height:55vh}.grid.g1,.grid.g2,.grid.g3{grid-template-columns:1fr}.ans{appearance:none;border:var(--bw) solid var(--line);border-radius:var(--r);display:grid;place-items:center;align-content:center;gap:4px;color:var(--aink);box-shadow:var(--shadow);position:relative;font-family:var(--f-disp);font-size:26px;min-height:96px;transition:transform .08s}.ans:active{transform:translateY(4px) scale(.98);box-shadow:none}.ans svg{filter:drop-shadow(0 2px 0 rgba(0,0,0,.2))}.ans.b0{background:var(--a0)}.ans.b1{background:var(--a1)}.ans.b2{background:var(--a2)}.ans.b3{background:var(--a3)}body[data-style=s3] .ans{background-image:linear-gradient(180deg,#ffffff38,#00000014)}body[data-style=s5] .ans{background-image:radial-gradient(rgba(0,0,0,.16) 1.4px,transparent 1.6px);background-size:8px 8px}.ans.tall{min-height:140px}.ans.tog{opacity:.55}.ans.tog.on{opacity:1;outline:6px solid var(--ink);outline-offset:-10px}.ans .check{position:absolute;top:8px;right:12px;font-size:30px;opacity:0;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.4)}.ans.tog.on .check{opacity:1}.slider{flex:1;display:flex;flex-direction:column;gap:14px;justify-content:center}.bignum{text-align:center;font-family:var(--f-disp)}.bignum b{font-weight:400;font-size:96px;line-height:1}.bignum span{font-size:32px;margin-left:6px;color:var(--muted)}.slider input[type=range]{width:100%;height:56px;accent-color:var(--a1)}.slider input[type=range]::-webkit-slider-thumb{width:44px;height:44px}.scale{display:flex;justify-content:space-between;font-weight:800;color:var(--muted);margin-top:-10px}.nudge{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.nudge button{appearance:none;border:var(--bw) solid var(--line);background:#fff;border-radius:14px;min-height:56px;font-weight:800;font-size:20px}.order{flex:1;display:flex;flex-direction:column;gap:10px}.order ol{list-style:none;margin:0;padding:0;display:grid;gap:8px;touch-action:none}.order li{display:flex;align-items:center;gap:10px;background:#fff;border:var(--bw) solid var(--line);border-radius:16px;min-height:64px;padding:6px 8px;user-select:none;transition:transform .12s}.order li.dragging{transition:none;box-shadow:0 12px 24px #0003;z-index:2;position:relative}.order .num{font-family:var(--f-disp);width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;flex:none}.order .grip{font-size:26px;color:var(--muted);padding:8px 2px;cursor:grab;touch-action:none}.order .lbl{flex:1;font-weight:800;font-size:20px;color:var(--ink);letter-spacing:0;touch-action:none;padding:10px 0}.order .arrows{display:flex;gap:4px}.order .arrows button{appearance:none;border:2px solid var(--line);background:var(--bg);border-radius:10px;width:40px;height:40px;font-size:14px}.order .arrows button:disabled{opacity:.25}.pin{flex:1;display:flex;flex-direction:column;gap:10px}.pinimg{position:relative;width:100%;border:var(--bw) solid var(--line);border-radius:14px;overflow:hidden;touch-action:none;background:#eee}.pinimg img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;user-select:none}.needle{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;background:#ff2d5559;border:4px solid #ff2d55;box-shadow:0 0 0 3px #fff}.timebar{position:relative;height:30px;border-radius:999px;background:#00000014;overflow:hidden}.timebar i{position:absolute;inset:0;background:var(--a3);transform-origin:0 50%;border-radius:999px}.timebar.low i{background:var(--a0)}.timebar span{position:relative;display:block;text-align:center;font-weight:800;line-height:30px}.locked{font-size:64px}.dots{display:flex;gap:6px}.dots i{width:10px;height:10px;border-radius:50%;background:var(--muted);animation:dot 1s infinite}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}@keyframes dot{0%,to{opacity:.25}40%{opacity:1;transform:translateY(-5px)}}.result{flex:1;border-radius:28px;color:#fff;padding:24px}.result.ok{background:var(--ok)}.result.no{background:var(--no)}.result.late{background:var(--late)}.pill{background:#ffffff40;border-radius:999px;padding:6px 18px;font-weight:800;font-size:22px}.final h1{font-size:44px}.card{background:#fff;border:var(--bw) solid var(--line);border-radius:24px;padding:24px;display:grid;gap:12px;text-align:center;max-width:360px}.spin{width:48px;height:48px;border-radius:50%;border:5px solid rgba(0,0,0,.12);border-top-color:var(--acc);animation:spin 1s linear infinite;margin:auto}@keyframes spin{to{transform:rotate(360deg)}}button:focus-visible,input:focus-visible{outline:4px solid var(--acc);outline-offset:2px}@media(prefers-reduced-motion:reduce){.bob,.preview,.dots i,.spin{animation:none}}.bootslow{opacity:0;animation:bootshow .3s 6s forwards}@keyframes bootshow{to{opacity:1}}
