/* Shared board: one canvas, direct drawing controls and optional teaching material. */
.board-page{--board-paper:#fffefa;min-width:0}.board-page .page-heading{align-items:flex-start}.board-page .page-heading h1{overflow-wrap:anywhere}.board-page svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.board-page .button{display:inline-flex;align-items:center;justify-content:center;gap:8px}.board-workspace{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px;align-items:start}.board-drawing-area{min-width:0}.board-session-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px;font-size:12px;color:var(--muted)}.board-session-row .board-allow{margin-left:auto;min-height:38px}.board-allow[aria-pressed=true]{color:var(--green,#193d36);border-color:var(--green,#193d36);background:var(--soft,#e9ede3)}.board-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;background:var(--board-paper)}.board-tool-group,.board-colors,.board-history,.board-zoom{display:flex;align-items:center;gap:3px}.board-tool{border:1px solid transparent;background:transparent;color:var(--ink,#193d36);min-width:42px;min-height:42px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:12px;font-weight:500;line-height:1.2;cursor:pointer;padding:8px}.board-tool-group .board-tool{flex-direction:column;min-width:56px;font-size:11px;gap:4px}.board-tool[aria-pressed=true]{background:#193d36;color:#fffefa}.board-tool:disabled{opacity:.35;cursor:default}.board-tool:hover:not(:disabled){border-color:#afb9a6}.board-tool:focus-visible,.board-swatch:focus-visible,.board-fit:focus-visible{outline:2px solid #87672d;outline-offset:2px}.board-colors{gap:1px}.board-swatch{width:34px;height:40px;border:1px solid transparent;border-radius:50%;background:transparent;display:grid;place-items:center;cursor:pointer;padding:0}.board-swatch span{display:block;width:21px;height:21px;border-radius:50%;background:var(--ink-color)}.board-swatch[aria-pressed=true]{border-color:var(--ink-color)}.board-swatch[aria-pressed=true] span{box-shadow:0 0 0 3px var(--board-paper)}.board-width{margin:0;font-size:11px;color:var(--muted);display:flex;flex-direction:column;gap:3px;min-width:91px}.board-width select{margin:0;padding:4px 24px 4px 6px;min-height:30px;font-size:12px;width:100%}.board-history{margin-left:auto;border-left:1px solid var(--line);padding-left:7px}.board-sheet{min-width:0}.board-sheet canvas{width:100%;height:auto;aspect-ratio:4/3;display:block;touch-action:none;background:var(--board-paper);background-image:none;border:1px solid var(--line);border-radius:0;cursor:crosshair}.response-ink{background-image:none}.board-viewbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 7px 5px 12px;border:1px solid var(--line);border-top:0;border-radius:0 0 12px 12px;background:var(--board-paper);font-size:11px;color:var(--muted)}.board-fit{font:inherit;font-size:12px;font-weight:500;line-height:1.2;background:transparent;border:0;color:var(--ink);min-height:42px;padding:8px;cursor:pointer;font-variant-numeric:tabular-nums}.board-sharing-note{font-size:11px;line-height:1.6;color:var(--muted);margin:10px 0 0}.board-materials{border:1px solid var(--line);border-radius:12px;background:var(--board-paper);position:sticky;top:18px;min-width:0}.board-materials>summary{font-size:14px;font-weight:600;padding:18px;cursor:pointer;list-style-position:inside}.board-materials .character-guide{position:static;padding:0 18px 18px}.board-materials .writing-target:empty{display:none}.board-materials .writing-target{margin:0 0 12px}.board-materials #board-note{white-space:pre-wrap;overflow-wrap:anywhere}.board-filebar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:20px 0}.board-filebar .danger{margin-left:auto}.board-pending{padding:14px;border-left:3px solid #ad7f38;background:#faf3e5;margin-top:14px}.board-pending p{margin:0 0 10px;font-size:13px}.board-pending .button{margin:0 5px 6px 0}.board-focused{position:fixed;inset:0;z-index:1000;background:var(--paper,#f3f0e8);padding:18px;display:flex;flex-direction:column;overflow:auto}.board-focused .page-heading{margin:0 0 12px;padding:0}.board-focused .page-heading h1{font-size:26px;margin:0}.board-focused .board-workspace{display:flex;flex:1;min-height:0}.board-focused .board-drawing-area{display:flex;flex-direction:column;width:100%}.board-focused .board-sheet{flex:1;min-height:180px}.board-focused .board-sheet canvas{height:100%;aspect-ratio:auto}.board-focused .board-materials,.board-focused .board-filebar,.board-focused .board-sharing-note{display:none}.board-focused .board-session-row{margin-bottom:8px}.board-focused .board-toolbar{padding:5px 10px}.board-focused .board-tool-group .board-tool{flex-direction:row}
@media(max-width:1200px){.board-workspace{grid-template-columns:minmax(0,1fr) 220px}.board-toolbar{gap:7px}.board-tool-group .board-tool{min-width:48px}.board-swatch{width:30px}.board-width{min-width:82px}}
@media(max-width:1000px){.board-workspace{grid-template-columns:1fr}.board-materials{position:static}.board-materials .character-guide{max-width:600px}.board-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px}.board-tool-group{grid-column:1;grid-row:1}.board-history{grid-column:2;grid-row:1;margin:0;border:0;padding:0;justify-content:flex-end}.board-colors{grid-column:1;grid-row:2;gap:4px}.board-width{grid-column:2;grid-row:2;min-width:108px;max-width:140px}.board-swatch{width:36px;height:40px}.board-tool-group .board-tool{flex-direction:row;min-width:58px;min-height:42px}.board-session-row{gap:8px;font-size:11px}.board-session-row .board-allow{font-size:11px;padding:7px 9px}.board-focused .board-toolbar{display:flex;gap:4px}.board-focused .board-colors{margin-left:auto}.board-focused .board-width{min-width:88px}.board-focused .board-tool-group .board-tool span{display:none}.board-focused .board-history{margin-left:auto}.board-focused .board-tool-group .board-tool{min-width:40px}.board-focused .board-swatch{width:30px;height:38px}.board-focused .board-session-row #board-permission{display:none}}
@media(max-width:380px){.board-toolbar{padding:7px;gap:6px}.board-tool-group .board-tool{min-width:49px;padding:6px;font-size:10px;gap:4px}.board-history .board-tool{min-width:36px}.board-colors{gap:0}.board-swatch{width:33px}.board-width{min-width:100px}.board-viewbar{padding-left:8px}.board-viewbar .board-tool{min-width:34px}.board-fit{padding:5px}.board-focused{padding:10px}.board-focused .board-toolbar{flex-wrap:wrap}.board-focused .board-width{max-width:120px}.board-filebar{gap:8px}.board-filebar .danger{margin-left:0}}

.board-focused .board-workspace{align-items:stretch;flex-direction:column}.board-focused .board-drawing-area{flex:1;min-height:0}.board-focused .board-sheet{position:relative}.board-focused .board-sheet canvas{position:absolute;inset:0;width:100%;height:100%}.board-focused .page-heading a[href^="#class/"],.board-focused .page-heading a[href="#learning"]{display:none}.board-focused .page-heading{flex-direction:row;align-items:center;gap:10px}.board-focused .page-heading>div:first-child{min-width:0}.board-focused .page-heading h1{font-size:23px}

.board-focused .page-heading{display:flex}.board-focused .page-heading>.row{flex:0 0 auto;width:auto;flex-wrap:nowrap}.board-focused .page-heading>.row .button{width:auto}.board-focused .board-sheet canvas{background:var(--paper,#f3f0e8)}
