.ou-editor-draw-panel{display:flex;flex-direction:column;gap:var(--spacing-160);width:100%}.ou-editor-draw-tabs{display:flex;flex-wrap:nowrap;align-items:stretch;justify-content:space-between;gap:var(--spacing-40);width:100%}.ou-editor-draw-tab{flex:1 1 0;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-40);min-width:0;min-height:var(--size-560);padding:var(--spacing-40) var(--spacing-20);border:none;border-radius:var(--radius-medium);background:transparent;color:var(--fg-neutral-3-rest);font-family:var(--font-family-base);font-size:var(--font-size-caption-1-strong);line-height:var(--line-height-caption-1-strong);font-weight:var(--font-weight-caption-1-strong);cursor:pointer;user-select:none;transition:color var(--anim-hover) ease,background var(--anim-hover) ease}.ou-editor-draw-tab-icon{display:inline-flex;align-items:center;justify-content:center;width:var(--size-240);height:var(--size-240)}.ou-editor-draw-tab-icon svg{width:var(--size-240);height:var(--size-240)}.ou-editor-draw-tab-icon .icon-filled{display:none}.ou-editor-draw-tab-label{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ou-editor-draw-tab:hover:not(.ou-editor-draw-tab--selected){color:var(--fg-neutral-2-hover);background:var(--bg-neutral-2-rest)}.ou-editor-draw-tab:active:not(.ou-editor-draw-tab--selected){color:var(--fg-neutral-2-pressed)}.ou-editor-draw-tab--selected{color:var(--fg-neutral-1-rest)}.ou-editor-draw-tab--selected .icon-rest{display:none}.ou-editor-draw-tab--selected .icon-filled{display:inline-flex;fill:var(--fg-brand-1-rest)}.ou-editor-draw-tab:focus-visible{outline:var(--size-20) solid var(--stroke-focus-2);outline-offset:var(--size-20)}.ou-editor-draw-body-host{display:block;width:100%}.ou-editor-draw-body{display:flex;flex-direction:column;gap:var(--spacing-160);width:100%}.ou-editor-draw-body[hidden]{display:none}.ou-editor-draw-body--pen,.ou-editor-draw-body--highlighter,.ou-editor-draw-body--shapes,.ou-editor-draw-body--eraser{width:100%}.ou-editor-nib-preview{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--size-560);padding:var(--spacing-160);border-radius:var(--radius-medium);background:var(--bg-neutral-2-rest);border:1px solid var(--surface-stroke-1)}.ou-editor-nib-line{width:70%;block-size:var(--size-480);overflow:visible}.ou-editor-nib-path{fill:none;stroke:var(--draw-color);stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.ou-editor-nib-preview--multiply .ou-editor-nib-line{mix-blend-mode:screen}.ou-editor-nib-preview--multiply .ou-editor-nib-path{stroke-linecap:butt}.ou-editor-draw-slider-host,.ou-draw-slider{width:100%}.ou-draw-slider.range-slider--bar:not(.range-slider--tinted) .range-slider-fill{inset-inline-start:0;inline-size:var(--range-slider-fill)}.ou-draw-slider--colored .range-slider-fill{background:var(--draw-color)}.ou-draw-slider:not(:has(.range-slider-input:focus-visible)) .range-slider-control:hover{box-shadow:0 0 0 var(--size-20) var(--surface-stroke-1)}.ou-draw-slider .range-slider-title,.ou-draw-slider .range-slider-value{z-index:3;text-shadow:var(--text-shadow-2)}.ou-draw-slider .range-slider-line{opacity:.25}.ou-draw-slider .range-slider-control:hover .range-slider-line,.ou-draw-slider:has(.range-slider-input:focus-visible) .range-slider-line,.ou-draw-slider.range-slider--animating .range-slider-line{opacity:1}@media (prefers-reduced-motion: no-preference){.ou-draw-slider .range-slider-control{transition:box-shadow var(--anim-hover) ease-out}.ou-draw-slider .range-slider-line{transition:opacity var(--anim-short) ease-out}}@media (forced-colors: active){.ou-draw-slider .range-slider-line{opacity:1}}.ou-editor-draw-colorrow{display:flex;flex-direction:column;gap:var(--spacing-80);width:100%}.ou-editor-draw-colorrow-label{margin:0}.ou-editor-draw-swatches{display:flex;align-items:center;gap:var(--spacing-80);width:100%;padding:var(--size-40);overflow:visible}.ou-editor-draw-colorrow-spacer{flex:1 1 auto}.ou-editor-draw-swatch{flex:0 0 auto;width:var(--size-240);height:var(--size-240);padding:0;border:1px solid var(--surface-stroke-2, var(--surface-stroke-1));border-radius:var(--radius-circular);cursor:pointer;transition:transform var(--anim-hover) ease,box-shadow var(--anim-hover) ease}.ou-editor-draw-swatch:hover{transform:scale(1.08)}.ou-editor-draw-swatch.is-selected{box-shadow:0 0 0 var(--size-20) var(--bg-neutral-1-rest),0 0 0 var(--size-40) var(--stroke-brand-1-rest)}.ou-editor-draw-swatch:focus-visible{outline:var(--size-20) solid var(--stroke-focus-2);outline-offset:var(--size-20)}.ou-editor-draw-eyedropper,.ou-editor-draw-wheel-trigger{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:var(--size-280);height:var(--size-280);padding:0;border:1px solid var(--surface-stroke-1);border-radius:var(--radius-circular);background:var(--bg-neutral-2-rest);color:var(--fg-neutral-2-rest);cursor:pointer;transition:background var(--anim-hover) ease,color var(--anim-hover) ease,filter var(--anim-hover) ease}.ou-editor-draw-eyedropper:hover{background:var(--bg-neutral-3-rest);color:var(--fg-neutral-1-rest)}.ou-editor-draw-eyedropper-icon{width:var(--size-200);height:var(--size-200)}.ou-editor-draw-eyedropper-icon svg,.ou-editor-draw-eyedropper svg{width:var(--size-200);height:var(--size-200);fill:currentColor}.ou-editor-draw-eyedropper:focus-visible,.ou-editor-draw-wheel-trigger:focus-visible{outline:var(--size-20) solid var(--stroke-focus-2);outline-offset:var(--size-20)}.ou-editor-draw-wheel-trigger{position:relative;overflow:hidden}.ou-editor-draw-wheel-trigger:before{content:"";position:absolute;inset:-12%;background:conic-gradient(from 0deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.ou-editor-draw-wheel-trigger:hover{filter:brightness(1.12)}.ou-editor-draw-wheel-trigger.is-selected{box-shadow:0 0 0 var(--size-20) var(--bg-neutral-1-rest),0 0 0 var(--size-40) var(--stroke-brand-1-rest)}.ou-editor-shape-head{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-80);width:100%}.ou-editor-shape-head .menu-section-header{margin:0}.ou-editor-shape-paging{display:inline-flex;gap:var(--spacing-40)}.ou-editor-shape-paging[hidden]{display:none}.ou-editor-shape-page-btn{flex:0 0 auto;color:var(--fg-neutral-2-rest)}.ou-editor-shape-page-btn:disabled{opacity:.4;pointer-events:none}.cmd-btn-subtle-icon.ou-editor-shape-page-btn svg{width:var(--size-160);height:var(--size-160)}.ou-editor-shape-page-btn--prev svg{transform:scaleX(-1)}.ou-editor-shape-grid{display:grid;grid-template-rows:repeat(2,var(--size-560));grid-auto-flow:column;grid-auto-columns:var(--size-560);gap:var(--spacing-80);width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:var(--size-40);scrollbar-width:none;box-sizing:content-box;padding:var(--size-40);margin:calc(-1 * var(--size-40))}.ou-editor-shape-grid::-webkit-scrollbar{display:none}.ou-editor-shape-cell{display:inline-flex;align-items:center;justify-content:center;width:var(--size-560);height:var(--size-560);padding:var(--spacing-120);border:1px solid var(--surface-stroke-1);border-radius:var(--radius-medium);background:var(--bg-neutral-2-rest);color:var(--fg-neutral-1-rest);scroll-snap-align:start;cursor:pointer;transition:border-color var(--anim-hover) ease,background var(--anim-hover) ease}.ou-editor-shape-cell:hover{background:var(--bg-neutral-3-rest)}.ou-editor-shape-cell svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:6}.ou-editor-shape-cell.is-selected{border-color:var(--stroke-brand-1-rest);color:var(--fg-brand-1-rest)}.ou-editor-shape-cell:focus-visible{outline:var(--size-20) solid var(--stroke-focus-2);outline-offset:var(--size-20)}.ou-editor-shape-style{display:inline-flex;gap:var(--spacing-40)}.ou-editor-shape-pill{flex:0 0 auto}.ou-editor-shape-pill.pill-switch--selected{color:var(--fg-brand-1-rest)}.ou-editor-shape-preview{display:flex;align-items:center;justify-content:center;width:100%;min-height:var(--size-640);padding:var(--spacing-160);border-radius:var(--radius-medium);background:var(--bg-neutral-2-rest);border:1px solid var(--surface-stroke-1)}.ou-editor-shape-preview-svg{width:var(--size-640);height:var(--size-640)}.ou-editor-shape-preview-svg.is-hollow>*{fill:none;stroke:var(--draw-color);stroke-linecap:round;stroke-linejoin:round}.ou-editor-shape-preview-svg.is-filled>*{fill:var(--draw-color);stroke:none}.ou-editor-draw-hint{margin:0;font-size:var(--font-size-caption-1);line-height:var(--line-height-caption-1);color:var(--fg-neutral-3-rest)}@media (prefers-reduced-motion: reduce){.ou-editor-draw-tab,.ou-editor-draw-swatch,.ou-editor-draw-eyedropper,.ou-editor-draw-wheel-trigger,.ou-editor-shape-cell{transition:none}.ou-editor-draw-swatch:hover{transform:none}}@media (forced-colors: active){.ou-editor-draw-tab{color:ButtonText}.ou-editor-draw-tab--selected{color:Highlight}.ou-editor-draw-tab--selected .icon-filled{fill:currentColor}.ou-editor-shape-cell.is-selected{border:2px solid Highlight;color:Highlight}.ou-editor-draw-swatch.is-selected,.ou-editor-draw-wheel-trigger.is-selected{outline:2px solid Highlight}}