*{box-sizing:border-box}body{color:#e8edf7;background:#0c1426;margin:0;font:14px/1.65 system-ui,-apple-system,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:not-allowed}button,a,input,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-offset:3px;outline:3px solid #7dd3fc}a{color:inherit}[hidden]{display:none!important}.sr-only,.cp-skip:not(:focus){clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.cp-skip:focus{z-index:999999;color:#152139;background:#c4b5fd;padding:10px;position:fixed;top:10px;left:10px}.cp-app{max-width:1280px;margin:0 auto;padding:0 28px}.cp-hero{text-align:center;padding:35px 0 36px}.cp-back{color:#9badc7;width:-moz-fit-content;width:fit-content;margin-bottom:26px;font-size:12px;text-decoration:none;display:block}.cp-eyebrow{letter-spacing:1.9px;color:#c4b5fd;font-size:10px;font-weight:750}.cp-hero h1{letter-spacing:-2.5px;margin:19px 0;font-size:clamp(39px,4.7vw,63px);font-weight:750;line-height:1.13}.cp-hero h1 span{color:#c4b5fd}.cp-hero p{color:#a5b5ce;margin:22px 0;font-size:15px;line-height:1.9}.cp-promises{color:#a0b3cd;justify-content:center;gap:26px;font-size:11px;display:flex}.cp-promises span:first-child{color:#8bdfc7}.cp-workspace{background:#101b2e;border:1px solid #303e58;border-radius:18px;overflow:clip}.cp-dropzone{text-align:center;background:radial-gradient(at 50% 0,#46385d70,#0000 75%);border:1.5px dashed #4a5776;border-radius:12px;margin:13px;padding:36px 20px 24px}.cp-icon{background:#443b5b33;border:1px solid #6b5f8433;border-radius:22px;width:76px;height:76px;margin:0 auto 18px;padding:8px}.cp-icon svg{width:100%;height:100%}.cp-dropzone h2{letter-spacing:-.5px;margin:0 0 8px;font-size:22px}.cp-dropzone>p{color:#9bacc7;margin:0 0 22px;font-size:13px}.button{color:#dfe6f4;background:#1b2a44;border:1px solid #3d4c69;border-radius:9px;justify-content:center;align-items:center;gap:7px;min-height:43px;padding:10px 15px;font-size:12px;font-weight:650;display:inline-flex}.button:hover:enabled{background:#2d3d5d}.button.primary{color:#171e38;background:#c4b5fd;border-color:#c4b5fd}.button.primary:hover:enabled{background:#ddd6fe}.button.small{min-height:34px;padding:7px 10px;font-size:10px}.button.subtle{color:#a9b6d2;background:0 0}.button.danger{color:#ffdae8;background:#542d43;border-color:#94576f}.button.full{width:100%;margin:11px 0;display:flex}.fine{line-height:1.8;color:#91a5c3!important;font-size:10px!important}.cp-dropzone .fine{margin:14px 0 24px}.cp-demos{color:#9eacc8;border-top:1px solid #323b56;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;padding-top:20px;font-size:11px;display:flex}.cp-demos button{background:#1a263f;border:1px solid #41506c;border-radius:6px;padding:7px 10px;font-size:11px}.cp-session-head{justify-content:space-between;align-items:center;gap:15px;padding:22px;display:flex}.cp-session-head h2{letter-spacing:-.4px;margin:0 0 4px;font-size:17px}.cp-session-head p{color:#9babc7;overflow-wrap:anywhere;margin:0;font-size:11px}.cp-actions{flex-shrink:0;gap:6px;display:flex}.cp-editor-grid{border-top:1px solid #303c55;grid-template-columns:minmax(0,1fr) 310px;display:grid}.cp-image-panel{background:#0b1526;min-width:0}.cp-preview-bar{justify-content:space-between;align-items:center;gap:9px;padding:12px 14px;display:flex}.cp-segments{background:#091224;border:1px solid #33405b;border-radius:8px;gap:3px;padding:3px;display:flex}.cp-segments button{color:#99acc9;background:0 0;border:0;border-radius:5px;min-height:30px;padding:7px 10px;font-size:10px}.cp-segments button[aria-pressed=true]{color:#eeeaff;background:#31375e}.cp-history{gap:4px;display:flex}.cp-history button{color:#9eb0cb;background:#17243d;border:1px solid #35445f;border-radius:6px;min-height:30px;padding:5px 8px;font-size:10px}.cp-history button:first-child,.cp-history button:nth-child(2){font-size:18px;line-height:1}.cp-preview-wrap{background-color:#081321;place-items:center;height:490px;padding:16px;display:grid;position:relative;overflow:hidden}.checker{background-image:linear-gradient(45deg,#233048 25%,#0000 25%),linear-gradient(-45deg,#233048 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#233048 75%),linear-gradient(-45deg,#0000 75%,#233048 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}#preview{touch-action:none;cursor:crosshair;max-width:100%;height:auto;display:block}.cp-loading{color:#ddd6fe;z-index:3;background:#0c152bd9;place-items:center;font-size:12px;display:grid;position:absolute;inset:0}.cp-preview-bottom{color:#93a5c3;border-bottom:1px solid #2c3a53;justify-content:space-between;gap:12px;padding:11px 14px;font-size:10px;display:flex}.cp-preview-bottom output{color:#bdc9e0;text-align:right;max-width:48%}.cp-picker{align-items:center;gap:9px;padding:16px 14px 10px;display:flex}.cp-picker>span{background:linear-gradient(135deg,#a5b4fc,#f9a8d4);border:1px solid #6d7c9944;border-radius:8px;flex-shrink:0;width:38px;height:38px}.cp-picker>div{flex:1;min-width:0}.cp-picker b{font-size:11px;font-weight:600;display:block}.cp-picker small{color:#8fa4c1;margin-top:2px;font-size:9px;display:block}.cp-picker-size{color:#9bacc9;flex-wrap:wrap;align-items:center;gap:10px;padding:0 14px 17px;font-size:9px;display:flex}.cp-picker-size select{color:#becce4;background:#122039;border:1px solid #3c4a68;border-radius:5px;padding:5px 7px;font-size:9px}.cp-picker-size>span{color:#7f95b5;margin-left:auto;font-size:9px}.cp-controls{border-left:1px solid #303f58;min-width:0;padding:0 18px}fieldset{border:0;min-width:0;margin:0;padding:0}.cp-control-section{padding:20px 0}.cp-control-section h3{align-items:center;gap:8px;margin:0 0 18px;font-size:13px;display:flex}.cp-control-section h3 b{letter-spacing:1px;color:#c4b5fd;border:1px solid #5f527e;border-radius:4px;padding:1px 4px;font-size:9px}.cp-control-section label,.cp-gradient-panel>label{color:#afbfda;justify-content:space-between;align-items:center;gap:8px;margin:13px 0 7px;font-size:10px;display:flex}.cp-control-section output{color:#c4b5fd;font-size:10px}.cp-control-section select,.cp-palette-actions select,.cp-export select,.cp-export input[type=text],#hex-edit,.cp-pair-select select{color:#dce5f7;background:#0d192e;border:1px solid #3a4867;border-radius:7px;width:100%;min-width:0;min-height:40px;padding:8px 9px;font-size:11px}input[type=range]{accent-color:#c4b5fd;cursor:pointer;width:100%}input[type=color]{cursor:pointer;background:#17243b;border:1px solid #4b5873;border-radius:5px;width:36px;height:30px;padding:2px}input[type=checkbox]{accent-color:#c4b5fd;flex-shrink:0;width:15px;height:15px;margin:0}.cp-checks{gap:12px;margin:13px 0;display:flex}.cp-control-section .cp-checks label{justify-content:flex-start;margin:0;font-size:10px}.cp-progress{padding:0 0 17px}.cp-progress p{color:#d5caff;margin:0 0 10px;font-size:11px}.cp-palette-section{border-top:1px solid #303e58;padding:25px 21px 21px}.cp-palette-head{justify-content:space-between;align-items:flex-end;gap:15px;margin-bottom:16px;display:flex}.cp-palette-head h2{letter-spacing:-.5px;margin:7px 0 0;font-size:20px}.cp-palette-actions{align-items:center;gap:6px;display:flex}.cp-palette-actions select{width:auto;min-height:34px;padding:6px 7px;font-size:10px}.cp-distribution{background:#17243a;border-radius:5px;height:15px;display:flex;overflow:hidden}.cp-distribution span{min-width:0}.cp-palette{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;margin:16px 0;display:grid}.cp-card{background:#14213a;border:1px solid #3a4760;border-radius:10px;min-width:0;overflow:hidden}.cp-card[aria-selected=true]{border-color:#ddd6fe;box-shadow:0 0 0 1px #c4b5fd66}.cp-color-button{text-align:left;border:0;border-bottom:1px solid #ffffff12;width:100%;height:114px;padding:11px;display:block;position:relative}.cp-color-button span{opacity:.8;font-size:9px;position:absolute;bottom:9px;left:10px}.cp-card-info{padding:9px}.cp-card-code{white-space:nowrap;text-overflow:ellipsis;text-align:left;background:0 0;border:0;max-width:100%;min-height:22px;padding:0;font:600 11px ui-monospace,SFMono-Regular,Consolas,monospace;display:block;overflow:hidden}.cp-card-bottom{color:#a2b2cb;justify-content:space-between;align-items:center;gap:5px;margin-top:6px;font-size:9px;display:flex}.cp-card-bottom button{color:#b4c0dc;background:#1b2942;border:1px solid #3b4c69;border-radius:5px;min-height:25px;padding:3px 5px;font-size:9px}.cp-card-bottom button[aria-pressed=true]{color:#ddd6fe;background:#56466f44;border-color:#8b79b8}.cp-color-detail{background:#0c182c;border:1px solid #374561;border-radius:10px;grid-template-columns:100px minmax(0,1fr) auto;align-items:center;gap:16px;padding:15px;display:grid}.cp-color-detail>#detail-swatch{border:1px solid #ffffff1c;border-radius:8px;width:100px;height:100px}.cp-detail-code label{color:#9eafca;margin-bottom:7px;font-size:10px;display:block}.cp-detail-code>div{align-items:center;gap:7px;max-width:240px;display:flex}#hex-edit{letter-spacing:1px;min-height:38px;font:600 15px ui-monospace,monospace}.cp-detail-code code{color:#9bafcd;margin-top:5px;font-size:10px;display:block}.cp-detail-actions{max-width:270px}.cp-detail-actions .fine{max-width:230px;margin-bottom:0}.cp-bottom-grid{border-top:1px solid #303d56;grid-template-columns:1fr 1fr;display:grid}.cp-gradient-panel,.cp-contrast-panel{min-width:0;padding:24px 21px}.cp-gradient-panel{border-right:1px solid #303d56}.cp-bottom-grid h3{letter-spacing:-.3px;margin:9px 0 18px;font-size:17px}#gradient-preview{border:1px solid #ffffff15;border-radius:10px;height:130px}#gradient-code{white-space:pre-wrap;overflow-wrap:anywhere;color:#9fb3d1;background:#0b172a;border:1px solid #293e58;border-radius:7px;max-height:105px;padding:11px;font:10px/1.9 ui-monospace,Consolas,monospace;overflow:auto}.cp-inline{flex-wrap:wrap;gap:6px;display:flex}.cp-contrast-controls{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.cp-contrast-controls label{color:#a3b5d0;align-items:center;gap:10px;font-size:11px;display:flex}.cp-pair-select{gap:7px;margin-bottom:13px;display:flex}.cp-pair-select select{min-height:33px;padding:6px 7px;font-size:10px}#contrast-preview{border:1px solid #ffffff20;border-radius:9px;flex-direction:column;justify-content:center;gap:7px;min-height:112px;padding:18px 19px;display:flex}#contrast-preview strong{letter-spacing:-.5px;font-size:22px;line-height:1.3}#contrast-preview span{font-size:12px}.cp-contrast-result{align-items:center;gap:17px;margin-top:14px;display:flex}.cp-contrast-result output{letter-spacing:-1px;color:#d8cdff;flex-shrink:0;font-size:27px;font-weight:700}.cp-contrast-result>div{flex-wrap:wrap;gap:5px;display:flex}.cp-contrast-result span{color:#9fe2c5;background:#163c3244;border:1px solid #376554;border-radius:5px;padding:3px 6px;font-size:9px}.cp-contrast-result span.fail{color:#f5c48f;background:#53372933;border-color:#76563f}.cp-export{border-top:1px solid #303e57;grid-template-columns:1fr 1.15fr;align-items:center;gap:28px;padding:25px 21px;display:grid}.cp-export h3{letter-spacing:-.4px;margin:9px 0;font-size:18px}.cp-export label{color:#adbfda;font-size:10px;display:block}.cp-export input[type=text]{margin-top:6px}.cp-export-row{align-items:center;gap:8px;margin-top:10px;display:flex}.cp-export-row .button{white-space:nowrap}.cp-export label.cp-check{align-items:center;gap:8px;margin-top:11px;display:flex}.cp-workspace.dragging{outline-offset:4px;outline:3px solid #c4b5fd}#message{color:#eddafa;white-space:pre-line;background:#3a2945;border:1px solid #795c80;border-radius:8px;margin:13px;padding:12px;font-size:12px}#copy-panel{background:#172940;border:1px solid #53678e;border-radius:9px;margin:13px;padding:14px}#copy-panel p{color:#b6c9e3;font-size:11px}#copy-text{color:#d9e4f5;resize:vertical;background:#09172a;border:1px solid #465c7b;border-radius:6px;width:100%;min-height:95px;padding:10px;font:11px/1.8 ui-monospace,monospace}#copy-panel button{margin-top:9px}.cp-how{padding:54px 4px 34px}.cp-how>div:first-child{justify-content:space-between;align-items:center;gap:20px;display:flex}.cp-how h2,.cp-faq h2{letter-spacing:-.7px;margin:12px 0 30px;font-size:24px}.cp-steps{grid-template-columns:repeat(3,1fr);gap:25px;display:grid}.cp-steps article{border-top:1px solid #34425a;padding-top:22px}.cp-steps b{color:#c4b5fd;font-size:11px}.cp-steps h3{margin:15px 0 9px;font-size:14px}.cp-steps p{color:#97acc7;margin:0;font-size:12px;line-height:1.9}.cp-privacy{background:#113031;border:1px solid #2d5556;border-radius:12px;align-items:center;gap:22px;margin:5px 0 45px;padding:25px 28px;display:flex}.cp-privacy>span{color:#7de0c6;font-size:32px}.cp-privacy h2{letter-spacing:-.3px;color:#a2e9d9;margin:0 0 7px;font-size:16px}.cp-privacy p{color:#9cbfbd;margin:0;font-size:12px;line-height:1.9}.cp-faq{max-width:850px;margin:0 auto}.cp-faq details{border-bottom:1px solid #2c4056;padding:17px 0}.cp-faq summary{cursor:pointer;justify-content:space-between;gap:20px;font-size:13px;list-style:none;display:flex}.cp-faq summary:after{content:"＋";color:#c4b5fd}.cp-faq details[open] summary:after{content:"−"}.cp-faq p{color:#96abc5;margin:13px 0 0;font-size:12px;line-height:1.9}.cp-faq p a{color:#cab9f3}.cp-footer{color:#8fa5c4;border-top:1px solid #2d4058;justify-content:space-between;gap:20px;margin-top:45px;padding:22px 0 30px;font-size:10px;display:flex}.cp-footer a{color:#b1c3df}@media (max-width:1000px){.cp-app{padding:0 18px}.cp-editor-grid{grid-template-columns:minmax(0,1fr) 280px}.cp-controls{padding:0 14px}.cp-palette{grid-template-columns:repeat(4,minmax(0,1fr))}.cp-preview-wrap{height:440px}.cp-hero h1{font-size:49px}.cp-picker{flex-wrap:wrap;gap:7px}.cp-picker>div{min-width:160px}.cp-picker-size>span{margin-left:0}.cp-how>div:first-child{display:block}.cp-palette-head{align-items:flex-start}.cp-palette-actions{flex-wrap:wrap;justify-content:flex-end}.cp-color-detail{grid-template-columns:85px minmax(0,1fr)}.cp-color-detail>#detail-swatch{width:85px;height:85px}.cp-detail-actions{grid-column:1/-1;max-width:none}.cp-detail-actions .fine{max-width:none;margin-left:8px;display:inline}.cp-export{gap:20px}.cp-contrast-result{gap:10px}.cp-contrast-result output{font-size:24px}}@media (max-width:700px){.cp-app{padding:0 10px}.cp-hero{padding:24px 5px 29px}.cp-back{margin-bottom:26px;font-size:11px}.cp-eyebrow{letter-spacing:1.3px;font-size:9px}.cp-hero h1{letter-spacing:-1.7px;font-size:40px}.cp-hero p{font-size:13px;line-height:1.9}.desktop{display:none}.cp-promises{gap:11px;font-size:8px}.cp-workspace{border-radius:13px}.cp-dropzone{margin:9px;padding:27px 12px 22px}.cp-dropzone h2{font-size:19px}.cp-dropzone>p{font-size:12px}.cp-dropzone .fine{font-size:9px!important}.cp-demos{gap:6px;font-size:10px}.cp-demos>span{flex:0 0 100%;margin-bottom:4px}.cp-demos button{padding:7px 8px;font-size:9px}.cp-session-head{align-items:flex-start;gap:9px;padding:17px 13px}.cp-session-head h2{font-size:14px}.cp-session-head p{max-width:230px;font-size:9px}.cp-actions{flex-direction:column;gap:4px}.cp-actions .button{min-height:29px;padding:5px 8px;font-size:9px}.cp-editor-grid{display:block}.cp-preview-bar{gap:6px;padding:10px}.cp-segments button{padding:6px 8px;font-size:9px}.cp-history button{padding:5px 7px;font-size:9px}.cp-history button:first-child,.cp-history button:nth-child(2){font-size:17px}.cp-preview-wrap{height:360px;padding:12px}.cp-preview-bottom{padding:10px 12px;font-size:9px}.cp-preview-bottom>span{max-width:190px}.cp-picker{gap:7px;padding:14px 12px 10px}.cp-picker>div{min-width:180px}.cp-picker .button{min-height:30px;padding:5px 8px;font-size:9px}.cp-picker b{font-size:10px}.cp-picker-size{padding:0 12px 15px;font-size:9px}.cp-picker-size>span{display:none}.cp-controls{border-top:1px solid #303e58;border-left:0;padding:0 17px}.cp-control-section{padding:21px 0}.cp-control-section label{font-size:11px}.cp-control-section select{font-size:12px}.cp-checks{gap:17px}.cp-control-section .cp-checks label{font-size:11px}.fine{font-size:9px!important}.cp-palette-section{padding:22px 12px 17px}.cp-palette-head{display:block}.cp-palette-head h2{font-size:18px}.cp-palette-actions{justify-content:flex-start;gap:6px;margin-top:14px}.cp-palette-actions select{font-size:9px}.cp-palette-actions .button{padding:6px 8px;font-size:9px}.cp-palette{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}.cp-color-button{height:112px}.cp-card-code{min-height:25px;font-size:11px}.cp-card-bottom{font-size:9px}.cp-card-bottom button{min-height:28px}.cp-color-detail{grid-template-columns:70px minmax(0,1fr);gap:12px;padding:12px}.cp-color-detail>#detail-swatch{width:70px;height:88px}.cp-detail-code label,.cp-detail-code code{font-size:9px}.cp-detail-actions .fine{margin:9px 0 0;display:block}.cp-bottom-grid{display:block}.cp-gradient-panel,.cp-contrast-panel{padding:23px 15px}.cp-gradient-panel{border-bottom:1px solid #303d56;border-right:0}.cp-bottom-grid h3{font-size:16px}.cp-gradient-panel>label{font-size:10px}#gradient-preview{height:122px}#contrast-preview strong{font-size:21px}.cp-contrast-result output{font-size:27px}.cp-contrast-result span{font-size:8px}.cp-export{padding:23px 15px;display:block}.cp-export h3{font-size:17px}.cp-export-controls{margin-top:18px}.cp-export-row{gap:6px}.cp-export-row select{font-size:10px}.cp-export-row .button{padding:9px 10px;font-size:10px}.cp-how{padding:40px 7px 28px}.cp-how h2,.cp-faq h2{font-size:21px}.cp-steps{grid-template-columns:1fr;gap:24px}.cp-steps article{padding-top:18px}.cp-steps h3{margin-top:10px}.cp-steps p{font-size:11px}.cp-privacy{align-items:flex-start;gap:12px;margin-bottom:36px;padding:20px 16px}.cp-privacy>span{font-size:25px}.cp-privacy h2{font-size:14px}.cp-privacy p{font-size:11px}.cp-faq{padding:0 7px}.cp-faq summary{font-size:12px}.cp-footer{padding:20px 7px 27px;font-size:9px}}