[hidden]{display:none!important}.brand-link{color:inherit;text-decoration:none}.drawing-main{max-width:1100px}.drawing-heading{display:flex;align-items:baseline;gap:18px;margin-bottom:18px;flex-wrap:wrap}.drawing-heading h1{font-size:30px}.drawing-heading p{color:var(--muted);margin:0;font-size:16px;line-height:1.6}.drawing-workspace{display:grid;grid-template-columns:250px minmax(0,1fr);gap:22px;align-items:start}.drawing-tools{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px;display:grid;gap:18px}.tool-row,.draw-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.draw-button{min-height:46px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--control-line);border-radius:11px;padding:10px 8px;background:var(--surface);color:var(--ink);font-size:16px;font-weight:650;text-decoration:none;line-height:1.4}.draw-button svg{height:21px;width:21px;flex:none}.draw-button.active,.size-button.active{color:var(--accent-ink);background:var(--soft);box-shadow:inset 0 0 0 2px var(--accent-ink);border-color:var(--accent-ink)}.save-button{background:var(--yellow);color:#513b0f;border-color:var(--yellow)}.palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.color-button{height:46px;padding:0;border:2px solid var(--control-line);border-radius:12px;display:grid;place-items:center;background:var(--swatch);color:var(--check-ink);font-weight:850;font-size:22px}.color-button[aria-pressed=true]{outline:3px solid var(--accent-ink);outline-offset:3px}.color-button span{pointer-events:none}.size-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.size-button{min-height:46px;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 3px;background:var(--surface);color:var(--ink);border:1px solid var(--control-line);border-radius:10px;font-size:15px}.size-dot{display:inline-block;border-radius:50%;background:currentColor;flex:none}.size-dot.thin{width:5px;height:5px}.size-dot.medium{width:11px;height:11px}.size-dot.thick{width:19px;height:19px}.drawing-status{margin:0;line-height:1.6;color:var(--accent-ink);font-size:14px;min-height:23px}.drawing-stage{min-width:0}.drawing-paper{background:white;padding:0;border:1px solid #c4d2e1;border-radius:15px;overflow:hidden;box-shadow:0 10px 25px #23486e14;aspect-ratio:1;line-height:0}#drawingCanvas{display:block;width:100%;height:100%;background:white;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:crosshair}#drawingCanvas.erasing{cursor:cell}.paper-note{font-size:14px;line-height:1.6;color:var(--muted);margin:11px 0 0}.drawing-main footer{font-size:14px}.drawing-main footer a{color:inherit}.drawing-dialog p{font-size:16px;line-height:1.7;color:var(--muted)}.dialog-actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}.dialog-actions .draw-button{flex:1}#drawingPreview{display:block;max-width:100%;width:auto;height:auto;max-height:48vh;margin:0 auto;border:1px solid #cad5e2;background:white;border-radius:10px}.drawing-dialog .save-hint{font-size:14px;margin-bottom:0}#drawingToast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--accent-ink);color:var(--surface);padding:12px 18px;border-radius:12px;max-width:90vw;z-index:100;font-size:15px}:root[data-theme=dark] .drawing-paper{border-color:#697889;box-shadow:0 10px 25px #0004}
@media(max-width:750px){.drawing-main{padding:18px 12px}.drawing-heading{gap:5px;display:block;margin-bottom:13px}.drawing-heading h1{font-size:27px;margin-bottom:5px}.drawing-workspace{grid-template-columns:1fr;gap:15px}.drawing-tools{padding:13px;gap:13px}.palette{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.color-button{height:44px}.size-row{grid-template-columns:repeat(3,minmax(0,1fr))}.tool-row{grid-template-columns:1fr 1fr}.draw-actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.draw-actions .draw-button{padding:10px 3px;font-size:14px}.drawing-tools{grid-template-columns:1fr 1fr}.palette,.draw-actions,.drawing-status{grid-column:1/-1}.tool-row{grid-column:1}.size-row{grid-column:2;grid-row:1}.tool-row .draw-button{font-size:14px;padding:9px 4px;gap:4px}.tool-row svg{width:17px;height:17px}.size-button{font-size:14px;gap:4px}.size-dot.thick{width:14px;height:14px}.size-dot.medium{width:9px;height:9px}.drawing-main .site-nav{gap:6px}.drawing-main .site-nav a{padding:10px 8px;font-size:14px;white-space:nowrap}.drawing-status{min-height:0}.paper-note{margin:9px 0 0}.drawing-main footer{flex-wrap:wrap}}
@media(max-width:360px){.drawing-main{padding-left:8px;padding-right:8px}.drawing-tools{padding:10px;gap:11px}.tool-row svg{display:none}.palette{gap:8px}.drawing-main .site-nav a{padding:10px 5px}.drawing-paper{border-radius:11px}}