/* Scoped handwriting surface; shared Tinkumo shell and controls remain unchanged. */
.write-name .wn-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px}
.write-name .wn-toolbar h1{font-size:22px;margin:0}
.write-name .trainer-training{padding:20px 24px}
.write-name .wn-live,.write-name .wn-activity{width:100%;min-width:0}
.write-name .wn-setup{max-width:420px;margin:16px auto}
.write-name .wn-setup label{font-size:22px;display:block;margin-bottom:14px}
.write-name .wn-setup p{font-size:14px;margin:12px 0}
.write-name .wn-count,.write-name .wn-help,.write-name .wn-status{font-size:14px;color:var(--secondary);margin:8px 0}
.write-name .wn-prompt{font-size:24px;margin:12px 0}
.write-name .wn-paper{max-width:960px;margin:14px auto;background:#fffdf7;border:var(--border);border-radius:var(--radius);overflow:hidden}
.write-name .wn-sheet{display:block;width:100%;height:auto;touch-action:none;user-select:none;-webkit-user-select:none;overscroll-behavior:contain;cursor:crosshair}
.write-name .wn-lines line{stroke:#7da1d5;stroke-width:1}
.write-name .wn-lines .midline{stroke-dasharray:7 6;stroke:#7da1d5}
.write-name .wn-guide{stroke:#6b727b;fill:none;stroke-width:1.8;stroke-dasharray:4 4;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.write-name[data-stage="1"] .wn-guide{opacity:.3}
.write-name .wn-guide circle{fill:#6b727b;stroke:none}
.write-name .wn-ink{stroke:#263947;fill:none;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.write-name .wn-ink circle{fill:#263947}
.write-name .wn-model{margin:10px auto;max-width:960px}
.write-name .wn-model p{font-size:14px;margin:0}
.write-name .wn-model svg{display:block;max-width:100%;width:640px;height:auto;stroke:var(--main);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.write-name .wn-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:14px 0}
.write-name .wn-actions .btn,.write-name .wn-change{min-height:44px}
.write-name .wn-change{display:block;margin:20px auto 0;font-size:14px}
.write-name .wn-finished{text-align:center;padding:24px 0}
.write-name .wn-finished h2{margin:0 0 12px}
.write-name .wn-prompt:focus,.write-name .wn-finished h2:focus{outline:none}
.training_fullscreen .write-name .wn-paper{max-width:960px}
@media(max-width:520px){.write-name .trainer-training{padding:14px}.write-name .wn-toolbar h1{font-size:19px}.write-name .wn-prompt{font-size:21px}.write-name .wn-actions{gap:8px}.write-name .wn-actions .btn{padding:10px 14px}.write-name .wn-help{font-size:13px}}
@media(max-height:750px) and (min-width:700px){.write-name .wn-toolbar{padding:8px 16px}.write-name .trainer-training{padding-block:10px}.write-name .wn-paper{max-width:720px}.write-name .wn-help{margin:4px 0}.write-name .wn-prompt{margin:6px 0}}

.write-name .wn-lines .descenderline{stroke:#dbe4ef}
.write-name .wn-setup-style{max-width:420px;margin:16px auto}
.write-name .wn-setup-style label{display:block;font-size:22px;margin-bottom:14px}
.write-name .wn-setup-style select{display:block;width:100%;min-height:44px;margin-bottom:20px;background:var(--card, var(--background));color:var(--main);border:var(--border);border-radius:var(--radius);padding:10px}
.write-name .wn-model circle{fill:var(--main);stroke:none}
.write-name button:focus-visible,.write-name select:focus-visible,.write-name a:focus-visible{outline:3px solid var(--blue, #16abf2);outline-offset:3px}

.write-name .wn-letter-choice{max-width:960px;margin:12px auto 24px}
.write-name .wn-letter-choice h2{font-size:24px;margin:0 0 12px}
.write-name .wn-letter-choice p{color:var(--secondary);margin:0 0 20px}
.write-name .wn-letter-choice h3{font-size:18px;margin:24px 0 12px}
.write-name .wn-choice-actions{display:flex;flex-wrap:wrap;gap:12px}
.write-name .wn-choice-actions .btn{min-height:44px;white-space:normal}
.write-name .wn-letter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(52px,1fr));gap:10px}
.write-name .wn-letter{text-transform:none;min-width:44px;min-height:48px;padding:8px;font-size:22px}
.write-name .wn-letter-grid[data-letter-case="mixed"]{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
.write-name .wn-letter-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
