.cwi-modal{box-sizing:border-box;width:min(760px,calc(100vw - 24px));height:min(900px,calc(100dvh - 24px));max-width:none;max-height:none;padding:18px;border:0;border-radius:20px;color:#24212c;background:#fff;overflow:hidden}
.cwi-modal[open]{display:flex;flex-direction:column;gap:12px}.cwi-modal::backdrop{background:#26213488}.cwi-modal [hidden]{display:none!important}.cwi-modal header,.cwi-modal footer{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0}.cwi-modal h2{font-size:22px;margin:0}.cwi-modal button{min-height:44px;border:1px solid #ddd;border-radius:12px;background:#faf9fc;padding:8px 12px;color:inherit;cursor:pointer}.cwi-modal .cwi-apply,.cwi-tabs [aria-pressed=true]{background:#783bea;color:#fff;border-color:#783bea}.cwi-preview{flex:0 0 38%;min-height:100px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:12px;background:repeating-conic-gradient(#f5f4f8 0% 25%,#e9e7ee 0% 50%) 0/20px 20px}.cwi-art{position:relative;flex-shrink:0}.cwi-art canvas{display:block}.cwi-settings{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}.cwi-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:12px}.cwi-tabs button{padding:8px 3px;font-size:14px}.cwi-row,.cwi-range{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid #eee}.cwi-row span{flex:1}.cwi-row [data-color]{width:44px;color:transparent;border:2px solid #ddd}.cwi-range{flex-wrap:wrap}.cwi-range span{width:100%;font-weight:600}.cwi-range input[type=number]{width:62px;height:44px;box-sizing:border-box;border:1px solid #ddd;border-radius:8px;text-align:center}.cwi-range small{width:100%;color:#777}.cwi-range small:empty{display:none}.cwi-range input[type=range]{--cw-slider-hit-inset:22;flex:1;min-width:0;height:44px;margin:0;appearance:none;background:transparent;touch-action:none}.cwi-range input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(to right,#783bea var(--cw-slider-progress,0%),#e3ddeb var(--cw-slider-progress,0%))}.cwi-range input[type=range]::-webkit-slider-thumb{appearance:none;width:44px;height:44px;margin-top:-19px;border:0;border-radius:50%;background:radial-gradient(circle,#783bea 0 8px,#fff 8px 10px,transparent 11px)}.cwi-range input[type=range]::-moz-range-track{height:6px;background:linear-gradient(to right,#783bea var(--cw-slider-progress,0%),#e3ddeb var(--cw-slider-progress,0%))}.cwi-range input[type=range]::-moz-range-thumb{width:44px;height:44px;border:0;background:radial-gradient(circle,#783bea 0 8px,#fff 8px 10px,transparent 11px)}.cwi-modal footer button{flex:1}.cwi-modal footer .cwi-apply{flex:2}@media(max-height:500px){.cwi-preview{flex-basis:27%}.cwi-modal{padding:10px;gap:6px}.cwi-modal h2{font-size:18px}}

/* Opt in to photo-sticker's shared control styles while keeping a separate session. */
.cwi-modal .cwi-control-surface{font:14px/1.5 sans-serif;color:#252538;box-sizing:border-box}
.cwi-modal .cwi-control-surface *{box-sizing:border-box}
#cw-illustration-effects.cwi-modal .kw-head{margin:-18px -18px 0;align-items:start}
#cw-illustration-effects.cwi-modal .kw-footer{margin:0 -18px -18px;align-items:stretch}
#cw-illustration-effects .kw-footer button:not(.cwi-apply){flex:none;min-height:0}
#cw-illustration-effects .kw-head button{min-height:0}
@media(max-height:500px){#cw-illustration-effects.cwi-modal .kw-head{margin:-10px -10px 0}#cw-illustration-effects.cwi-modal .kw-footer{margin:0 -10px -10px}}

#cw-illustration-effects .cwi-row.cwi-control-surface{font-weight:500}
/* Keep the photo picker's HEX row on one line in the narrower illustration dialog. */
#cw-illustration-effects .cwi-picker .cwfx-hex{flex-wrap:nowrap}

/* All options below the tabs share one scroll area; its edges fade as content moves. */
#cw-illustration-effects .cwi-tabs,#cw-illustration-effects .cwi-fill{flex:none;margin:0}
#cw-illustration-effects .cwi-preview{flex:0 1 clamp(90px,25dvh,280px);min-height:80px}
#cw-illustration-effects .cwi-scroll-shell{position:relative;flex:1;min-height:64px;overflow:hidden}
#cw-illustration-effects .cwi-settings{box-sizing:border-box;height:100%;min-height:0;overflow-x:hidden;overflow-y:auto;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;scroll-padding:12px 0 20px;padding-bottom:20px}
#cw-illustration-effects .cwi-scroll-shell::before,#cw-illustration-effects .cwi-scroll-shell::after{content:"";position:absolute;left:0;right:0;height:var(--cw-sheet-fade-height);z-index:1;pointer-events:none;opacity:0}
#cw-illustration-effects .cwi-scroll-shell::before{top:0;background:var(--cw-sheet-top-fade)}
#cw-illustration-effects .cwi-scroll-shell::after{bottom:0;background:linear-gradient(to top,#fff,#fff0)}
#cw-illustration-effects .cwi-scroll-shell.cwi-scrolled::before,#cw-illustration-effects .cwi-scroll-shell.cwi-more::after{opacity:1}
#cw-illustration-effects .cwi-settings::-webkit-scrollbar,#cw-illustration-effects .cwi-picker::-webkit-scrollbar{display:none;width:0;height:0}
#cw-illustration-effects .cwi-picker{scrollbar-width:none;-ms-overflow-style:none}
#cw-illustration-effects .cwi-fill-toggle{flex-wrap:nowrap}
#cw-illustration-effects .cwi-fill-toggle input{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:48px;height:28px;margin:0;padding:0;border:0;border-radius:20px;background:#d9d5e5;cursor:pointer}
#cw-illustration-effects .cwi-fill-toggle input::before{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0002}
#cw-illustration-effects .cwi-fill-toggle input:checked{background:#7340e8}
#cw-illustration-effects .cwi-fill-toggle input:checked::before{left:23px}
@media(max-height:500px){#cw-illustration-effects .cwi-preview{flex-basis:60px;min-height:48px}#cw-illustration-effects .cwi-fill .cwi-row{padding-block:4px}}

/* Keep only the internal color sheet enhanced; the parent retains its modal chrome. */
#cw-illustration-effects .cwi-row [data-color][aria-pressed=true]{outline:3px solid #793aff;outline-offset:3px}