.cc-unified .cp-heading{text-align:left;margin:28px auto 26px;max-width:1280px}.cc-unified .cp-heading h1{font-size:clamp(29px,3.6vw,48px);font-weight:700;margin:26px 0 12px}.cc-unified .cp-heading h1 br{display:none}.cc-unified .cp-heading p{font-size:18px;max-width:780px;margin-bottom:0}.cc-unified .cp-shell>.cp-section{background:none;padding:0;margin-top:0}.rgb-current{display:flex;gap:12px;align-items:center;justify-content:flex-end;color:#eaf0f7;margin:0 0 18px}.rgb-current>span:first-child{width:40px;height:40px;border-radius:10px;border:2px solid #ffffff50}.rgb-current small{display:block;font-size:10px;color:#a5b2c4;letter-spacing:.1em}.rgb-current strong{font:700 15px ui-monospace,monospace}.rgb-free{font-size:10px;letter-spacing:.08em;background:#173f33;color:#9ff3c6;padding:8px 12px;border-radius:25px;margin-left:auto;order:-1}.rgb-lab{border-radius:26px;overflow:hidden;background:#fff;box-shadow:0 20px 60px #0003}.rgb-banner{display:grid;grid-template-columns:1.15fr 1fr}.cp-page .rgb-banner>button{border-radius:0;border:0;text-align:left;min-height:235px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:28px 32px;color:white;position:relative}.rgb-banner>button>*{position:relative;background:#101e2dc9;border-radius:8px;padding:5px 9px}.rgb-banner>button strong{font:700 clamp(25px,3vw,43px)/1.4 system-ui,sans-serif;letter-spacing:.04em;margin-top:48px}.rgb-banner-tag{font-size:10px;letter-spacing:.12em;font-weight:700;border-radius:20px!important}.rgb-banner>button>span:last-of-type{font-size:13px;margin-top:8px}.rgb-banner>button:last-child:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,#ffffff09 3px,#ffffff09 5px);pointer-events:none}.rgb-controls{display:grid;grid-template-columns:1fr 1fr;gap:72px;padding:30px 32px 15px;position:relative}.cp-page .rgb-controls form{min-width:0}.rgb-controls h2{font-size:14px;font-weight:700;letter-spacing:.08em;color:#db4254;margin:0 0 5px}.rgb-controls form:last-of-type h2{color:#0098b5}.rgb-controls p{font-size:12px;color:#70829a;margin:0 0 25px}.rgb-channel{display:grid;grid-template-columns:1fr 75px;align-items:center;gap:12px;margin-bottom:20px;--channel:#223447;--start:#dedfe3}.rgb-channel[data-channel=r]{--channel:#f04456;--start:#292929}.rgb-channel[data-channel=g]{--channel:#1fc466;--start:#292929}.rgb-channel[data-channel=b]{--channel:#387cf2;--start:#292929}.rgb-channel[data-channel=c]{--channel:#00b3e6;--start:#e7faff}.rgb-channel[data-channel=m]{--channel:#e8008e;--start:#ffebf8}.rgb-channel[data-channel=y]{--channel:#f0c300;--start:#fff8d8}.rgb-channel[data-channel=k]{--channel:#242424;--start:#eeeeef}.rgb-channel label{font-size:13px;font-weight:700;display:flex;gap:9px;align-items:center}.rgb-channel label span{width:10px;height:10px;border-radius:50%;background:var(--channel)}.cp-page .rgb-channel input[type=number]{padding:7px 9px;text-align:right;font-size:13px;font-weight:700;border-color:#dbe5ef}.cp-page .rgb-channel input[type=range]{grid-column:1/-1;appearance:none;height:9px;padding:0;border:0;background:linear-gradient(90deg,var(--start),var(--channel));border-radius:9px;cursor:pointer;width:100%;margin:6px 0}.rgb-channel input[type=range]::-webkit-slider-thumb{appearance:none;width:22px;height:22px;border:3px solid #344352;background:#fff;border-radius:50%;box-shadow:0 2px 6px #0003}.rgb-channel input[type=range]::-moz-range-thumb{width:17px;height:17px;border:3px solid #344352;background:#fff;border-radius:50%}.rgb-sync{position:absolute;left:50%;top:45%;transform:translateX(-50%);background:#102433;color:#fff;border-radius:50%;font-size:23px;width:44px;height:44px;display:grid;place-items:center;box-shadow:0 5px 20px #10243320}.rgb-sync small{position:absolute;top:52px;font-size:8px;letter-spacing:.1em;color:#70829a;white-space:nowrap}.cp-page .rgb-reset{border:0;font-size:11px;padding:5px 0;color:#65768a;text-decoration:underline}.rgb-extras{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:15px 32px 24px}.rgb-hex-box,.rgb-tac{padding:18px;background:#f4f7fb;border:1px solid #e0e8f1;border-radius:16px;min-width:0}.rgb-hex-box>label,.rgb-tac h3{display:block;font-size:10px;letter-spacing:.09em;color:#62778b;font-weight:700;margin:0 0 12px}.rgb-hex-box>div{display:flex;gap:9px;align-items:center}.rgb-hex-box #hexChip{width:25px;height:25px;border-radius:7px;flex-shrink:0}.cp-page .rgb-hex-box input{font-weight:700;font-size:15px;min-width:0;max-width:180px}.cp-page .rgb-hex-box button{background:#2399bc;color:#fff;font-size:11px;font-weight:700;white-space:nowrap;padding:10px 12px;border:0}.rgb-pick{position:relative;background:white;border:1px solid #dbe5ef;white-space:nowrap;padding:9px 12px;border-radius:12px;font-size:12px;font-weight:700;cursor:pointer}.rgb-pick input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.rgb-tac-bar{display:flex;height:15px;border-radius:20px;overflow:hidden;background:#e3e9ef}.rgb-tac-bar span{display:block;height:100%}.rgb-tac>div:last-of-type{display:flex;justify-content:space-between;gap:8px;margin-top:10px;font-size:11px;color:#6f8297}.rgb-tac strong{color:#102d40}.rgb-tac small{display:block;font-size:10px;color:#6f8297;margin-top:7px}.rgb-output{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:18px 32px;background:#102433;color:#fff}.rgb-output>span{font-size:10px;color:#90dbed;font-weight:700;letter-spacing:.1em}.cp-page .rgb-output-pill{background:#ffffff10;border:1px solid #ffffff20;border-radius:12px;padding:10px 12px;color:#fff;font:700 11px/1.4 ui-monospace,monospace}.cp-page .rgb-output-pill:hover{background:#ffffff25}.cp-page .rgb-copy-all{background:#2399bc;color:#fff;font-weight:700;border:0;padding:10px 14px;font-size:12px;margin-left:auto}.rgb-variations{padding:24px 32px}.rgb-variations h3{font-size:10px;letter-spacing:.1em;color:#63768b;font-weight:700;margin:0 0 14px}.rgb-variations>div{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.cp-page .rgb-variation{padding:0;border:0;background:none;border-radius:10px;min-width:0}.rgb-variation span{display:block;width:100%;height:56px;border-radius:12px;border:1px solid #0002}.rgb-variation small{display:block;font:700 9px ui-monospace,monospace;color:#61758a;margin-top:7px}.rgb-variation.selected span{outline:3px solid #102433;outline-offset:2px}#rgbError{margin:0 32px 15px;color:#b72c45;font-size:13px}@media(max-width:800px){.rgb-controls{gap:36px;padding:24px}.rgb-sync{display:none}.rgb-extras{grid-template-columns:1fr;padding:15px 24px}.rgb-banner>button strong{font-size:26px}.cp-page .rgb-banner>button{padding:20px}.rgb-output{padding:18px 24px}.rgb-variations{padding:20px 24px}.rgb-variations>div{gap:6px}.rgb-current{justify-content:flex-start}}@media(max-width:550px){.rgb-banner,.rgb-controls{grid-template-columns:1fr}.cp-page .rgb-banner>button{min-height:170px}.rgb-banner>button strong{margin-top:20px}.rgb-controls{gap:24px}.rgb-variations>div{grid-template-columns:repeat(4,1fr);gap:12px}.rgb-free{display:none}.rgb-hex-box>div{flex-wrap:wrap}.rgb-hex-box input{max-width:calc(100% - 40px)}.rgb-copy-all{margin-left:0!important}.cc-unified .cp-heading p{font-size:15px}}
.cc-unified .cp-shell>.cp-section>p.cp-muted{color:#a5b2c4}