@import"https://fonts.googleapis.com/css2?family=Figtree:wght@400;450;500;550;600;650;700;750;800&display=swap";.brand-guide-backdrop{z-index:1000;padding:24px}.app .brand-guide-dialog{width:min(1450px,96vw);max-height:94vh;overflow:auto;background:var(--surface);border:1px solid var(--line-strong);border-radius:24px;padding:30px;color:var(--ink)}.brand-guide-dialog h2{margin:5px 0;font-size:32px}.brand-guide-layout{display:grid;grid-template-columns:320px 1fr;gap:25px}.brand-guide-layout form{display:flex;flex-direction:column;gap:14px}.brand-guide-layout label{display:flex;flex-direction:column;gap:6px;font-size:14px}.brand-guide-layout textarea{resize:vertical;background:var(--key);color:var(--ink);border:1px solid var(--line-strong);border-radius:9px;padding:11px;font:inherit}.brand-guide-layout iframe{width:100%;height:750px;border:0;border-radius:12px;background:#eee}.brand-guide-actions{display:flex;flex-wrap:wrap;gap:8px}.brand-guide-actions .button{font-size:13px}@media(max-width:750px){.brand-guide-layout{grid-template-columns:1fr}.app .brand-guide-dialog{padding:20px}.brand-guide-layout iframe{height:500px}.brand-guide-backdrop{padding:8px}}.app .brand{overflow:visible;white-space:normal;text-decoration:none}.colibria-logo{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:0 3px;position:relative;isolation:isolate}.colibria-symbol{width:48px;height:56px;filter:drop-shadow(0 2px 12px #9b8cff35);transition:transform .3s}.brand:hover .colibria-symbol{transform:rotate(-8deg) translateY(-2px)}.colibria-lettering{font-family:Figtree,sans-serif;font-size:31px;font-weight:850;letter-spacing:-1.6px;line-height:1;display:flex;align-items:baseline;color:var(--ink,#f7f1ff)}.logo-o{background:conic-gradient(from 40deg,#ffa6c9,#b9a3ff,#8ce5e2,#ffcf9e,#ffa6c9);background-clip:text;-webkit-text-fill-color:transparent}.logo-i{position:relative}.logo-i:after{content:"";position:absolute;width:4px;height:4px;border-radius:1px;background:#b2f1de;top:2px;left:3px;transform:rotate(45deg)}.logo-pixel{width:5px;height:5px;background:#f5a2c9;display:inline-block;align-self:flex-start;margin:2px 0 0 4px;box-shadow:5px 5px #9faeff;border-radius:1px}.logo-caption{grid-column:2;font-size:8px;font-weight:650;letter-spacing:2px;color:var(--muted,#bdb3ce);line-height:1.4;margin-top:5px}.app header .brand{height:auto;min-height:85px;padding:18px 12px}.app header .colibria-logo{grid-template-columns:1fr;justify-items:center;gap:5px}.app header .colibria-symbol{height:50px;width:50px}.app header .colibria-lettering{font-size:25px;letter-spacing:-1.3px}.app header .logo-caption{grid-column:1;font-size:6px;letter-spacing:1.1px}.footer-brand .colibria-logo{grid-template-columns:44px 1fr}.footer-brand .colibria-symbol{width:40px}.footer-brand .colibria-lettering{font-size:28px}.footer-brand .logo-caption{display:none}@media(max-width:700px){.app header .brand{padding:8px;min-height:60px}.app header .colibria-logo{display:flex;gap:5px}.app header .colibria-symbol{width:35px;height:39px}.app header .colibria-lettering{font-size:25px}.app header .logo-caption{display:none}}@media(prefers-reduced-motion:reduce){.colibria-symbol{transition:none}}:root{font-family:DM Sans,sans-serif;color:#292e25;background:#f6f5f1;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,.wheel:focus-visible{outline:3px solid #799667;outline-offset:4px}a{color:inherit;text-decoration:none}header{height:87px;border-bottom:1px solid #dedfd6;display:flex;align-items:center;padding:0 4%;gap:7%;background:#faf9f6}.brand{font-family:Manrope,sans-serif;font-size:32px;font-weight:800;letter-spacing:-1.7px;display:flex;align-items:center;gap:10px}.brandmark{height:28px;width:28px;background:conic-gradient(#ee936b,#edc95d,#81b68c,#85b7d0,#a98ec7,#ee936b);border-radius:50%;position:relative}.brandmark:after{content:"";position:absolute;inset:8px;border-radius:50%;background:#faf9f6}.brand-dot{font:11px sans-serif;align-self:flex-start;margin-top:8px;margin-left:-7px}nav{height:100%;display:flex;gap:30px}.nav{font-size:13px;font-weight:500;padding:0 2px;position:relative;color:#83857a;display:flex;gap:7px;align-items:center}.nav.active{color:#30372c}.nav.active:after{content:"";height:3px;background:#53634a;position:absolute;bottom:0;left:0;right:0}.count{background:#e7eadd;padding:2px 6px;border-radius:10px;font-size:10px}.header-right{margin-left:auto;display:flex;align-items:center;gap:24px}.local-label{font-size:11px;color:#7a7e72;display:flex;gap:7px;align-items:center}.local-label i,.status-dot{width:5px;height:5px;border-radius:50%;background:#7c8c65;display:inline-block}.avatar{width:32px;height:32px;border:1px solid #dedfcf;display:grid;place-items:center;border-radius:50%;font-size:12px;background:#eeefdf}main{max-width:1510px;padding:45px 4% 0;margin:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:35px;gap:20px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:1.8px;color:#8a8d7c;margin-bottom:12px}h1{font-family:Manrope,sans-serif;font-size:clamp(26px,2.6vw,38px);font-weight:500;letter-spacing:-1.7px;margin:0 0 12px}.page-heading p{font-size:13px;color:#85867b;margin:0}.heading-actions{display:flex;gap:10px;padding-top:14px}.button{border:1px solid #d9dbd0;background:#faf9f5;display:inline-flex;gap:9px;align-items:center;justify-content:center;min-height:41px;padding:0 16px;border-radius:6px;font-size:11px;font-weight:500;white-space:nowrap}.button:hover{background:#eeeede}.button.dark{background:#364331;border-color:#364331;color:#fff}.button.dark:hover{background:#4b5c44}.studio{display:grid;grid-template-columns:minmax(0,1fr) 304px;gap:20px}.panel{background:#fdfcf9;border:1px solid #dfe0d6;border-radius:10px;overflow:hidden}.section-title{display:flex;justify-content:space-between;align-items:center;padding:22px 24px}.section-title>div{display:flex;align-items:center;gap:10px}h2{font-size:13px;font-weight:500;margin:0}.tiny-index{font-size:9px;color:#a0a38e}.pill{border:1px solid #e4e5dc;background:#f4f5ee;border-radius:20px;padding:5px 8px;font-size:8px;color:#848879}.wheel-layout{display:grid;grid-template-columns:minmax(250px,1.4fr) minmax(170px,1fr);align-items:center;padding:10px 32px 26px;gap:32px}.wheel{position:relative;aspect-ratio:1;max-width:340px;width:100%;margin:auto;border-radius:50%;background:conic-gradient(#f55c5c,#f6a75d,#f4df69,#a4d86b,#69c88b,#6bc8c7,#6b9bd6,#8c7bd2,#c67ccc,#eb7b9a,#f55c5c);touch-action:none;cursor:crosshair;box-shadow:inset 0 0 22px #ffffff4d}.wheel:before{content:"";position:absolute;inset:5%;border-radius:50%;border:1px solid #ffffff26}.wheel-core{position:absolute;inset:27.5%;border-radius:50%;background:#fdfcf9;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2}.wheel-core>span{font-size:7px;color:#969987;letter-spacing:1.4px}.wheel-core strong{font-family:Manrope;font-size:44px;letter-spacing:-2px;font-weight:500;margin:4px 0}.wheel-core sup{font-size:25px}.wheel-core small{font-size:8px;color:#8b8e7f;text-align:center}.wheel-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.wheel-point{position:absolute;transform:translate(-50%,-50%);width:23px;height:23px;border:2px solid white;border-radius:50%;font-size:8px;box-shadow:0 1px 5px #0002;color:#fff;z-index:3;padding:0;text-shadow:0 1px 3px #0006}.wheel-point.selected{outline:2px solid #333c33;outline-offset:3px}.field-label{font-size:10px;display:block;margin-bottom:10px;color:#636959}select{width:100%;background:#fdfcf9;border:1px solid #dcded2;border-radius:5px;height:38px;padding:0 10px;font-size:11px;color:#424b38}.helper{font-size:10px;color:#96998b;line-height:1.6;margin:10px 0 27px;min-height:32px}.slider-label{display:flex;justify-content:space-between;font-size:10px;color:#6b705e;margin:20px 0 10px}.slider-label span{color:#909580}input[type=range]{width:100%;margin:0;appearance:none;height:5px;border-radius:4px;background:var(--track);cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;background:#fdfcf9;border:1px solid #899079;box-shadow:0 1px 2px #0002;width:13px;height:13px;border-radius:50%}input[type=range]::-moz-range-thumb{background:#fff;border:1px solid #899079;width:13px;height:13px;border-radius:50%}.wheel-tip{border-top:1px solid #e7e8df;display:flex;align-items:center;gap:6px;margin-top:25px;padding-top:18px;font-size:9px;color:#999d8d}.panel-footer{height:40px;border-top:1px solid #e8e9e0;padding:0 24px;display:flex;gap:7px;align-items:center;font-size:8px;color:#858b75}.panel-footer>span:last-child{margin-left:auto;color:#a6aa9a}.small-muted{font-size:9px;color:#a4a894}.inspector .section-title{padding:22px 20px}.detail-color{margin:0 20px;border-radius:5px;height:103px;padding:17px;position:relative;display:flex;flex-direction:column;justify-content:space-between}.detail-color>span{font-size:7px;letter-spacing:1.5px;opacity:.75}.detail-color>strong{font-size:24px;letter-spacing:-.7px;font-weight:500}.detail-color>button{position:absolute;right:12px;bottom:17px;opacity:.75;padding:3px}.detail-values{padding:17px 20px 12px}.detail-values label,.detail-values>div{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#9a9d8e;margin-bottom:11px;min-height:20px}.detail-values input{width:108px;text-align:right;color:#535c47;font-size:10px;border:1px solid #e3e4da;border-radius:3px;padding:5px 7px;background:transparent}.detail-values strong{font-size:10px;color:#686f5e;font-weight:400}.accessibility{padding:16px 20px 18px;border-top:1px solid #e8e9e0}.mini-heading{font-size:10px;display:flex;justify-content:space-between;color:#646e56;align-items:center}.mini-heading>span{font-size:7px;letter-spacing:1px;color:#969e88}.contrast-row{display:flex;gap:13px;align-items:center;margin:15px 0 8px}.aa-sample{font-size:35px;line-height:1}.contrast-row>div{display:flex;flex-direction:column;gap:4px}.contrast-row strong{font-size:14px;font-weight:500}.contrast-row>div>span{font-size:8px;color:#929a85}.badge{font-size:7px;border-radius:4px;padding:5px 7px;margin-left:auto;letter-spacing:.3px}.badge.pass{color:#61764d;background:#ecf1e5}.badge.fail{background:#f3eddd;color:#9a8650}.accessibility>p{font-size:9px;line-height:1.6;color:#a1a68f;margin:0}.palette-strip{display:flex;height:164px;border-radius:8px;overflow:hidden;margin-top:26px}.swatch{flex:1;position:relative;min-width:0;transition:background .14s}.swatch-select{width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;text-align:left;padding:18px 22px;color:inherit}.swatch-number{font-size:9px;opacity:.75;display:flex;align-items:center;gap:8px}.swatch-number>span{font-size:6px;letter-spacing:1px;border:1px solid currentColor;border-radius:10px;padding:3px 5px;opacity:.7}.swatch-bottom{display:flex;flex-direction:column;gap:7px}.swatch-bottom>strong{font-family:Manrope;font-weight:500;font-size:20px;letter-spacing:-.5px}.swatch-bottom>small{font-size:8px;opacity:.6}.lock{position:absolute;top:12px;right:12px;color:inherit;opacity:.55;font-size:19px}.lock.locked{opacity:1}.swatch-copy{position:absolute;bottom:17px;right:13px;opacity:0;color:inherit}.swatch:hover .swatch-copy,.swatch:focus-within .swatch-copy{opacity:.7}.palette-caption{display:flex;justify-content:space-between;align-items:center;padding:14px 0 0;font-size:10px;color:#757e65}.palette-dot{display:inline-block;width:6px;height:6px;background:#939c7c;border-radius:50%;margin-right:6px}.muted{color:#a2a795;margin-left:7px}.text-button{display:flex;align-items:center;gap:7px;font-size:10px;color:#606d51;padding:3px}.text-button>span{margin-left:7px;color:#9ba48b}.preview-section{margin-top:45px}.preview-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:21px}.preview-heading .eyebrow{font-size:8px;margin-bottom:8px}.preview-heading h2{font-family:Manrope;font-size:23px;letter-spacing:-.7px;font-weight:500}.segmented{display:flex;background:#eceee5;border:1px solid #dfe2d4;border-radius:6px;padding:3px}.segmented button{font-size:9px;border-radius:4px;padding:8px 12px;color:#8e9681}.segmented button.active{background:#fdfdf9;color:#4b5c3c;box-shadow:0 1px 3px #48503315}.preview-canvas{padding:26px 5%;background:#eaece2;border:1px solid #e0e3d5;border-radius:9px}.mock-site{background:var(--soft);padding:21px 33px 0;border-radius:5px;color:var(--ink);box-shadow:0 3px 12px #29341d08;overflow:hidden}.mock-nav{display:flex;align-items:center;justify-content:space-between;font-size:8px;padding-bottom:19px;border-bottom:1px solid #b3a58c26}.mock-nav>strong{font-size:22px;letter-spacing:-1px}.mock-nav>strong>span{font-size:27px;margin-right:5px}.mock-nav>div{display:flex;gap:25px}.mock-body{display:grid;grid-template-columns:1.1fr 1fr;gap:25px;align-items:center;padding:30px 0 0}.mock-kicker{font-size:6px;letter-spacing:1.1px;opacity:.65}.mock-body h3{font:34px/1.16 Georgia,serif;letter-spacing:-1px;margin:17px 0}.mock-body h3 em{font-weight:400}.mock-body p{font-size:9px;line-height:1.8;max-width:265px;opacity:.7}.mock-body button,.ui-preview article>button{display:flex;align-items:center;gap:18px;border-radius:3px;font-size:8px;padding:12px 15px;margin:19px 0 30px}.still-life{height:250px;position:relative;background:linear-gradient(135deg,#fff6,#fff0 60%),var(--accent);border-radius:110px 110px 0 0;overflow:hidden;align-self:end}.sun-disc{position:absolute;width:150px;height:150px;border-radius:50%;background:var(--soft);opacity:.35;right:-15px;top:15px}.still-life:after{content:"";position:absolute;bottom:0;width:100%;height:72px;background:var(--ink);opacity:.14}.vase{position:absolute;bottom:39px;z-index:2;box-shadow:inset -20px 0 25px #0002,15px 10px 20px #0002}.vase-one{width:84px;height:135px;background:var(--primary);left:25%;border-radius:35% 35% 42% 42%;transform:rotate(-7deg)}.vase-one:before{content:"";position:absolute;top:-19px;left:23px;width:39px;height:32px;border-radius:3px 3px 20% 20%;background:inherit;box-shadow:inset -12px 0 12px #0002;border-top:5px solid #0003}.vase-two{height:82px;width:93px;right:16%;border-radius:9% 9% 45% 45%;background:var(--soft);transform:rotate(4deg)}.vase-two:before{content:"";position:absolute;inset:0 0 auto;height:12px;border-radius:50%;border:4px solid #ffffff66;background:var(--ink);opacity:.4}.still-life-label{position:absolute;bottom:16px;left:20px;right:20px;display:flex;justify-content:space-between;color:var(--ink);font-size:5px;letter-spacing:1.3px;z-index:3}.poster{max-width:650px;margin:auto;padding:30px;position:relative;overflow:hidden;border-radius:4px}.poster>div:first-child{font-size:8px;display:flex;justify-content:space-between;letter-spacing:1px}.poster h3{font-family:Manrope;line-height:1;font-size:65px;letter-spacing:-4px;margin:35px 0;position:relative;z-index:2;font-weight:600}.poster h3 em{font-family:Georgia;font-weight:400}.poster-circles{position:absolute;right:-45px;top:50px;display:flex;flex-direction:column}.poster-circles i{width:180px;height:100px;border-radius:50%;margin-top:-20px}.poster>p{font-size:10px;position:relative;z-index:2}.ui-preview{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:800px;margin:auto}.ui-preview article{padding:30px;background:var(--soft);border-radius:8px;color:var(--ink)}.ui-preview h3{font:32px Georgia;margin:20px 0}.ui-preview p{font-size:11px}.ui-stat>strong{font-family:Manrope;font-size:40px;display:block;margin-top:28px;font-weight:500}.ui-stat>strong>span{font:9px DM Sans;display:block;margin-top:5px}.bars{display:flex;align-items:end;gap:10px;height:130px;margin-top:15px}.bars i{flex:1;border-radius:6px 6px 0 0}.week-label{display:flex;justify-content:space-between;font-size:7px;margin-top:8px}footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #dedfd2;margin-top:41px;padding:24px 0 28px;color:#a0a58f;font-size:9px;gap:15px}.footer-brand{font-family:Manrope;font-weight:800;font-size:17px;letter-spacing:-.8px;color:#727c60}.footer-star{font-size:19px;margin-left:13px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%);background:#34412e;color:#fff;padding:14px 22px;border-radius:8px;box-shadow:0 8px 25px #0002;display:flex;align-items:center;gap:10px;font-size:12px;z-index:30;max-width:90vw}.modal-backdrop{position:fixed;inset:0;background:#28302066;backdrop-filter:blur(5px);display:grid;place-items:center;z-index:20;padding:20px}.export-modal{width:440px;max-width:100%;padding:25px;background:#faf9f5;border-radius:13px;box-shadow:0 20px 80px #0003}.export-modal .section-title{padding:0}.export-modal h2{font:22px Manrope;letter-spacing:-.6px}.export-modal>p{color:#959b87;font-size:12px}.icon-button{padding:5px;display:grid;place-items:center}.mini-palette{height:150px;display:flex;border-radius:7px;overflow:hidden}.mini-palette span{flex:1}.export-modal .mini-palette{height:75px;margin-top:22px}.export-modal pre{background:#edf0e6;padding:18px;border-radius:6px;font-size:12px;line-height:1.7;color:#566247}.full{width:100%}.export-options{display:flex;gap:8px;margin-top:10px}.export-options>*{flex:1}.collection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;min-height:500px}.collection-card{text-align:left;border:1px solid #dde0d2;border-radius:9px;padding:12px;background:#fbfbf7;align-self:start}.collection-card:hover{border-color:#9aa58a}.collection-card h3{font-size:14px;font-weight:500;margin:17px 4px 8px;display:flex;justify-content:space-between}.collection-card p{font-size:10px;color:#9da58d;margin:0 4px 8px}.saved-load{width:100%;padding:0;text-align:left}.delete-button{font-size:10px;color:#8c776a;padding:8px 4px}.empty{min-height:450px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#879477}.empty h2{font-size:25px;margin:23px 0 0;letter-spacing:-1px;color:#46553b}.empty p{font-size:13px;margin-bottom:25px}@media(min-width:1350px){.wheel-layout{padding-left:50px;padding-right:45px;gap:50px}.studio{grid-template-columns:minmax(0,1fr) 330px}.detail-color{height:120px}.accessibility{padding-top:23px}.detail-values{padding-top:23px;padding-bottom:20px}}@media(max-width:1050px){.studio{grid-template-columns:minmax(0,1fr) 270px;gap:14px}.wheel-layout{padding:14px 20px 30px;gap:20px;grid-template-columns:minmax(180px,1.2fr) minmax(140px,1fr)}.wheel-core strong{font-size:32px}.wheel-core>span{font-size:5px}.wheel-core small{font-size:6px}.wheel-point{width:20px;height:20px}.local-label{display:none}.section-title{padding:20px}.wheel-tip{font-size:8px}.helper{margin-bottom:20px}.swatch-select{padding:16px}.swatch-bottom>strong{font-size:17px}.swatch-number>span{font-size:5px}.mock-body h3{font-size:30px}.page-heading{align-items:end}.heading-actions{flex-direction:column}.button{min-height:36px}}@media(max-width:780px){header{height:70px;padding:0 5%;gap:30px}.brand{font-size:26px}.brandmark{width:24px;height:24px}.brandmark:after{inset:7px}nav{gap:18px}.nav{font-size:11px}.header-right{display:none}main{padding:32px 5% 0}.eyebrow{font-size:8px}.page-heading{display:block;margin-bottom:25px}h1{font-size:30px;letter-spacing:-1.3px}.page-heading p{font-size:12px}.heading-actions{flex-direction:row;margin-top:15px;padding:0}.studio{grid-template-columns:1fr}.wheel-layout{grid-template-columns:1.2fr 1fr;padding:5px 25px 25px;gap:30px}.wheel-core strong{font-size:40px}.wheel-core>span{font-size:6px}.wheel-core small{font-size:8px}.inspector{display:grid;grid-template-columns:1fr 1fr}.inspector .section-title{grid-column:1/-1;padding:17px 20px}.detail-color{height:106px;margin-bottom:20px}.detail-values{padding:0 20px 10px 0}.accessibility{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 20px;padding:14px 20px}.mini-heading{grid-column:1/-1}.contrast-row{margin:10px 0 0}.accessibility>p{align-self:center;margin-top:10px}.palette-strip{height:145px;margin-top:20px}.swatch-select{padding:12px 9px}.swatch-bottom>strong{font-size:13px;letter-spacing:0}.swatch-bottom>small{font-size:6px}.swatch-number>span{display:none}.lock{right:5px;top:5px;font-size:17px}.swatch-copy{display:none}.palette-caption{font-size:9px}.muted{display:none}.preview-section{margin-top:35px}.preview-heading{align-items:start;gap:15px}.preview-heading h2{font-size:19px}.segmented button{padding:7px 8px;font-size:8px}.preview-canvas{padding:18px}.mock-site{padding:15px 18px 0}.mock-body{gap:15px;padding-top:25px}.mock-nav>div{display:none}.mock-body h3{font-size:25px}.mock-body p{font-size:8px}.still-life{height:220px}.vase-one{left:18%;width:65px;height:110px}.vase-one:before{left:17px;width:30px}.vase-two{right:7%;width:70px;height:65px}.mock-kicker{font-size:5px}.collection-grid{grid-template-columns:repeat(2,1fr)}footer>span:last-child{display:none}.ui-preview article{padding:20px}.ui-preview h3{font-size:25px}.ui-preview p{font-size:9px}}@media(max-width:480px){header{gap:22px}.brand{font-size:25px;gap:7px}nav{gap:15px}.nav{font-size:10px}.brand-dot{display:none}.page-heading h1{font-size:27px}.wheel-layout{grid-template-columns:1fr;padding:8px 25px 25px;gap:25px}.wheel{max-width:300px}.wheel-core strong{font-size:43px}.wheel-core>span{font-size:7px}.wheel-core small{font-size:9px}.harmony-settings{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.harmony-settings>.field-label,.harmony-settings>select,.harmony-settings>.helper,.wheel-tip{grid-column:1/-1}.helper{min-height:0;margin-bottom:0}.slider-label[for=sat]{grid-row:4;grid-column:1}.slider-label[for=light]{grid-row:4;grid-column:2}#sat{grid-row:5;grid-column:1}#light{grid-row:5;grid-column:2}.wheel-tip{margin-top:21px;padding-top:14px}.section-title{padding:18px 20px}.wheel-point{width:23px;height:23px}.palette-strip{height:130px}.swatch-bottom>strong{font-size:10px}.swatch-bottom>small{display:none}.swatch-select{padding:12px 7px}.swatch-number{font-size:8px}.palette-caption .text-button{font-size:9px}.preview-heading{flex-direction:column}.preview-canvas{padding:12px}.mock-body{grid-template-columns:1fr}.mock-body h3{font-size:32px}.mock-body p{font-size:10px;max-width:100%}.mock-kicker{font-size:6px}.mock-body button{font-size:9px;margin-bottom:10px}.still-life{height:210px;width:100%;border-radius:100px 100px 0 0}.vase-one{left:25%;height:120px;width:78px}.vase-two{right:19%;width:86px;height:70px}.ui-preview,.collection-grid{grid-template-columns:1fr}.mini-palette{height:180px}.poster{padding:20px}.poster h3{font-size:52px}.poster-circles{right:-80px}.accessibility>p{font-size:8px}.panel-footer{font-size:7px;padding:0 20px}footer{font-size:8px}.empty{text-align:center}.empty h2{font-size:22px}.empty p{font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}@media(max-width:480px){.detail-color{padding:14px}.detail-color>strong{font-size:18px}.detail-color>button{bottom:14px;right:6px}.detail-color>button svg{width:14px;height:14px}.detail-color>span{font-size:6px;letter-spacing:1px}}.wheel{background:conic-gradient(#f36868,#f3f368,#70e170,#6cdada,#7d7de3,#e37de3,#f36868);cursor:grab}.wheel.is-dragging,.wheel.is-dragging .wheel-point{cursor:grabbing}.wheel-point{width:29px;height:29px;font-size:10px;cursor:grab;touch-action:none;transition:box-shadow .15s,outline-color .15s}.wheel-point.master-handle{width:40px;height:40px;border:3px solid #fff;font-size:25px;font-weight:500;box-shadow:0 0 0 2px #364331,0 3px 12px #0003;z-index:5}.wheel-point.linked-highlight{box-shadow:0 0 0 5px #ffffff80,0 0 0 7px #36433180;z-index:6}.wheel-point.handle-locked:after{content:"\2022";position:absolute;bottom:-6px;right:-4px;background:#34412e;color:#fff;width:13px;height:13px;border-radius:50%;font-size:13px;line-height:10px}.wheel-core small{max-width:90%;font-size:8px}.wheel-tip{display:flex;flex-direction:column;align-items:flex-start;gap:7px;line-height:1.5}.wheel-tip strong{color:#57644b;font-size:10px;font-weight:500}.pair-legend{display:flex;gap:13px;color:#7a886a;font-size:10px}.pair-legend span{cursor:default}.preview-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:17px 20px;border:1px solid #dce0d1;border-radius:9px 9px 0 0;background:#fdfcf9}.scheme-navigation{display:flex;align-items:center;gap:18px}.scheme-navigation>div{display:flex;flex-direction:column;gap:5px;min-width:150px}.scheme-navigation strong{font-size:14px;font-weight:500}.scheme-navigation>div>span{font-size:8px;letter-spacing:1px;color:#8c967f}.round-button{width:35px;height:35px;border:1px solid #dce1d1;background:#f4f5ed;border-radius:50%;font-size:18px}.round-button:hover{background:#e5eadc}.preview-tools{display:flex;gap:8px}.harmony-filmstrip{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;padding:17px 20px;background:#fdfcf9;border-left:1px solid #dce0d1;border-right:1px solid #dce0d1}.harmony-thumbnail{min-width:0;border:1px solid #e1e4d8;border-radius:6px;padding:5px;text-align:left;background:#f7f8f2}.harmony-thumbnail.current{border-color:#526747;box-shadow:0 0 0 1px #526747}.thumbnail-colors{display:flex;height:38px;border-radius:3px;overflow:hidden}.thumbnail-colors i{flex:1}.harmony-thumbnail>span:last-child{display:flex;justify-content:space-between;align-items:center;gap:2px;font-size:9px;margin:9px 3px 4px;color:#69785b}.preview-canvas{border-radius:0 0 9px 9px}.preview-bottom{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#8c987d;padding:13px 2px}.preview-expanded{position:fixed;inset:0;z-index:15;margin:0;background:#f6f5f1;overflow:auto;padding:30px max(25px,5vw)}.preview-expanded .preview-canvas{min-height:55vh;display:grid;align-items:center}.preview-expanded .mock-site{width:100%;max-width:1150px;margin:auto}.preview-expanded .mock-body h3{font-size:clamp(32px,4vw,60px)}.preview-expanded .still-life{height:340px}.preview-expanded .mock-body{padding-top:40px}.preview-expanded .ui-preview{width:100%;max-width:1050px}.preview-expanded .poster{width:100%}@media(max-width:1050px){.preview-tools .button{font-size:10px;padding:0 10px}.harmony-filmstrip{gap:8px;padding:15px}.harmony-thumbnail>span:last-child{font-size:8px}}@media(max-width:780px){.preview-toolbar{flex-wrap:wrap;padding:14px}.scheme-navigation{gap:12px}.scheme-navigation>div{min-width:150px}.preview-tools{margin-left:auto;flex-wrap:wrap}.harmony-filmstrip{grid-template-columns:repeat(3,1fr);gap:10px}.harmony-thumbnail>span:last-child{font-size:9px}.preview-expanded{padding:20px}.preview-expanded .still-life{height:230px}.preview-bottom{font-size:8px;gap:10px}.preview-bottom .text-button{font-size:9px}}@media(max-width:480px){.preview-tools{width:100%;margin:0}.preview-tools .button{flex:1;font-size:9px;padding:0 7px;gap:5px}.scheme-navigation{width:100%;justify-content:space-between}.scheme-navigation>div{text-align:center}.thumbnail-colors{height:32px}.harmony-thumbnail>span:last-child{font-size:8px;min-height:20px}.preview-expanded .still-life{height:210px}.preview-bottom>span{max-width:150px}.wheel-core small{font-size:8px}.pair-legend{font-size:10px}}@media(pointer:coarse){.wheel-point{width:34px;height:34px;font-size:10px}.wheel-point.master-handle{width:44px;height:44px}.round-button{width:42px;height:42px}.harmony-thumbnail{min-height:75px}}button:disabled{cursor:default;opacity:.4}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.creative-lab{border:1px solid #dce0d2;border-radius:12px;background:#fcfcf8;display:grid;grid-template-columns:260px 1fr;margin-bottom:30px;overflow:hidden}.lab-intro{padding:28px;background:#eef0e7;border-right:1px solid #dce0d2}.lab-intro h2{font:25px/1.2 Manrope;letter-spacing:-1px;margin:18px 0 12px}.lab-intro p{font-size:11px;line-height:1.8;color:#88927c}.lab-body{padding:0 23px 18px;min-width:0}.lab-tabs{display:flex;gap:25px;border-bottom:1px solid #e5e8dc}.lab-tabs button{padding:16px 0;font-size:11px;position:relative;color:#929c85}.lab-tabs button[aria-selected=true]{color:#384c2f}.lab-tabs button[aria-selected=true]:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#536d44}.lab-tabs button>span{font-size:8px;color:#a3ac99;margin-right:7px}.chat-messages{height:115px;overflow:auto;padding:12px 4px;overscroll-behavior:contain}.chat-message{display:flex;align-items:start;gap:12px;font-size:11px;margin-bottom:10px;flex-wrap:wrap}.chat-message>span{font-size:7px;letter-spacing:1px;color:#849571;padding-top:3px;width:48px;flex-shrink:0}.chat-message p{margin:0;color:#78836b;font-size:11px;line-height:1.65;flex:1}.chat-message.user p{color:#35472b}.chat-message.user>span{color:#b2a487}.chat-palette{margin-left:60px;height:23px;display:flex;width:180px;border-radius:3px;overflow:hidden}.chat-palette i{flex:1}.brief-form,.url-form{display:flex;gap:8px}.brief-form input,.url-form input{min-width:0;width:100%;background:#f5f6ef;border:1px solid #dfe4d5;border-radius:6px;padding:12px;color:#405234;font-size:12px}.brief-form input::placeholder,.url-form input::placeholder{color:#9ca58e}.brief-suggestions{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.brief-suggestions button{font-size:9px;color:#839572;border:1px solid #e2e7d8;border-radius:15px;padding:5px 8px}.lab-disclosure{font-size:8px;color:#9aa38e;line-height:1.6}.url-tool{padding-top:19px}.url-tool h3{font:18px Manrope;letter-spacing:-.5px;margin:0 0 9px}.url-tool>p{font-size:11px;color:#8c987f;line-height:1.7;max-width:640px}.url-tool>p.lab-disclosure{font-size:9px}.upload-option{display:flex;align-items:center;gap:8px;margin:10px 0;color:#98a38b;font-size:9px}.upload-option .text-button{font-size:9px}.lab-error{padding:12px;background:#faf0e9;border:1px solid #e8d0be;border-radius:6px;font-size:11px;line-height:1.7;color:#95735b;margin-top:13px}.import-result{background:#eff4e9;border:1px solid #dce6cf;padding:14px;border-radius:6px;color:#657c51;margin-top:15px}.import-result strong{font-size:12px;font-weight:500}.import-result p{font-size:10px;line-height:1.6}.import-result>span{font-size:9px;color:#9bab8a;overflow-wrap:anywhere}.extracted-colors{display:flex;gap:5px;margin-top:12px}.extracted-colors i{width:23px;height:23px;border-radius:4px;border:1px solid #0001}.import-result .import-warning{font-size:9px;color:#929e85}.workspace-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:25px 0 16px}.workspace-heading>div:first-child{display:flex;flex-direction:column;gap:6px}.workspace-heading strong{font-size:13px;font-weight:500;color:#536448}.workspace-heading span{font-size:10px;color:#9ba68e}.workspace-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:end}.workspace-actions .button{font-size:9px;min-height:33px;padding:0 10px}.creative-workspace.side-by-side{display:grid;grid-template-columns:380px minmax(0,1fr);gap:22px;align-items:start}.side-by-side .wheel-side{position:sticky;top:15px;max-height:calc(100vh - 30px);overflow:auto;scrollbar-width:thin;padding:2px;overscroll-behavior:contain}.side-by-side .studio{display:block}.side-by-side .inspector{display:none}.side-by-side .wheel-layout{display:flex;flex-direction:column;padding:6px 20px 20px;gap:20px}.wheel-controls{display:flex;align-items:center;width:100%;min-width:0;gap:15px}.wheel-controls .wheel{flex:1;min-width:0}.vertical-levers{display:flex;align-items:center;gap:12px;flex-shrink:0;padding:0 3px}.vertical-levers label{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:7px;letter-spacing:.6px;color:#849575}.vertical-levers label>span{font-size:8px;letter-spacing:0;color:#9eaa91}.vertical-levers input.vertical-range{writing-mode:vertical-lr;direction:rtl;width:10px;height:160px;appearance:none;border-radius:10px;touch-action:none;background:linear-gradient(#fff,#aaa,#101a14)}.vertical-levers input.pastel-range{background:linear-gradient(#f4e5de,#e28f79,#cf3b20)}.vertical-levers input.vertical-range::-webkit-slider-thumb{width:22px;height:13px;border-radius:5px;border:2px solid #fcfff8;box-shadow:0 0 0 1px #5c7050;background:#879873}.vertical-levers input.vertical-range::-moz-range-thumb{width:22px;height:13px;border-radius:5px;border:2px solid #fcfff8;background:#879873}.side-by-side .wheel-core{inset:30%}.side-by-side .wheel-core strong{font-size:30px}.side-by-side .wheel-core>span{font-size:4px;letter-spacing:1px}.side-by-side .wheel-core small{font-size:6px;max-width:80%}.side-by-side .harmony-settings{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.side-by-side .harmony-settings>.field-label,.side-by-side .harmony-settings>select,.side-by-side .harmony-settings>.restore-harmony,.side-by-side .adjustment-scope,.side-by-side .mood-presets,.side-by-side .helper,.side-by-side .wheel-tip{grid-column:1/-1}.side-by-side .slider-label[for=sat]{grid-column:1;grid-row:8}.side-by-side .slider-label[for=light]{grid-column:2;grid-row:8}.side-by-side #sat{grid-column:1;grid-row:9}.side-by-side #light{grid-column:2;grid-row:9}.adjustment-scope{display:flex;align-items:center;gap:10px;margin:12px 0}.adjustment-scope>label{font-size:9px;color:#95a187}.adjustment-scope>select{font-size:10px;height:30px}.mood-presets{display:flex;gap:6px}.mood-presets button{flex:1;font-size:9px;border:1px solid #dce3d0;border-radius:5px;padding:7px 10px;color:#6c8059;background:#f3f6ed}.mood-presets button:hover{background:#e5edda}.restore-harmony{font-size:9px;text-align:left;color:#8b8c62;padding:10px 0 0}.side-by-side .helper{font-size:9px;min-height:0;margin-bottom:0}.side-by-side .wheel-tip{margin-top:16px;padding-top:12px;font-size:8px;gap:5px}.side-by-side .wheel-tip strong{font-size:9px}.side-by-side .panel-footer{padding:0 12px;font-size:7px}.side-by-side .panel-footer>span:last-child{font-size:6px}.side-by-side .palette-strip{height:102px;margin-top:14px}.side-by-side .swatch-select{padding:10px 7px}.side-by-side .swatch-bottom strong{font-size:10px;letter-spacing:0}.side-by-side .swatch-bottom small,.side-by-side .swatch-number>span{display:none}.side-by-side .lock{font-size:15px;top:5px;right:3px}.side-by-side .swatch-number{font-size:7px}.side-by-side .palette-caption{font-size:8px;align-items:start;gap:10px}.side-by-side .palette-caption>span{line-height:1.7}.side-by-side .palette-caption .muted{display:block;margin:3px 0 0;font-size:8px}.side-by-side .palette-caption .text-button{font-size:8px;white-space:nowrap}.side-by-side .swatch-copy{display:none}.side-by-side .preview-section:not(.preview-expanded){margin-top:0;min-width:0}.side-by-side .preview-heading{flex-direction:column;align-items:start;gap:12px}.side-by-side .preview-heading h2{font-size:23px}.side-by-side .harmony-filmstrip{grid-template-columns:repeat(3,1fr)}.side-by-side .preview-toolbar{flex-direction:column;align-items:stretch;gap:15px}.side-by-side .preview-tools,.side-by-side .scheme-navigation{justify-content:space-between}.side-by-side .scheme-navigation>div{text-align:center;min-width:0}.side-by-side .scheme-navigation strong{font-size:12px}.side-by-side .preview-canvas{padding:20px}.side-by-side .mock-site{padding:18px 22px 0}.side-by-side .mock-nav>div{display:none}.side-by-side .mock-body{grid-template-columns:1fr;gap:0}.side-by-side .mock-body h3{font-size:40px}.side-by-side .mock-body p{font-size:11px;max-width:360px}.side-by-side .mock-kicker{font-size:7px}.side-by-side .mock-body button{font-size:10px;padding:14px 18px}.side-by-side .still-life{height:260px;border-radius:100px 100px 0 0}.side-by-side .poster h3{font-size:54px}.side-by-side .preview-expanded .preview-toolbar{flex-direction:row}.side-by-side .preview-expanded .harmony-filmstrip{grid-template-columns:repeat(6,1fr)}.side-by-side .preview-expanded .mock-body{grid-template-columns:1.1fr 1fr}.stencil-work{width:100%;min-width:0}.stencil-mapping{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.stencil-mapping>div{min-width:0;display:flex;flex-direction:column;gap:6px}.stencil-mapping strong{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#667958}.stencil-mapping span{font-size:8px;color:#98a78a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stencil-mapping .button{min-height:30px;font-size:9px;padding:0 9px}.role-mapping{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:15px}.role-mapping label{font-size:8px;color:#8b9b7c;display:flex;flex-direction:column;gap:6px;min-width:0}.role-mapping select{min-width:0;height:28px;font-size:8px;padding:0 4px}.stencil-page{border-radius:6px;padding:20px;overflow:hidden;transition:background .05s,color .05s}.stencil-nav{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid currentColor;padding-bottom:15px}.stencil-nav strong{font:600 14px Manrope;max-width:45%}.stencil-nav>div{display:flex;gap:10px;justify-content:end;flex-wrap:wrap;max-width:55%}.stencil-nav span{font-size:7px}.stencil-hero{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;align-items:center;padding:32px 0}.stencil-hero.text-only{grid-template-columns:1fr}.stencil-eyebrow{font-size:6px;letter-spacing:1px;opacity:.65}.stencil-hero h3{font:500 30px/1.15 Manrope;letter-spacing:-1px;margin:16px 0;overflow-wrap:anywhere}.stencil-hero p{font-size:10px;line-height:1.8;opacity:.8}.stencil-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.stencil-actions span{font-size:8px;padding:11px 14px;background:var(--stencil-accent);color:var(--stencil-button-text);border-radius:4px;max-width:100%;overflow-wrap:anywhere}.stencil-actions span.secondary{background:transparent;color:inherit;box-shadow:inset 0 0 0 1px currentColor}.stencil-image{height:180px;background:var(--stencil-surface);position:relative;border-radius:70px 70px 6px 6px;display:grid;place-items:center;overflow:hidden}.stencil-image>div{width:60%;height:65%;border-radius:50%;background:var(--stencil-accent);opacity:.5}.stencil-image>span,.stencil-card-image span{font-size:6px;letter-spacing:1px;position:absolute;bottom:12px;color:var(--stencil-button-text);mix-blend-mode:difference}.stencil-sections{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stencil-sections article{padding:18px;background:var(--stencil-surface);border:1px solid currentColor;border-radius:5px;overflow:hidden}.stencil-section-index{font-size:7px;opacity:.5}.stencil-sections h4{font:500 17px/1.3 Manrope;margin:12px 0;overflow-wrap:anywhere}.stencil-sections p,.stencil-sections li{font-size:9px;line-height:1.7;opacity:.8;overflow-wrap:anywhere}.stencil-sections ul{padding-left:15px}.stencil-card-image{position:relative;height:80px;background:var(--stencil-accent);border-radius:3px;margin-bottom:12px;display:grid;place-items:center}.stencil-footer{border-top:1px solid currentColor;margin-top:30px;padding-top:16px;font-size:8px;display:flex;justify-content:space-between;gap:15px}.stencil-footer>span{font-size:6px;letter-spacing:1px;flex-shrink:0}.stencil-note{font-size:8px;line-height:1.8;color:#9aa68d;margin:12px 0 0}.preview-expanded .stencil-work{max-width:1200px;margin:auto}.preview-expanded .stencil-hero h3{font-size:48px}.preview-expanded .stencil-image{height:280px}.preview-expanded .stencil-sections{grid-template-columns:repeat(3,1fr)}@media(max-width:1150px){.creative-workspace.side-by-side{grid-template-columns:330px minmax(0,1fr);gap:16px}.side-by-side .wheel-layout{padding-left:15px;padding-right:15px}.side-by-side .wheel-controls,.side-by-side .vertical-levers{gap:10px}.side-by-side .vertical-range{height:130px!important}.side-by-side .wheel-core strong{font-size:25px}.side-by-side .wheel-core small{font-size:5px}.side-by-side .wheel-point{width:25px;height:25px;font-size:8px}.side-by-side .wheel-point.master-handle{width:34px;height:34px;font-size:21px}.side-by-side .mock-body h3{font-size:32px}.side-by-side .ui-preview{grid-template-columns:1fr}.side-by-side .preview-tools .button{font-size:9px;padding:0 8px}.side-by-side .stencil-hero{grid-template-columns:1fr}.side-by-side .role-mapping{grid-template-columns:repeat(2,1fr)}.creative-lab{grid-template-columns:210px 1fr}.lab-intro{padding:24px}.lab-intro h2{font-size:22px}.workspace-heading{align-items:start}}@media(max-width:850px){.creative-workspace.side-by-side{grid-template-columns:1fr}.side-by-side .wheel-side{position:static;max-height:none;overflow:visible}.side-by-side .studio{display:grid}.side-by-side .wheel-layout{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:25px;padding:15px 25px 25px}.side-by-side .wheel-core strong{font-size:32px}.side-by-side .wheel-core small{font-size:7px}.side-by-side .wheel-core>span{font-size:5px}.side-by-side .harmony-settings{display:block}.side-by-side .wheel-tip{display:flex}.side-by-side .palette-strip{height:120px}.side-by-side .palette-caption .muted{display:inline;margin-left:6px}.side-by-side .preview-heading{flex-direction:row;align-items:center}.side-by-side .preview-toolbar{flex-direction:row;flex-wrap:wrap}.side-by-side .scheme-navigation>div{text-align:left;min-width:140px}.side-by-side .harmony-filmstrip{grid-template-columns:repeat(6,1fr)}.side-by-side .mock-body{grid-template-columns:1fr 1fr}.side-by-side .mock-body h3{font-size:28px}.side-by-side .mock-body p{font-size:9px}.workspace-heading{flex-direction:column;gap:14px}.workspace-actions{justify-content:start}.creative-lab{grid-template-columns:1fr}.lab-intro{border-right:0;border-bottom:1px solid #dce0d2;padding:20px 24px}.lab-intro h2{font-size:23px;margin:7px 0}.lab-intro p{margin:0;font-size:11px}.lab-intro .eyebrow{font-size:8px;margin-bottom:9px}.stencil-hero{grid-template-columns:1fr 1fr!important}}@media(max-width:600px){.lab-body{padding:0 16px 16px}.lab-tabs{gap:20px}.lab-tabs button{font-size:10px}.lab-tabs button>span{display:none}.brief-form,.url-form{flex-direction:column}.brief-form .button,.url-form .button{min-height:39px}.chat-messages{height:130px}.brief-suggestions button,.lab-disclosure{font-size:8px}.side-by-side .wheel-layout{grid-template-columns:1fr;padding:15px 22px 22px}.side-by-side .wheel-controls{max-width:340px;margin:auto;gap:18px}.side-by-side .wheel-core strong{font-size:34px}.side-by-side .wheel-core small{font-size:7px}.side-by-side .wheel-core>span{font-size:5px}.vertical-levers input.vertical-range{height:150px!important}.side-by-side .wheel-point{width:29px;height:29px;font-size:9px}.side-by-side .wheel-point.master-handle{width:38px;height:38px;font-size:24px}.side-by-side .harmony-settings{display:grid;grid-template-columns:1fr 1fr}.side-by-side .adjustment-scope,.side-by-side .mood-presets{grid-column:1/-1}.side-by-side .palette-caption .muted{display:block;margin:3px 0}.side-by-side .preview-heading{flex-direction:column;align-items:start}.side-by-side .preview-toolbar{flex-direction:column;align-items:stretch}.side-by-side .scheme-navigation>div{text-align:center}.side-by-side .harmony-filmstrip,.side-by-side .preview-expanded .harmony-filmstrip{grid-template-columns:repeat(3,1fr)}.side-by-side .mock-body,.side-by-side .preview-expanded .mock-body{grid-template-columns:1fr}.side-by-side .mock-body h3{font-size:32px}.side-by-side .preview-canvas{padding:12px}.side-by-side .preview-expanded .preview-toolbar{flex-direction:column}.stencil-hero{grid-template-columns:1fr!important}.stencil-page{padding:16px}.stencil-hero h3{font-size:26px}.stencil-sections,.preview-expanded .stencil-sections{grid-template-columns:1fr}.stencil-nav{gap:10px}.stencil-nav strong{font-size:11px}.stencil-nav span{font-size:6px}.stencil-footer{font-size:7px}.side-by-side .role-mapping{grid-template-columns:repeat(2,1fr)}.stencil-mapping{flex-wrap:wrap}.workspace-actions{gap:5px}.workspace-actions .button{font-size:8px;padding:0 8px}.side-by-side .vertical-levers{gap:12px}.creative-lab{margin-bottom:25px}}.compact-inspector{display:none}.side-by-side .compact-inspector{display:flex;gap:8px;align-items:center;border:1px solid #dce2d2;border-radius:6px;padding:11px 10px;margin-top:13px;background:#fdfdf8;font-size:8px;color:#94a286}.compact-inspector>span:first-child{font-size:7px;letter-spacing:1px}.compact-inspector input{min-width:0;width:86px;background:#f5f7ef;border:1px solid #dfe5d5;padding:6px;font-size:10px;color:#596e47;border-radius:3px}.compact-inspector>span:last-child{margin-left:auto;font-size:8px}.per-color-controls{border:1px solid #dce2d2;background:#fcfdf8;border-radius:8px;padding:15px;margin-top:18px}.per-color-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:12px}.per-color-heading strong{font-size:11px;font-weight:500;color:#617551}.per-color-heading span{font-size:8px;color:#a0ab93}.per-color-row{display:grid;grid-template-columns:30px 1fr 1fr 20px;align-items:center;gap:14px;padding:12px 0;border-top:1px solid #e8ecdf}.color-row-chip{width:30px;height:30px;border-radius:6px;font-size:10px;border:1px solid #0001}.color-row-active .color-row-chip{outline:1px solid #748969;outline-offset:3px}.per-color-row label{display:flex;flex-direction:column;gap:10px;min-width:0}.per-color-row label>span{display:flex;align-items:center;justify-content:space-between;font-size:8px;color:#8c9b7e;gap:6px}.per-color-row label b{font-size:7px;color:#9daa8f;font-weight:400}.per-color-row input[type=range]{height:5px}.color-row-lock{font-size:18px;color:#9baa8e;padding:0}.side-by-side .per-color-heading{flex-direction:column;align-items:start;gap:5px}.side-by-side .per-color-row{gap:12px;padding:13px 0;grid-template-columns:25px 1fr 1fr 15px}.side-by-side .color-row-chip{height:25px;width:25px}.side-by-side .per-color-row label>span{font-size:7px}.side-by-side .per-color-row label b{font-size:6px}.side-by-side .per-color-controls{padding:13px}.side-by-side .per-color-row input[type=range]::-webkit-slider-thumb{width:15px;height:15px}.wheel-core.live-wheel-core{inset:26%;gap:3px;pointer-events:none}.live-wheel-core>span{font-size:7px;letter-spacing:1px}.live-wheel-core>strong{font-size:37px;line-height:1.05;margin:2px 0}.live-wheel-core>strong>sup{font-size:20px}.wheel-live-values{display:flex;gap:10px;align-items:center;justify-content:center;font-size:9px;color:#89977b}.wheel-live-values b{font-weight:500;color:#526447;font-variant-numeric:tabular-nums}.live-wheel-core>small{font-size:8px;letter-spacing:.2px;color:#7c8c6d;margin-top:2px}.wheel-value-meters{display:flex;gap:4px;width:58%;margin-top:3px}.wheel-value-meters>i{flex:1;height:3px;background:linear-gradient(90deg,var(--meter-color) var(--meter),#e9eddf var(--meter));border-radius:3px}.vertical-levers output{font-size:9px;font-variant-numeric:tabular-nums;color:#5e7650;letter-spacing:0}.vertical-levers label{gap:7px}.wheel-color-values{display:flex;gap:6px;width:100%;grid-column:1/-1}.wheel-color-values>button{flex:1;min-width:0;border:1px solid #e3e8d9;background:#f7f9f2;border-radius:5px;display:grid;grid-template-columns:10px 1fr;gap:6px 5px;padding:8px;font-size:8px;color:#94a284;text-align:left}.wheel-color-values>button.current{background:#eef3e6;border-color:#8b9e77}.wheel-color-values i{display:block;width:10px;height:10px;border-radius:50%;border:1px solid #0001}.wheel-color-values strong{grid-column:1/-1;font-size:11px;font-weight:500;color:#5f7650;font-variant-numeric:tabular-nums}.wheel-color-values small{font-size:6px;color:#97a58a;font-weight:400;margin-left:2px}.side-by-side .wheel-core.live-wheel-core{inset:25%;gap:3px}.side-by-side .live-wheel-core>span{font-size:6px;letter-spacing:.7px}.side-by-side .live-wheel-core>strong{font-size:28px;margin:1px 0}.side-by-side .live-wheel-core>strong>sup{font-size:16px}.side-by-side .live-wheel-core>small{font-size:7px}.side-by-side .wheel-live-values{font-size:8px;gap:7px}.side-by-side .wheel-color-values{margin-top:-8px}.side-by-side .wheel-color-values>button{padding:7px 5px;gap:5px 3px}.side-by-side .wheel-color-values strong{font-size:10px}.side-by-side .wheel-layout{gap:18px}.wheel-layout>.wheel-color-values{order:2}.wheel-layout>.harmony-settings{order:3}.wheel-layout>.wheel-controls{order:1}@media(min-width:851px){.creative-workspace:not(.side-by-side) .wheel-layout{grid-template-columns:minmax(250px,1.4fr) minmax(170px,1fr)}.creative-workspace:not(.side-by-side) .wheel-controls{grid-column:1;grid-row:1}.creative-workspace:not(.side-by-side) .wheel-color-values{grid-column:1;grid-row:2}.creative-workspace:not(.side-by-side) .harmony-settings{grid-column:2;grid-row:1/3}}@media(max-width:1150px){.side-by-side .live-wheel-core>strong{font-size:24px}.side-by-side .wheel-live-values{font-size:7px;gap:5px}.side-by-side .live-wheel-core>span{font-size:5px}.side-by-side .live-wheel-core>small{font-size:6px}}@media(min-width:601px)and (max-width:850px){.side-by-side .wheel-controls{grid-column:1;grid-row:1}.side-by-side .wheel-color-values{grid-column:1;grid-row:2}.side-by-side .harmony-settings{grid-column:2;grid-row:1/3}}@media(max-width:600px){.side-by-side .live-wheel-core>strong{font-size:29px}.side-by-side .wheel-live-values{font-size:8px;gap:7px}.side-by-side .live-wheel-core>span{font-size:6px}.side-by-side .live-wheel-core>small{font-size:7px}.side-by-side .wheel-color-values{margin-top:0}.wheel-color-values strong{font-size:10px}.vertical-levers output{font-size:8px}}.side-by-side .live-wheel-core>span{font-size:7px}.side-by-side .live-wheel-core>strong{font-size:32px}.side-by-side .wheel-live-values{font-size:10px;gap:8px}.side-by-side .live-wheel-core>small{font-size:8px}.wheel-live-values{font-variant-numeric:tabular-nums}.app .idea-page{max-width:1440px}.app .idea-page .creative-lab{display:block;border:0}.app .idea-hero{position:relative;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:35px;min-height:510px;padding:48px 50px;overflow:hidden;border:1px solid var(--line-strong);border-radius:30px;background:radial-gradient(ellipse at 100% 0%,#a57bec35,transparent 55%),radial-gradient(ellipse at 80% 100%,#79d5bd24,transparent 55%),var(--surface)}.app .idea-hero-copy{position:relative;z-index:2}.idea-hero-badge{display:inline-flex;align-items:center;gap:10px;font-size:10px;font-weight:700;letter-spacing:1.5px;padding:9px 12px;background:#ffffff09;border:1px solid var(--line-strong);border-radius:99px;color:var(--muted)}.idea-hero-badge i{width:6px;height:6px;border-radius:50%;background:#9ddcc8;box-shadow:0 0 12px #9ddcc866}.idea-hero-badge>span{color:#d9bcff;font-size:15px}.app .idea-hero h2{font-size:clamp(42px,4.4vw,68px);line-height:1.02;letter-spacing:-3px;margin:27px 0 23px;font-weight:650;color:var(--ink)}.app .idea-hero h2 em{font-style:normal;background:linear-gradient(95deg,#eab0ff,#f2b3b6 48%,#f6cf91);background-clip:text;-webkit-text-fill-color:transparent}.app .idea-hero-copy>p{font-size:17px;line-height:1.75;color:var(--muted);max-width:490px;margin:0 0 26px}.app .idea-start{display:flex;align-items:center;gap:17px;padding:15px 22px;border:0;border-radius:13px;background:#dfd4f9;color:#29213c;font-size:16px;font-weight:700;box-shadow:0 5px #100b1e4d;cursor:pointer}.idea-start span{font-size:21px}.idea-hero-footnote{display:block;font-size:12px;color:var(--muted);margin-top:18px}.idea-hero-art{position:relative;min-height:420px;padding:35px 20px 25px;perspective:900px}.idea-art-label{position:absolute;top:4px;right:30px;font-size:9px;color:var(--muted);letter-spacing:2px;font-weight:650}.idea-orbit{position:absolute;width:420px;height:420px;border:1px solid #c2a6f926;border-radius:50%;top:5px;left:-5px;transform:rotateX(52deg) rotate(-20deg);pointer-events:none}.idea-orbit.orbit-two{transform:rotateX(52deg) rotate(65deg);width:520px;height:340px;top:55px;left:-50px;border-color:#8be3c92b}.app .idea-study{position:relative;display:block;width:88%;max-width:410px;border-radius:18px;border:1px solid #ffffff4a;background:#f6f1f8;padding:14px;color:#362e48;text-align:left;box-shadow:0 16px 35px #09071744;cursor:pointer;transition:transform .22s,box-shadow .22s;z-index:2}.idea-study-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;font-size:9px;letter-spacing:1.5px;font-weight:700;color:#7b6b84}.idea-study-top b{font-size:18px;line-height:1}.idea-study-colors{display:flex;height:66px;overflow:hidden;border-radius:9px}.idea-study-colors i{flex:1}.idea-study>strong{display:block;font-size:14px;font-weight:650;margin-top:10px}.app .study-0{transform:rotate(-7deg);margin-left:3%;z-index:3}.app .study-1{transform:rotate(5deg);margin:-12px 0 0 13%;z-index:4;background:#efeaf9}.app .study-2{transform:rotate(-4deg);margin:-12px 0 0 4%;z-index:5;background:#eef5ef}.app .idea-study:hover,.app .idea-study:focus-visible{transform:translateY(-9px) rotate(0);z-index:9;box-shadow:0 20px 50px #09071766}.idea-art-spark{position:absolute;color:#f0c3a5;z-index:8;pointer-events:none}.spark-one{right:-5px;top:90px;font-size:46px;transform:rotate(15deg)}.spark-two{left:-18px;bottom:48px;font-size:36px;color:#b6e8d3}.idea-art-note{position:absolute;right:0;bottom:-20px;font-size:11px;letter-spacing:1px;color:var(--muted);transform:rotate(-4deg)}.idea-launchers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:23px 0}.app .idea-launchers>button{display:flex;align-items:center;gap:14px;padding:22px 19px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:18px;text-align:left;cursor:pointer}.idea-launcher-icon{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:12px;font-size:25px;color:#3a3049}.lavender{background:#d8c9f6}.peach{background:#f7cbab}.mint{background:#c3e7d5}.idea-launchers strong{display:block;font-size:14px;line-height:1.4;margin-bottom:6px}.idea-launchers small{display:block;font-size:12px;line-height:1.6;color:var(--muted)}.idea-launchers b{margin-left:auto;color:var(--muted);font-size:18px}.idea-workflow-line{display:flex;justify-content:center;align-items:center;gap:27px;padding:14px 0 32px;font-size:12px;color:var(--muted)}.idea-workflow-line b{font-size:10px;letter-spacing:1px;color:var(--accent);margin-right:8px}.idea-workflow-line i{font-style:normal;opacity:.5}.app .idea-page .lab-body{border:1px solid var(--line-strong);border-radius:25px;padding:25px;background:var(--surface)}.app .idea-page .brief-form{border:1px solid #AB9BD760;border-radius:15px;box-shadow:0 0 0 4px #9c8de609;padding:9px;background:var(--bg)}.app[data-theme=light] .idea-hero{background:radial-gradient(ellipse at 100% 0%,#D9C7FB,transparent 62%),radial-gradient(ellipse at 60% 100%,#D1EEE4,transparent 60%),#fff5ec}.app[data-theme=light] .idea-hero h2 em{background-image:linear-gradient(95deg,#8351b7,#ad4a7c 50%,#a35a2c)}.app[data-theme=light] .idea-hero-badge{background:#fff8}.app[data-theme=light] .idea-orbit{border-color:#8771ad33}.app[data-theme=light] .idea-study{box-shadow:0 16px 30px #805e8a26}.app[data-theme=light] .idea-start{background:#6f58b5;color:#fff;box-shadow:0 4px #3b287e22}@media(max-width:1150px){.app .idea-hero{padding:35px 30px;gap:20px}.app .idea-hero h2{font-size:52px}.idea-launchers{gap:10px}.app .idea-launchers>button{padding:18px 13px;gap:10px}.idea-launcher-icon{width:35px;height:35px;font-size:21px}.idea-launchers b{display:none}.idea-hero-art{padding-left:0;padding-right:0}.idea-study-colors{height:55px}}@media(max-width:850px){.app .idea-hero{grid-template-columns:1fr;padding:32px 27px;gap:10px}.app .idea-hero h2{font-size:54px}.idea-hero-art{min-height:350px;width:min(100%,460px);margin:10px auto 20px}.idea-study-colors{height:53px}.idea-art-label{top:1px}.app .idea-study{max-width:350px;padding:11px}.idea-study>strong{font-size:12px}.idea-study-top{font-size:8px}.idea-launchers{grid-template-columns:1fr}.app .idea-launchers>button{padding:17px 20px}.idea-launchers strong{font-size:15px}.idea-launchers small{font-size:13px}.idea-launchers b{display:block}.idea-workflow-line{gap:13px;font-size:10px}.idea-workflow-line b{margin-right:4px;font-size:9px}}@media(max-width:450px){.app .idea-hero{border-radius:23px;padding:27px 21px}.app .idea-hero h2{font-size:44px;letter-spacing:-2px}.app .idea-hero-copy>p{font-size:15px}.idea-hero-badge{font-size:8px;letter-spacing:1px}.idea-hero-art{min-height:330px}.idea-art-note{font-size:9px;right:-3px}.idea-study-top{font-size:7px;letter-spacing:1px}.spark-one{font-size:32px;right:-10px}.spark-two{left:-12px}.idea-workflow-line{gap:8px;flex-wrap:wrap}.app .idea-page .lab-body{padding:18px}.app .idea-start{font-size:14px;padding:14px 18px}}@media(prefers-reduced-motion:reduce){.app .idea-study{transition:none}}.app .image-studio{min-width:0}.app .image-studio-intro h2{font-size:34px;line-height:1.15;letter-spacing:-.7px;margin:13px 0}.app .image-studio-intro p{font-size:16px;line-height:1.7;color:var(--muted)}.app .image-mode-tabs{display:flex;gap:9px;margin:23px 0}.app .image-mode-tabs button{border:1px solid var(--line);border-radius:99px;background:var(--key);color:var(--ink);padding:12px 17px;font-size:14px;cursor:pointer}.app .image-mode-tabs button[aria-pressed=true]{background:var(--accent);color:#1b1931}.app .image-studio-upload{padding:55px 25px;text-align:center;border:1px dashed var(--line-strong);border-radius:25px;background:var(--surface)}.app .image-studio-upload>span{font-size:50px;color:var(--accent)}.app .image-studio-upload h3{font-size:29px;margin:17px 0}.app .image-studio-upload p{font-size:15px;color:var(--muted)}.app .image-studio-upload>div{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px}.app .image-studio-toolbar{display:grid;grid-template-columns:1.5fr 1fr 1fr auto;gap:15px;align-items:end;margin:25px 0}.app .image-sampling-stage{position:relative;line-height:0;border-radius:20px;border:1px solid var(--line);background:var(--key)}.app .image-sampling-stage>canvas{display:block;width:100%;height:auto;border-radius:20px;cursor:crosshair}.app .image-sample-handle{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;display:grid;place-items:center;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #17132277,0 3px 10px #0006;font-size:13px;font-weight:700;cursor:grab;touch-action:none}.app .image-sample-handle.active{outline:3px solid var(--accent);outline-offset:3px}.app .image-sample-hint{font-size:14px;line-height:1.7;color:var(--muted);margin:17px 0 25px}.app .image-gradient-work{padding:22px;border:1px solid var(--line);border-radius:23px;background:var(--surface);margin:25px 0}.app .image-gradient-preview{min-height:260px;padding:35px;border-radius:16px;display:flex;align-items:center}.app .image-gradient-preview>span{font-size:53px;line-height:1.03;font-weight:600;letter-spacing:-2px}.app .image-gradient-track{position:relative;height:35px;border-radius:8px;margin:30px 12px 35px}.app .image-gradient-track button{position:absolute;top:50%;transform:translate(-50%,-50%);width:22px;height:48px;border:2px solid white;border-radius:7px;box-shadow:0 1px 8px #0006;cursor:ew-resize;touch-action:none}.app .image-gradient-track button.active{outline:3px solid var(--accent);outline-offset:3px;z-index:3}.app .image-gradient-controls{display:grid;grid-template-columns:1fr 1fr auto auto;gap:15px;align-items:center}.app .image-gradient-css{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.7;border:1px solid var(--line);border-radius:12px;padding:15px;background:var(--key);color:var(--muted);margin:23px 0 0}.app .image-swatch-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:25px 0}.app .image-swatch-list article{min-width:0;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:var(--surface)}.app .image-swatch-list article.active{border-color:var(--accent)}.app .image-swatch-preview{display:flex;flex-direction:column;justify-content:space-between;align-items:start;gap:22px;width:100%;min-height:110px;padding:15px;border:0;cursor:pointer}.app .image-swatch-preview span{font-size:13px}.app .image-swatch-preview strong{font-size:17px}.app .image-swatch-list article>div{display:flex;justify-content:space-between;padding:9px 12px}.app .image-swatch-list article .text-button{font-size:13px}.app .image-swatch-list article>label{display:grid;grid-template-columns:1fr auto;gap:9px;padding:8px 13px;font-size:13px;color:var(--muted)}.app .image-swatch-list input{grid-column:1/-1;width:100%;accent-color:var(--accent)}.app .image-swatch-list article>.text-button{padding:10px 13px 15px}.app .image-studio-actions{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.app .image-studio-error{color:#f0b9b9;line-height:1.7;font-size:15px}@media(max-width:1000px){.app .image-studio-toolbar,.app .image-gradient-controls{grid-template-columns:1fr 1fr}.app .image-swatch-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.app .image-studio-intro h2{font-size:29px}.app .image-studio-upload{padding:35px 18px}.app .image-studio-upload h3{font-size:25px}.app .image-studio-toolbar{grid-template-columns:1fr 1fr}.app .image-studio-toolbar>.tool-field:first-child{grid-column:1/-1}.app .image-studio-toolbar>.button{min-height:44px}.app .image-gradient-work{padding:17px 12px}.app .image-gradient-preview{min-height:215px;padding:23px}.app .image-gradient-preview>span{font-size:43px}.app .image-gradient-controls{gap:13px 9px}.app .image-studio-actions>.button{flex:1 1 135px;font-size:13px}.app .image-mode-tabs button{font-size:13px;padding:11px 13px}.app .image-sample-handle{width:27px;height:27px;font-size:12px}}.color-toolkit{display:grid;grid-template-columns:205px minmax(0,1fr);gap:32px;align-items:start}.tool-sidebar{border:1px solid #dde3d2;border-radius:10px;padding:22px 14px;background:#fafcf5;position:sticky;top:20px}.tool-sidebar-title{font-size:9px;letter-spacing:1.4px;color:#6d805a;line-height:1.7;padding:0 9px}.tool-sidebar-title>span{display:block;letter-spacing:0;font-size:9px;color:#a0ad90;font-weight:400;margin-top:4px}.tool-sidebar h3{font-size:7px;letter-spacing:1.5px;font-weight:500;color:#a0ad8f;margin:27px 9px 10px}.tool-sidebar>div>button{display:flex;gap:10px;align-items:center;width:100%;font-size:11px;text-align:left;color:#8a9b75;padding:11px 10px;border-radius:5px;margin:2px 0}.tool-sidebar>div>button>span{font-size:16px;width:20px;color:#839c6c}.tool-sidebar>div>button.current{background:#e9f0df;color:#3c562b}.tool-sidebar>div>button>small{margin-left:auto;color:#a0b08a;font-size:10px}.tool-sidebar>div>button:hover{background:#f0f4e8}.tool-sidebar .back-studio{display:block;font-size:10px;text-align:left;border-top:1px solid #e3e9d7;padding:20px 10px 0;margin-top:25px;color:#799362;width:100%}.tool-content{min-width:0}.tool-heading{margin-bottom:28px;display:flex;justify-content:space-between}.tool-heading h2{font:500 28px/1.3 Manrope;letter-spacing:-1px;margin:0 0 12px}.tool-heading p{font-size:12px;color:#92a17f;line-height:1.8;margin:0;max-width:800px}.tool-heading .eyebrow{font-size:8px}.tool-card{background:#fcfdf8;border:1px solid #dfe5d3;border-radius:9px;padding:22px;min-width:0}.tool-two-column{display:grid;grid-template-columns:minmax(200px,.9fr) minmax(250px,1.1fr);gap:20px}.sv-square{height:250px;position:relative;border-radius:6px;touch-action:none;cursor:crosshair;border:1px solid #0001;overflow:hidden}.sv-square>i{position:absolute;width:15px;height:15px;border-radius:50%;border:2px solid white;box-shadow:0 0 0 1px #3338;transform:translate(-50%,-50%);pointer-events:none}.tool-slider-label{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:10px;color:#80946c;margin:22px 0}.tool-slider-label>span{margin-left:auto;font-size:9px;color:#9eac8e}.tool-slider-label input{flex-basis:100%;width:100%;--track:linear-gradient(90deg,#dce5d1,#5e8142)}input.rainbow-slider{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.tool-field{display:flex;flex-direction:column;gap:8px;font-size:10px;color:#82976d;min-width:0}.tool-field>span{font-size:9px}.tool-field>div{display:flex;border:1px solid #dfe6d1;border-radius:5px;background:#f5f8ee;padding:4px;gap:5px}.tool-field input[type=color]{width:37px;min-width:37px;border:0;background:none;padding:0;height:30px;cursor:pointer}.tool-field input:not([type=color]),.tool-field select{min-width:0;width:100%;border:1px solid #dfe6d1;background:#f6f8ef;border-radius:5px;color:#607a4d;padding:10px;font-size:12px}.tool-field>div>input:not([type=color]){border:0;background:transparent;padding:5px 8px;font-size:12px;font-family:monospace}.nearest-name{display:flex;justify-content:space-between;font-size:9px;color:#9daa90;margin-top:17px;gap:10px}.nearest-name strong{font-weight:500;color:#758d60}.format-list{display:flex;flex-direction:column;margin:20px 0;gap:0;border-top:1px solid #e6ebdc}.format-list>button{display:flex;gap:10px;align-items:center;text-align:left;border-bottom:1px solid #e6ebdc;padding:12px 0;min-width:0}.format-list>button>span:first-child{width:44px;flex-shrink:0;font-size:8px;color:#a1ae92}.format-list>button>span:last-child{margin-left:auto;color:#a1b38c;font-size:13px}.format-list code{font-size:10px;color:#708758;overflow-wrap:anywhere;min-width:0}.format-list>button:hover code{color:#3a6026}.parse-color-form>label{font-size:10px;color:#869a70;display:block;margin-bottom:10px}.parse-color-form>div{display:flex;gap:8px}.parse-color-form input{font:11px DM Sans,sans-serif;min-width:0;width:100%;padding:10px;background:#f4f7ed;border:1px solid #dfe6d2;border-radius:5px;color:#6f8a58}.parse-color-form input::placeholder{color:#acb69f;font-size:9px}.parse-color-form .button{font-size:10px;padding:0 12px;min-height:35px}.numeric-editor{margin-top:20px;display:flex;gap:14px;align-items:center}.numeric-editor>select{width:80px;height:34px;font-size:10px;background:#f5f7ee}.numeric-editor>div{flex:1;display:flex;gap:8px}.numeric-editor label{font-size:8px;color:#99aa86;display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}.numeric-editor input{width:100%;min-width:0;border:1px solid #dfe6d2;border-radius:4px;padding:8px 5px;background:#f7f9f0;color:#657f50;font-size:11px}.tool-note{color:#a0ad90;font-size:9px;line-height:1.8;margin:17px 0}.tool-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.tool-actions .button{font-size:9px;padding:0 11px}.tool-error{padding:12px;border:1px solid #e5d3be;background:#fbf0e5;border-radius:5px;color:#a08059;font-size:11px;line-height:1.7}.tool-section-title{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:30px 0 18px}.tool-section-title h3,.palette-contrast-matrix h3{font-size:13px;font-weight:500;color:#6b8456}.tool-section-title>div{display:flex;gap:8px}.tool-section-title .button{font-size:9px;padding:0 11px}.tool-swatches{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.tool-swatches article{min-width:0;border:1px solid #dfe5d3;border-radius:7px;overflow:hidden;background:#fcfdf8;padding-bottom:11px}.tool-swatch-color{display:flex;width:100%;height:100px;align-items:center;justify-content:center}.tool-swatch-color>span{font-size:9px;opacity:0;padding:7px 12px;border-radius:20px;background:#ffffff60;transition:opacity .12s}.tool-swatch-color:hover>span,.tool-swatch-color:focus-visible>span{opacity:1}.tool-swatches article>strong{display:block;font-size:10px;font-weight:500;color:#71865e;padding:12px 10px 6px;overflow-wrap:anywhere}.swatch-code{font:9px/1.5 monospace;color:#9eae8d;padding:0 10px;display:flex;align-items:center;gap:5px;justify-content:space-between;width:100%;text-align:left;overflow-wrap:anywhere}.swatch-code>span{margin-left:auto;font-size:11px;flex-shrink:0}.tool-swatches.compact{grid-template-columns:repeat(11,minmax(0,1fr));gap:5px}.compact .tool-swatch-color{height:65px}.compact article>strong{font-size:8px;padding:8px 5px 5px}.compact .swatch-code{font-size:6px;padding:0 5px;display:block}.compact .swatch-code>span{display:none}.compact .tool-swatch-color>span{font-size:7px;padding:4px}.catalog-toolbar{display:flex;gap:8px;flex-wrap:wrap}.catalog-toolbar>input{width:250px;flex:1;min-width:180px;border:1px solid #dfe6d2;background:#fbfdf6;padding:11px 12px;border-radius:5px;font-size:11px;color:#7b9366}.catalog-toolbar>input::placeholder{color:#aab69a}.catalog-toolbar>select{width:auto;min-width:95px;font-size:10px;height:38px;background:#fcfdf8;color:#81966d}.catalog-toolbar>.button{min-height:38px;font-size:9px;padding:0 12px}.family-filter{display:flex;gap:7px;flex-wrap:wrap;margin:23px 0}.family-filter button{font-size:9px;padding:6px 11px;border:1px solid #e0e6d5;border-radius:20px;color:#8b9f76;background:#fbfcf7}.family-filter button.current{background:#e7efdd;border-color:#97ad80;color:#4d7136}.catalog-count{display:flex;justify-content:space-between;gap:15px;align-items:center;font-size:9px;color:#9cac8c;margin:22px 0 15px}.catalog-count>span:last-child{font-size:8px;color:#b0bba2}.tool-empty{padding:80px 20px;border:1px dashed #d8e2cc;border-radius:8px;text-align:center;font-size:12px;color:#9aae85}.tool-table-scroll{overflow:auto;max-width:100%;border:1px solid #e0e6d4;border-radius:6px}.color-table{width:100%;border-collapse:collapse;font-size:10px;background:#fcfdf8;white-space:nowrap}.color-table th{font-size:8px;letter-spacing:.5px;font-weight:500;text-align:left;background:#f0f5e7;color:#91a67b;padding:12px}.color-table td{padding:11px 12px;border-top:1px solid #e8eddf;color:#879d71;font-size:10px}.color-table td>button{font-size:9px;padding:0;color:#8ca279}.color-table td>i{display:block;width:25px;height:25px;border-radius:4px;border:1px solid #0001}.catalog-source{display:flex;gap:20px;margin-top:25px;font-size:9px;color:#9aaf83;flex-wrap:wrap}.catalog-source a:hover{text-decoration:underline}.image-upload{border:1px dashed #c4d4b2;border-radius:9px;background:#f5f9ee;padding:38px 20px;text-align:center}.image-upload>span{font-size:37px;color:#a5ba8d}.image-upload h3{font:500 21px Manrope;letter-spacing:-.6px;color:#6a8753;margin:15px 0 10px}.image-upload p{font-size:10px;color:#9fb38a;margin:0 0 22px}.image-info{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#95a980;margin:22px 0 18px;gap:20px}.image-info>label{display:flex;align-items:center;gap:10px;white-space:nowrap}.image-info select{width:65px;height:30px;font-size:10px;background:#fbfdf6}.image-tool-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;align-items:start}.sample-canvas-wrap{border:1px solid #dee7d1;border-radius:8px;padding:15px;min-width:0;background:repeating-conic-gradient(#f1f5e9 0% 25%,#fff 0% 50%) 0/20px 20px}.sample-canvas-wrap canvas{display:block;width:100%;height:auto;border-radius:4px;cursor:crosshair}.sample-canvas-wrap p{font-size:9px;color:#9cae88;margin:15px 0 0}.sample-preview{height:85px;border-radius:5px;border:1px solid #0001}.mixer-controls{display:grid;grid-template-columns:1fr 35px 1fr;gap:20px;align-items:center}.mixer-controls>.tool-slider-label{grid-column:1/-1;margin:0}.mixer-controls>.tool-field:nth-last-child(2){grid-column:1/2}.mixer-controls>.tool-field:last-child{grid-column:3/4}.mix-preview{display:flex;flex-direction:column;align-items:center;justify-content:center;height:220px;border-radius:9px;margin-top:22px;gap:20px}.mix-preview>span{font-size:9px;letter-spacing:2px;opacity:.7}.mix-preview>strong{font:500 42px Manrope;letter-spacing:-1.5px}.mix-preview>.button{background:#ffffff60;border-color:#ffffff40;font-size:10px}.contrast-controls{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.contrast-controls>.tool-field{flex:1;min-width:150px}.contrast-controls>.button{font-size:9px}.contrast-preview{border-radius:9px;padding:44px;margin-top:22px;border:1px solid #0001}.contrast-preview>span{font-size:8px;letter-spacing:1.5px;opacity:.7}.contrast-preview h3{font:500 40px Manrope;letter-spacing:-1.5px;margin:22px 0}.contrast-preview p{font-size:13px;line-height:1.8;max-width:550px}.contrast-preview>button{font-size:11px;border-radius:4px;padding:13px 20px;margin-top:13px}.contrast-report{display:grid;grid-template-columns:1.3fr repeat(5,1fr);border:1px solid #dce5cf;border-radius:8px;overflow:hidden;margin-top:20px}.contrast-report>div{padding:20px 12px;display:flex;flex-direction:column;gap:12px;background:#fbfdf6;border-right:1px solid #e5ecdc;align-items:center;justify-content:center;text-align:center}.contrast-report>div>span{font-size:8px;color:#97ab81}.contrast-report strong{font:500 32px Manrope;color:#6d8b56;letter-spacing:-1px}.contrast-report strong>small{font-size:16px}.contrast-report b{font-size:11px;font-weight:500}.passes{color:#71974f}.fails{color:#b38a68}.contrast-report>div>small{font-size:7px;color:#afbea0}.palette-contrast-matrix{margin-top:35px}.game-composer{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px;margin:20px 0}.game-preview{background:#242b23;border:5px solid #4e5e45;border-radius:7px;padding:35px;font:24px/1.5 monospace;text-shadow:2px 2px #0008;overflow-wrap:anywhere;min-height:100px}.game-output{display:flex;align-items:center;gap:20px;padding:17px 0 24px}.game-output>code{flex:1;min-width:0;font-size:12px;color:#8ca774;overflow-wrap:anywhere}.game-output .button{font-size:9px}.roblox-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.roblox-grid>article{border:1px solid #dee7d1;background:#fcfef7;border-radius:7px;overflow:hidden;padding-bottom:13px}.roblox-grid>article>button:first-child{display:block;width:100%;height:85px}.roblox-grid strong{display:block;font-size:10px;font-weight:500;color:#839d6c;padding:12px 11px 7px;overflow-wrap:anywhere}.roblox-grid>article>span{display:block;font-size:7px;line-height:1.6;color:#9db488;padding:0 11px;margin-bottom:10px}.roblox-grid .text-button{padding:3px 11px;font-size:9px;color:#a2b88c}.learn-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.learn-grid details{align-self:start}.learn-grid summary{list-style:none;cursor:pointer;position:relative;padding-right:25px}.learn-grid summary::-webkit-details-marker{display:none}.learn-grid summary>span{font-size:7px;color:#9cb488;letter-spacing:1.5px}.learn-grid summary h3{font:500 19px/1.4 Manrope;letter-spacing:-.5px;color:#72955a;margin:12px 0 0}.learn-grid summary>b{position:absolute;right:0;top:0;font-size:17px;font-weight:400;color:#9dbb87}.learn-grid details>p{font-size:11px;line-height:1.9;color:#91a77f;margin-top:20px}.learn-grid pre{font-size:10px;line-height:1.8;background:#eff5e7;padding:16px;border-radius:5px;color:#87a66f;overflow:auto;max-width:100%}.learn-grid details>.text-button{font-size:9px;color:#99b581}.learn-sources{grid-column:1/-1;display:flex;gap:25px;font-size:9px;color:#9bb687;margin-top:15px}@media(max-width:1150px){.color-toolkit{grid-template-columns:175px minmax(0,1fr);gap:22px}.tool-swatches,.roblox-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tool-swatches.compact{grid-template-columns:repeat(6,minmax(0,1fr))}.tool-two-column{gap:15px}.tool-card{padding:17px}.sv-square{height:210px}.tool-actions{flex-direction:column}.contrast-report{grid-template-columns:repeat(3,1fr)}.contrast-report>div{border-bottom:1px solid #e5ecdc}.catalog-toolbar>input{flex-basis:100%}.image-tool-grid{grid-template-columns:1fr}.tool-heading h2{font-size:25px}}@media(max-width:780px){.color-toolkit{display:block}.tool-sidebar{position:static;padding:15px;margin-bottom:25px;display:flex;flex-wrap:wrap;gap:10px}.tool-sidebar-title{width:100%;padding:0 0 10px;display:flex;justify-content:space-between;gap:10px}.tool-sidebar-title>span{margin:0;font-size:8px}.tool-sidebar>div:not(.tool-sidebar-title){display:contents}.tool-sidebar h3{display:none}.tool-sidebar>div>button{width:auto;padding:7px 9px;gap:5px;font-size:10px;margin:0;background:#f1f6e8;border:1px solid #e0e9d3}.tool-sidebar>div>button>small{display:none}.tool-sidebar>div>button>span{font-size:12px;width:auto}.tool-sidebar .back-studio{padding:10px 0 0;margin:5px 0 0;font-size:9px}.tool-two-column{grid-template-columns:1fr 1fr}.tool-heading h2{font-size:25px}.tool-swatches,.roblox-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tool-swatch-color{height:80px}.sv-square{height:200px}.tool-heading p{font-size:11px}.game-composer{grid-template-columns:1fr 1fr}.game-composer>.tool-field:first-child{grid-column:1/-1}.image-info{font-size:9px}.catalog-count{font-size:8px}.catalog-count>span:last-child{display:none}.learn-grid{gap:14px}.contrast-preview{padding:30px}.contrast-preview h3{font-size:32px}}@media(max-width:520px){header{gap:16px}nav{gap:12px}.nav{font-size:9px}.brand{font-size:23px}.brandmark{width:22px;height:22px}.color-toolkit .tool-sidebar{gap:7px}.tool-sidebar>div>button{font-size:9px;padding:7px 8px}.tool-sidebar-title{font-size:8px;letter-spacing:1px}.tool-sidebar-title>span{font-size:7px;letter-spacing:0}.tool-two-column{grid-template-columns:1fr}.tool-heading h2{font-size:24px}.sv-square{height:230px}.tool-swatches,.roblox-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.tool-swatch-color{height:75px}.tool-swatches article>strong{font-size:9px;padding:10px 7px 5px}.swatch-code{font-size:8px;padding:0 7px}.tool-swatches.compact{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.tool-card{padding:17px}.tool-actions{flex-direction:row}.tool-section-title{align-items:start;gap:10px}.tool-section-title>div{flex-direction:column;gap:6px}.tool-section-title .button{font-size:8px;min-height:32px;padding:0 9px}.tool-section-title>.text-button{font-size:8px}.tool-section-title h3{font-size:12px}.catalog-toolbar{gap:7px}.catalog-toolbar>.button{font-size:8px;padding:0 9px;min-height:32px}.catalog-toolbar>select{font-size:9px;min-width:82px;height:32px}.family-filter{gap:5px;margin:17px 0}.family-filter button{font-size:8px;padding:5px 8px}.mixer-controls{grid-template-columns:1fr 28px 1fr;gap:12px}.mixer-controls .round-button{width:28px;height:28px}.tool-field>div{flex-wrap:wrap;gap:0}.tool-field input[type=color]{width:100%;min-width:0;height:25px}.tool-field>div>input:not([type=color]){font-size:10px;text-align:center;width:100%}.contrast-controls{gap:12px}.contrast-controls>.tool-field{min-width:100px}.contrast-controls .round-button{width:30px;height:30px}.contrast-preview{padding:24px}.contrast-preview h3{font-size:28px}.contrast-preview p{font-size:11px}.contrast-report{grid-template-columns:repeat(2,1fr)}.contrast-report>div{padding:17px 10px}.tool-table-scroll .color-table td{font-size:9px}.game-output{align-items:start;flex-direction:column;gap:14px}.game-preview{font-size:18px;padding:23px}.roblox-grid strong{font-size:9px;padding:10px 8px 5px}.roblox-grid>article>span{padding:0 8px;font-size:6px}.roblox-grid .text-button{font-size:8px;padding:3px 8px}.learn-grid{grid-template-columns:1fr}.learn-grid summary h3{font-size:18px}.learn-sources{flex-direction:column;gap:12px}.image-upload{padding:28px 16px}.image-upload h3{font-size:19px}.image-info{align-items:start;font-size:8px}.image-info>span{overflow-wrap:anywhere}.parse-color-form>div{flex-wrap:wrap}.parse-color-form .button{width:100%}.numeric-editor{gap:9px}.format-list code{font-size:10px}.compact .swatch-code{font-size:8px}.tool-swatch-color>span{opacity:.6;font-size:8px}}.catalog-pagination{display:flex;justify-content:center;align-items:center;gap:20px;padding:25px 0;font-size:10px;color:#637455}.catalog-pagination>.button{font-size:10px}.catalog-pagination>.text-button{font-size:9px}.color-toolkit .passes{color:#456c2e}.color-toolkit .fails{color:#945b32}.color-toolkit input::placeholder{color:#748469}.color-toolkit .catalog-toolbar input{color:#566447}.color-toolkit .tool-slider-label>span{color:#637455}@media(max-width:520px){.catalog-pagination{gap:12px;flex-wrap:wrap}.catalog-pagination>span{width:100%;text-align:center}}.color-toolkit:has(.image-studio) .tool-heading{display:none}.app .readable-studio{margin:24px 0 30px;padding:26px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}.app .readable-heading{display:flex;align-items:start;justify-content:space-between;gap:20px}.app .readable-heading h3{font-size:27px;line-height:1.25;margin:10px 0}.app .readable-heading p,.app .suggestion-intro p{font-size:15px;line-height:1.6;color:var(--muted);margin:0}.app .readable-controls{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:20px;margin:23px 0}.app .readable-side{display:grid;grid-template-columns:1fr 1fr;gap:10px}.app .readable-side button{border:1px solid var(--line);border-radius:16px;background:var(--key);color:var(--ink);padding:16px 14px;display:flex;align-items:center;text-align:left;gap:12px;cursor:pointer}.app .readable-side button[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent)}.app .readable-side b{font-size:25px;color:var(--accent)}.app .readable-side span{display:grid;gap:7px;font-size:15px;font-weight:600}.app .readable-side small{font-size:12px;color:var(--muted);font-weight:400;overflow-wrap:anywhere}.app .bias-choices{display:flex;gap:7px;flex-wrap:wrap}.app .bias-choices button{font-size:14px;padding:9px 14px;min-height:40px;border:1px solid var(--line);border-radius:99px;color:var(--muted);background:var(--key);cursor:pointer}.app .bias-choices button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#222039}.app .suggestion-intro{display:flex;align-items:start;justify-content:space-between;gap:18px;margin:17px 0}.app .suggestion-intro .text-button{white-space:nowrap;flex-shrink:0}.app .readable-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.app .readable-option{padding:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--key);color:var(--ink);text-align:left;cursor:pointer;transition:transform .16s,border-color .16s}.app .readable-option:hover{transform:translateY(-3px);border-color:var(--accent)}.app .readable-option:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.app .readable-option-sample{padding:24px 20px;min-height:205px;display:flex;flex-direction:column;gap:15px}.app .readable-option-sample>strong{font-size:23px;line-height:1.15;font-weight:600}.app .readable-option-sample>span{font-size:14px;line-height:1.45}.app .readable-option-sample>i{font-size:13px;font-style:normal;margin-top:auto}.app .readable-option-info{display:flex;justify-content:space-between;gap:8px;padding:14px 12px}.app .readable-option-info>span{display:grid;gap:7px;min-width:0}.app .readable-option-info>span:last-child{text-align:right}.app .readable-option-info b{font-size:14px}.app .readable-option-info small{font-size:11px;color:var(--muted)}.app .suggestion-empty{padding:24px;border:1px dashed var(--line-strong);border-radius:17px}.app .suggestion-empty p{font-size:15px;line-height:1.6;color:var(--muted)}.app .color-theory-course{max-width:1200px;margin:auto;min-width:0}.app .theory-hero{padding:35px;display:grid;grid-template-columns:minmax(0,1fr) 280px;align-items:center;gap:25px;border:1px solid var(--line);background:linear-gradient(130deg,var(--surface),var(--accent-soft));border-radius:28px}.app .theory-hero h2{font-size:44px;letter-spacing:-1.5px;line-height:1.1;margin:15px 0}.app .theory-hero p{font-size:17px;line-height:1.7;color:var(--muted)}.app .theory-hero .button{display:inline-flex;margin-top:8px;text-decoration:none}.app .theory-wheel-svg{display:block;width:100%;max-width:340px;margin:auto;overflow:visible}.app .theory-contents{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:26px 0 40px}.app .theory-contents a{display:flex;align-items:center;gap:12px;padding:12px 15px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);font-size:14px;background:var(--surface)}.app .theory-contents a:hover{border-color:var(--accent)}.app .theory-contents a span{font-size:12px;color:var(--accent)}.app .theory-section{scroll-margin-top:115px;padding:32px 0;border-top:1px solid var(--line)}.app .theory-section-heading h3{font-size:32px;line-height:1.2;letter-spacing:-.6px;margin:10px 0 18px}.app .theory-section p{font-size:16px;line-height:1.8;color:var(--muted);max-width:85ch}.app .theory-section h4{font-size:21px;line-height:1.3;margin:12px 0}.app .theory-two-col{display:grid;grid-template-columns:1fr 1.15fr;gap:30px;align-items:center;margin:24px 0}.app .theory-diagram{padding:24px;border:1px solid var(--line);border-radius:23px;background:#171222}.app .theory-diagram svg{display:block;width:100%;margin:15px auto 0}.app .theory-callout{padding:22px;border-left:3px solid var(--accent)}.app .theory-callout p{font-size:15px}.app .theory-formula{padding:18px;background:var(--key);border:1px solid var(--line);border-radius:13px;font-size:14px;font-family:ui-monospace,monospace;overflow-wrap:anywhere}.app .theory-slider{display:grid;grid-template-columns:1fr auto;gap:12px;margin:20px 0;font-size:15px;font-weight:600}.app .theory-slider input,.app .theory-slider .theory-ramp{grid-column:1/-1;width:100%}.app .theory-slider input{accent-color:var(--accent);height:22px}.app .theory-slider output{color:var(--accent)}.app .theory-hsl-lab{display:grid;grid-template-columns:1fr 1.2fr;gap:25px;margin:25px 0}.app .theory-color-sample{min-height:230px;border-radius:22px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px}.app .theory-color-sample strong{font-size:30px}.app .theory-color-sample span{font-size:14px}.app .theory-ramp{display:flex;overflow:hidden;border-radius:8px;height:32px}.app .theory-ramp i{flex:1}.app .theory-note{font-size:15px;line-height:1.75;padding:21px 24px;border:1px solid var(--line);border-radius:17px;color:var(--muted);background:var(--surface);margin:25px 0}.app .theory-note strong{display:block;color:var(--ink);margin-bottom:7px}.app .theory-ramps>div{display:grid;grid-template-columns:215px 1fr;align-items:center;gap:22px;margin:22px 0}.app .theory-ramps h4 span{font-size:14px;font-weight:400;color:var(--muted)}.app .theory-ramps p{font-size:14px;margin:6px 0}.app .theory-palette{width:100%;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;height:86px;cursor:pointer;background:transparent}.app .theory-palette i{flex:1;min-width:0;font-style:normal;display:flex;align-items:end;justify-content:center;padding:12px 3px}.app .theory-palette span{font-size:11px;line-height:1.5}.app .theory-palette:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.app .theory-palette:hover{box-shadow:0 0 0 2px var(--accent)}.app .theory-tip{font-size:14px!important;color:var(--accent)!important}.app .theory-principles{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.app .theory-principles article{border:1px solid var(--line);border-radius:18px;padding:22px;background:var(--surface)}.app .theory-principles article>b{color:var(--accent);font-size:14px}.app .theory-principles p{font-size:14px;margin-bottom:0}.app .theory-context{display:grid;grid-template-columns:repeat(3,1fr);border-radius:20px;overflow:hidden;margin:25px 0}.app .theory-context>div{display:flex;align-items:center;justify-content:center;min-height:170px}.app .theory-context i{width:70px;height:70px;border-radius:8px}.app .theory-contrast-lab>div{padding:30px;border-radius:20px;margin-top:25px}.app .theory-contrast-lab h4{font-size:31px}.app .theory-contrast-lab p{color:inherit}.app .theory-contrast-lab strong{font-size:17px}.app .theory-role-layout{display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:25px;margin:25px 0}.app .theory-role-demo{background:#f4f0e9;color:#243b33;position:relative;overflow:hidden;border-radius:20px}.app .theory-role-nav{padding:20px;border-bottom:1px solid #243B3322;font-size:18px;font-weight:700;display:flex;justify-content:space-between;gap:12px}.app .theory-role-nav span{font-size:11px;font-weight:400}.app .theory-role-demo>div:not(.theory-role-nav){padding:30px 24px;position:relative;z-index:1}.app .theory-role-demo>div>span{font-size:11px}.app .theory-role-demo h4{font-size:27px;line-height:1.2}.app .theory-role-demo p{font-size:14px;color:#334c40}.app .theory-role-demo button{padding:12px 17px;border:0;border-radius:9px;background:#4c6959;color:#fff;cursor:pointer;font-size:14px}.app .theory-role-demo>i{position:absolute;width:160px;height:160px;border-radius:100%;background:#cd9b73;right:-65px;bottom:-45px}.app .theory-role-layout ul{list-style:none;padding:0;margin:0}.app .theory-role-layout li{display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.5;margin:18px 0}.app .theory-role-layout li i{width:22px;height:22px;flex-shrink:0;border:1px solid #8886;border-radius:6px}.app .theory-status{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:25px 0}.app .theory-status>div{display:grid;gap:14px;padding:25px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}.app .theory-status b{font-size:27px;color:#a4d6b5}.app .theory-status>div:nth-child(2) b{color:#e5c087}.app .theory-status>div:nth-child(3) b{color:#f0a9b5}.app .theory-status strong{font-size:18px}.app .theory-status span{font-size:14px;line-height:1.5;color:var(--muted)}.app .theory-chart{width:100%;max-height:240px;margin-top:12px}.app .theory-workflow{padding:0;list-style:none;display:grid;gap:13px}.app .theory-workflow li{display:flex;align-items:start;gap:20px;border:1px solid var(--line);border-radius:17px;padding:21px}.app .theory-workflow li>b{font-size:22px;min-width:42px;height:42px;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}.app .theory-workflow h4{margin:0 0 6px}.app .theory-workflow p{margin:0;font-size:15px}.app .theory-quiz{padding:25px;border:1px solid var(--line);border-radius:20px;background:var(--surface);margin:28px 0}.app .theory-quiz .button{width:100%;justify-content:start;text-align:left;margin:5px 0;white-space:normal;line-height:1.5}.app .theory-quiz .button[aria-pressed=true]{border-color:var(--accent)}.app .theory-sources{display:flex;flex-wrap:wrap;gap:18px;margin:35px 0;font-size:14px;line-height:1.5}.app .theory-sources strong{width:100%;font-size:17px}.app .theory-sources a{color:var(--accent)}.app .motion-lesson{scroll-margin-top:110px;border:1px solid var(--line);border-radius:25px;padding:28px;margin:35px 0;background:var(--surface)}.app .motion-lesson>.theory-section-heading p{font-size:16px;color:var(--muted);line-height:1.7}.app .motion-frame{position:relative;border-radius:18px;overflow:hidden;background:#191426;aspect-ratio:16/9}.app .motion-frame canvas{width:100%;height:100%;display:block}.app .motion-play-overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:70px;height:70px;background:#b6beffee;border:1px solid #FFFFFF66;border-radius:100%;font-size:26px;color:#181426;cursor:pointer;box-shadow:0 7px 25px #0005}.app .motion-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:18px 0}.app .motion-controls label{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--muted)}.app .motion-controls select{padding:8px;min-height:40px;border:1px solid var(--line);border-radius:9px;background:var(--key);color:var(--ink);font-size:14px}.app .motion-time{font-size:14px;font-variant-numeric:tabular-nums;color:var(--muted)}.app .motion-scrubber{width:100%;accent-color:var(--accent);min-height:23px}.app .motion-caption{display:grid;gap:9px;background:var(--key);border-radius:14px;padding:19px;font-size:16px;line-height:1.7}.app .motion-caption strong{font-size:14px;color:var(--accent)}.app .motion-chapters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:22px 0}.app .motion-chapters button{border:1px solid var(--line);border-radius:11px;background:var(--key);color:var(--ink);text-align:left;padding:12px;display:flex;gap:12px;align-items:center;font-size:14px;line-height:1.5;cursor:pointer}.app .motion-chapters button[aria-current=step]{border-color:var(--accent);background:var(--accent-soft)}.app .motion-chapters span{font-size:12px;color:var(--accent);font-variant-numeric:tabular-nums}.app .motion-export{padding:22px 0;display:flex;align-items:center;gap:24px;border-top:1px solid var(--line)}.app .motion-export>div{flex:1}.app .motion-export strong{font-size:17px}.app .motion-export p{font-size:14px;line-height:1.7;color:var(--muted);margin-bottom:0}.app .motion-export>div[role=status]{display:grid;gap:12px;flex:0 0 155px}.app .motion-export-result video{display:block;width:100%;margin:20px 0;border-radius:16px}.app .motion-export-result a{text-decoration:none;display:inline-flex}.app .motion-transcript,.app .theory-code-reference{border-top:1px solid var(--line);padding-top:20px}.app .motion-transcript summary,.app .theory-code-reference summary{font-size:16px;font-weight:600;cursor:pointer}.app .motion-transcript section{padding:12px 0}.app .motion-transcript h4{font-size:18px}.app .motion-transcript p{font-size:15px;line-height:1.8;color:var(--muted)}.app .theory-code-reference .learn-grid{margin-top:22px}@media(max-width:1150px){.app .readable-controls{grid-template-columns:1fr}.app .readable-options{grid-template-columns:repeat(2,minmax(0,1fr))}.app .theory-hero{grid-template-columns:1fr 200px;padding:27px}.app .theory-hero h2{font-size:35px}.app .theory-role-layout{grid-template-columns:1fr}.app .theory-ramps>div{grid-template-columns:170px 1fr}}@media(max-width:700px){.app .readable-studio{padding:20px 16px}.app .readable-heading{flex-direction:column}.app .readable-heading h3{font-size:25px}.app .readable-side{grid-template-columns:1fr}.app .readable-side button{padding:13px}.app .readable-options{grid-template-columns:1fr}.app .readable-option-sample{min-height:220px}.app .readable-option-sample>strong{font-size:27px}.app .readable-option-info b{font-size:15px}.app .readable-option-info small{font-size:12px}.app .suggestion-intro{flex-direction:column;gap:10px}.app .bias-choices{gap:6px}.app .bias-choices button{font-size:13px;padding:8px 12px}.app .theory-hero{grid-template-columns:1fr;padding:24px 20px}.app .theory-hero h2{font-size:33px;letter-spacing:-1px}.app .theory-hero p{font-size:16px}.app .theory-hero .theory-wheel-svg{max-width:220px}.app .theory-contents{grid-template-columns:1fr;margin:20px 0 30px}.app .theory-section{padding:27px 0;scroll-margin-top:100px}.app .theory-section-heading h3{font-size:28px}.app .theory-two-col,.app .theory-hsl-lab{grid-template-columns:1fr;gap:18px}.app .theory-two-col>.theory-wheel-svg{max-width:250px}.app .theory-callout{padding:10px 18px}.app .theory-color-sample{min-height:185px}.app .theory-ramps>div{grid-template-columns:1fr;gap:8px}.app .theory-palette{height:85px}.app .theory-palette span{font-size:9px;letter-spacing:-.4px}.app .theory-principles,.app .theory-status{grid-template-columns:1fr}.app .theory-context>div{min-height:125px}.app .theory-context i{height:45px;width:45px}.app .theory-note{padding:18px}.app .theory-contrast-lab>div{padding:22px}.app .theory-role-nav{flex-direction:column;gap:7px}.app .theory-role-demo h4{font-size:24px}.app .theory-role-layout ul{margin-top:0}.app .theory-status>div{grid-template-columns:35px 1fr;gap:6px 12px;padding:20px}.app .theory-status span{grid-column:2}.app .theory-status b{grid-row:1/3}.app .theory-workflow li{padding:17px;gap:13px}.app .theory-workflow h4{font-size:19px}.app .theory-quiz{padding:20px}.app .theory-chart{min-height:150px}.app .motion-lesson{padding:20px 13px;border-radius:21px;scroll-margin-top:100px}.app .motion-frame{border-radius:11px}.app .motion-controls{gap:9px}.app .motion-controls .button{font-size:13px;padding:9px 12px}.app .motion-caption{font-size:15px;padding:15px}.app .motion-chapters{grid-template-columns:1fr}.app .motion-export{flex-direction:column;align-items:stretch;gap:16px}.app .motion-export .button{justify-content:center}.app .motion-export>div[role=status]{flex:auto}.app .motion-play-overlay{height:49px;width:49px;font-size:20px}.app .motion-lesson>.theory-section-heading p{font-size:15px}.app .theory-hero .button{white-space:normal;line-height:1.5}.app .theory-quiz .button{font-size:14px}}.app .readable-option-sample[data-large=true]>strong,.app .readable-option-sample[data-large=true]>span,.app .readable-option-sample[data-large=true]>i{font-size:24px;line-height:1.3}.app .readable-option-sample[data-large=true]{min-height:280px}.app .color-theory-course .button{max-width:100%;white-space:normal;line-height:1.5}.app .theory-diagram svg text{fill:#f7f2ff}.app[data-theme=light] .theory-status b{color:#21633e}.app[data-theme=light] .theory-status>div:nth-child(2) b{color:#85581b}.app[data-theme=light] .theory-status>div:nth-child(3) b{color:#a62c44}.app .narration-credit{display:inline-flex;align-items:center;gap:8px;color:var(--accent);background:var(--accent-soft);border:1px solid var(--line);border-radius:99px;padding:9px 14px;font-size:13px;line-height:1.5;margin:0 0 20px}.app .learn-workspace{grid-template-columns:minmax(0,1fr)}.app .learn-workspace>.tool-sidebar,.app .learn-workspace .tool-heading{display:none}.app .learn-workspace>.tool-content{min-width:0}.app .learn-workspace .color-theory-course{max-width:1200px}.app .learn-progress{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:15px 25px;margin:25px 0;padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.app .learn-progress>div{display:grid;gap:9px}.app .learn-progress strong{font-size:17px}.app .learn-progress progress{width:100%;height:10px;accent-color:var(--accent);border:0;border-radius:99px;overflow:hidden}.app .learn-progress progress::-webkit-progress-bar{background:var(--key)}.app .learn-progress progress::-webkit-progress-value{background:var(--accent);border-radius:99px}.app .learn-progress>span{grid-column:1/-1;font-size:13px;color:var(--muted)}.app .learn-lab-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:26px 0}.app .learn-palette-lab,.app .learn-practice{padding:27px;border:1px solid var(--line);border-radius:23px;background:linear-gradient(145deg,var(--surface),var(--panel))}.app .learn-lab-grid h3{font-size:25px;line-height:1.2;margin:14px 0}.app .learn-lab-grid p{font-size:15px;line-height:1.7;color:var(--muted)}.app .learn-lab-grid .theory-palette{height:105px;margin:23px 0}.app .learn-pair-insight{display:grid;gap:11px;padding:18px;border-radius:14px;background:var(--key)}.app .learn-pair-insight strong{font-size:16px}.app .learn-pair-insight>span{font-size:13px;line-height:1.6;color:var(--muted)}.app .learn-pair-insight .text-button{justify-self:start;font-size:14px}.app .learn-practice-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.app .learn-practice-top>span:last-child{font-size:12px;color:var(--muted)}.app .learn-practice-answers{display:grid;gap:9px}.app .learn-practice-answers button{padding:13px;display:flex;align-items:center;gap:13px;font-size:14px;line-height:1.5;text-align:left;color:var(--ink);background:var(--key);border:1px solid var(--line);border-radius:12px;cursor:pointer}.app .learn-practice-answers button[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}.app .learn-practice-answers i{height:38px;min-width:38px;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:20px;border-radius:8px;border:1px solid #8883}.app .learn-practice-feedback{margin-top:17px;border-left:3px solid var(--accent);padding-left:16px}.app .learn-practice-feedback strong{font-size:16px}.app .learn-practice-feedback p{font-size:14px}.app .learn-recipes{padding:20px 0;margin:25px 0}.app .learn-recipes>.theory-section-heading p{font-size:16px;line-height:1.7;color:var(--muted)}.app .learn-recipes>div:last-child{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.app .learn-recipes>div>button{padding:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;text-align:left;color:var(--ink);background:var(--surface);cursor:pointer;transition:transform .16s,border-color .16s}.app .learn-recipes>div>button:hover{transform:translateY(-3px);border-color:var(--accent)}.app .learn-recipe-colors{height:98px;display:flex}.app .learn-recipe-colors i{flex:1}.app .learn-recipes button>strong{display:flex;justify-content:space-between;gap:8px;font-size:17px;padding:18px 17px 0}.app .learn-recipes button>strong>b{color:var(--accent);font-weight:400}.app .learn-recipes button>p{font-size:14px;line-height:1.7;color:var(--muted);padding:0 17px 17px;margin-bottom:0}.app .theory-chapter-done{display:flex;justify-content:end;margin-top:25px}.app .theory-chapter-done button[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}@media(max-width:1000px){.app .learn-lab-grid{grid-template-columns:1fr}.app .learn-recipes>div:last-child{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.app .learn-progress{padding:21px;grid-template-columns:1fr}.app .learn-progress strong{font-size:16px}.app .learn-lab-grid{gap:17px}.app .learn-palette-lab,.app .learn-practice{padding:23px 18px}.app .learn-lab-grid h3{font-size:24px}.app .learn-recipes>div:last-child{grid-template-columns:1fr 1fr;gap:10px}.app .learn-recipes button>strong{font-size:15px;padding:14px 12px 0}.app .learn-recipes button>p{font-size:13px;padding:0 12px 14px}.app .learn-recipe-colors{height:80px}.app .theory-chapter-done{justify-content:stretch}.app .theory-chapter-done .button{width:100%;justify-content:center;font-size:14px}}.app .lesson-audio-console{display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,2fr) 160px;align-items:center;gap:15px;padding:20px;border:1px solid var(--line);border-radius:18px;background:var(--key);margin:20px 0}.app .lesson-audio-console>div{display:grid;gap:8px}.app .lesson-audio-console strong{font-size:15px}.app .lesson-audio-console>div>span{font-size:12px;color:var(--muted)}.app .lesson-audio-console canvas{width:100%;height:60px;min-width:0;border-radius:10px}.app .lesson-audio-console label{font-size:14px;display:grid;grid-template-columns:1fr auto;gap:8px}.app .lesson-audio-console input{grid-column:1/-1;width:100%;accent-color:var(--accent);min-height:26px}.app .lesson-audio-console output{font-size:13px;color:var(--accent)}.app .lesson-audio-console>p{grid-column:1/-1;font-size:13px;line-height:1.6;color:var(--muted);margin:0}.app .lesson-audio-console audio{grid-column:1/-1;width:100%}@media(max-width:700px){.app .lesson-audio-console{grid-template-columns:1fr;padding:17px}.app .lesson-audio-console canvas{height:70px}.app .lesson-audio-console .button,.app .lesson-audio-console .text-button{justify-content:center}}:root{font-family:Figtree,system-ui,sans-serif;background:#171322;color:#f4eff9;font-size:16px;color-scheme:dark}body{background:#171322}.app{--bg:#171322;--bg2:#1d1729;--surface:#221c30;--panel:#211b2e;--key:#2a2339;--key-on:#33305a;--ink:#f4eff9;--muted:#c1b7d0;--faint:#a79ab9;--line:#ffffff1c;--line-strong:#ffffff30;--accent:#aebcff;--accent-soft:#2b2a4a;--accent-ink:#1d1b3a;--mint:#cdeee0;--blush:#ffd3c9;--butter:#ffe9a8;--shadow:0 24px 50px -28px #000c;--small-shadow:0 7px 0 -3px #0e0b15,0 10px 24px -14px #000b;min-height:100vh;background:radial-gradient(ellipse at 66% 0%,#8294ff18,transparent 40%),radial-gradient(ellipse at 12% 50%,#ff968c0a,transparent 50%),var(--bg);color:var(--ink);font-family:Figtree,system-ui,sans-serif;line-height:1.5;padding-left:116px}.app[data-theme=light]{--bg:#f6f0f4;--bg2:#eee7f1;--surface:#fffcff;--panel:#f8f3fc;--key:#eee7f3;--key-on:#e0d9f8;--ink:#292137;--muted:#665a77;--faint:#726780;--line:#33244920;--line-strong:#33244938;--accent:#7770d6;--accent-soft:#eeeafb;--accent-ink:#fff;--mint:#cdeee0;--blush:#ffd3c9;--butter:#ffe9a8;--shadow:0 24px 50px -28px #4c346133;--small-shadow:0 5px 0 -3px #c4b9d3,0 10px 24px -14px #503c6955;color-scheme:light}.app :is(h1,h2,h3,h4,strong,button,input,select,textarea){font-family:inherit}.app :is(button,input,select){font-size:16px}.app button{transition:background .12s,transform .12s,border-color .12s}.app button:active:not(:disabled){transform:translateY(1px)}.app :is(button,input,select,a):focus-visible{outline:3px solid var(--accent);outline-offset:4px}.app input::placeholder{color:var(--faint);font-size:15px}.app select{background:var(--key);color:var(--ink);border:1px solid var(--line-strong);height:46px;border-radius:11px;padding:0 12px;font-size:15px}.app select option{background:var(--surface);color:var(--ink)}.app input:not([type=range]):not([type=color]):not([type=file]){background:var(--key);color:var(--ink);border-color:var(--line-strong);border-radius:10px;font-size:16px;min-height:44px}.app input[type=range]{height:7px;background:var(--track,var(--accent-soft));accent-color:var(--accent)}.app input[type=range]::-webkit-slider-thumb{width:21px;height:21px;border:2px solid var(--ink);background:var(--accent);box-shadow:0 2px 7px #0005}.app input[type=range]::-moz-range-thumb{width:19px;height:19px;border:2px solid var(--ink);background:var(--accent)}.app .button{min-height:46px;padding:10px 17px;border:1px solid var(--line-strong);background:var(--key);color:var(--ink);font-size:15px;font-weight:600;border-radius:13px;box-shadow:var(--small-shadow);gap:9px}.app .button:hover{background:var(--key-on);border-color:var(--accent)}.app .button.dark{background:var(--accent);color:var(--accent-ink);border:1px solid #c9d1ff66;box-shadow:inset 0 1px #ffffff40,0 5px 0 -1px #6c7bdc66,0 12px 24px -15px #aebcff90}.app .button.dark:hover{filter:brightness(1.07)}.app .button:disabled{box-shadow:none;opacity:.4}.app .text-button{font-size:14px;color:var(--accent);gap:8px;line-height:1.5}.app .icon-button{color:var(--ink);min-width:40px;min-height:40px}.app .round-button{width:44px;height:44px;min-width:44px;background:var(--key);color:var(--ink);border:1px solid var(--line-strong);box-shadow:var(--small-shadow);font-size:22px}.app header{position:fixed;left:0;top:0;bottom:0;width:116px;height:100dvh;background:linear-gradient(180deg,var(--surface),var(--bg2));border:0;border-right:1px solid var(--line);padding:27px 10px 20px;display:flex;flex-direction:column;gap:30px;z-index:18}.app .brand{display:flex;flex-direction:column;gap:9px;font-size:21px;font-weight:750;letter-spacing:-1px;color:var(--ink)}.app .brandmark{width:31px;height:31px;box-shadow:0 0 20px #aebcff20}.app .brandmark:after{background:var(--surface);inset:9px}.app .brand-dot{display:none}.app header nav{height:auto;width:100%;display:flex;flex-direction:column;gap:10px}.app .nav{display:flex;flex-direction:column;justify-content:center;gap:7px;min-height:77px;width:100%;padding:12px 5px;border:1px solid transparent;border-radius:17px;color:var(--muted);font-size:13px;font-weight:600;text-align:center}.app .nav:hover{background:var(--key)}.app .nav.active{background:var(--accent-soft);color:var(--accent);border-color:#aebcff45;box-shadow:inset 0 1px #fff1,var(--small-shadow)}.app .nav.active:after{display:none}.app .count{position:absolute;right:7px;top:6px;background:var(--accent);color:var(--accent-ink);font-size:11px;padding:1px 5px}.app .header-right{margin:auto 0 0;display:flex;justify-content:center}.app .local-label{display:none}.app .avatar{height:39px;width:39px;border-color:var(--line-strong);background:var(--key-on);color:var(--accent);font-size:15px}.app-topbar{height:94px;position:sticky;top:0;z-index:12;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 34px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.app-context{display:block;color:var(--faint);font-size:11px;font-weight:650;letter-spacing:1.5px;margin-bottom:4px}.app-topbar h1{font-size:27px;font-weight:600;letter-spacing:-.8px;line-height:1.2;margin:0;color:var(--ink)}.app-topbar-actions{display:flex;align-items:center;gap:15px}.theme-toggle{display:flex;align-items:center;justify-content:center;gap:9px;background:var(--key);color:var(--ink);border:1px solid var(--line-strong);box-shadow:var(--small-shadow);padding:8px 15px 8px 8px;border-radius:30px;font-size:15px;font-weight:600;min-height:44px}.theme-toggle>span{background:var(--accent);color:var(--accent-ink);height:29px;width:29px;display:grid;place-items:center;border-radius:50%;font-size:19px}.app main{padding:26px 32px 0;max-width:1780px;margin:auto}.app .page-heading{display:none}.maker-progress{display:flex;align-items:center;gap:17px;border:1px solid var(--line);border-radius:20px;padding:12px 18px;background:linear-gradient(115deg,var(--surface),var(--accent-soft));margin-bottom:20px;box-shadow:inset 0 1px #fff1}.maker-progress>button{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--muted);padding:6px 0;font-weight:600;white-space:nowrap}.maker-progress>button>span{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:var(--key);border:1px dashed var(--line-strong);font-size:15px;font-weight:700}.maker-progress>button.current{color:var(--ink)}.maker-progress>button.current>span{background:var(--accent);border-style:solid;color:var(--accent-ink);box-shadow:0 0 22px #aebcff30}.maker-progress>i{height:1px;background:var(--line-strong);width:34px;flex-shrink:1}.creative-start{border:1px solid var(--line);border-radius:19px;background:var(--surface);margin-bottom:23px;box-shadow:var(--shadow);overflow:hidden}.creative-start>summary{list-style:none;display:flex;align-items:center;gap:15px;padding:17px 20px;cursor:pointer}.creative-start>summary::-webkit-details-marker{display:none}.creative-start-icon{width:45px;height:45px;display:grid;place-items:center;font-size:26px;background:var(--accent-soft);border:1px solid var(--line-strong);border-radius:14px;color:var(--accent);flex-shrink:0}.creative-start>summary>div{display:flex;flex-direction:column;gap:3px}.creative-start strong{font-size:17px;font-weight:550;color:var(--ink)}.creative-start>summary>div>span{font-size:14px;color:var(--muted)}.creative-start-open{margin-left:auto;white-space:nowrap;font-size:13px;color:var(--accent);display:flex;gap:15px;align-items:center}.creative-start-open>b{font-size:24px;font-weight:400}.creative-start[open] .creative-start-open>b{transform:rotate(45deg)}.app .creative-lab{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;margin:0;grid-template-columns:240px 1fr}.app .lab-intro{background:var(--accent-soft);border-color:var(--line);padding:28px}.app .lab-intro h2{font-size:26px;font-weight:500;color:var(--ink)}.app .lab-intro p{font-size:15px;color:var(--muted);line-height:1.7}.app .eyebrow{font-size:11px;letter-spacing:1.4px;color:var(--faint);font-weight:600}.app .lab-body{padding:0 24px 24px}.app .lab-tabs{gap:26px;border-color:var(--line)}.app .lab-tabs button{font-size:15px;padding:19px 0;color:var(--muted)}.app .lab-tabs button>span{font-size:11px;color:var(--faint)}.app .lab-tabs button[aria-selected=true]{color:var(--accent)}.app .lab-tabs button[aria-selected=true]:after{background:var(--accent)}.app .chat-messages{height:165px;padding:18px 0}.app .chat-message{font-size:15px;gap:15px;flex-wrap:nowrap}.app .chat-message>span{width:65px;font-size:10px;color:var(--accent);padding-top:5px}.app .chat-message p{font-size:15px;color:var(--muted);line-height:1.7}.app .chat-message.user p{color:var(--ink)}.app .chat-palette{margin-left:0;min-width:100px;height:30px}.app .brief-form input,.app .url-form input{padding:13px 15px;font-size:16px}.app .brief-suggestions{gap:8px;margin:15px 0}.app .brief-suggestions button{font-size:13px;padding:7px 11px;border-color:var(--line-strong);background:var(--key);color:var(--muted)}.app .lab-disclosure{font-size:12px;color:var(--faint)}.app .url-tool h3{font-size:24px;color:var(--ink)}.app .url-tool>p{font-size:15px;color:var(--muted);max-width:780px}.app .url-tool>p.lab-disclosure{font-size:12px}.app .upload-option{font-size:13px;color:var(--muted);margin:16px 0;gap:12px}.app .upload-option .text-button{font-size:13px}.app .import-result{background:var(--accent-soft);border-color:var(--line-strong);color:var(--mint);padding:18px;border-radius:14px}.app .import-result strong{font-size:17px;color:var(--ink)}.app .import-result p{font-size:14px;color:var(--muted)}.app .import-result>span{font-size:12px;color:var(--faint)}.app .import-result .import-warning{font-size:12px;color:var(--faint)}.app .lab-error,.app .tool-error{background:#ffd3c914;border-color:#ffd3c940;color:var(--blush);font-size:15px;border-radius:12px;padding:16px}.app .workspace-heading{margin:23px 0 19px;gap:20px}.app .workspace-heading strong{font-size:18px;font-weight:600;color:var(--ink)}.app .workspace-heading span{font-size:14px;color:var(--muted)}.app .workspace-actions{gap:8px}.app .workspace-actions .button{font-size:13px;min-height:39px;padding:8px 12px;border-radius:12px}.app .creative-workspace.side-by-side{grid-template-columns:430px minmax(0,1fr);gap:25px}.app .side-by-side .wheel-side{position:sticky;top:113px;max-height:calc(100dvh - 135px);padding:3px;scrollbar-color:var(--key-on) transparent}.app .panel{border:1px solid var(--line);background:linear-gradient(130deg,var(--surface),var(--panel));border-radius:24px;box-shadow:inset 0 1px #fff1,var(--shadow)}.app .section-title{padding:21px 23px}.app .section-title h2{font-size:19px;font-weight:600;color:var(--ink)}.app .tiny-index{font-size:12px;color:var(--faint)}.app .pill{font-size:11px;padding:6px 10px;border-color:var(--line);background:var(--key);color:var(--muted)}.app .small-muted{font-size:12px;color:var(--faint)}.app .side-by-side .wheel-layout{padding:10px 22px 23px;gap:22px}.app .wheel-controls{gap:16px}.app .wheel{box-shadow:0 10px 30px #0003,inset 0 0 30px #ffffff30}.app .wheel-core.live-wheel-core,.app .side-by-side .wheel-core.live-wheel-core{background:var(--bg2);inset:25%;box-shadow:inset 0 0 0 1px var(--line),0 2px 15px #0002;gap:4px}.app .live-wheel-core>span,.app .side-by-side .live-wheel-core>span{font-size:10px;color:var(--muted);letter-spacing:1px}.app .live-wheel-core>strong,.app .side-by-side .live-wheel-core>strong{font-size:37px;line-height:1.1;letter-spacing:-1.3px;color:var(--ink)}.app .live-wheel-core>strong>sup,.app .side-by-side .live-wheel-core>strong>sup{font-size:21px}.app .wheel-live-values,.app .side-by-side .wheel-live-values{font-size:12px;gap:9px;color:var(--muted)}.app .wheel-live-values b{color:var(--ink);font-weight:600}.app .live-wheel-core>small,.app .side-by-side .live-wheel-core>small{font-size:11px;color:var(--accent)}.app .wheel-value-meters{margin-top:2px}.app .wheel-value-meters>i{height:4px}.app .vertical-levers{gap:13px;padding:0 2px}.app .vertical-levers label{font-size:11px;font-weight:550;letter-spacing:.6px;color:var(--muted);gap:8px}.app .vertical-levers output{font-size:13px;color:var(--ink)}.app .vertical-levers label>span{font-size:12px;color:var(--faint)}.app .vertical-levers input.vertical-range{height:175px!important;width:12px;background:linear-gradient(#fff,#a797ba,#0e0b15)}.app .vertical-levers input.pastel-range{background:linear-gradient(#e9dcfc,#c28eb9,#993665)}.app .vertical-levers input.vertical-range::-webkit-slider-thumb{width:27px;height:17px;border:2px solid var(--ink);background:var(--accent);border-radius:6px;box-shadow:0 3px 8px #0006}.app .wheel-point,.app .side-by-side .wheel-point{width:32px;height:32px;font-size:11px;border-color:#fff;box-shadow:0 2px 8px #0005;line-height:1}.app .wheel-point.master-handle,.app .side-by-side .wheel-point.master-handle{width:43px;height:43px;font-size:27px;border-width:3px;box-shadow:0 0 0 2px #40364f,0 3px 14px #0005}.app .wheel-color-values,.app .side-by-side .wheel-color-values{gap:7px;margin-top:0}.app .wheel-color-values>button,.app .side-by-side .wheel-color-values>button{background:var(--key);border-color:var(--line);padding:9px 7px;gap:6px 5px;border-radius:12px;color:var(--muted);font-size:12px}.app .wheel-color-values>button.current{background:var(--accent-soft);border-color:#aebcff80}.app .wheel-color-values i{width:12px;height:12px}.app .wheel-color-values strong,.app .side-by-side .wheel-color-values strong{font-size:15px;line-height:1.2;color:var(--ink)}.app .wheel-color-values small{font-size:10px;color:var(--muted);margin-left:3px}.app .field-label{font-size:14px;color:var(--muted);margin-bottom:8px}.app .harmony-settings>select{font-size:15px;height:46px}.app .adjustment-scope{margin:15px 0;gap:12px}.app .adjustment-scope>label{font-size:13px;color:var(--muted)}.app .adjustment-scope>select{font-size:14px;height:41px}.app .mood-presets{gap:7px}.app .mood-presets button{font-size:14px;padding:8px;border-color:var(--line);background:var(--key);color:var(--ink);border-radius:10px;min-height:39px}.app .mood-presets button:hover{background:var(--accent-soft);color:var(--accent)}.app .helper,.app .side-by-side .helper{font-size:13px;line-height:1.7;color:var(--muted);margin:13px 0 0}.app .slider-label,.app .side-by-side .slider-label{font-size:14px;color:var(--muted);margin-top:18px}.app .slider-label>span{font-size:13px;color:var(--accent)}.app .wheel-tip,.app .side-by-side .wheel-tip{font-size:12px;color:var(--muted);border-color:var(--line);margin-top:21px;padding-top:17px;gap:8px}.app .wheel-tip strong,.app .side-by-side .wheel-tip strong{font-size:14px;font-weight:550;color:var(--ink)}.app .pair-legend{font-size:13px;gap:15px;color:var(--accent)}.app .panel-footer,.app .side-by-side .panel-footer{height:auto;min-height:46px;padding:13px 20px;font-size:11px;color:var(--muted);border-color:var(--line);gap:8px;flex-wrap:wrap}.app .panel-footer>span:last-child,.app .side-by-side .panel-footer>span:last-child{font-size:10px;color:var(--faint)}.app .restore-harmony{font-size:13px;color:var(--butter);padding:10px 0 0}.app .palette-strip,.app .side-by-side .palette-strip{border-radius:16px;height:143px;margin-top:20px;box-shadow:var(--shadow);flex-shrink:0}.app .swatch-select,.app .side-by-side .swatch-select{padding:15px 10px}.app .swatch-number,.app .side-by-side .swatch-number{font-size:12px}.app .swatch-bottom>strong,.app .side-by-side .swatch-bottom>strong{font-size:14px;font-weight:600;letter-spacing:-.3px}.app .swatch-bottom>small{font-size:11px}.app .lock,.app .side-by-side .lock{font-size:22px;top:8px;right:7px}.app .swatch-number>span{font-size:9px}.app .palette-caption,.app .side-by-side .palette-caption{font-size:13px;color:var(--ink);gap:12px;padding-top:15px}.app .palette-caption .muted,.app .side-by-side .palette-caption .muted{font-size:12px;color:var(--muted)}.app .palette-caption .text-button,.app .side-by-side .palette-caption .text-button{font-size:12px}.app .palette-dot{background:var(--mint)}.app .per-color-controls,.app .side-by-side .per-color-controls{padding:19px;background:var(--surface);border-color:var(--line);border-radius:20px;margin-top:23px}.app .per-color-heading,.app .side-by-side .per-color-heading{gap:6px;margin-bottom:17px}.app .per-color-heading strong{font-size:17px;font-weight:600;color:var(--ink)}.app .per-color-heading span{font-size:13px;color:var(--muted)}.app .per-color-row,.app .side-by-side .per-color-row{grid-template-columns:31px 1fr 1fr 22px;gap:15px;padding:17px 0;border-color:var(--line)}.app .color-row-chip,.app .side-by-side .color-row-chip{height:31px;width:31px;border-radius:10px;font-size:13px}.app .color-row-active .color-row-chip{outline-color:var(--accent)}.app .per-color-row label{gap:15px}.app .per-color-row label>span,.app .side-by-side .per-color-row label>span{font-size:12px;color:var(--muted);gap:4px;line-height:1.3}.app .per-color-row label b,.app .side-by-side .per-color-row label b{font-size:11px;color:var(--accent)}.app .per-color-row input[type=range]{height:6px}.app .per-color-row input[type=range]::-webkit-slider-thumb{height:18px;width:18px}.app .color-row-lock{font-size:23px;color:var(--muted)}.app .compact-inspector,.app .side-by-side .compact-inspector{background:var(--surface);border-color:var(--line);border-radius:13px;padding:13px;gap:10px;color:var(--muted);font-size:12px}.app .compact-inspector>span:first-child{font-size:11px}.app .compact-inspector>span:last-child{font-size:12px}.app .compact-inspector input{width:103px;font-size:15px;padding:6px 9px}.app .preview-heading{gap:16px;margin-bottom:22px}.app .preview-heading h2,.app .side-by-side .preview-heading h2{font-size:29px;line-height:1.2;font-weight:500;letter-spacing:-1px;color:var(--ink)}.app .preview-heading .eyebrow{font-size:11px;margin-bottom:10px}.app .segmented{background:var(--key);border-color:var(--line);border-radius:13px;padding:4px;gap:3px;flex-wrap:wrap}.app .segmented button{font-size:14px;color:var(--muted);padding:9px 13px;border-radius:10px;min-height:38px}.app .segmented button.active{background:var(--accent);color:var(--accent-ink);box-shadow:0 2px 10px #0002}.app .preview-toolbar{background:var(--surface);border-color:var(--line);border-radius:21px 21px 0 0;padding:20px}.app .scheme-navigation>div>span{font-size:11px;letter-spacing:1px;color:var(--faint)}.app .scheme-navigation strong,.app .side-by-side .scheme-navigation strong{font-size:18px;font-weight:550;color:var(--ink)}.app .preview-tools .button,.app .side-by-side .preview-tools .button{font-size:14px;padding:9px 14px;min-height:43px}.app .harmony-filmstrip{background:var(--surface);border-color:var(--line);padding:20px;gap:11px}.app .harmony-thumbnail{background:var(--key);border-color:var(--line);padding:7px;border-radius:13px}.app .harmony-thumbnail.current{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 0 14px #aebcff14}.app .thumbnail-colors{height:44px;border-radius:8px}.app .harmony-thumbnail>span:last-child{font-size:12px;margin:9px 3px 4px;color:var(--muted);gap:5px;line-height:1.3}.app .preview-canvas,.app .side-by-side .preview-canvas{background:radial-gradient(circle at 20% 10%,#aebcff13,transparent 55%),var(--bg2);border-color:var(--line);border-radius:0 0 21px 21px;padding:24px}.app .preview-bottom{font-size:13px;color:var(--faint);padding:17px 2px;gap:15px}.app .preview-bottom .text-button{font-size:13px}.app .preview-expanded{background:var(--bg);padding:28px 35px 35px 145px;z-index:25}.app .preview-expanded .preview-canvas{min-height:55vh}.app .mock-site{border-radius:16px;padding:24px 28px 0;box-shadow:0 20px 35px #0002;font-family:inherit}.app .mock-nav{font-size:12px;padding-bottom:20px;gap:15px}.app .mock-nav>strong{font-size:26px}.app .mock-kicker,.app .side-by-side .mock-kicker{font-size:10px;letter-spacing:1px}.app .mock-body h3,.app .side-by-side .mock-body h3{font-family:inherit;font-size:37px;line-height:1.15;font-weight:500;letter-spacing:-1px}.app .mock-body p,.app .side-by-side .mock-body p{font-size:14px;line-height:1.8;max-width:450px}.app .mock-body button,.app .side-by-side .mock-body button{font-size:13px;padding:14px 18px;min-height:45px;border-radius:10px}.app .still-life{height:280px}.app .still-life-label{font-size:8px}.app .poster{border-radius:15px;padding:30px}.app .poster>div:first-child{font-size:11px}.app .poster h3,.app .side-by-side .poster h3{font-family:inherit;font-size:60px}.app .poster>p{font-size:13px}.app .ui-preview article{border-radius:18px;padding:27px}.app .ui-preview h3{font-family:inherit;font-size:34px;font-weight:500}.app .ui-preview p{font-size:14px}.app .ui-preview article>button{font-size:14px;padding:14px 18px;border-radius:10px}.app .ui-preview .mini-heading{font-size:14px}.app .ui-preview .mini-heading>span{font-size:12px}.app .ui-stat>strong{font-family:inherit;font-size:42px}.app .ui-stat>strong>span{font:13px inherit}.app .week-label{font-size:11px}.app .stencil-mapping strong{font-size:16px;color:var(--ink)}.app .stencil-mapping span{font-size:12px;color:var(--muted)}.app .stencil-mapping .button{font-size:13px;min-height:39px;padding:8px 12px}.app .role-mapping{gap:11px;margin-bottom:20px}.app .role-mapping label{font-size:13px;color:var(--muted);gap:7px}.app .role-mapping select{height:40px;font-size:12px;padding:0 9px}.app .stencil-page{border-radius:16px;padding:26px}.app .stencil-nav{font-size:13px;gap:20px}.app .stencil-nav strong{font-family:inherit;font-size:19px}.app .stencil-nav span{font-size:11px}.app .stencil-eyebrow{font-size:10px}.app .stencil-hero{padding:35px 0;gap:25px}.app .stencil-hero h3{font-family:inherit;font-size:35px;font-weight:550}.app .stencil-hero p{font-size:14px;line-height:1.8}.app .stencil-actions span{font-size:13px;padding:12px 16px;border-radius:10px}.app .stencil-section-index{font-size:11px}.app .stencil-sections article{padding:22px;border-radius:13px}.app .stencil-sections h4{font-family:inherit;font-size:23px}.app .stencil-sections p,.app .stencil-sections li{font-size:13px}.app .stencil-image>span,.app .stencil-card-image span{font-size:10px}.app .stencil-footer{font-size:11px}.app .stencil-footer>span{font-size:10px}.app .stencil-note{font-size:12px;color:var(--muted)}.app .collection-grid{gap:25px}.app .collection-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:14px;box-shadow:var(--shadow)}.app .mini-palette{height:170px;border-radius:14px}.app .collection-card h3{font-size:19px;margin:19px 5px 10px;color:var(--ink)}.app .collection-card p{font-size:14px;margin:0 5px 12px;color:var(--muted)}.app .delete-button{font-size:13px;color:var(--blush);padding:10px 5px}.app .empty{color:var(--muted)}.app .empty h2{font-size:31px;color:var(--ink)}.app .empty p{font-size:16px;color:var(--muted)}.app footer{border-color:var(--line);font-size:13px;color:var(--faint);margin-top:35px;padding:24px 0 30px}.app .footer-brand{font-family:inherit;color:var(--muted);font-size:23px}.app .toast{background:var(--accent);color:var(--accent-ink);border:1px solid #c9d1ff66;font-size:15px;padding:16px 22px;border-radius:17px;box-shadow:var(--shadow);bottom:24px;z-index:40;max-width:calc(100vw - 30px)}.app .modal-backdrop{background:#09061099;backdrop-filter:blur(12px);z-index:35}.app .export-modal{background:var(--surface);border:1px solid var(--line-strong);border-radius:25px;width:510px;padding:27px;color:var(--ink)}.app .export-modal h2{font-family:inherit;font-size:28px;color:var(--ink)}.app .export-modal>p{font-size:16px;color:var(--muted)}.app .export-modal pre{background:var(--bg2);border:1px solid var(--line);border-radius:13px;padding:20px;font-size:15px;color:var(--accent)}.app .export-modal .mini-palette{height:85px}.app .detail-values input{font-size:16px;width:128px}.app .detail-values label,.app .detail-values>div{font-size:14px;color:var(--muted)}.app .detail-values strong{font-size:14px;color:var(--ink)}.app .detail-color>span{font-size:11px}.app .detail-color>strong{font-size:27px}.app .detail-color{height:125px;border-radius:12px}.app .accessibility{border-color:var(--line)}.app .mini-heading{font-size:14px;color:var(--muted)}.app .mini-heading>span{font-size:11px;color:var(--faint)}.app .contrast-row strong{font-size:20px;color:var(--ink)}.app .contrast-row>div>span{font-size:12px;color:var(--muted)}.app .badge{font-size:11px;border-radius:7px;padding:7px 9px}.app .accessibility>p{font-size:13px;color:var(--muted)}.app .color-toolkit{grid-template-columns:218px minmax(0,1fr);gap:28px}.app .tool-sidebar{background:var(--surface);border-color:var(--line);border-radius:23px;padding:23px 14px;top:113px;box-shadow:var(--shadow)}.app .tool-sidebar-title{font-size:12px;letter-spacing:1.1px;color:var(--ink)}.app .tool-sidebar-title>span{font-size:13px;color:var(--muted);line-height:1.6;margin-top:8px}.app .tool-sidebar h3{font-size:11px;letter-spacing:1.2px;color:var(--faint);margin:25px 10px 12px}.app .tool-sidebar>div>button{font-size:16px;color:var(--muted);padding:12px 10px;border-radius:12px;min-height:46px;gap:12px}.app .tool-sidebar>div>button>span{font-size:21px;width:22px;color:var(--faint)}.app .tool-sidebar>div>button>small{font-size:13px;color:var(--faint)}.app .tool-sidebar>div>button.current{background:var(--accent-soft);color:var(--accent);border:1px solid #aebcff35;box-shadow:inset 0 1px #fff1}.app .tool-sidebar>div>button:hover{background:var(--key)}.app .tool-sidebar .back-studio{font-size:14px;color:var(--accent);border-color:var(--line);padding-top:20px}.app .tool-heading{margin-bottom:27px}.app .tool-heading h2{font-size:32px;letter-spacing:-1px;color:var(--ink);font-weight:500}.app .tool-heading p{font-size:16px;color:var(--muted);line-height:1.75}.app .tool-heading .eyebrow{font-size:11px;color:var(--faint)}.app .tool-card{background:linear-gradient(130deg,var(--surface),var(--panel));border:1px solid var(--line);border-radius:22px;padding:25px;box-shadow:inset 0 1px #fff1,var(--shadow)}.app .tool-two-column{grid-template-columns:minmax(250px,.9fr) minmax(290px,1.1fr);gap:22px}.app .sv-square{height:275px;border-radius:15px;border-color:var(--line-strong)}.app .sv-square>i{width:21px;height:21px;border-width:3px}.app .tool-slider-label{font-size:15px;color:var(--muted);gap:14px;margin:24px 0}.app .tool-slider-label>span{font-size:14px;color:var(--accent)}.app input.rainbow-slider{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.app .tool-field{font-size:15px;color:var(--muted);gap:9px}.app .tool-field>span{font-size:14px;color:var(--muted)}.app .tool-field>div{background:var(--key);border-color:var(--line-strong);border-radius:12px;padding:7px;gap:8px}.app .tool-field input[type=color]{height:40px;width:45px;border-radius:8px}.app .tool-field input:not([type=color]),.app .tool-field select{font-size:16px;padding:11px 13px;background:var(--key);color:var(--ink);border-color:var(--line-strong)}.app .tool-field>div>input:not([type=color]){font-size:17px;background:transparent;border:0;min-height:40px;padding:6px 10px}.app .nearest-name{font-size:14px;color:var(--muted);gap:12px;margin-top:20px;flex-wrap:wrap}.app .nearest-name strong{font-size:15px;color:var(--accent)}.app .format-list{border-color:var(--line);margin:22px 0}.app .format-list>button{padding:15px 0;gap:12px;border-color:var(--line);min-height:51px}.app .format-list>button>span:first-child{font-size:12px;color:var(--faint);width:54px}.app .format-list code{font-size:14px;line-height:1.5;color:var(--ink);font-family:ui-monospace,SFMono-Regular,monospace}.app .format-list>button>span:last-child{font-size:18px;color:var(--accent)}.app .format-list>button:hover code{color:var(--accent)}.app .parse-color-form>label{font-size:15px;color:var(--muted);margin-bottom:12px}.app .parse-color-form>div{gap:10px}.app .parse-color-form input{padding:12px;font-size:15px;background:var(--key);color:var(--ink);border-color:var(--line-strong)}.app .parse-color-form input::placeholder{font-size:14px;color:var(--faint)}.app .parse-color-form .button{font-size:14px;min-height:45px;padding:9px 14px}.app .numeric-editor{gap:16px;margin-top:25px}.app .numeric-editor>select{height:45px;width:90px;font-size:14px;color:var(--ink);background:var(--key)}.app .numeric-editor>div{gap:10px}.app .numeric-editor label{font-size:13px;color:var(--muted);gap:7px}.app .numeric-editor input{font-size:16px;min-height:44px;padding:9px 7px;background:var(--key);color:var(--ink);border-color:var(--line-strong)}.app .tool-note{font-size:13px;line-height:1.8;color:var(--muted);margin:19px 0}.app .tool-actions{gap:10px;flex-wrap:wrap}.app .tool-actions .button{font-size:14px;padding:10px 14px}.app .tool-section-title{gap:16px;margin:32px 0 20px}.app .tool-section-title h3,.app .palette-contrast-matrix h3{font-size:20px;font-weight:550;color:var(--ink)}.app .tool-section-title .button{font-size:13px;padding:10px 14px}.app .tool-section-title>.text-button{font-size:14px}.app .tool-swatches{gap:17px;grid-template-columns:repeat(4,minmax(0,1fr))}.app .tool-swatches article{background:var(--surface);border-color:var(--line);border-radius:17px;overflow:hidden;padding-bottom:16px;box-shadow:var(--shadow)}.app .tool-swatch-color{height:112px}.app .tool-swatch-color>span{font-size:13px;font-weight:550;opacity:0;padding:8px 14px;background:#ffffff50;backdrop-filter:blur(5px)}.app .tool-swatch-color:hover>span,.app .tool-swatch-color:focus-visible>span{opacity:1}.app .tool-swatches article>strong{font-size:15px;font-weight:500;color:var(--ink);padding:15px 13px 8px;line-height:1.3}.app .swatch-code{font-size:13px;color:var(--muted);padding:0 13px;gap:8px;font-family:ui-monospace,SFMono-Regular,monospace}.app .swatch-code>span{font-size:16px;color:var(--accent)}.app .tool-swatches.compact{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.app .compact .tool-swatch-color{height:78px}.app .compact article>strong{font-size:12px;padding:10px 8px 6px}.app .compact .swatch-code{font-size:10px;padding:0 8px}.app .compact .tool-swatch-color>span{font-size:10px;padding:4px 8px}.app .catalog-toolbar{gap:10px}.app .catalog-toolbar>input{font-size:16px;background:var(--surface);border-color:var(--line-strong);padding:13px 15px;flex-basis:100%}.app .catalog-toolbar>select{font-size:14px;height:44px;background:var(--key);color:var(--ink);min-width:115px}.app .catalog-toolbar>.button{font-size:13px;min-height:44px;padding:10px 14px}.app .family-filter{gap:8px;margin:23px 0}.app .family-filter button{font-size:13px;min-height:35px;padding:7px 13px;background:var(--key);border-color:var(--line);color:var(--muted);border-radius:20px}.app .family-filter button.current{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:0 3px 12px #aebcff25}.app .catalog-count{font-size:14px;color:var(--muted);margin:23px 0 19px}.app .catalog-count>span:last-child{font-size:12px;color:var(--faint)}.app .tool-empty{border-color:var(--line-strong);color:var(--muted);font-size:17px;background:var(--surface);border-radius:18px;padding:70px 25px}.app .tool-table-scroll{border-color:var(--line);border-radius:15px}.app .color-table{font-size:15px;background:var(--surface)}.app .color-table th{font-size:13px;background:var(--key);color:var(--muted);padding:15px 17px;letter-spacing:.2px}.app .color-table td{font-size:14px;color:var(--ink);padding:15px 17px;border-color:var(--line)}.app .color-table td>button{font-size:13px;color:var(--muted)}.app .color-table td>button:hover{color:var(--accent)}.app .color-table td>i{width:31px;height:31px;border-radius:9px}.app .catalog-source{font-size:13px;color:var(--accent);gap:22px;margin-top:26px}.app .image-upload{border:1px dashed var(--line-strong);background:linear-gradient(140deg,var(--accent-soft),var(--surface));border-radius:24px;padding:40px 25px}.app .image-upload>span{font-size:43px;color:var(--accent)}.app .image-upload h3{font-size:27px;color:var(--ink);letter-spacing:-.8px}.app .image-upload p{font-size:15px;color:var(--muted);margin-bottom:24px}.app .image-info{font-size:14px;color:var(--muted);margin:25px 0 20px}.app .image-info>label{gap:12px;font-size:14px}.app .image-info select{height:41px;width:72px;font-size:14px;background:var(--key)}.app .image-tool-grid{gap:22px}.app .sample-canvas-wrap{border-color:var(--line);border-radius:20px;padding:18px;background:repeating-conic-gradient(var(--key) 0% 25%,var(--surface) 0% 50%) 0/20px 20px}.app .sample-canvas-wrap canvas{border-radius:12px}.app .sample-canvas-wrap p{font-size:14px;color:var(--muted);margin-top:18px}.app .sample-preview{height:105px;border-radius:13px}.app .mixer-controls{gap:25px}.app .mixer-controls>.tool-slider-label{margin:0}.app .mix-preview{height:245px;border-radius:24px;gap:23px;margin-top:25px}.app .mix-preview>span{font-size:12px;letter-spacing:1.7px}.app .mix-preview>strong{font-family:inherit;font-size:46px;letter-spacing:-1.2px}.app .mix-preview>.button{font-size:14px;background:#ffffff80;border-color:#ffffff60;color:#24202e}.app .contrast-controls{gap:22px}.app .contrast-controls>.button{font-size:14px}.app .contrast-preview{border-radius:24px;padding:38px}.app .contrast-preview>span{font-size:12px;color:inherit}.app .contrast-preview h3{font-family:inherit;font-size:38px;font-weight:500;color:inherit}.app .contrast-preview p{font-size:16px;color:inherit;line-height:1.8}.app .contrast-preview>button{font-size:15px;border-radius:12px;padding:14px 20px;min-height:46px}.app .contrast-report{border-color:var(--line);border-radius:18px;grid-template-columns:repeat(3,1fr);margin-top:25px}.app .contrast-report>div{background:var(--surface);border-color:var(--line);padding:25px 15px;gap:14px}.app .contrast-report>div>span{font-size:13px;color:var(--muted)}.app .contrast-report strong{font-size:38px;font-family:inherit;color:var(--ink)}.app .contrast-report strong>small{font-size:22px}.app .contrast-report b{font-size:17px}.app .contrast-report>div>small{font-size:12px;color:var(--faint)}.app .passes{color:#9bddb7}.app .fails{color:#ffb7a8}.app[data-theme=light] .passes{color:#316b45}.app[data-theme=light] .fails{color:#a23d2c}.app .game-composer{gap:23px;margin:24px 0}.app .game-preview{border-color:var(--line-strong);border-radius:20px;background:#181322;padding:35px;font-size:26px}.app .game-output{gap:20px;padding:22px 0 30px}.app .game-output>code{font-size:16px;color:var(--accent)}.app .game-output .button{font-size:14px}.app .roblox-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}.app .roblox-grid>article{background:var(--surface);border-color:var(--line);border-radius:17px;padding-bottom:15px}.app .roblox-grid>article>button:first-child{height:105px}.app .roblox-grid strong{font-size:15px;line-height:1.3;color:var(--ink);padding:15px 13px 8px}.app .roblox-grid>article>span{font-size:12px;color:var(--muted);line-height:1.7;padding:0 13px;margin-bottom:12px}.app .roblox-grid .text-button{font-size:13px;color:var(--accent);padding:5px 13px}.app .learn-grid{gap:22px}.app .learn-grid summary>span{font-size:11px;color:var(--faint);letter-spacing:1.3px}.app .learn-grid summary h3{font-size:25px;line-height:1.3;color:var(--ink);margin-top:14px}.app .learn-grid summary>b{font-size:25px;color:var(--accent)}.app .learn-grid details>p{font-size:16px;color:var(--muted);line-height:1.8}.app .learn-grid pre{font-size:14px;background:var(--bg2);border:1px solid var(--line);color:var(--accent);padding:18px;border-radius:13px}.app .learn-grid details>.text-button{font-size:14px;color:var(--accent)}.app .learn-sources{font-size:13px;color:var(--accent);gap:25px}.app .catalog-pagination{font-size:14px;color:var(--muted);padding:28px 0;gap:20px}.app .catalog-pagination>.button{font-size:14px}.app .catalog-pagination>.text-button{font-size:13px}.app .wheel-panel{background-image:radial-gradient(#ffffff05 1px,transparent 1px),linear-gradient(130deg,var(--surface),var(--panel));background-size:20px 20px,auto}.app .live-wheel-core>span,.app .side-by-side .live-wheel-core>span{font-size:11px}.app .wheel-live-values,.app .side-by-side .wheel-live-values{font-size:13px}.app .live-wheel-core>small,.app .side-by-side .live-wheel-core>small{font-size:12px}.app .per-color-row label>span,.app .side-by-side .per-color-row label>span{font-size:13px}.app .per-color-row label b,.app .side-by-side .per-color-row label b{font-size:12px}.app .chat-palette{flex-shrink:0}.app .chat-message{flex-wrap:wrap}.app .chat-message p{min-width:150px}.app .chat-message .chat-palette{margin-left:80px}@media(min-width:1700px){.app main{padding-left:42px;padding-right:42px}.app .creative-workspace.side-by-side{grid-template-columns:460px minmax(0,1fr);gap:32px}.app .side-by-side .mock-body{grid-template-columns:1.1fr 1fr;gap:25px}.app .side-by-side .preview-toolbar{flex-direction:row}.app .side-by-side .harmony-filmstrip{grid-template-columns:repeat(6,1fr)}.app .side-by-side .preview-heading{flex-direction:row;align-items:center}.app .side-by-side .harmony-thumbnail>span:last-child{font-size:11px}.app .still-life{height:330px}}@media(max-width:1300px){.app main{padding:24px 25px 0}.app .creative-workspace.side-by-side{grid-template-columns:390px minmax(0,1fr);gap:22px}.app .side-by-side .wheel-layout{padding-left:18px;padding-right:18px}.app .side-by-side .live-wheel-core>strong{font-size:32px}.app .side-by-side .live-wheel-core>span{font-size:10px}.app .side-by-side .wheel-live-values{font-size:11px;gap:6px}.app .side-by-side .live-wheel-core>small{font-size:10px}.app .side-by-side .wheel-controls{gap:13px}.app .vertical-levers{gap:11px}.app .vertical-levers label{font-size:10px}.app .side-by-side .preview-tools .button{font-size:12px;padding:9px 10px}.app .color-toolkit{grid-template-columns:192px minmax(0,1fr);gap:23px}.app .tool-sidebar>div>button{font-size:14px}.app .tool-swatches,.app .roblox-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.app .tool-two-column{grid-template-columns:1fr}.app .tool-actions{flex-direction:row}.app .tool-sidebar{padding-left:10px;padding-right:10px}.app .sv-square{height:290px}.app .creative-lab{grid-template-columns:1fr}.app .lab-intro{display:none}.app .workspace-heading{align-items:start;flex-direction:column;gap:16px}.app .workspace-actions{justify-content:start}.app .side-by-side .scheme-navigation strong{font-size:16px}.app .side-by-side .harmony-filmstrip{padding:15px;gap:9px}.app .side-by-side .harmony-thumbnail>span:last-child{font-size:11px}.app .side-by-side .stencil-nav>div{max-width:50%}.app .side-by-side .role-mapping{grid-template-columns:repeat(2,1fr)}.app .preview-toolbar{padding:16px}.app .mixer-controls{gap:16px}}@media(max-width:1050px){.app{padding-left:94px}.app header{width:94px;padding:25px 7px 18px}.app .brand{font-size:18px}.app .nav{font-size:12px;min-height:72px}.app-topbar{padding:15px 25px;height:88px}.app-topbar h1{font-size:25px}.app .creative-workspace.side-by-side{grid-template-columns:1fr}.app .side-by-side .wheel-side{position:static;max-height:none;overflow:visible;padding:2px}.app .side-by-side .wheel-layout{display:grid;grid-template-columns:1fr 1fr;gap:23px;padding:15px 25px 25px}.app .side-by-side .wheel-controls{grid-column:1;grid-row:1;gap:18px}.app .side-by-side .wheel-color-values{grid-column:1;grid-row:2;align-self:start}.app .side-by-side .harmony-settings{grid-column:2;grid-row:1/3;display:block}.app .side-by-side .wheel-tip{display:flex}.app .side-by-side .wheel{max-width:310px}.app .side-by-side .live-wheel-core>strong{font-size:37px}.app .side-by-side .wheel-live-values{font-size:13px}.app .side-by-side .live-wheel-core>small{font-size:12px}.app .side-by-side .live-wheel-core>span{font-size:11px}.app .side-by-side .palette-strip{height:160px}.app .side-by-side .swatch-bottom>strong{font-size:18px}.app .side-by-side .palette-caption .muted{display:inline;margin-left:8px;font-size:13px}.app .side-by-side .preview-heading{flex-direction:row;align-items:center}.app .side-by-side .preview-toolbar{flex-direction:row;align-items:center;flex-wrap:wrap}.app .side-by-side .preview-tools .button{font-size:14px}.app .side-by-side .harmony-filmstrip{grid-template-columns:repeat(3,1fr);padding:20px;gap:14px}.app .side-by-side .harmony-thumbnail>span:last-child{font-size:13px}.app .side-by-side .mock-body{grid-template-columns:1fr 1fr;gap:25px}.app .per-color-row,.app .side-by-side .per-color-row{grid-template-columns:40px 1fr 1fr 30px;gap:22px}.app .color-row-chip,.app .side-by-side .color-row-chip{height:40px;width:40px;font-size:16px}.app .per-color-heading,.app .side-by-side .per-color-heading{flex-direction:row;align-items:center}.app .per-color-row label>span,.app .side-by-side .per-color-row label>span{font-size:15px}.app .per-color-row label b,.app .side-by-side .per-color-row label b{font-size:14px}.app .color-toolkit{grid-template-columns:180px minmax(0,1fr);gap:20px}.app .tool-sidebar{top:105px}.app .tool-swatches,.app .roblox-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.app .catalog-toolbar>select{min-width:105px}.app .learn-grid{grid-template-columns:1fr}.app .maker-progress{gap:14px;padding:12px 16px}.app .maker-progress>button{font-size:13px;gap:8px}.app .maker-progress>i{width:20px}.app .creative-start-open{font-size:12px}.app .creative-start>summary>div>span{font-size:13px}.app .preview-expanded{padding-left:115px}}@media(max-width:850px){.app .color-toolkit{display:block}.app .tool-sidebar{position:static;display:flex;flex-wrap:wrap;gap:9px;padding:18px;margin-bottom:28px;max-height:none}.app .tool-sidebar-title{width:100%;display:flex;justify-content:space-between;gap:15px;font-size:12px;padding:0 0 8px}.app .tool-sidebar-title>span{margin:0;font-size:12px}.app .tool-sidebar>div:not(.tool-sidebar-title){display:contents}.app .tool-sidebar h3{display:none}.app .tool-sidebar>div>button{display:flex;width:auto;min-height:41px;font-size:14px;gap:8px;padding:8px 12px;background:var(--key);border:1px solid var(--line);border-radius:11px;margin:0}.app .tool-sidebar>div>button>span{font-size:17px;width:auto}.app .tool-sidebar>div>button>small{display:none}.app .tool-sidebar .back-studio{display:none}.app .tool-swatches,.app .roblox-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.app .tool-two-column{grid-template-columns:1fr}.app .tool-swatches.compact{grid-template-columns:repeat(4,minmax(0,1fr))}.app .image-tool-grid{grid-template-columns:1fr}.app .side-by-side .preview-heading{flex-direction:column;align-items:start}.app .preview-heading h2,.app .side-by-side .preview-heading h2{font-size:29px}.app .creative-start>summary{gap:12px}.app .creative-start strong{font-size:16px}.app .creative-start-open{font-size:0;gap:0}.app .creative-start-open>b{font-size:25px}.app .creative-start>summary>div>span{font-size:12px}.app .side-by-side .wheel-layout{grid-template-columns:1fr;gap:25px;padding:14px 25px 25px}.app .side-by-side .wheel-controls,.app .side-by-side .wheel-color-values{grid-column:1;grid-row:auto;max-width:430px;margin:auto}.app .side-by-side .harmony-settings{grid-column:1;grid-row:auto;display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.app .side-by-side .harmony-settings>.field-label,.app .side-by-side .harmony-settings>select,.app .side-by-side .harmony-settings>.restore-harmony,.app .side-by-side .harmony-settings>.adjustment-scope,.app .side-by-side .harmony-settings>.mood-presets,.app .side-by-side .harmony-settings>.helper,.app .side-by-side .harmony-settings>.wheel-tip{grid-column:1/-1}.app .side-by-side .slider-label[for=sat],.app .side-by-side .slider-label[for=light]{grid-row:8}.app .side-by-side #sat,.app .side-by-side #light{grid-row:9}.app .preview-expanded{padding-left:115px}.app .collection-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.app{padding-left:0;padding-bottom:108px}.app header{width:calc(100% - 24px);height:86px;top:auto;bottom:12px;left:12px;padding:7px;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(20px);border:1px solid var(--line-strong);border-radius:24px;box-shadow:0 12px 35px #0005;z-index:28;display:flex;flex-direction:row;gap:0}.app header .brand,.app header .header-right{display:none}.app header nav{height:100%;display:flex;flex-direction:row;gap:5px}.app .nav{flex:1;width:25%;min-height:0;height:100%;padding:9px 4px;gap:5px;font-size:12px;border-radius:17px;line-height:1.1}.app .nav svg{height:22px;width:22px}.app .count{font-size:10px;right:4px;top:2px}.app-topbar{height:83px;padding:14px 18px;gap:12px}.app-topbar h1{font-size:23px}.app-context{font-size:10px;letter-spacing:1.2px;margin-bottom:5px}.app-topbar-actions{gap:8px}.theme-toggle{font-size:13px;padding:6px 10px 6px 6px;gap:6px;min-height:41px}.theme-toggle>span{width:26px;height:26px;font-size:17px}.app .topbar-save{font-size:0;padding:10px;min-height:41px;min-width:41px;box-shadow:none;border-radius:12px;gap:0}.app .topbar-save svg{width:19px;height:19px}.app main{padding:18px 17px 0}.maker-progress{gap:8px;padding:11px 12px;border-radius:18px;margin-bottom:17px;justify-content:space-between}.maker-progress>button{font-size:12px;gap:7px;white-space:normal;line-height:1.25;text-align:left;flex:1}.maker-progress>button>span{height:29px;min-width:29px;width:29px;border-radius:9px;font-size:13px;flex-shrink:0}.maker-progress>i{width:10px;min-width:5px}.creative-start{border-radius:19px;margin-bottom:20px}.creative-start>summary{padding:15px 14px;gap:11px}.creative-start-icon{height:36px;width:36px;font-size:23px;border-radius:11px}.creative-start strong{font-size:16px;line-height:1.35}.creative-start>summary>div>span{font-size:12px;line-height:1.5;margin-top:4px}.app .workspace-heading{margin:22px 0 17px;gap:16px}.app .workspace-heading strong{font-size:19px}.app .workspace-heading span{font-size:14px}.app .workspace-actions{gap:8px;width:100%}.app .workspace-actions .button{font-size:13px;min-height:39px;padding:8px 11px;border-radius:11px}.app .side-by-side .wheel-layout{padding:9px 18px 22px;gap:23px}.app .section-title{padding:20px 19px}.app .section-title h2{font-size:18px}.app .pill{font-size:10px;padding:5px 8px}.app .side-by-side .wheel-controls{max-width:420px;gap:13px}.app .side-by-side .wheel{max-width:300px}.app .vertical-levers{gap:12px}.app .vertical-levers label{font-size:10px}.app .vertical-levers output{font-size:12px}.app .vertical-levers label>span{font-size:11px}.app .vertical-levers input.vertical-range{height:165px!important}.app .wheel-point,.app .side-by-side .wheel-point{width:29px;height:29px;font-size:10px}.app .wheel-point.master-handle,.app .side-by-side .wheel-point.master-handle{width:40px;height:40px;font-size:26px}.app .side-by-side .live-wheel-core>strong{font-size:31px}.app .side-by-side .live-wheel-core>span{font-size:10px}.app .side-by-side .wheel-live-values{font-size:11px;gap:6px}.app .side-by-side .live-wheel-core>small{font-size:10px}.app .wheel-color-values>button,.app .side-by-side .wheel-color-values>button{padding:8px 6px;font-size:11px;gap:6px 4px;border-radius:10px}.app .wheel-color-values strong,.app .side-by-side .wheel-color-values strong{font-size:15px}.app .wheel-color-values small{font-size:10px}.app .side-by-side .harmony-settings{gap:0 15px}.app .field-label{font-size:14px}.app .adjustment-scope>select{font-size:14px}.app .mood-presets button{font-size:14px;min-height:39px}.app .helper,.app .side-by-side .helper,.app .wheel-tip,.app .side-by-side .wheel-tip,.app .pair-legend{font-size:13px}.app .panel-footer,.app .side-by-side .panel-footer{font-size:11px;padding:12px 16px;gap:6px}.app .panel-footer>span:last-child,.app .side-by-side .panel-footer>span:last-child{font-size:10px}.app .side-by-side .palette-strip{height:140px;border-radius:16px}.app .side-by-side .swatch-select{padding:14px 7px}.app .side-by-side .swatch-bottom>strong{font-size:12px;letter-spacing:-.3px}.app .swatch-number,.app .side-by-side .swatch-number{font-size:11px}.app .lock,.app .side-by-side .lock{right:4px;top:7px;font-size:19px}.app .palette-caption,.app .side-by-side .palette-caption{font-size:13px;gap:10px}.app .side-by-side .palette-caption .muted{display:block;margin:4px 0 0;font-size:12px;line-height:1.5}.app .palette-caption .text-button,.app .side-by-side .palette-caption .text-button{font-size:12px}.app .per-color-controls,.app .side-by-side .per-color-controls{padding:17px;border-radius:20px;margin-top:22px}.app .per-color-heading,.app .side-by-side .per-color-heading{flex-direction:column;align-items:start;gap:7px}.app .per-color-heading strong{font-size:18px}.app .per-color-heading span{font-size:13px}.app .per-color-row,.app .side-by-side .per-color-row{grid-template-columns:29px 1fr 1fr 18px;gap:12px;padding:20px 0}.app .color-row-chip,.app .side-by-side .color-row-chip{height:29px;width:29px;font-size:13px}.app .per-color-row label>span,.app .side-by-side .per-color-row label>span{font-size:12px;gap:4px;min-height:30px;align-items:start;flex-wrap:wrap}.app .per-color-row label b,.app .side-by-side .per-color-row label b{font-size:12px}.app .color-row-lock{font-size:22px}.app .compact-inspector,.app .side-by-side .compact-inspector{flex-wrap:wrap;font-size:12px;gap:8px;padding:13px}.app .compact-inspector>span:first-child{font-size:11px}.app .compact-inspector>span:last-child{font-size:12px}.app .compact-inspector input{font-size:15px;width:100px;min-height:39px!important}.app .side-by-side .preview-heading{flex-direction:column;align-items:start}.app .preview-heading h2,.app .side-by-side .preview-heading h2{font-size:28px}.app .segmented{width:100%;gap:2px;padding:4px}.app .segmented button{font-size:13px;flex:1;padding:8px 7px;white-space:nowrap;min-height:40px}.app .side-by-side .preview-toolbar{flex-direction:column;align-items:stretch;gap:18px;padding:18px 15px}.app .scheme-navigation{gap:12px}.app .scheme-navigation>div{min-width:0!important}.app .scheme-navigation strong,.app .side-by-side .scheme-navigation strong{font-size:17px;line-height:1.3}.app .scheme-navigation>div>span{font-size:11px}.app .side-by-side .preview-tools{gap:8px;flex-wrap:wrap;justify-content:space-between}.app .side-by-side .preview-tools .button{font-size:12px;flex:1;padding:9px 8px;gap:5px;min-height:42px}.app .harmony-filmstrip,.app .side-by-side .harmony-filmstrip,.app .side-by-side .preview-expanded .harmony-filmstrip{grid-template-columns:repeat(3,minmax(0,1fr));padding:15px;gap:9px}.app .harmony-thumbnail{padding:5px;border-radius:11px}.app .thumbnail-colors{height:40px;border-radius:7px}.app .harmony-thumbnail>span:last-child,.app .side-by-side .harmony-thumbnail>span:last-child{font-size:11px;line-height:1.3;margin:8px 2px 4px;min-height:29px;overflow-wrap:anywhere}.app .preview-canvas,.app .side-by-side .preview-canvas{padding:13px}.app .side-by-side .mock-body,.app .side-by-side .preview-expanded .mock-body{grid-template-columns:1fr;gap:10px}.app .mock-site{padding:22px 21px 0;border-radius:15px}.app .mock-nav{font-size:11px;gap:12px}.app .mock-nav>strong{font-size:24px}.app .mock-kicker,.app .side-by-side .mock-kicker{font-size:10px;line-height:1.6}.app .mock-body h3,.app .side-by-side .mock-body h3{font-size:32px;margin:18px 0}.app .mock-body p,.app .side-by-side .mock-body p{font-size:14px}.app .mock-body button,.app .side-by-side .mock-body button{font-size:13px}.app .still-life{height:245px}.app .preview-bottom{font-size:12px;line-height:1.6;gap:14px}.app .preview-bottom>span{max-width:170px}.app .preview-bottom .text-button{font-size:12px;max-width:150px;text-align:left}.app .poster{padding:25px 21px;border-radius:15px}.app .poster>div:first-child{font-size:10px;gap:12px}.app .poster h3,.app .side-by-side .poster h3{font-size:50px;letter-spacing:-2.5px}.app .poster>p{font-size:13px}.app .ui-preview{grid-template-columns:1fr;gap:17px}.app .ui-preview article{padding:25px}.app .ui-preview h3{font-size:33px}.app .ui-preview p{font-size:15px}.app .preview-expanded{padding:23px 17px 120px;z-index:25}.app .preview-expanded .preview-toolbar,.app .side-by-side .preview-expanded .preview-toolbar{flex-direction:column}.app .stencil-mapping{gap:15px}.app .stencil-mapping strong{font-size:16px;white-space:normal}.app .stencil-mapping span{font-size:12px}.app .stencil-mapping .button{font-size:13px}.app .role-mapping,.app .side-by-side .role-mapping{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.app .role-mapping label{font-size:13px}.app .role-mapping select{font-size:12px;height:41px;min-width:0}.app .stencil-page{padding:21px;border-radius:15px}.app .stencil-nav{gap:13px;align-items:start}.app .stencil-nav strong{font-size:16px;max-width:50%}.app .stencil-nav>div{max-width:50%;gap:7px}.app .stencil-nav span{font-size:10px}.app .stencil-hero h3{font-size:30px}.app .stencil-eyebrow{font-size:9px}.app .stencil-hero p{font-size:14px}.app .stencil-actions span{font-size:12px}.app .stencil-sections,.app .preview-expanded .stencil-sections{grid-template-columns:1fr}.app .stencil-sections h4{font-size:23px}.app .stencil-sections p,.app .stencil-sections li{font-size:14px}.app .stencil-footer{font-size:11px;flex-direction:column;gap:12px}.app .stencil-footer>span{font-size:10px}.app .stencil-note{font-size:12px}.app .lab-body{padding:0 17px 21px}.app .lab-tabs{gap:17px;justify-content:space-between}.app .lab-tabs button{font-size:14px;padding:17px 0}.app .lab-tabs button>span{display:none}.app .chat-messages{height:195px}.app .chat-message{gap:10px}.app .chat-message>span{width:58px;font-size:10px}.app .chat-message p{font-size:15px;min-width:140px}.app .chat-message .chat-palette{margin-left:68px}.app .brief-form,.app .url-form{flex-direction:column;gap:11px}.app .brief-form .button,.app .url-form .button{font-size:15px;min-height:45px}.app .brief-form input,.app .url-form input{font-size:16px;min-height:48px}.app .brief-suggestions{gap:7px}.app .brief-suggestions button{font-size:12px;padding:7px 10px}.app .lab-disclosure{font-size:12px}.app .url-tool h3{font-size:24px}.app .url-tool>p{font-size:15px}.app .upload-option{font-size:12px;gap:9px;flex-wrap:wrap}.app .url-tool>p.lab-disclosure{font-size:12px}.app .import-result strong{font-size:17px}.app .import-result p{font-size:14px}.app .import-result>span{font-size:12px}.app .collection-grid{grid-template-columns:1fr;gap:22px}.app .collection-card h3{font-size:21px}.app .collection-card p{font-size:15px}.app .mini-palette{height:180px}.app .empty h2{font-size:28px}.app .empty p{font-size:16px;line-height:1.7;text-align:center}.app footer{font-size:12px;margin-top:28px;gap:18px;align-items:start}.app footer>span:last-child{display:none}.app .footer-brand{font-size:23px}.app footer>span:nth-child(2){max-width:200px;text-align:right}.app .toast{bottom:113px;font-size:14px;min-width:200px;padding:15px 19px;max-width:calc(100vw - 30px);border-radius:16px}.app .export-modal{padding:24px 20px;border-radius:24px;max-height:calc(100dvh - 50px);overflow:auto}.app .export-modal h2{font-size:27px}.app .export-modal>p{font-size:16px}.app .export-modal pre{font-size:14px}.app .export-options{gap:9px}.app .export-options>.button{font-size:14px;padding:10px}.app .color-toolkit .tool-sidebar{padding:17px;gap:8px;border-radius:20px}.app .tool-sidebar-title{font-size:11px;gap:10px;flex-wrap:wrap}.app .tool-sidebar-title>span{font-size:12px}.app .tool-sidebar>div>button{font-size:13px;padding:9px 10px;gap:7px;min-height:41px;border-radius:12px}.app .tool-sidebar>div>button>span{font-size:16px}.app .tool-heading h2{font-size:29px}.app .tool-heading p{font-size:16px}.app .tool-heading .eyebrow{font-size:11px}.app .tool-card{padding:21px;border-radius:21px}.app .tool-swatches,.app .roblox-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.app .tool-swatch-color{height:103px}.app .tool-swatch-color>span{font-size:12px;opacity:.75;padding:7px 12px}.app .tool-swatches article>strong{font-size:14px;line-height:1.4;padding:13px 12px 8px}.app .swatch-code{font-size:12px;padding:0 12px;gap:7px}.app .tool-swatches.compact{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.app .compact .tool-swatch-color{height:72px}.app .compact article>strong{font-size:12px;padding:10px 8px 6px}.app .compact .swatch-code{font-size:10px;padding:0 8px}.app .sv-square{height:240px}.app .tool-field{font-size:15px}.app .tool-field>div{flex-wrap:nowrap;gap:5px}.app .tool-field input[type=color]{width:38px;min-width:38px;height:36px}.app .tool-field>div>input:not([type=color]){font-size:16px;text-align:left;padding:5px 7px;min-height:36px}.app .tool-slider-label{font-size:15px}.app .tool-slider-label>span{font-size:14px}.app .numeric-editor{gap:12px;flex-wrap:wrap}.app .numeric-editor>select{width:100%}.app .numeric-editor>div{width:100%;flex-basis:100%;gap:10px}.app .numeric-editor label{font-size:13px}.app .numeric-editor input{font-size:16px;padding:10px 7px}.app .parse-color-form>label{font-size:15px}.app .parse-color-form>div{flex-direction:column}.app .parse-color-form input{min-height:47px;font-size:16px}.app .parse-color-form .button{font-size:15px;min-height:44px}.app .format-list>button{gap:10px;padding:15px 0}.app .format-list>button>span:first-child{font-size:12px;width:49px}.app .format-list code{font-size:13px}.app .nearest-name{font-size:14px}.app .tool-actions{flex-direction:column}.app .tool-actions .button{font-size:15px;min-height:45px}.app .tool-note{font-size:13px;line-height:1.8}.app .catalog-toolbar>input{font-size:16px;width:100%;min-width:0}.app .catalog-toolbar>select{font-size:14px;min-width:0;max-width:100%;height:43px;flex:1}.app .catalog-toolbar>.button{font-size:13px;min-height:41px;flex:1;padding:9px 11px;white-space:nowrap}.app .family-filter{gap:7px;margin:21px 0}.app .family-filter button{font-size:13px;padding:6px 11px;min-height:34px}.app .catalog-count{font-size:14px;margin:21px 0 17px}.app .catalog-count>span:last-child{display:none}.app .catalog-pagination{font-size:14px;gap:13px;flex-wrap:wrap}.app .catalog-pagination>span{width:100%;text-align:center}.app .catalog-pagination>.button{font-size:14px}.app .catalog-pagination>.text-button{font-size:13px}.app .color-table th{font-size:13px;padding:14px}.app .color-table td{font-size:14px;padding:14px}.app .color-table td>button{font-size:13px}.app .tool-section-title{align-items:start;gap:15px}.app .tool-section-title h3{font-size:19px;margin:0}.app .tool-section-title>.text-button{font-size:13px;max-width:145px}.app .tool-section-title>div{flex-direction:column;gap:10px}.app .tool-section-title .button{font-size:12px;min-height:41px;padding:9px 10px}.app .mixer-controls{grid-template-columns:1fr 30px 1fr;gap:15px}.app .mixer-controls .round-button{height:30px;width:30px;min-width:30px;font-size:19px}.app .mixer-controls .tool-field>div{flex-direction:column}.app .mixer-controls .tool-field input[type=color]{width:100%;height:33px}.app .mixer-controls .tool-field>div>input:not([type=color]){font-size:14px;width:100%;text-align:center;padding:3px}.app .mix-preview{height:220px}.app .mix-preview>strong{font-size:43px}.app .contrast-controls{gap:14px;justify-content:center}.app .contrast-controls>.tool-field{min-width:100px}.app .contrast-controls>.round-button{width:32px;height:32px;min-width:32px;font-size:20px}.app .contrast-controls .tool-field>div{flex-direction:column}.app .contrast-controls .tool-field input[type=color]{width:100%;height:33px}.app .contrast-controls .tool-field>div>input:not([type=color]){font-size:14px;text-align:center;padding:3px}.app .contrast-controls>.button{font-size:14px;min-height:44px;width:100%}.app .contrast-preview{padding:27px 23px;border-radius:21px}.app .contrast-preview>span{font-size:11px;line-height:1.6}.app .contrast-preview h3{font-size:32px}.app .contrast-preview p{font-size:16px}.app .contrast-preview>button{font-size:14px}.app .contrast-report{grid-template-columns:repeat(2,minmax(0,1fr));border-radius:18px}.app .contrast-report>div{padding:22px 12px}.app .contrast-report>div>span{font-size:13px}.app .contrast-report>div>small{font-size:12px}.app .contrast-report strong{font-size:37px}.app .contrast-report b{font-size:17px}.app .image-upload{padding:30px 20px;border-radius:22px}.app .image-upload h3{font-size:26px}.app .image-upload p{font-size:14px}.app .image-info{font-size:13px;align-items:start;gap:15px}.app .image-info>span{overflow-wrap:anywhere;min-width:0}.app .image-info>label{font-size:13px;gap:8px;white-space:normal;flex-shrink:0}.app .image-info select{font-size:14px;width:60px;height:41px}.app .sample-canvas-wrap{padding:15px;border-radius:20px}.app .sample-canvas-wrap p{font-size:14px}.app .sample-preview{height:100px}.app .game-composer{grid-template-columns:1fr 1fr;gap:16px}.app .game-composer>.tool-field:first-child{grid-column:1/-1}.app .game-preview{font-size:21px;padding:25px}.app .game-output{flex-direction:column;align-items:start;gap:17px}.app .game-output>code{font-size:16px}.app .game-output .button{font-size:14px}.app .roblox-grid strong{font-size:14px;line-height:1.4;padding:13px 12px 8px}.app .roblox-grid>article>span{font-size:12px;line-height:1.6;padding:0 12px}.app .roblox-grid .text-button{font-size:13px;padding:5px 12px}.app .learn-grid{grid-template-columns:1fr;gap:20px}.app .learn-grid summary>span{font-size:11px}.app .learn-grid summary h3{font-size:24px}.app .learn-grid details>p{font-size:16px}.app .learn-grid pre{font-size:13px;padding:16px}.app .learn-grid details>.text-button{font-size:14px}.app .learn-sources{font-size:13px;flex-direction:column;gap:15px}.app .catalog-source{font-size:13px;gap:17px}}@media(max-width:370px){.app main{padding-left:12px;padding-right:12px}.app-topbar{padding-left:14px;padding-right:14px}.app-topbar h1{font-size:21px}.app .theme-toggle{font-size:0;padding:5px;gap:0;min-width:39px}.app .theme-toggle>span{width:27px;height:27px}.app .maker-progress>button{font-size:11px;gap:5px}.app .maker-progress>button>span{width:26px;height:26px;min-width:26px;font-size:12px}.app .maker-progress{gap:6px;padding:10px}.app .maker-progress>i{display:none}.app .side-by-side .wheel-layout{padding-left:15px;padding-right:15px}.app .side-by-side .live-wheel-core>strong{font-size:27px}.app .side-by-side .live-wheel-core>span{font-size:9px}.app .side-by-side .wheel-live-values{font-size:10px;gap:4px}.app .side-by-side .live-wheel-core>small{font-size:9px}.app .vertical-levers{gap:9px}.app .vertical-levers input.vertical-range{height:145px!important}.app .side-by-side .swatch-bottom>strong{font-size:11px}.app .compact-inspector>span:last-child{margin-left:0}.app .side-by-side .preview-tools .button{font-size:11px;padding:8px 7px}.app .segmented button{font-size:12px}.app .tool-sidebar>div>button{font-size:12px;padding:8px 9px}.app .tool-swatches article>strong{font-size:13px}.app .swatch-code{font-size:11px}}@media(prefers-reduced-motion:reduce){.app button{transition:none}}.maker-progress .step-label{font-weight:600;font-size:inherit;text-align:left}@media(max-width:700px){.maker-progress .step-label{display:none}.maker-progress>button:after{content:attr(data-short);font-size:13px}.app .maker-progress{padding:11px 12px;gap:10px;min-height:66px}.app .maker-progress>button{justify-content:start;gap:8px;flex:initial}.app .maker-progress>i{width:10px}.app .maker-progress>button>span{height:29px;width:29px;min-width:29px}.app .creative-start>summary>div>span{font-size:12px}.app .creative-start strong{font-size:16px}}.app .creative-workspace .wheel-side,.app .creative-workspace.side-by-side .wheel-side{position:static;top:auto;max-height:none;height:auto;overflow:visible;overscroll-behavior:auto;scrollbar-width:auto}.app .wheel-extra-controls{grid-column:1/-1;width:100%;margin-top:15px;border-top:1px solid var(--line);padding-top:14px;min-width:0}.app .wheel-extra-controls>summary{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;list-style:none;cursor:pointer;font-size:15px;font-weight:550;color:var(--ink);padding:7px 26px 7px 0;position:relative;line-height:1.5}.app .wheel-extra-controls>summary::-webkit-details-marker,.app details.per-color-controls>summary::-webkit-details-marker{display:none}.app .wheel-extra-controls>summary>span{font-size:12px;font-weight:400;color:var(--muted);display:block;flex-basis:100%}.app .wheel-extra-controls>summary:after,.app details.per-color-controls>summary:after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:24px;font-weight:400;color:var(--accent)}.app .wheel-extra-controls[open]>summary:after,.app details.per-color-controls[open]>summary:after{content:"\2212"}.app .wheel-extra-content{padding-top:8px;display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.app .wheel-extra-content :is(.adjustment-scope,.mood-presets,.helper,.wheel-tip){grid-column:1/-1}.app .wheel-extra-content .slider-label[for=sat],.app .side-by-side .wheel-extra-content .slider-label[for=sat]{grid-column:1;grid-row:4}.app .wheel-extra-content .slider-label[for=light],.app .side-by-side .wheel-extra-content .slider-label[for=light]{grid-column:2;grid-row:4}.app .wheel-extra-content #sat,.app .side-by-side .wheel-extra-content #sat{grid-column:1;grid-row:5}.app .wheel-extra-content #light,.app .side-by-side .wheel-extra-content #light{grid-column:2;grid-row:5}.app details.per-color-controls>summary{position:relative;list-style:none;cursor:pointer;display:flex;flex-direction:column;align-items:start;gap:6px;padding:2px 28px 2px 0;margin:0;line-height:1.5}.app details.per-color-controls[open]>summary{margin-bottom:15px}.app :is(.wheel-extra-controls,details.per-color-controls)>summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px;border-radius:8px}.app .scheme-navigation,.app .side-by-side .scheme-navigation{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;grid-template-rows:108px;gap:16px;align-items:center;width:100%;height:108px;min-height:108px;flex:1;min-width:0}.app .scheme-navigation>.round-button{width:44px;height:44px;min-width:44px;padding:0;justify-self:center;align-self:center;transform:none}.app .scheme-navigation>.round-button:first-child{grid-column:1;grid-row:1}.app .scheme-navigation>.round-button:last-child{grid-column:3;grid-row:1}.app .scheme-navigation>div,.app .side-by-side .scheme-navigation>div{grid-column:2;grid-row:1;width:100%;min-width:0!important;min-height:90px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;text-align:center}.app .scheme-navigation strong,.app .side-by-side .scheme-navigation strong{width:100%;max-width:100%;font-size:17px;line-height:1.3;white-space:normal;overflow-wrap:anywhere;text-align:center}@media(max-width:700px){.app .scheme-navigation,.app .side-by-side .scheme-navigation{gap:12px}.app .scheme-navigation strong,.app .side-by-side .scheme-navigation strong{font-size:16px}.app .wheel-extra-controls>summary{font-size:15px}.app .wheel-extra-controls>summary>span{font-size:12px}}.app .creative-workspace,.app .creative-workspace .wheel-side{min-width:0;width:100%}.app .creative-workspace .preview-section:not(.preview-expanded){min-width:0;width:100%}.app .wheel-side :is(.studio,.wheel-panel,.harmony-settings,.wheel-extra-controls,.compact-inspector){min-width:0;max-width:100%}.app .wheel-side .palette-caption>span{min-width:0;overflow-wrap:anywhere}.app .scheme-navigation>.round-button:active:not(:disabled){transform:none}@media(max-width:1050px){.app .creative-workspace.side-by-side{grid-template-columns:minmax(0,1fr)}}@media(max-width:700px){.app .wheel-side .palette-caption{min-height:88px;align-items:start}}.app .wheel{isolation:isolate;position:relative;overflow:visible;touch-action:none;cursor:grab}.app .wheel:before{display:none}.app .wheel-lines{z-index:1;overflow:visible;pointer-events:none}.app .wheel-point,.app .side-by-side .wheel-point{width:25px;height:25px;border:2px solid white;border-radius:50%;font-size:11px;font-weight:650;padding:0;display:grid;place-items:center;box-shadow:0 1px 5px #0007;outline:1px solid #1115;outline-offset:0;text-shadow:none;transform:translate(-50%,-50%);touch-action:none;cursor:grab}.app .wheel-point.master-handle,.app .side-by-side .wheel-point.master-handle{width:32px;height:32px;border:3px solid white;font-size:13px;box-shadow:0 0 0 2px #171322aa,0 2px 8px #0005}.app .wheel-point.selected,.app .wheel-point:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.app .wheel-point.linked-highlight{box-shadow:0 0 0 3px #fff4,0 2px 9px #0006}.app .wheel-point .base-stop-mark{position:absolute;bottom:-7px;left:50%;transform:translate(-50%) rotate(45deg);height:7px;width:7px;border:1px solid var(--accent-ink);background:var(--accent);border-radius:1px;pointer-events:none}.app .wheel-point>span{pointer-events:none;line-height:1}.app .wheel-point[aria-disabled=true]{cursor:not-allowed}.app .wheel.is-dragging .wheel-point{cursor:grabbing}.app .wheel-layout>.wheel-selected-readout{order:2;grid-column:1/-1}.app .wheel-layout>.wheel-gesture-help{order:3;grid-column:1/-1}.app .wheel-layout>.wheel-color-values{order:4}.app .wheel-layout>.harmony-settings{order:5}.app .wheel-selected-readout,.app .side-by-side .wheel-selected-readout{position:static;inset:auto;width:100%;border-radius:14px;background:var(--key);border:1px solid var(--line);box-shadow:none;display:grid;grid-template-columns:auto auto 1fr;grid-template-rows:auto auto;align-items:center;justify-content:normal;gap:4px 15px;padding:14px 16px;pointer-events:auto;text-align:left;min-width:0}.app .wheel-selected-readout>span,.app .side-by-side .wheel-selected-readout>span{font-size:11px;letter-spacing:.8px;grid-column:1;grid-row:1;color:var(--muted)}.app .wheel-selected-readout>strong,.app .side-by-side .wheel-selected-readout>strong{font-size:28px;line-height:1.2;letter-spacing:-.8px;grid-column:2;grid-row:1/3;margin:0;color:var(--ink)}.app .wheel-selected-readout>strong>sup{font-size:17px}.app .wheel-selected-readout>small,.app .side-by-side .wheel-selected-readout>small{font-size:12px;grid-column:1;grid-row:2;color:var(--accent);margin:0;max-width:none;letter-spacing:0}.app .wheel-selected-readout>.wheel-live-values,.app .side-by-side .wheel-selected-readout>.wheel-live-values{grid-column:3;grid-row:1;font-size:13px;gap:12px;justify-content:end}.app .wheel-selected-readout>.wheel-value-meters{grid-column:3;grid-row:2;width:100%;max-width:135px;justify-self:end;margin:0}.app .wheel-gesture-help{font-size:13px;line-height:1.7;color:var(--muted);margin:0;width:100%;min-width:0}.app .wheel-gesture-help>strong{display:block;color:var(--ink);font-size:14px;font-weight:550;margin-bottom:4px}.app .wheel-gesture-help>span{display:block;color:var(--accent);margin-top:6px;font-size:12px}.app .wheel-side .wheel-color-values>button.current{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 1px #aebcff35}@media(min-width:1051px){.app .creative-workspace:not(.side-by-side) .wheel-selected-readout{grid-column:1;grid-row:2}.app .creative-workspace:not(.side-by-side) .wheel-gesture-help{grid-column:1;grid-row:3}.app .creative-workspace:not(.side-by-side) .wheel-color-values{grid-column:1;grid-row:4}.app .creative-workspace:not(.side-by-side) .harmony-settings{grid-column:2;grid-row:1/5}}@media(min-width:851px)and (max-width:1050px){.app .side-by-side .wheel-selected-readout{grid-column:1;grid-row:2}.app .side-by-side .wheel-gesture-help{grid-column:1;grid-row:3}.app .side-by-side .wheel-color-values{grid-column:1;grid-row:4}.app .side-by-side .harmony-settings{grid-column:2;grid-row:1/5}}@media(max-width:850px){.app .side-by-side .wheel-selected-readout,.app .side-by-side .wheel-gesture-help,.app .side-by-side .wheel-color-values,.app .side-by-side .harmony-settings{grid-column:1;grid-row:auto}}@media(max-width:700px){.app .wheel-point,.app .side-by-side .wheel-point{width:25px;height:25px;font-size:11px}.app .wheel-point.master-handle,.app .side-by-side .wheel-point.master-handle{width:31px;height:31px;font-size:13px}.app .wheel-selected-readout,.app .side-by-side .wheel-selected-readout{padding:13px;gap:4px 12px;grid-template-columns:auto auto 1fr}.app .wheel-selected-readout>strong,.app .side-by-side .wheel-selected-readout>strong{font-size:26px}.app .wheel-selected-readout>.wheel-live-values,.app .side-by-side .wheel-selected-readout>.wheel-live-values{font-size:12px;gap:8px}.app .wheel-gesture-help{font-size:13px}.app .wheel-gesture-help>strong{font-size:14px}}@media(max-width:370px){.app .wheel-selected-readout,.app .side-by-side .wheel-selected-readout{gap:5px 10px}.app .wheel-selected-readout>.wheel-live-values,.app .side-by-side .wheel-selected-readout>.wheel-live-values{font-size:11px;gap:5px}.app .wheel-selected-readout>small,.app .side-by-side .wheel-selected-readout>small{font-size:11px}.app .wheel-selected-readout>strong,.app .side-by-side .wheel-selected-readout>strong{font-size:24px}}.app .harmony-description{font-size:14px;line-height:1.6;color:var(--muted);margin:12px 0 0;overflow-wrap:anywhere}.app .harmony-browser{min-width:0;border-top:1px solid var(--line)}.app .harmony-browser>summary{cursor:pointer;padding:20px 24px;font-size:15px;font-weight:600;display:flex;align-items:center;gap:12px;list-style:none}.app .harmony-browser>summary::-webkit-details-marker{display:none}.app .harmony-browser>summary:after{content:"+";margin-left:auto;font-size:22px}.app .harmony-browser[open]>summary:after{content:"\2212"}.app .harmony-browser>summary>span{font-size:13px;color:var(--muted);font-weight:400}.app .harmony-browser .harmony-filmstrip{border-top:0;padding-top:0}.app .harmony-thumbnail>span:last-child{line-height:1.5;white-space:normal;overflow-wrap:anywhere}@media(max-width:600px){.app .harmony-browser>summary{padding:17px 16px}.app .harmony-browser>summary>span{display:none}}.app .idea-page[hidden]{display:none}.app .idea-page{max-width:1200px;margin:0 auto}.app .idea-next{margin-top:24px;padding:24px;border:1px solid var(--line);border-radius:22px;background:var(--card);display:flex;align-items:center;justify-content:space-between;gap:24px}.app .idea-next>div{display:grid;gap:8px}.app .idea-next strong{font-size:17px}.app .idea-next span{font-size:15px;line-height:1.6;color:var(--muted)}@media(max-width:700px){.app header nav .nav{width:20%;min-width:0;font-size:11px;padding:9px 2px}.app .idea-next{padding:20px;align-items:stretch;flex-direction:column}.app .idea-next .button{justify-content:center}}.app .palette-open{border:0;padding:0;width:100%;cursor:pointer;background:transparent;overflow:hidden}.app .palette-open:focus-visible,.app .tool-palette-open:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.app .palette-open:hover{box-shadow:0 0 0 2px var(--accent)}.app .palette-open-hint{display:block;margin-top:9px;font-size:13px;color:var(--accent)}.app .tool-palette-open{display:block;width:100%;padding:0;margin:0 0 24px;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:var(--key);color:var(--ink);cursor:pointer;text-align:left}.app .tool-palette-open>span{display:flex;height:76px}.app .tool-palette-open i{flex:1}.app .tool-palette-open>strong{display:block;font-size:14px;padding:14px 18px}.app .wheel-panel{overflow:visible}.app .wheel-live-palette{position:sticky;top:106px;z-index:11;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;margin:0 22px 14px;padding:6px;border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:var(--small-shadow)}.app .wheel-live-palette button{min-width:0;min-height:66px;padding:8px 2px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;border:2px solid transparent;border-radius:9px;cursor:pointer}.app .wheel-live-palette button[aria-pressed=true]{border-color:currentColor}.app .wheel-live-palette button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.app .wheel-live-palette span{font-size:12px}.app .wheel-live-palette strong{font-size:12px;line-height:1.5;font-family:ui-monospace,monospace}@media(max-width:1050px){.app .wheel-live-palette{top:100px}}@media(max-width:700px){.app .wheel-live-palette{top:95px;margin:0 18px 12px}}@media(max-width:360px){.app .wheel-live-palette{margin-left:12px;margin-right:12px;gap:2px;padding:4px}.app .wheel-live-palette strong{font-size:11px}}@media(max-width:700px){.app{padding-bottom:166px}.app header{height:144px}.app header nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4px;width:100%}.app header nav .nav{width:100%;height:100%;padding:5px 2px;font-size:12px;gap:4px;border-radius:14px}.app header nav .nav svg{height:20px;width:20px}}.app .wheel-live-palette button[data-primary=true]>span{font-size:10px;font-weight:800;letter-spacing:.25px;background:color-mix(in srgb,currentColor 12%,transparent);border:1px solid currentColor;border-radius:4px;padding:1px 3px;white-space:nowrap}@media(max-width:360px){.app .wheel-live-palette button[data-primary=true]>span{font-size:9px;padding:1px;letter-spacing:0}}.app .coffee-support{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--line-strong);border-radius:99px;padding:12px 17px;background:var(--accent-soft);color:var(--ink);text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap;transition:transform .16s,border-color .16s}.app .coffee-support:hover{transform:translateY(-2px);border-color:var(--accent)}.app .coffee-support:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.app header nav{gap:6px}.app header nav .nav{min-height:65px;padding-top:9px;padding-bottom:9px}@media(min-width:701px)and (max-height:740px){.app header nav .nav{min-height:54px;padding-top:6px;padding-bottom:6px;gap:4px}.app header nav .nav svg{height:20px;width:20px}}@media(max-width:700px){.app header nav{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.app header nav .nav{min-height:0;padding:5px 1px;font-size:11px}.app footer .coffee-support{font-size:14px;padding:12px 17px;margin-top:7px}}.app footer{flex-wrap:wrap}.app footer .coffee-support{max-width:100%;box-sizing:border-box}@media(max-width:700px){.app footer{display:flex;flex-direction:column;align-items:flex-start;gap:14px}.app footer>span{max-width:100%}.app footer .coffee-support{margin-top:3px}}.app .color-toolkit.learn-workspace{grid-template-columns:minmax(0,1fr)}.app .color-toolkit.learn-workspace>.tool-content{grid-column:1/-1;width:100%;min-width:0}.app .color-toolkit.learn-workspace>.tool-sidebar{display:none}.app .palette-strip,.app .side-by-side .palette-strip{display:grid;height:auto;overflow:visible;gap:4px;padding:4px;background:var(--surface)}.app .palette-strip .swatch{min-width:0;min-height:172px;position:relative;overflow:hidden;border-radius:12px}.app .palette-strip .swatch-select{width:100%;height:136px;min-height:136px;text-align:left}.app .palette-strip .swatch-bottom{bottom:18px}.app .palette-strip .swatch-bottom strong{font-size:17px}.app .swatch-manage{position:absolute;bottom:5px;left:4px;right:4px;display:flex;gap:2px;align-items:center;justify-content:space-between}.app .swatch-manage button{height:28px;min-width:25px;flex:1;max-width:42px;padding:0 2px;background:color-mix(in srgb,currentColor 9%,transparent);border:1px solid currentColor;border-radius:6px;color:inherit;font-size:13px;cursor:pointer}.app .swatch-manage button:disabled{opacity:.35;cursor:default}.app .swatch-manage button[aria-pressed=true]{background:color-mix(in srgb,currentColor 22%,transparent)}.app .palette-size-actions{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:15px 0}.app .palette-size-actions>span{font-size:14px;color:var(--muted)}.app .wheel-live-palette:has(button:nth-child(6)) button{min-height:49px;gap:5px;padding:5px 2px}.app .wheel-color-values{width:100%;max-width:none!important}.app .wheel-point{touch-action:none}@media(max-width:700px){.app .palette-strip,.app .side-by-side .palette-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}.app .palette-strip .swatch{min-height:160px}.app .palette-strip .swatch-bottom strong{font-size:17px}.app .palette-strip .swatch-select{height:125px;min-height:125px}.app .swatch-manage button{height:29px}}.app .live-palette-slot{position:relative;min-width:0;display:flex;overflow:visible}.app .wheel-live-palette .live-palette-slot>button:first-child{width:100%;min-height:60px;display:flex;flex-direction:column;justify-content:space-between;border:0;border-radius:9px;padding:8px 5px;cursor:pointer;font-size:12px}.app .wheel-live-palette .live-palette-slot>button:first-child strong{font-size:11px;letter-spacing:.3px}.app .wheel-live-palette .live-palette-slot>button:first-child span{font-size:10px;font-weight:750}.app .palette-insert-plus{position:absolute;z-index:8;right:-16px;top:50%;transform:translateY(-50%);width:32px;height:32px;min-height:32px;border:2px solid var(--surface);background:var(--ink);color:var(--bg);border-radius:50%;font-size:24px;font-weight:600;line-height:1;display:grid;place-items:center;padding:0;cursor:pointer;opacity:0;box-shadow:0 3px 12px #0007;transition:opacity .15s,scale .15s;scale:.8}.app .palette-insert-plus:hover,.app .palette-insert-plus:focus-visible{opacity:1;scale:1}.app .palette-insert-plus:disabled{display:none}.app .palette-strip,.app .swatch,.app .wheel-live-palette{overflow:visible}.app .swatch .palette-insert-plus{right:-17px}.app .wheel-live-palette .palette-insert-plus{right:-11px;width:26px;height:26px;min-height:26px;font-size:21px}.app .wheel-live-palette:has(.live-palette-slot:nth-child(6)){gap:6px}.app .wheel-live-palette .live-palette-slot:last-child>.palette-insert-plus{right:-9px}@media(hover:none){.app .palette-insert-plus{opacity:1;scale:1}}@media(prefers-reduced-motion:reduce){.app .palette-insert-plus{transition:none}}.app .header-right{flex-direction:column;align-items:center;gap:12px}.app .sidebar-coffee{display:flex;flex-direction:column;align-items:center;gap:6px;width:94px;border:1px solid #E8C99266;border-radius:15px;padding:11px 5px;color:var(--ink);background:linear-gradient(135deg,#f3cfa01a,#eaa8c415);text-decoration:none;font-size:11px;line-height:1.3;text-align:center;font-weight:650}.sidebar-coffee svg{color:#ebc995}.app .mobile-coffee{display:none}@media(min-width:701px)and (max-height:800px){.app header{gap:12px;padding-top:12px;padding-bottom:12px}.app header .brand{padding:7px;min-height:92px}.app header .colibria-symbol{height:35px;width:35px}.app header nav{gap:4px}.app header nav .nav{min-height:46px;padding:5px 3px;gap:3px}.app header nav .nav svg{height:20px;width:20px}.app .header-right .avatar{display:none}.app .sidebar-coffee{padding:8px 4px;font-size:10px}}@media(max-width:700px){.app .mobile-coffee{display:flex;position:fixed;right:17px;bottom:170px;align-items:center;gap:8px;z-index:25;background:#f4d4a9;color:#38283b;border:1px solid #FFF0D8;border-radius:99px;box-shadow:0 5px 18px #10091f33;padding:11px 15px;text-decoration:none;font-size:12px;font-weight:700}.app .mobile-coffee svg{width:19px;height:19px}}@media(max-width:380px){.app .mobile-coffee{bottom:230px;font-size:11px;padding:10px 13px}}.app .footer-brand{text-decoration:none;color:inherit}.app .sidebar-coffee{width:100%;max-width:94px}@media(max-width:700px){.app .app-topbar-actions{width:100%;flex-wrap:wrap;gap:8px}.app .app-topbar-actions>.button{min-width:0;padding:10px 12px;font-size:13px}.app .app-topbar-actions>.theme-toggle{flex:0 0 auto}.app .app-topbar-actions>.button:not(.topbar-save){flex:1 1 auto}.app .app-topbar-actions>.topbar-save{flex:0 0 auto}}@media(max-width:700px){.app .app-topbar-actions>.topbar-save{font-size:0;flex:0 0 41px;width:41px;min-height:41px;padding:10px}}