@font-face{font-family:Kolebat;src:url(/fonts/Kolebat.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}:root{font-family:Kolebat,cursive,sans-serif;color:#172033;background:#eef2f7;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;font-family:Kolebat,cursive,sans-serif}body{min-width:320px;overflow:hidden}button,select,input,textarea,output{font-family:inherit}.app-shell{min-height:100vh;display:grid;grid-template-rows:auto auto minmax(0,1fr)}.app-header{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.8rem 1.1rem;background:#111827;color:#f8fafc}h1{margin:0;font-size:clamp(1.1rem,2vw,1.45rem)}.eyebrow{margin:0 0 .15rem;color:#93c5fd;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}.status-group{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.35rem .8rem}.service-status,.pending-status{font-size:.8rem}.storage-error{flex-basis:100%;max-width:32rem;color:#fecaca;font-size:.75rem;text-align:right}.storage-error button{margin-left:.5rem;padding:.15rem .4rem;border:1px solid #fecaca;border-radius:.3rem;background:transparent;color:inherit;cursor:pointer}.storage-error button:disabled{cursor:wait;opacity:.7}.toolbar{z-index:10;display:flex;flex-wrap:wrap;align-items:center;gap:.55rem 1rem;min-height:3.6rem;padding:.55rem .85rem;border-bottom:1px solid #cbd5e1;background:#f8fafcf7;box-shadow:0 2px 8px #0f172a14}.control-group{display:inline-flex;align-items:center;gap:.3rem}.toolbar button,.toolbar select{min-height:2rem;border:1px solid #94a3b8;border-radius:.4rem;background:#fff;color:#172033}.toolbar button{padding:.3rem .65rem;cursor:pointer}.toolbar button:hover:not(:disabled){border-color:#2563eb}.toolbar button:disabled{opacity:.45;cursor:not-allowed;border-color:#cbd5e1;background:#f1f5f9}.toolbar button:focus-visible,.toolbar select:focus-visible,.toolbar input:focus-visible{outline:3px solid rgba(37,99,235,.35);outline-offset:2px}.toolbar button.selected{border-color:#1d4ed8;background:#dbeafe;box-shadow:inset 0 0 0 1px #1d4ed8}.select-control,.width-control{display:inline-flex;align-items:center;gap:.45rem;font-size:.82rem;font-weight:650}.select-control select{padding:.2rem .45rem}.width-control input{width:clamp(6rem,12vw,9rem);accent-color:#2563eb}.width-control output{min-width:2.5rem;font-variant-numeric:tabular-nums}.color-controls{display:inline-flex;align-items:center;gap:.35rem;margin:0;padding:0;border:0}.color-controls legend{float:left;margin-right:.1rem;font-size:.82rem;font-weight:650}.toolbar button.color{width:1.65rem;min-height:1.65rem;padding:0;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #94a3b8}.toolbar button.color.selected{box-shadow:0 0 0 3px #2563eb}.zoom-controls output{min-width:3.4rem;text-align:center;font-size:.82rem;font-variant-numeric:tabular-nums}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.board-shell{position:relative;min-height:0;overflow:hidden;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;background:#fffdf8}.board-shell.tool-pen{cursor:crosshair}.board-shell.tool-pan{cursor:grab}.board-shell.tool-pan:active{cursor:grabbing}.board-shell canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;pointer-events:none}.interaction-note{position:absolute;right:.75rem;bottom:.75rem;max-width:26rem;margin:0;padding:.45rem .65rem;border:1px solid rgba(148,163,184,.7);border-radius:.45rem;background:#f8fafce0;color:#475569;font-size:.7rem;line-height:1.35;pointer-events:none}@media(max-width:680px){.app-header{padding:.65rem .75rem}.service-status{font-size:.72rem}.toolbar{gap:.45rem .65rem;padding:.45rem .55rem}.interaction-note{left:.55rem;right:.55rem;max-width:none}}
