@property --edge{syntax:"<percentage>";inherits:false;initial-value:0%}@property --miss-fade{syntax:"<number>";inherits:false;initial-value:0}:root{--bg:#f7f5f0;--bg-grad:#fdfcf8;--paper:#fff;--ink:#1c1a17;--ink-2:#5c5852;--ink-3:#9a958a;--line:#e9e5db;--line-2:#d9d4c7;--green:#2d7a4f;--paint-green:#1f9e55;--yellow:#c48a1a;--gray:#b8b3a6;--tint-short-fill:#efe9f7;--tint-short-edge:#8b6bb5;--tint-equal-fill:#eaf4ee;--tint-equal-edge:#a8cdb6;--tint-excess-fill:#fbf3d4;--tint-excess-edge:#d9b84a;--ghost:#efece3;--radius:12px;--font-sans:Inter, "Hiragino Sans", "Noto Sans JP", system-ui, sans-serif;--font-serif:"Noto Serif JP", "Hiragino Mincho ProN", serif;--glyph-weight:1;--ease:cubic-bezier(.2, .7, .3, 1)}*{box-sizing:border-box}body{min-height:100dvh;color:var(--ink);font-family:var(--font-sans);background:radial-gradient(120% 80% at 50% 0%, var(--bg-grad), var(--bg) 70%) fixed;-webkit-font-smoothing:antialiased;margin:0}body.modal-open{overflow:hidden}.app{flex-direction:column;gap:18px;width:min(440px,100%);height:100svh;margin:0 auto;padding:22px 18px 26px;display:flex;overflow:hidden}.boot-loading{text-align:center;width:min(440px,100%);color:var(--ink-2);margin:0 auto;padding:80px 18px;font-size:14px}.boot-error{text-align:center;flex-direction:column;align-items:center;gap:12px;width:min(440px,100%);margin:0 auto;padding:80px 18px;display:flex}.boot-error-title{font-family:var(--font-serif);color:var(--ink);margin:0;font-size:18px}.boot-error-body{color:var(--ink-2);margin:0;font-size:14px}.boot-error-retry{background:var(--ink);color:var(--paper);font-family:var(--font-sans);cursor:pointer;border:0;border-radius:999px;margin-top:4px;padding:10px 22px;font-size:14px}.boot-error-retry:hover{opacity:.9}.header{justify-content:space-between;align-items:center;display:flex}.brand{align-items:center;gap:10px;display:flex}.brand-marks{align-items:center;gap:4px;display:flex}.brand-kanji{width:24px;height:24px;font-family:var(--font-serif);color:var(--ink);background:0 0;border-radius:7px;place-items:center;font-size:14px;line-height:1;display:grid}.brand-kanji.brand-mark{background:var(--ink);color:var(--paper)}.brand-text{letter-spacing:.26em;color:var(--ink-2);font-size:10.5px;font-weight:600}.turn{color:var(--ink-3);font-size:11px}.turn b{color:var(--ink);font-size:12px;font-weight:600}.turn .sep{opacity:.5;margin:0 1px}.board-area{flex:1;justify-content:center;min-height:0;display:flex}.board{aspect-ratio:2/6;grid-template-rows:repeat(6,minmax(0,1fr));gap:9px;height:100%;display:grid}.row{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;min-height:0;display:grid}.cell{border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);height:100%;position:relative;overflow:hidden}.cell.empty{border-style:dashed;border-width:1.5px;border-color:var(--line-2);cursor:pointer;font:inherit;appearance:none;background:0 0;place-items:center;padding:0;display:grid}.cell.empty:before{content:"";background:var(--line-2);opacity:.55;border-radius:3px;width:12px;height:12px;transition:opacity .2s,transform .2s}.cell.empty:hover{background:#ffffff80;border-color:#b8b2a2}.cell.empty:hover:before{opacity:.85;transform:scale(1.08)}.cell.empty:active{transform:scale(.985)}.cell svg{width:100%;height:100%;position:absolute;inset:0}.stroke{fill:none;stroke:var(--ink);stroke-width:calc(6px * var(--glyph-weight));stroke-linecap:round;stroke-linejoin:round}.stroke[data-paint=green]{--final:var(--paint-green);stroke-width:calc(9px * var(--glyph-weight))}.stroke[data-paint=yellow]{--final:var(--yellow);stroke-width:calc(9px * var(--glyph-weight))}.stroke[data-paint=gray]{--final:var(--gray)}.placeholder-dot{fill:var(--ink-3)}.placeholder-dot[data-paint=green]{--final:var(--paint-green)}.placeholder-dot[data-paint=yellow]{--final:var(--yellow)}.placeholder-dot[data-paint=gray]{--final:var(--gray)}.frame{fill:#0000;stroke:#0000;vector-effect:non-scaling-stroke;fill-rule:evenodd}.frame[data-frame=short]{fill:var(--tint-short-fill);stroke:var(--tint-short-edge);stroke-width:1.5px;stroke-dasharray:4 3}.frame[data-frame=equal]{fill:var(--tint-equal-fill);stroke:var(--tint-equal-edge);stroke-width:2px}.frame[data-frame=excess]{fill:var(--tint-excess-fill);stroke:var(--tint-excess-edge);stroke-width:1.5px}.reading{background:color-mix(in oklch, var(--line-2), transparent 25%);--at:0s;--dur:.7s;--edge:0%;--miss-fade:0;border-radius:2px;height:4px;position:absolute;bottom:0;left:0;right:0}.reading[data-match=true]{--ruby:#8ff0bc;--glory-tail:color-mix(in oklch, var(--green), var(--ink) 42%);--glory-body:var(--green);--glory-core:color-mix(in oklch, var(--green), var(--ruby) 62%);background-image:linear-gradient(90deg in oklch, transparent 0, color-mix(in oklch, var(--glory-core), transparent 62%) 32%, color-mix(in oklch, var(--glory-core), transparent 22%) 50%, transparent 64%), linear-gradient(90deg in oklch, var(--glory-tail) 0%, var(--glory-body) 46%, var(--glory-core) 88%, var(--ruby) 100%);background-position:0 0;background-repeat:no-repeat;background-size:var(--edge) 100%, var(--edge) 100%;box-shadow:0 0 5px color-mix(in oklch, var(--glory-core), transparent 55%)}.reading[data-match=false]{background-image:linear-gradient(90deg in oklch, color-mix(in oklch, var(--ink), var(--line-2) calc(var(--miss-fade) * 100%)) 0%, color-mix(in oklch, var(--ink), var(--line-2) calc(var(--miss-fade) * 100%)) 100%);background-position:0 0;background-repeat:no-repeat;background-size:var(--edge) 100%}.cell[data-reveal=pre] .stroke{stroke:var(--ghost)}.cell[data-reveal=pre] .placeholder-dot{fill:var(--ghost)}.cell[data-reveal=pre] .frame,.cell[data-reveal=pre] .reading{opacity:0}.cell[data-reveal=run] .stroke{animation:paintIn var(--dur,.3s) var(--ease) var(--at,0s) both}.cell[data-reveal=run] .placeholder-dot{animation:paintInDot var(--dur,.3s) var(--ease) var(--at,0s) both}.cell[data-reveal=run] .frame{animation:tintIn var(--dur,.3s) var(--ease) var(--at,0s) both}.cell[data-reveal=run] .reading{animation:readingIn var(--dur,.3s) var(--ease) var(--at,0s) both}.cell[data-reveal=run] .reading[data-match=false]{animation:readingIn var(--dur,.3s) var(--ease) var(--at,0s) both, missFade var(--dur,.3s) var(--ease) var(--at,0s) both}.cell[data-reveal=done] .stroke{stroke:var(--final,var(--ink))}.cell[data-reveal=done] .placeholder-dot{fill:var(--final,var(--ink))}.cell[data-reveal=done] .frame,.cell[data-reveal=done] .reading{opacity:1}.cell[data-reveal=done] .reading{--edge:100%;background-image:linear-gradient(90deg in oklch, var(--glory-tail) 0%, var(--glory-body) 46%, var(--glory-core) 88%, var(--ruby) 100%)}.cell[data-reveal=done] .reading[data-match=false]{--edge:100%;--miss-fade:1;background-image:linear-gradient(90deg in oklch, color-mix(in oklch, var(--ink), var(--line-2) 100%) 0%, color-mix(in oklch, var(--ink), var(--line-2) 100%) 100%)}@keyframes paintIn{0%{stroke:var(--ghost);opacity:.9}45%{stroke:var(--ink);opacity:.9}to{stroke:var(--final,var(--ink));opacity:1}}@keyframes paintInDot{0%{fill:var(--ghost);opacity:.9}45%{fill:var(--ink);opacity:.9}to{fill:var(--final,var(--ink));opacity:1}}@keyframes tintIn{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@keyframes readingIn{0%{--edge:0%;opacity:1}to{--edge:100%;opacity:1}}@keyframes missFade{0%{--miss-fade:0}to{--miss-fade:1}}.hint{text-align:center;color:var(--ink-3);margin:0;font-size:11.5px}.hint kbd{font-family:var(--font-sans);border:1px solid var(--line-2);background:var(--paper);color:var(--ink-2);border-radius:5px;padding:1px 5px;font-size:10.5px}.modal{z-index:100;pointer-events:none;visibility:hidden;position:fixed;inset:0}.modal[aria-hidden=false]{pointer-events:auto;visibility:visible}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;background:#1c1a1752;transition:opacity .18s;position:absolute;inset:0}.modal[aria-hidden=false] .modal-backdrop{opacity:1}.modal-sheet{background:var(--paper);border-radius:22px 22px 0 0;flex-direction:column;max-width:70em;max-height:92dvh;margin:0 auto;transition:transform .22s cubic-bezier(.22,.61,.36,1);display:flex;position:absolute;bottom:0;left:0;right:0;transform:translateY(100%)}.modal[aria-hidden=false] .modal-sheet{transform:translateY(0)}@media (width>=640px){.modal-sheet{opacity:0;border-radius:22px;width:min(70em,100% - 40px);top:50%;bottom:auto;transform:translateY(12px)}.modal[aria-hidden=false] .modal-sheet{opacity:1;transform:translateY(-50%)}}.modal-head{justify-content:space-between;align-items:center;padding:16px 22px 12px;display:flex}.modal-turn-label{letter-spacing:.08em;color:var(--ink-3);font-size:11px}.modal-turn-label b{color:var(--ink);font-size:12px}.modal-close{width:32px;height:32px;color:var(--ink-2);cursor:pointer;background:0 0;border:none;border-radius:50%;place-items:center;display:grid}.modal-close svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;width:18px;height:18px}.modal-history{flex-direction:column;flex:1;gap:6px;padding:0 22px;display:flex;overflow-y:auto}.modal-empty-hint{color:var(--ink-3);margin:0;padding:8px 0 14px;font-size:12.5px}.history-grid{grid-template-columns:repeat(3,1fr);gap:8px;padding-bottom:6px;display:grid}.history-cell{background:var(--bg);border-radius:9px;justify-content:center;align-items:center;gap:4px;padding:6px;display:flex}.mini-cell{background:var(--paper);width:34px;height:34px;font-family:var(--font-serif);border-radius:7px;place-items:center;font-size:20px;display:grid}.modal-input-area{border-top:1px solid var(--line);flex-direction:column;gap:14px;padding:12px 22px 20px;display:flex}.modal-slots{justify-content:center;align-items:center;gap:10px;display:flex;position:relative}.modal-slot{width:76px;height:76px;font-family:var(--font-serif);color:var(--ink);border-radius:14px;place-items:center;font-size:48px;font-weight:500;display:grid}.modal-slot.empty{border:1.5px dashed var(--line-2);background:0 0}.modal-slot.filled{background:var(--paper);border:1.5px solid var(--ink-2)}.modal-field{opacity:0;caret-color:#0000;font-size:16px;position:absolute;inset:0}.toast{z-index:200;background:var(--ink);color:var(--paper);border-radius:10px;padding:10px 16px;font-size:13px;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}.cell.clickable{cursor:pointer}.cell.clickable:focus-visible{outline:2px solid var(--ink-2);outline-offset:2px}.explain{z-index:100;pointer-events:none;visibility:hidden;position:fixed;inset:0}.explain[aria-hidden=false]{pointer-events:auto;visibility:visible}.explain[aria-hidden=false] .modal-backdrop{opacity:1}.explain[aria-hidden=false] .modal-sheet{transform:translateY(0)}.explain-sheet{gap:4px}.explain-char{font-family:var(--font-serif);color:var(--ink);font-size:32px;font-weight:500}.explain-title{align-items:center;gap:14px;display:flex}.explain-readings{color:var(--ink-2);flex-direction:column;gap:2px;font-size:13px;line-height:1.35;display:flex}.explain-list{flex-direction:column;gap:12px;margin:0;padding:4px 22px 24px;list-style:none;display:flex}.explain-item{color:var(--ink-2);padding-left:18px;font-size:13.5px;line-height:1.6;position:relative}.explain-item:before{content:"";background:var(--ink-3);border-radius:50%;width:5px;height:5px;position:absolute;top:.62em;left:2px}.explain-item strong{font-weight:600}.explain-item strong.perfect{color:var(--paint-green)}.explain-item strong.misplaced{color:var(--yellow)}.explain-item strong.missed{color:var(--ink-3)}.explain-item strong.short-strokes{color:var(--tint-short-edge)}.explain-item strong.excess-strokes{color:var(--tint-excess-edge)}@media (width>=640px){.explain[aria-hidden=false] .modal-sheet{opacity:1;transform:translateY(-50%)}}.result{z-index:100;pointer-events:none;visibility:hidden;position:fixed;inset:0}.result[aria-hidden=false]{pointer-events:auto;visibility:visible}.result[aria-hidden=false] .modal-backdrop{opacity:1}.result[aria-hidden=false] .modal-sheet{transform:translateY(0)}.result-sheet{gap:4px}.result-heading{letter-spacing:.08em;color:var(--ink);font-size:14px;font-weight:600}.result-body{flex-direction:column;gap:18px;padding:0 22px 24px;display:flex;overflow-y:auto}.result-answer{align-items:center;gap:14px;display:flex}.result-answer-word{font-family:var(--font-serif);color:var(--ink);font-size:40px;font-weight:500}.result-answer-info{flex-direction:column;gap:2px;display:flex}.result-answer-yomi{color:var(--ink-2);font-size:13px;line-height:1.35}.result-answer-meaning{color:var(--ink-2);font-size:13.5px;line-height:1.7}.result-block{flex-direction:column;gap:8px;display:flex}.result-label{letter-spacing:.08em;color:var(--ink-3);margin:0;font-size:11px;font-weight:600}.result-rate{align-items:baseline;gap:10px;display:flex}.result-rate b{color:var(--paint-green);font-size:28px;font-weight:600}.result-rate span{color:var(--ink-2);font-size:12px}.result-empty{color:var(--ink-3);margin:0;font-size:12.5px}.count-bars{gap:8px;height:120px;display:flex}.count-bar{flex:1;grid-template-rows:auto 1fr auto;place-items:end center;gap:4px;display:grid}.count-fill{background:color-mix(in oklch, var(--gray), transparent 30%);border-radius:5px 5px 0 0;width:72%;min-height:2px}.count-bar.is-user .count-fill{background:var(--paint-green)}.count-value{color:var(--ink-2);font-size:11px}.count-bar.is-user .count-value{color:var(--paint-green);font-weight:600}.count-turn{color:var(--ink-3);font-size:11px}.turn-tabs{gap:6px;display:flex}.turn-tab{border:1px solid var(--line-2);background:var(--paper);color:var(--ink-2);font:inherit;cursor:pointer;border-radius:8px;flex:1;padding:6px 0;font-size:12px}.turn-tab.active{border-color:var(--ink);background:var(--ink);color:var(--paper)}.word-bars{flex-direction:column;gap:6px;margin:4px 0 0;padding:0;list-style:none;display:flex}.word-row{grid-template-columns:3.5em 1fr 3em;align-items:center;gap:8px;font-size:12.5px;display:grid}.word-name{font-family:var(--font-serif);color:var(--ink);white-space:nowrap}.word-track{background:var(--bg);border-radius:6px;height:12px;overflow:hidden}.word-fill{background:color-mix(in oklch, var(--gray), transparent 25%);border-radius:6px;min-width:2px;height:100%;display:block}.word-pct{text-align:right;color:var(--ink-2);font-variant-numeric:tabular-nums}.word-row.is-user .word-name{color:var(--paint-green);font-weight:600}.word-row.is-user .word-fill{background:var(--paint-green)}.result-share{gap:10px;display:flex}.share{text-align:center;border-radius:10px;flex:1;padding:11px 0;font-size:13px;text-decoration:none}.share-x{background:var(--ink);color:var(--paper)}.share-misskey{background:var(--bg);color:var(--ink);border:1px solid var(--line-2)}.result-open{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:none;border-radius:10px;align-self:center;padding:10px 20px;font-size:13px}@media (width>=640px){.result[aria-hidden=false] .modal-sheet{opacity:1;transform:translateY(-50%)}}.admin{flex-direction:column;gap:14px;width:min(420px,100% - 32px);margin:0 auto;padding:40px 0;display:flex}.admin-title{color:var(--ink);margin:0;font-size:20px}.admin-field{align-items:center;gap:10px;display:flex}.admin-field label{width:4em;color:var(--ink-2);flex:none;font-size:13px}.admin-field input{border:1px solid var(--line-2);background:var(--bg-grad);min-width:0;color:var(--ink);font:inherit;border-radius:8px;flex:1;padding:9px 12px}.admin-button{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:none;border-radius:8px;flex:none;padding:9px 16px;font-size:13px}.admin-save{align-self:flex-start}.admin-status{color:var(--ink-2);margin:0;font-size:13px}.practice-edit{border:1px solid var(--line-2);background:var(--bg);color:var(--ink-2);font:inherit;cursor:pointer;border-radius:10px;align-self:center;padding:8px 16px;font-size:12px}.result-actions{flex-direction:column;gap:10px;display:flex}.result-primary{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:none;border-radius:10px;padding:11px 0;font-size:13px}.result-secondary{border:1px solid var(--line-2);background:var(--bg);color:var(--ink);font:inherit;cursor:pointer;border-radius:10px;padding:11px 0;font-size:13px}.tutorial-title,.practice-title{letter-spacing:.08em;color:var(--ink-2);font-size:13px}.practice-body{flex-direction:column;gap:14px;padding:0 22px 22px;display:flex;overflow-y:auto}.tutorial-body{padding:0 22px 22px;overflow-y:auto}.tutorial-body>section{padding:.5em}.tutorial-body h2{margin:1em 0 0;padding:0;font-size:100%;font-weight:700;text-decoration:underline}.tutorial-list dl{grid-template-columns:auto 1fr;gap:10px 14px;display:grid}.tutorial-list dt{color:var(--ink);white-space:nowrap;margin:0;font-size:13px;font-weight:600}.tutorial-body{color:var(--ink-2);margin:0;font-size:13px;line-height:1.7}.tutorial-body p{margin:.5em 0 0;padding:0}.tutorial-body .perfect{color:var(--paint-green);font-weight:700}.tutorial-body .misplaced{color:var(--yellow);font-weight:700}.tutorial-body .missed{color:var(--ink-3);font-weight:700}.tutorial-body .short-stroke{background-color:var(--tint-short-fill);border:1.5px dashed var(--tint-short-edge);border-radius:4px;padding:2px;font-weight:700}.tutorial-body .equal-stroke{background-color:var(--tint-equal-fill);border:1.5px dashed var(--tint-equal-edge);border-radius:4px;padding:2px;font-weight:700}.tutorial-body .excess-stroke{background-color:var(--tint-excess-fill);border:1.5px solid var(--tint-excess-edge);border-radius:4px;padding:2px;font-weight:700}.tutorial-body .yomi-match{border-bottom:3px solid var(--paint-green);font-weight:700}.tutorial-body .yomi-miss{color:var(--ink-3);border-bottom:2px solid var(--gray)}.vertical-separator{border-right:1px solid var(--ink-3);width:0;height:-webkit-fill-available;height:-moz-available;height:stretch}.tutorial-example-container{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);flex-direction:column;align-items:center;display:flex;position:sticky;top:0;-webkit-mask-image:linear-gradient(#000 0 calc(100% - 1em),#0000 100%);mask-image:linear-gradient(#000 0 calc(100% - 1em),#0000 100%);margin-bottom:-.5em!important;padding-bottom:1em!important}.tutorial-example{background-color:var(--bg);border-radius:.5em;flex-direction:column;align-items:center;gap:8px;width:fit-content;padding:1em;display:flex}.tutorial-example-pair{align-items:flex-start;gap:18px;display:flex}.tutorial-example-side{flex-direction:column;align-items:center;gap:6px;display:flex}.tutorial-example-tag{color:var(--ink);font-size:12px}.tutorial-example-row{grid-template-columns:repeat(2,72px);justify-content:center;gap:9px;display:grid}.tutorial-example-row .cell{height:72px}.tutorial-example-answer .cell[data-reveal=pre] .stroke{stroke:var(--ink)}.tutorial-example-answer .cell[data-reveal=pre] .placeholder-dot{fill:var(--ink)}.tutorial-example-loading{height:72px}.tutorial-note{color:var(--ink-3);margin:0;font-size:12px}.tutorial-actions{gap:10px;display:flex}.tutorial-primary{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:none;border-radius:10px;flex:1;padding:12px 0;font-size:14px}.tutorial-secondary,.tutorial-back{border:1px solid var(--line-2);background:var(--bg);color:var(--ink);font:inherit;cursor:pointer;border-radius:10px;flex:1;padding:12px 0;font-size:14px}.practice-note{color:var(--ink-3);margin:0;font-size:12px;line-height:1.7}.practice-words{grid-template-columns:repeat(2,1fr);gap:8px;margin:0;padding:0;list-style:none;display:grid}.practice-word{border:1px solid var(--line);background:var(--bg-grad);border-radius:8px;justify-content:space-between;align-items:center;gap:6px;padding:8px 8px 8px 12px;display:flex}.practice-word-text{font-family:var(--font-serif);font-size:16px}.practice-remove{width:24px;height:24px;color:var(--ink-3);cursor:pointer;background:0 0;border:none;border-radius:50%;flex:none;place-items:center;font-size:15px;line-height:1;display:grid}.practice-remove:hover:not(:disabled){background:var(--ghost);color:var(--ink)}.practice-remove:disabled{opacity:.35;cursor:default}.practice-add{gap:8px;display:flex}.practice-field{border:1px solid var(--line-2);background:var(--bg-grad);min-width:0;color:var(--ink);font:inherit;border-radius:8px;flex:1;padding:9px 12px}.practice-add-btn{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:none;border-radius:8px;flex:none;padding:9px 16px;font-size:13px}.practice-error{color:#b23c3c;margin:0;font-size:12px}.practice-actions{gap:10px;margin-top:4px;display:flex}.practice-reset{border:1px solid var(--line-2);background:var(--bg);color:var(--ink);font:inherit;cursor:pointer;border-radius:10px;flex:1;padding:11px 0;font-size:13px}.practice-save{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:none;border-radius:10px;flex:1.4;padding:11px 0;font-size:13px}.practice-start{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:14px;max-width:420px;min-height:100dvh;margin:0 auto;padding:32px 24px;display:flex}.practice-start-title{font-family:var(--font-serif);letter-spacing:.1em;color:var(--ink);margin:0;font-size:22px;font-weight:600}.practice-start-note{color:var(--ink-2);margin:0;font-size:13px}.practice-start-words{width:100%}.practice-start-btn{background:var(--ink);color:var(--paper);font:inherit;cursor:pointer;border:none;border-radius:12px;align-self:stretch;padding:14px 0;font-size:15px}.header-side{align-items:center;gap:12px;display:flex}.menu-open{width:30px;height:30px;color:var(--ink-2);cursor:pointer;background:0 0;border:none;border-radius:8px;place-items:center;padding:0;display:grid}.menu-open svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;width:18px;height:18px}.menu-open:hover{background:var(--paper)}.menu-title,.about-title{font-family:var(--font-serif);color:var(--ink);font-size:17px;font-weight:600}.menu-list{flex-direction:column;padding:8px 12px 16px;display:flex}.menu-item{color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;border-radius:10px;padding:14px 10px;font-size:15px}.menu-item:hover{background:var(--paper)}.about-body{flex-direction:column;gap:16px;max-height:70vh;padding:12px 22px 22px;display:flex;overflow-y:auto}.about-app{font-family:var(--font-serif);letter-spacing:.12em;color:var(--ink);margin:0;font-size:24px;font-weight:600}.about-desc{color:var(--ink-2);margin:0;font-size:13px;line-height:1.7}.about-block{flex-direction:column;gap:6px;display:flex}.about-label{letter-spacing:.1em;color:var(--ink-2);margin:0;font-size:11px;font-weight:600}.about-creator{color:var(--ink);margin:0;font-size:13px;line-height:1.7}.about-creator a{color:var(--ink);text-underline-offset:2px;text-decoration:underline}.about-list{color:var(--ink-2);flex-direction:column;gap:6px;margin:0;padding:0;font-size:12px;line-height:1.7;list-style:none;display:flex}.about-list a{color:var(--ink);text-underline-offset:2px;text-decoration:underline}.about-credits-link{margin:0;font-size:12px}.about-credits-link a{color:var(--ink);text-underline-offset:2px;text-decoration:underline}.about-thanks{color:var(--ink);margin:0;font-size:13px}.feedback-block{gap:10px}.feedback-form{flex-direction:column;gap:8px;display:flex}.feedback-field{box-sizing:border-box;resize:vertical;border:1px solid var(--line-2);background:var(--bg-grad);width:100%;min-height:72px;color:var(--ink);font-family:var(--font-sans);border-radius:10px;padding:10px 12px;font-size:13px;line-height:1.6}.feedback-field:focus{border-color:var(--ink-2);outline:none}.feedback-actions{justify-content:flex-end;align-items:center;gap:10px;display:flex}.feedback-error{color:#b23c3c;margin-right:auto;font-size:12px}.feedback-submit{background:var(--ink);color:var(--bg);font-family:var(--font-sans);cursor:pointer;border:none;border-radius:999px;padding:8px 20px;font-size:13px;font-weight:600}.feedback-submit:hover:not(:disabled){opacity:.9}.feedback-submit:disabled{opacity:.5;cursor:default}.feedback-thanks{color:var(--ink-2);margin:0;font-size:13px}@media (hover:hover) and (pointer:fine){.modal-slots{flex-wrap:wrap}.modal-field{opacity:1;caret-color:var(--ink);border:1px solid var(--line-2);background:var(--bg-grad);color:var(--ink);font-family:var(--font-serif);text-align:center;border-radius:10px;flex-basis:100%;margin-top:6px;padding:10px 12px;font-size:20px;position:static}}