.doodle-board{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xxl);overflow:hidden}.doodle-board__toolbar{border-bottom:1px solid var(--border-color);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#11182799;flex-wrap:wrap;align-items:center;gap:12px;padding:14px;display:flex}.doodle-board__toolbar-group{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.doodle-board__toolbar-actions{margin-left:auto}.doodle-label{color:var(--text-secondary);font-size:.875rem;font-weight:600}.doodle-muted{color:var(--text-secondary);opacity:.85;font-weight:600}.doodle-btn{border:1px solid var(--border-color);color:var(--text-primary);transition:all var(--transition-base);background:#0b0d1280;border-radius:10px;justify-content:center;align-items:center;padding:.5rem .75rem;font-weight:600;display:inline-flex}.doodle-btn:hover:not(:disabled){border-color:#7c3aedb3;transform:translateY(-1px)}.doodle-btn:disabled{opacity:.45;cursor:not-allowed}.doodle-btn.is-active{border-color:#7c3aede6;box-shadow:0 0 0 3px #7c3aed33}.doodle-color{align-items:center;gap:10px;display:inline-flex}.doodle-color__input{border:1px solid var(--border-color);background:0 0;border-radius:10px;width:38px;height:32px;padding:0}.doodle-color__presets{align-items:center;gap:8px;display:inline-flex}.doodle-swatch{width:22px;height:22px;transition:transform var(--transition-fast),box-shadow var(--transition-fast);border:1px solid #ffffff2e;border-radius:999px;box-shadow:inset 0 0 0 1px #0000001f}.doodle-swatch:hover{transform:translateY(-1px)}.doodle-swatch.is-active{box-shadow:0 0 0 3px #7c3aed59,inset 0 0 0 1px #0000001f}.doodle-range{width:170px}.doodle-select{border:1px solid var(--border-color);color:var(--text-primary);background:#0b0d1280;border-radius:10px;padding:.5rem .75rem;font-weight:600}.doodle-board__canvas-shell{padding:14px}.doodle-board__canvas-wrap{border-radius:var(--radius-xl);border:1px solid var(--border-color);touch-action:none;background:#fff;width:100%;height:min(72vh,640px);min-height:360px;overflow:hidden}.doodle-board__canvas{touch-action:none;cursor:crosshair;width:100%;height:100%;display:block}.doodle-board__hint{color:var(--text-secondary);margin:10px 2px 0;font-size:.9375rem}kbd{border:1px solid var(--border-color);color:var(--text-primary);background:#0b0d128c;border-radius:8px;padding:2px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.875em}@media (max-width:640px){.doodle-board__toolbar-actions{width:100%;margin-left:0}.doodle-range{width:150px}}
.doodle-board-page{padding:var(--section-spacing)0}.doodle-board-page__header{margin-bottom:var(--spacing-lg)}.doodle-board-page__breadcrumb ol{margin:0 0 var(--spacing-sm)0;color:var(--text-secondary);align-items:center;gap:10px;padding:0;font-size:.9375rem;list-style:none;display:flex}.doodle-board-page__breadcrumb span{opacity:.6}.doodle-board-page__eyebrow{color:var(--text-secondary);letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--spacing-xs);font-size:.8125rem}.doodle-board-page__title{margin-bottom:var(--spacing-sm)}.doodle-board-page__subtitle{max-width:72ch;margin-bottom:0}.doodle-board-page__tool{margin:var(--spacing-lg)0 var(--spacing-xl)}.doodle-board-page__content{margin-top:var(--spacing-xl)}.doodle-board-page__content-grid{gap:var(--spacing-md);margin-top:var(--spacing-md);grid-template-columns:1fr;display:grid}.doodle-board-page__content-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--spacing-md)}.doodle-board-page__content-card p{margin-bottom:0}@media (min-width:768px){.doodle-board-page__content-grid{grid-template-columns:repeat(3,1fr)}}
