:root{--ink:#1b1b1b;--paper:#fffdf7;--red:#d4261e;--indigo:#25476a;--desk:#dde3e6;--rule:#c9c3b4;--mincho:"Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;--maru:"Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Yu Gothic", sans-serif}*{box-sizing:border-box}html,body{height:100%}body{background:var(--desk);color:var(--ink);font-family:var(--mincho);margin:0}#app{grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);gap:10px;height:100dvh;padding:10px clamp(8px,2vw,24px) 12px;display:grid}.bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.bar h1{letter-spacing:.08em;margin:0;font-size:1.15rem;font-weight:600}.tabs{gap:6px;display:flex}.stage{min-height:0;position:relative}button{font:700 1.05rem/1 var(--maru);color:var(--ink);border:2px solid var(--ink);background:var(--paper);cursor:pointer;border-radius:14px;min-width:52px;min-height:52px;padding:0 14px}button:hover:not(:disabled){box-shadow:0 2px 0 var(--ink);background:#fff}button:focus-visible{outline-offset:2px;outline:4px solid #2563eb}button[aria-pressed=true]{background:var(--indigo);border-color:var(--indigo);color:#fff}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--red);border-color:var(--red);color:#fff;padding:0 28px}button.primary:hover:not(:disabled){box-shadow:none;background:#e03a31}.tabs button{min-height:44px}.paper{background:var(--paper);border:1px solid var(--rule);border-top:6px double var(--ink);border-radius:4px;height:100%;box-shadow:0 6px 18px #1e2d3c2e}.sheet{writing-mode:vertical-rl;scrollbar-width:thin;width:100%;padding:18px 24px 18px 28px;font-size:28px;line-height:2.3;overflow:auto hidden}.sheet .title{margin-inline-start:1.3em;font-weight:600}.sheet .q,.sheet .c{margin-inline-start:1em}.sheet .no,.sheet .sym{margin-block-end:.15em;font-weight:600}.sheet .box{writing-mode:horizontal-tb;text-align:center;width:1.8em;height:1.8em;line-height:1.7em;font-family:var(--maru);color:var(--indigo);border:2px solid var(--ink);vertical-align:middle;margin-block-start:.45em;font-size:.85em;font-weight:700;display:inline-block}.sheet .box.ok{border-color:var(--red);color:var(--red);border-radius:50%}.sheet .box.ng{border-color:var(--red);color:var(--red)}.sheet .mark{color:var(--red);font-family:var(--maru);margin-block-start:.3em;font-weight:700}rt{color:#4a4a4a;font-size:.48em;font-family:var(--maru);font-weight:500}.stamp{border:4px solid var(--red);width:64px;height:64px;color:var(--red);text-align:center;font:700 1.6rem/1 var(--maru);border-radius:50%;place-content:center;animation:.35s cubic-bezier(.2,1.6,.4,1) both stamp;display:grid;transform:rotate(-8deg)}.stamp small{font-size:1rem}@keyframes stamp{0%{opacity:0;transform:rotate(-8deg)scale(1.8)}}@media (prefers-reduced-motion:reduce){.stamp{animation:none}}.dock{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 22px;display:flex}.grp{align-items:center;gap:6px;display:flex}.grp .lbl{text-align:center;width:1.4em;font-size:1.5rem;font-weight:600}.grp button{min-width:56px;min-height:56px;font-size:1.3rem}.dock .actions{gap:10px;display:flex}.counter{font:500 1rem var(--maru);text-align:center;min-width:5em}.note{margin:0;padding:20px;font-size:1.1rem}.card{width:100%;height:100%;font-family:var(--mincho);cursor:pointer;background:0 0;border:0;border-radius:0;place-items:center;padding:16px;font-size:40px;font-weight:600;line-height:2.3;display:grid}.card:hover:not(:disabled){box-shadow:none;background:0 0}.card .vt{writing-mode:vertical-rl;text-align:start;max-height:100%}.paper.scroll{padding:18px 22px;overflow:auto}.summary{font:700 1.4rem var(--maru);margin:0 0 12px}.hist{margin:0 0 18px;padding:0;list-style:none}.hist li{border-bottom:1px dashed var(--rule);padding:10px 2px;font-size:1.05rem}.hist .when{font-family:var(--maru);color:#6b6b6b;margin-right:10px}.hist b{font-family:var(--maru)}.hist .wrong{color:var(--red);margin-top:2px;font-size:.95rem;display:block}@media (width<=640px){#app{gap:8px;padding:8px}.bar h1{display:none}.bar{flex-wrap:nowrap;justify-content:flex-end}.bar .stamp{margin-right:auto}.tabs button{min-width:46px;padding:0 10px;font-size:.95rem}.dock{grid-template-columns:1fr 1fr;gap:8px 6px;display:grid}.grp{justify-content:center;gap:3px}.grp button{min-width:38px;min-height:48px;padding:0 4px;font-size:1.15rem}.grp .lbl{width:1.2em;font-size:1.15rem}.dock .actions{grid-column:1/-1;justify-content:center}.dock .actions button{min-height:48px}.stamp{border-width:3px;width:52px;height:52px;font-size:1.3rem}}