html,body{margin:0;height:100%;overflow:hidden}html{background:#1d3320}@supports (height: 100lvh){html{height:100lvh}}canvas{display:block;position:fixed;left:0;top:0;width:100vw;height:100vh}@supports (height: 100lvh){canvas{height:100lvh}}.back{position:fixed;left:12px;bottom:12px;font:12px ui-monospace,Menlo,monospace;color:#fff;opacity:.5;text-decoration:none}.back:hover{opacity:1}.hint{position:fixed;right:12px;bottom:12px;margin:0;font:12px ui-monospace,Menlo,monospace;color:#fff;opacity:.4;pointer-events:none;transition:opacity 1.2s}.hint.gone{opacity:0}canvas{touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.back{display:none}.plate{position:fixed;top:max(24px,env(safe-area-inset-top));left:max(24px,env(safe-area-inset-left));pointer-events:none;color:#f3f5ee}.plate b{display:block;white-space:nowrap;font-family:IBM Plex Sans,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:56px;font-weight:700;letter-spacing:-.02em;line-height:.9;text-transform:uppercase;text-shadow:0 1px 24px rgba(10,30,8,.25)}.plate .head>i{display:block;margin-top:6px;font-style:normal;font:600 14px/1.15 Inter,Helvetica Neue,Helvetica,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}.plate .home{color:inherit;text-decoration:none;pointer-events:auto;opacity:.85}.plate .home:hover{opacity:1}.plate .home span[lang=ja]{font-family:Hiragino Sans,Hiragino Kaku Gothic ProN,Noto Sans JP,Yu Gothic,sans-serif;letter-spacing:.06em}@media(max-width:640px){.plate{top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left))}.plate b{font-size:34px}.plate .head>i{font-size:10px}}.fs{position:fixed;top:25px;right:22px;z-index:3;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(243,245,238,.45);border-radius:50%;background:#1428122e;color:#f3f5ee;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:opacity .4s,background .2s}.fs:hover{background:#14281259}.fs .out,body.clean .fs .in{display:none}body.clean .fs .out{display:inline}body.clean .plate,body.clean .hint{display:none}body.clean .fs{opacity:0}body.clean.near .fs,body.clean .fs:focus-visible{opacity:.7}body.clean.fullscreen .fs,.hint .narrow{display:none}@media(max-width:640px){.hint .wide{display:none}.hint .narrow{display:inline}}.gear{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom));right:22px;z-index:3;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(243,245,238,.45);border-radius:50%;background:#1428122e;color:#f3f5ee;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:opacity .4s,background .2s,transform .4s}.gear:hover,.gear.on{background:#14281266}.gear.on{transform:rotate(60deg)}.settings{position:fixed;bottom:calc(66px + env(safe-area-inset-bottom));right:22px;z-index:3;width:240px;max-height:calc(100vh - 100px);overflow:auto;padding:12px 14px 14px;border-radius:14px;border:.5px solid rgba(243,245,238,.3);background:#10200e8c;color:#f3f5ee;-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);font:12px/1.3 IBM Plex Sans,system-ui,sans-serif}.settings[hidden]{display:none}.settings h5{margin:10px 0 6px;padding-bottom:5px;border-bottom:1px solid rgba(243,245,238,.3);font:700 10px/1 Helvetica Neue,Helvetica,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;opacity:.8}.settings h5:first-child{margin-top:0}.settings .row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 0;cursor:pointer}.settings .row.range{flex-direction:column;align-items:stretch;gap:4px}.settings input[type=range]{width:100%;accent-color:#b9f06a}.settings select{background:#10200e99;color:inherit;border:.5px solid rgba(243,245,238,.45);border-radius:6px;padding:2px 4px;font:inherit}.settings input[type=checkbox]{accent-color:#b9f06a;width:15px;height:15px}.settings .act{display:inline-block;margin:4px 6px 0 0;padding:6px 10px 5px;border:.5px solid rgba(243,245,238,.45);border-radius:999px;background:none;color:inherit;cursor:pointer;font:700 9px/1 Helvetica Neue,Helvetica,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase}.settings .act:hover{background:#f3f5ee26}.settings .reset{display:block;margin-top:12px;opacity:.7}body.clean .gear,body.clean .settings{display:none}@media(max-width:640px){.gear{bottom:calc(14px + env(safe-area-inset-bottom));right:12px}.fs{top:14px;right:12px}.settings{bottom:calc(56px + env(safe-area-inset-bottom));right:12px;width:calc(100vw - 52px)}}body.loading,body.drawing{background-color:#f1f0e8;background-image:linear-gradient(rgba(111,143,106,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(111,143,106,.35) 1px,transparent 1px),linear-gradient(rgba(111,143,106,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(111,143,106,.22) 1px,transparent 1px),linear-gradient(rgba(111,143,106,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(111,143,106,.12) 1px,transparent 1px);background-size:50px 50px,50px 50px,25px 25px,25px 25px,5px 5px,5px 5px}canvas.pending{opacity:0}.plate{transition:color 1.4s ease}body.loading .plate{color:#2b3a2c}.plate .loading-label{opacity:0;transition:opacity .6s}body.loading .plate .loading-label{opacity:.7}body.loading .fs,body.loading .gear{opacity:0;pointer-events:none}.gyro,body.touch .fs{display:none}body.touch .gyro{position:fixed;top:max(14px,env(safe-area-inset-top));right:12px;z-index:3;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(243,245,238,.45);border-radius:50%;background:#1428122e;color:#f3f5ee;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s,color .2s}body.touch .gyro.on{background:#f3f5ee;color:#1f3a1c}body.loading .gyro{opacity:0;pointer-events:none}body.clean .gyro{display:none}body.drawing .plate{color:#2b3a2c}body.drawing .fs,body.drawing .gear,body.drawing .gyro{color:#2b3a2c;border-color:#2b3a2c73;background:#f1f0e880}body.snap .plate,body.snap .fs,body.snap .gear,body.snap .gyro{transition:none}.palette{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom));right:66px;z-index:3;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(243,245,238,.45);border-radius:50%;background:#1428122e;color:#f3f5ee;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s,opacity .4s}.palette:hover{background:#14281266}body.loading .palette,body.clean .palette{opacity:0;pointer-events:none}body.drawing .palette{color:#2b3a2c;border-color:#2b3a2c73;background:#f1f0e880}@media(max-width:640px){.palette{bottom:calc(14px + env(safe-area-inset-bottom));right:56px}}body:not(.loading) .plate .loading-label{display:none}.bug{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom));right:110px;z-index:3;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid rgba(243,245,238,.45);border-radius:50%;background:#1428122e;color:#f3f5ee;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .2s,opacity .4s}.bug:hover{background:#14281266}body.loading .bug,body.clean .bug{opacity:0;pointer-events:none}body.drawing .bug{color:#2b3a2c;border-color:#2b3a2c73;background:#f1f0e880}@media(max-width:640px){.bug{bottom:calc(14px + env(safe-area-inset-bottom));right:100px}}