/* Browser-persisted colors for the author studio; scoped to new component only. */
.rw-color-palette{position:fixed;z-index:920;width:264px;max-width:calc(100vw - 16px);border:1px solid #5c6774;border-radius:6px;background:#222832;color:#e9edf3;box-shadow:0 15px 42px #000b;padding:9px;font:13px/1.4 system-ui,-apple-system,sans-serif}
.rw-color-title{display:flex;justify-content:space-between;align-items:center;font-weight:700;margin:0 0 8px}.rw-color-title button{border:0;background:transparent;color:#c9d3df;font-size:24px;cursor:pointer;line-height:1;padding:0 3px}
.rw-color-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px}
.rw-color-swatch{box-sizing:border-box;width:100%;aspect-ratio:1;border:1px solid #7d8793!important;border-radius:0!important;background:var(--swatch)!important;cursor:pointer!important;margin:0!important;padding:0!important;min-width:0!important;min-height:0!important;box-shadow:inset 0 0 0 1px #0004}
.rw-color-swatch:hover,.rw-color-swatch:focus-visible{outline:2px solid #fff;outline-offset:1px;position:relative;z-index:1}
.rw-color-swatch.rw-color-empty{background:#252d38!important;color:#b9cad6;font-size:17px;border-style:dashed!important;box-shadow:none}
.rw-color-custom-label{display:flex;align-items:baseline;justify-content:space-between;gap:5px;margin:13px 0 6px;font-weight:700}
.rw-color-custom-label span{color:#9eafbd;font-size:10px;font-weight:400}
.rw-color-customize{display:flex!important;align-items:center;justify-content:space-between;width:100%;border:1px solid #4d5b68;background:#303945;color:#e9edf3;border-radius:3px;margin-top:10px;padding:8px 10px;text-align:left;cursor:pointer}
.rw-color-customize:hover{background:#405263}.rw-color-customize span{font-size:11px;color:#b3c2d1}
.rw-color-dialog{width:min(650px,96vw);max-height:95vh;overflow:auto;border:1px solid #556476;border-radius:10px;background:#222a32;color:#e4eaf1;padding:0;box-shadow:0 25px 75px #000d;font:14px/1.4 system-ui,-apple-system,sans-serif}
.rw-color-dialog::backdrop{background:#090d13cc}
.rw-color-modal-head{display:flex;align-items:center;justify-content:space-between;background:#191f27;padding:12px 17px;border-bottom:1px solid #475462}
.rw-color-modal-head h2{font-size:20px;font-weight:600;color:inherit;margin:0}.rw-color-modal-head button{border:0;background:transparent;color:#d6e0ea;font-size:24px;cursor:pointer}
.rw-color-modal-body{display:grid;grid-template-columns:minmax(0,1fr) 175px;gap:17px;padding:17px}
.rw-color-picker-main{display:flex;gap:10px;min-width:0}
.rw-color-sv{position:relative;flex:1;min-width:0;min-height:258px;touch-action:none;cursor:crosshair;outline-offset:4px;background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,var(--hue-color,#f00));border:1px solid #697381}
.rw-color-marker{position:absolute;width:14px;height:14px;border:2px solid white;border-radius:50%;box-shadow:0 1px 3px #000c;transform:translate(-50%,-50%);pointer-events:none}
.rw-color-hue{appearance:slider-vertical;writing-mode:vertical-lr;direction:rtl;width:23px;height:258px;margin:0;cursor:pointer;accent-color:#e9edf3;background:linear-gradient(to bottom,red,magenta,blue,cyan,lime,yellow,red)}
.rw-color-picker-fields{display:flex;flex-direction:column;gap:8px}.rw-color-picker-fields label{display:grid;grid-template-columns:42px minmax(0,1fr);gap:7px;align-items:center;font-size:14px;font-weight:500;margin:0}
.rw-color-picker-fields input,.rw-color-picker-fields select{width:100%;min-width:0;border:1px solid #8491a1;border-radius:3px;background:#f7f8fa;color:#222d39;padding:6px 8px;font:14px system-ui;margin:0;min-height:33px}
.rw-color-picker-fields label:has([name=hex]){grid-template-columns:42px minmax(0,1fr)}
.rw-color-preview{height:47px;border:1px solid #626e7b;border-radius:3px;margin:4px 0;background:#000}
.rw-color-picker-fields .rw-color-slot-label{grid-template-columns:1fr;gap:4px;font-size:12px}
.rw-color-modal-info{margin:0;padding:0 17px 15px;color:#adbac8;font-size:12px}
.rw-color-modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:12px 17px;border-top:1px solid #475462;flex-wrap:wrap}
.rw-color-modal-actions button{border:1px solid #5a6979;color:#e8eef5;background:#303b47;border-radius:5px;padding:9px 12px;cursor:pointer;font:13px system-ui}
.rw-color-modal-actions button:hover{background:#43576b}.rw-color-modal-actions .rw-color-primary{background:#276d9a;border-color:#4294c2;color:white}
@media(max-width:530px){.rw-color-modal-body{grid-template-columns:1fr}.rw-color-sv{min-height:190px}.rw-color-hue{height:190px}.rw-color-picker-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}.rw-color-preview{align-self:end}.rw-color-picker-fields .rw-color-slot-label{grid-column:1/-1}}
/* Draw the hue rainbow instead of the browser's default gray slider track. */
.rw-color-hue{-webkit-appearance:none;appearance:none;writing-mode:vertical-lr;direction:rtl;outline-offset:3px;background:linear-gradient(to bottom,#f00,#f0f,#00f,#0ff,#0f0,#ff0,#f00)!important;border:1px solid #94a4b4;border-radius:2px;min-width:21px}
.rw-color-hue::-webkit-slider-runnable-track{background:transparent;border:none}
.rw-color-hue::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:9px;border:2px solid white;border-radius:2px;background:transparent;box-shadow:0 0 0 1px #18212c,0 1px 2px #0008}
.rw-color-hue::-moz-range-track{background:transparent;border:0}
.rw-color-hue::-moz-range-thumb{width:22px;height:7px;border:2px solid white;border-radius:2px;background:transparent;box-shadow:0 0 0 1px #18212c}