:root{--ink:#2f453c;--teal:#287a6b;--paper:#fcf8eb;--desk:#ece8d9}*{box-sizing:border-box}body{background:var(--desk);color:var(--ink);background-image:repeating-linear-gradient(0deg,#0000 0 127px,#908a7010 128px 129px);margin:0;font-family:Yu Gothic,Hiragino Kaku Gothic ProN,Meiryo,sans-serif}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default}button:focus-visible,canvas:focus-visible{outline-offset:4px;outline:3px solid #c67c36}button{transition:transform .12s,background .12s}button:active:not(:disabled){transform:translateY(2px)}[hidden]{display:none!important}.desk{width:min(1140px,100% - 48px);margin:22px auto 0}.masthead{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.eyebrow{letter-spacing:1.6px;color:#5d7365;margin:0 0 6px;font-size:10px;font-weight:800}.eyebrow span{letter-spacing:1px;border-left:1px solid #9ea99a;margin-left:10px;padding-left:13px;display:inline-block}h1{letter-spacing:2px;margin:0;font-size:30px;line-height:1.3}h1 span{font-weight:500}h1 i{color:var(--teal);vertical-align:middle;margin-left:12px;font-size:35px;font-style:normal}.tagline{letter-spacing:.5px;color:#6b7868;margin:5px 0 0;font-size:11px}.head-actions{gap:8px;display:flex}.icon-button{background:#f8f4e8;border:1px solid #a6b1a0;border-radius:50%;width:44px;height:44px;font-size:19px;font-weight:700}.icon-button:disabled{opacity:.4}.game-layout{grid-template-columns:minmax(0,1fr) 232px;align-items:start;gap:24px;display:grid}.notebook{background:var(--paper);border:1px solid #bbc5af;border-radius:5px 12px 12px 5px;position:relative;overflow:hidden;box-shadow:3px 4px #d0d5c1,4px 6px 18px #3f523614}.binding{background:#ebecdc;border-bottom:1px solid #d3d9c6;justify-content:space-around;align-items:flex-start;height:13px;display:flex}.binding i{background:var(--desk);border:2px solid #748d78;border-top:0;border-radius:0 0 5px 5px;width:8px;height:10px;margin-top:-2px;display:block}.hud{background:#faf7e9;border-bottom:1px solid #d9decd;justify-content:space-between;align-items:center;min-height:64px;padding:13px 24px 10px;display:flex}.hud small{color:#788674;letter-spacing:1px;margin-bottom:2px;font-size:10px;font-weight:700;display:block}.hud strong{font-variant-numeric:tabular-nums;font-size:22px;font-weight:800}.hud em{color:#86917e;font-size:12px;font-style:normal;font-weight:500}.health span{letter-spacing:2px;color:#bd665b;font-size:19px;display:block}.wave{text-align:center}.defeats{text-align:right}.arena{aspect-ratio:900/520;isolation:isolate;position:relative;overflow:hidden}canvas{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block;position:absolute;inset:0}.field-note{background:#f3f1e2;border-top:1px solid #dde0ce;align-items:center;gap:8px;min-height:35px;padding:6px 16px;display:flex}.field-note .dot{background:var(--teal);border-radius:50%;flex:none;width:6px;height:6px}.field-note p{color:#536b59;margin:0;font-size:11px;font-weight:600;line-height:1.7}.pencil-case{background:#e2e7d5;border:1px solid #c6ceba;border-radius:9px;padding:19px 15px 14px;position:relative;box-shadow:2px 3px #cdd3bf}.pencil-case:before{content:"";background:#f2ddb19a;border:1px solid #dbc99966;width:100px;height:18px;display:block;position:absolute;top:-8px;left:60px;transform:rotate(-4deg)}.case-heading{margin:3px 3px 20px;position:relative}.case-heading .eyebrow{font-size:8px}.case-heading h2{letter-spacing:1px;margin:0;font-size:19px}.case-heading>span{color:#799581;font-size:30px;position:absolute;bottom:1px;right:8px}.pencil-status{border-bottom:1px dashed #b8c5ad;align-items:center;gap:18px;margin-bottom:17px;padding:0 4px 17px;display:flex}.pencil-status small{color:#6b7f69;font-size:10px}.pencil-status strong{font-size:16px;display:block}.pencil-status p{color:#64816c;margin:5px 0 0;font-size:10px}.pencil-mark{background:linear-gradient(90deg,#e6ae43 50%,#f3c96c 50%);border:1.5px solid #5a6548;border-radius:2px;flex:none;width:12px;height:58px;margin-left:8px;display:block;position:relative;transform:rotate(20deg)}.pencil-mark:after{content:"";border-bottom:14px solid #5c624a;border-left:6px solid #0000;border-right:6px solid #0000;position:absolute;top:-13px;left:-1.5px}.pencil-mark:before{content:"";background:#d68b8f;width:100%;height:9px;position:absolute;bottom:0;left:0}.tools{flex-direction:column;gap:8px;display:flex}.tool{text-align:left;background:#f4f4e8aa;border:1px solid #c9d1bf;border-radius:6px;align-items:center;gap:10px;width:100%;min-height:57px;padding:10px 8px;display:flex}.tool:not(.owned){opacity:.67}.tool-symbol{color:#a57637;background:#ecce8c;border:1px solid #cfb473;border-radius:5px;flex:none;justify-content:center;align-items:center;width:29px;height:31px;font-size:24px;font-weight:800;display:flex}.ruler .tool-symbol{color:#5d846a;background:#c1d9b9;border-color:#adc6a7;transform:rotate(-8deg)}.protractor .tool-symbol{color:#997739;background:#e7d2a0;border-radius:20px 20px 3px 3px}.tool strong{font-size:12px;display:block}.tool small{color:#60765d;white-space:nowrap;margin-top:3px;font-size:9px;display:block}.tool em{color:#6f8569;white-space:nowrap;margin-left:auto;font-size:8px;font-style:normal}.tool.owned{background:#f9f9e9;border-color:#7fa18a}.tool.owned em{color:#267c67}.tool.owned button:hover{background:#fff}.eraser-mark{background:linear-gradient(90deg,#d77f8b 40%,#faf1dd 40% 90%,#d77f8b 90%);border:2px solid #856761;border-radius:4px;flex:none;width:29px;height:23px;transform:rotate(-14deg)}.case-note{text-align:center;color:#778570;margin:19px 0 2px;font-size:10px;line-height:1.9}footer{color:#8a907e;letter-spacing:1px;justify-content:space-between;align-items:center;padding:16px 3px;font-size:8px;display:flex}footer p{letter-spacing:0;margin:0;font-size:10px}footer p span{margin:0 6px}kbd{background:#f0f0e2;border:1px solid #c7cebb;border-radius:3px;padding:1px 3px;font-family:inherit;font-size:9px}.screen{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#f8f5e85c;place-items:center;padding:16px;display:grid;position:absolute;inset:0}.intro-card,.pause-card,.result-card{text-align:center;background:#fffcf2f5;border:1px solid #becbb5;border-radius:4px;width:min(360px,100%);padding:26px 24px 22px;transform:rotate(-1deg);box-shadow:3px 4px #b7c5ae50}.stamp{letter-spacing:1.5px;color:#b45e4b;margin:0 0 13px;font-size:10px;font-weight:800}.screen h2{letter-spacing:1px;margin:0 0 10px;font-size:24px;line-height:1.6}.screen p:not(.stamp){color:#66775f;margin:9px 0 18px;font-size:12px;line-height:1.9}.screen small{color:#7c8870;margin-top:12px;font-size:9px;display:block}.primary{background:var(--teal);color:#fffae9;letter-spacing:1px;border:1px solid #1d6258;border-radius:5px;width:100%;min-height:48px;padding:13px 16px;font-size:15px;font-weight:700;display:block;box-shadow:0 3px #18564d}.primary span{float:right}.primary:hover{background:#326e5e}.text-button{color:#64806c;background:0 0;border:0;min-height:44px;margin-top:8px;font-size:12px;text-decoration:underline}.result-card{transform:rotate(.6deg)}.result-card h2{font-size:23px}#best{color:#a07631;font-size:11px}dialog{background:var(--paper);color:var(--ink);border:1px solid #bac6ac;border-radius:10px;width:min(580px,100% - 28px);max-height:calc(100dvh - 24px);padding:0;box-shadow:0 20px 80px #263d3b35}dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#263d3b66}.dialog-inner{padding:28px}.dialog-inner h2{margin:10px 0;font-size:23px}.dialog-inner>p:not(.eyebrow){color:#657a63;font-size:12px;line-height:1.8}.dialog-inner>small{text-align:center;color:#7a876e;font-size:11px;line-height:1.7;display:block}.shape-options{grid-template-columns:1fr 1fr;gap:12px;margin:23px 0;display:grid}.shape-options button{background:#f0efdc;border:2px solid #bac8ad;border-radius:7px;min-height:180px;padding:16px 10px}.shape-options button:hover{border-color:var(--teal);background:#e3edd8}.shape-options svg{width:100%;height:55px}.shape-options strong,.shape-options span,.shape-options small{display:block}.shape-options strong{margin:5px 0 9px;font-size:17px}.shape-options span{color:var(--teal);font-size:11px;font-weight:700}.shape-options small{color:#7d886d;margin-top:8px;font-size:9px}ol{padding-left:21px;font-size:12px;line-height:1.9}li{margin:15px 0;padding-left:5px}li strong{color:var(--teal);font-size:14px}@media (max-width:900px) and (min-width:701px){.desk{width:calc(100% - 30px)}.game-layout{grid-template-columns:minmax(0,1fr) 200px;gap:14px}.pencil-case{padding:16px 10px}.tool{gap:6px}.case-note{display:none}h1{font-size:27px}.case-heading h2{font-size:17px}footer>span:last-child{display:none}}@media (max-width:700px){.desk{width:calc(100% - 24px);margin:12px auto 0}.masthead{margin-bottom:12px}.eyebrow{letter-spacing:1px;margin-bottom:3px;font-size:8px}h1{letter-spacing:1px;font-size:24px}h1 i{margin-left:6px;font-size:27px}.tagline{letter-spacing:0;font-size:9px}.head-actions{gap:6px}.icon-button{width:40px;min-width:40px;height:40px}.game-layout{flex-direction:column;gap:12px;display:flex}.notebook{width:100%}.binding{height:9px}.hud{min-height:52px;padding:8px 15px}.hud strong{font-size:19px}.hud small{font-size:9px}.health span{letter-spacing:1px;font-size:16px}.field-note{min-height:33px;padding:5px 10px}.field-note p{font-size:9px}.pencil-case{grid-template-columns:1fr;gap:9px;width:100%;padding:10px;display:grid}.pencil-case:before,.case-heading,.case-note{display:none}.pencil-status{border:0;gap:12px;margin:0;padding:0}.pencil-mark{width:7px;height:22px;margin-left:5px}.pencil-mark:after{border-bottom-width:8px;border-left-width:3.5px;border-right-width:3.5px;top:-8px;left:-1.5px}.pencil-mark:before{height:4px}.pencil-status>div{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.pencil-status small{font-size:9px}.pencil-status strong{font-size:12px}.pencil-status p{margin:0;font-size:9px}.tools{flex-direction:row;gap:6px}.tool{flex:1;gap:5px;min-width:0;min-height:47px;padding:7px 5px}.tool-symbol{width:22px;height:25px;font-size:19px}.tool strong{font-size:10px}.tool small{white-space:normal;font-size:8px}.tool em{display:none}footer{padding:12px 1px;font-size:7px}footer>span:last-child{display:none}footer p{font-size:8px}footer kbd{font-size:7px}.intro-card,.pause-card,.result-card{max-width:294px;padding:21px 16px 17px}.screen h2{font-size:21px}.screen p:not(.stamp){margin-bottom:15px;font-size:11px}.stamp{margin-bottom:10px;font-size:9px}.primary{min-height:46px;padding:12px;font-size:14px}.screen small{font-size:8px}.dialog-inner{padding:22px 16px}.dialog-inner h2{font-size:21px}.shape-options{gap:8px}.shape-options button{min-height:165px;padding:12px 5px}.shape-options strong{font-size:15px}.shape-options span{font-size:10px}.shape-options small{font-size:8px}}@media (max-width:700px) and (max-height:720px){.desk{margin-top:7px}.masthead{margin-bottom:7px}.tagline{display:none}.game-layout{gap:8px}.pencil-case{gap:7px;padding:8px}.screen{padding:10px}.intro-card,.pause-card,.result-card{padding:12px 15px}.screen h2{font-size:18px;line-height:1.4}.screen p:not(.stamp){margin:7px 0 10px;font-size:10px}.screen small{margin-top:9px}.stamp{margin-bottom:7px}footer{padding:8px 1px}.field-note{min-height:29px}.field-note p{font-size:8px}}@media (min-width:701px) and (max-height:780px){.case-note{display:none}.case-heading{margin-bottom:12px}.pencil-status{margin-bottom:12px;padding-bottom:12px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.sharpness-panel{background:#f8f7e5;border:1px solid #aebfa4;border-radius:5px;margin:0 0 14px;padding:9px 10px}.sharpness-panel strong{font-size:12px;display:block}.sharpness-panel small{color:#6b7c60;margin-top:3px;font-size:9px;display:block}.sharpness-panel meter{accent-color:#3d8e75;width:100%;height:12px;margin-top:4px;display:block}.sharpness-panel.low{background:#fff0cf;border-color:#bc7358}.sharpness-panel.low strong{color:#ad563d}.tool.eraser{margin-top:8px}.tool em{font-size:10px}.tool strong{font-size:11px}.pencil-case{padding-top:16px}.case-heading{margin-bottom:14px}.pencil-status{margin-bottom:12px;padding-bottom:12px}@media (max-width:700px){.sharpness-panel{margin:0;padding:6px 8px}.sharpness-panel>div{justify-content:space-between;align-items:center;gap:4px;display:flex}.sharpness-panel small{margin:0;font-size:8px}.sharpness-panel meter{height:9px;margin-top:3px}.tools{grid-template-columns:1fr 1fr;display:grid}.tool{min-height:44px;padding-right:32px;position:relative}.tool em{font-size:9px;display:block;position:absolute;top:8px;right:5px}.tool.eraser{grid-area:1/2;margin:0}.pencil-case{grid-template-columns:1fr 1fr;gap:6px;display:grid}.pencil-status,.sharpness-panel,.tools{grid-column:1/-1}.tools{display:contents}.tool.eraser{grid-area:auto}.pencil-status{margin:0;padding:0}.pencil-status strong{font-size:12px}.tool strong{font-size:10px}.tool-symbol,.eraser-mark{width:23px;height:23px}.pencil-case>.tool.eraser{grid-column:2}.case-note{display:none}}.survival{text-align:center}.survival strong{font-size:20px}.sharpness-panel.recoil{background:#fce4de;border-color:#b64f5e}.sharpness-panel.recoil strong,.sharpness-panel.recoil small{color:#9e354a}.arena.recoil:after{content:"";pointer-events:none;z-index:2;position:absolute;inset:0;box-shadow:inset 0 0 0 4px #b64f5e99}@media (max-width:700px){.survival strong{font-size:16px}.sharpness-panel.recoil>div{flex-wrap:wrap}.hud{gap:6px}.hud small{letter-spacing:0}.defeats strong{font-size:17px}}
