@import "https://fonts.googleapis.com/css2?family=Bangers&family=Noto+Sans+SC:wght@400;500;600;700;800;900&family=Space+Mono:wght@400;700&display=swap";:root{--paper:#f4f3ef;--white:#fffefa;--ink:#242737;--muted:#777986;--line:#dcdbe1;--yellow:#f8d64d;--purple:#7968d8;--soft-purple:#eeebfb;--base:#7968d8;--shadow:5px 5px 0 var(--ink);color:var(--ink);font-synthesis:none;font-family:Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{background:var(--paper);background-image:radial-gradient(#bfc0c34a .75px,#0000 .75px);background-size:7px 7px;margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a,input,label{touch-action:manipulation}button{color:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline-offset:5px;outline:3px solid #407fcc}button{border-radius:0}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}input[type=range]{cursor:pointer;width:100%;margin:0}button,fieldset{margin:0}fieldset{border:0;padding:0}button svg{fill:none;stroke:currentColor;stroke-width:1.7px;width:19px;height:19px}button:active{transform:translate(2px,2px)}[hidden]{display:none!important}.page-shell{max-width:1336px;margin:auto;padding:0 52px}.site-header{border-bottom:2px solid var(--ink);justify-content:space-between;align-items:center;gap:20px;height:104px;display:flex}.brand{align-items:center;gap:21px;display:flex}.brand-word{letter-spacing:1px;align-items:center;gap:4px;font-family:Bangers,Impact,sans-serif;font-size:48px;line-height:1;display:inline-flex;transform:rotate(-3deg)}.brand-miniature{object-fit:contain;flex-shrink:0;width:.82em;height:.92em;display:block;transform:rotate(3deg)}.brand-description{border-left:1px solid var(--ink);letter-spacing:1px;padding-left:20px;font-size:14px;font-weight:700}.header-note{color:#606270;align-items:center;gap:9px;font-size:13px;display:flex}.tiny-spark{color:var(--purple);font-size:24px}.intro{justify-content:space-between;align-items:flex-end;gap:24px;margin:35px 0 29px;display:flex}.eyebrow{letter-spacing:1.6px;margin-bottom:12px;font:700 12px Space Mono,monospace}.intro h1{letter-spacing:-1.2px;font-size:clamp(26px,3.6vw,43px);font-weight:900;line-height:1.5}.title-highlight{z-index:0;margin-left:3px;display:inline-block;position:relative}.title-highlight:before{content:"";z-index:-1;background:var(--yellow);height:19px;position:absolute;bottom:5px;left:-4px;right:-5px;transform:rotate(-2deg)}.title-star{color:var(--purple);font-size:28px;position:absolute;top:-15px;right:-15px;transform:rotate(14deg)}.intro p{color:#606270;padding-bottom:8px;font-size:16px;line-height:1.9}.workbench{grid-template-columns:320px minmax(0,1fr);align-items:stretch;gap:25px;display:grid}.comic-panel{border:2px solid var(--ink);background:var(--white);box-shadow:var(--shadow);border-radius:12px;overflow:hidden}.panel-heading{border-bottom:2px solid var(--ink);align-items:center;gap:10px;min-height:66px;padding:16px 21px;display:flex}.panel-heading h2{white-space:nowrap;font-size:17px;font-weight:800}.step-badge{background:var(--yellow);border:1.5px solid var(--ink);text-align:center;min-width:28px;box-shadow:2px 2px 0 var(--ink);font-family:Space Mono,monospace;font-size:13px;font-weight:700;line-height:24px;transform:rotate(-5deg)}.step-badge.purple{background:var(--purple);color:#fff}.panel-caption{color:var(--muted);margin-left:auto;font:12px Space Mono,monospace}.control-body{padding:24px 24px 25px}.base-input-row{grid-template-columns:64px minmax(0,1fr);align-items:center;gap:17px;display:grid}.base-color-button{background:var(--base);border:2px solid var(--ink);width:64px;height:64px;box-shadow:3px 3px 0 var(--ink);cursor:pointer;border-radius:10px;display:block;position:relative;overflow:hidden}.base-color-button input{opacity:0;cursor:pointer;width:100%;height:100%;padding:0;position:absolute;inset:0}.base-color-button:focus-within{outline-offset:4px;outline:3px solid #407fcc}.picker-cross{pointer-events:none;border:1.5px solid var(--ink);background:var(--white);border-radius:50%;place-items:center;width:22px;height:22px;font-size:17px;line-height:1;display:grid;position:absolute;bottom:5px;right:6px}.hex-field label{color:#696b78;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:12px;display:flex}.hex-field label span{color:#90909a;font:12px Space Mono,monospace}.hex-input-wrap{border:1.5px solid var(--ink);background:#fff;border-radius:5px;align-items:center;height:38px;padding-left:11px;font-family:Space Mono,monospace;display:flex}.hex-input-wrap span{color:#9795a3;font-size:16px}.hex-input-wrap input{letter-spacing:.2px;width:100%;min-width:0;height:100%;color:var(--ink);text-transform:uppercase;background:0 0;border:0;padding:0 10px 0 5px;font:700 16px Space Mono,monospace}.hex-input-wrap input:focus{outline:none}.hex-input-wrap:has([aria-invalid=true]){border-color:#ac2744}.field-error{color:#ac2744;margin-top:10px;font-size:12px;line-height:1.6}.color-controls{gap:18px;margin-top:24px;display:grid}.range-label{justify-content:space-between;align-items:center;margin-bottom:9px;font-size:14px;font-weight:500;display:flex}.range-label label span{color:var(--muted);margin-left:5px;font-family:Space Mono,monospace;font-size:12px}.range-label output{color:#757582;font:12px Space Mono,monospace}.color-range{appearance:none;border:1px solid #24273775;border-radius:9px;height:10px;display:block}.color-range::-webkit-slider-thumb{-webkit-appearance:none;border:2px solid var(--ink);background:var(--white);width:19px;height:19px;box-shadow:0 1px 0 var(--ink);border-radius:50%}.color-range::-moz-range-thumb{border:2px solid var(--ink);background:var(--white);border-radius:50%;width:16px;height:16px}.color-range::-moz-range-track{background:0 0}.preset-section{margin-top:24px}.small-heading{color:#747580;margin-bottom:10px;font-size:12px}.preset-section .small-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;font-size:13px;display:flex}.preset-tag{color:var(--purple);font-size:12px;font-weight:700}.presets{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.preset-button{border:1.5px solid var(--line);background:var(--white);min-width:0;min-height:44px;color:var(--ink);text-align:left;border-radius:5px;align-items:center;gap:8px;padding:7px 9px;font-size:14px;font-weight:600;display:flex;position:relative}.preset-chip{border:1px solid var(--ink);background:var(--swatch);border-radius:3px;flex:none;width:23px;height:26px}.preset-button[aria-pressed=true]{border-color:var(--ink);background:var(--soft-purple);box-shadow:2px 2px 0 var(--ink)}.preset-button:hover{border-color:var(--ink)}.preset-button:focus-visible{outline-offset:3px;outline:3px solid #407fcc}.settings-divider{border-top:1px dashed #c6c5ce;margin:24px 0 21px}.mood-field legend{margin-bottom:11px;font-size:13px;font-weight:600}.mood-options{gap:7px;display:grid}.mood-option{cursor:pointer;position:relative}.mood-option input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.mood-option>span{background:#fff;border:1px solid #dedde5;border-radius:5px;align-items:center;gap:11px;height:36px;padding:0 12px;font-size:14px;transition:background .15s,border-color .15s;display:flex}.mood-symbol{text-align:center;color:#777584;width:20px;font-size:18px}.mood-option input:checked+span{border:1.5px solid var(--ink);background:var(--soft-purple);box-shadow:2px 2px 0 var(--ink);font-weight:700}.mood-option input:checked+span:after{content:"✓";margin-left:auto;font-size:12px}.mood-option input:focus-visible+span{outline-offset:3px;outline:3px solid #407fcc}.contrast-field .range-label{margin-bottom:7px}.contrast-field output{color:#71677e;background:#f0eef6;border-radius:3px;padding:2px 7px;font-family:inherit;font-size:12px}.contrast-field input{appearance:none;background:linear-gradient(to right,var(--purple) 0%,var(--purple) 55%,#e6e3eb 55%,#e6e3eb 100%);border-radius:5px;height:5px;margin:12px 0 10px;display:block}.contrast-field input::-webkit-slider-thumb{-webkit-appearance:none;border:2px solid var(--ink);background:var(--yellow);border-radius:50%;width:17px;height:17px}.contrast-field input::-moz-range-thumb{border:2px solid var(--ink);background:var(--yellow);border-radius:50%;width:14px;height:14px}.range-endpoints{color:var(--muted);justify-content:space-between;font-size:12px;display:flex}.palette-panel{flex-direction:column;display:flex}.palette-panel .panel-heading{padding-left:25px;padding-right:25px}.grayscale-toggle{white-space:nowrap;cursor:pointer;color:#626371;align-items:center;gap:8px;margin-left:auto;font-size:12px;display:flex;position:relative}.grayscale-toggle input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.toggle-track{border:1.5px solid var(--ink);background:#e8e6ed;border-radius:20px;width:29px;height:17px;transition:background .2s;position:relative}.toggle-track:before{content:"";background:var(--ink);border-radius:50%;width:9px;height:9px;transition:transform .2s;position:absolute;top:2.5px;left:2.5px}.grayscale-toggle input:checked+.toggle-track{background:var(--yellow)}.grayscale-toggle input:focus-visible+.toggle-track{outline-offset:3px;outline:3px solid #407fcc}.wheel-stage{background-image:radial-gradient(#bcb7ca60 .7px,#0000 .7px);background-size:7px 7px;flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:376px;padding:9px 10px 24px;display:flex;position:relative;overflow:hidden}.palette-wheel-wrap{aspect-ratio:1;flex-shrink:0;width:min(355px,75%);position:relative}.palette-wheel-wrap svg{width:100%;height:100%;display:block;overflow:visible}.wheel-center{background:0 0;border:0;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:34%;height:34%;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.wheel-center:active{transform:translate(-48%,-48%)}.wheel-center>span:first-child{color:#8a8699;letter-spacing:3px;font:12px Space Mono,monospace}.wheel-center strong{color:var(--ink);font:700 17px Space Mono,monospace}.wheel-center .center-copy{color:#a19aab;font-size:12px}.wheel-center:hover .center-copy{color:var(--purple)}.wheel-sector{transition:fill .16s}.wheel-sector-label{text-anchor:middle;dominant-baseline:middle;pointer-events:none;font:600 12px Noto Sans SC,PingFang SC,sans-serif}.stage-label{z-index:1;flex-direction:column;gap:5px;display:flex;position:absolute}.stage-label>span:first-child{letter-spacing:1px;font:23px Bangers,Impact,sans-serif}.stage-label>span:nth-child(2){color:#7c7789;font-size:12px}.shade-label{top:44px;left:25px;transform:rotate(-8deg)}.light-label{top:65px;right:22px;transform:rotate(7deg)}.stage-label svg{fill:none;width:46px;height:30px;stroke:var(--ink);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;margin:4px auto 0}.wheel-footnote{color:#767181;text-align:center;align-items:center;gap:7px;padding:0 15px;font-size:12px;line-height:1.6;display:flex}.live-dot{background:var(--purple);border-radius:50%;flex-shrink:0;width:6px;height:6px}.palette-strip-area{border-top:2px solid var(--ink);padding:22px 25px 23px}.strip-heading{justify-content:space-between;align-items:center;gap:8px;margin-bottom:15px;display:flex}.strip-heading h3{font-size:14px;font-weight:700}.strip-heading>span{color:#8b8697;font-size:12px}.palette-cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.palette-card{border:1.5px solid var(--ink);background:var(--white);border-radius:7px;flex-direction:column;align-items:stretch;min-width:0;padding:0;transition:box-shadow .16s,transform .16s;display:flex;overflow:hidden}.palette-card:hover{box-shadow:3px 4px 0 var(--ink);transform:translate(-1px,-3px)}.card-color{border-bottom:1.5px solid var(--ink);height:77px;position:relative}.card-color .base-star{color:var(--swatch-text);font-size:18px;position:absolute;top:7px;right:7px}.card-info{flex-direction:column;align-items:center;gap:5px;padding:10px 2px 11px;display:flex}.card-name{font-size:14px;font-weight:600}.card-hex{color:#77717f;letter-spacing:-.3px;font:12px Space Mono,monospace}.palette-actions{justify-content:space-between;align-items:center;gap:14px;margin-top:20px;display:flex}.palette-tip{color:#908995;max-width:235px;font-size:12px;line-height:1.7}.copy-palette-button{border:1.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink);background:var(--yellow);white-space:nowrap;border-radius:5px;justify-content:center;align-items:center;gap:7px;padding:10px 13px;font-size:12px;font-weight:700;display:flex}.copy-palette-button:hover{background:#ffe479}.is-grayscale .color-fill{filter:grayscale()}.painting-note{border:1.5px solid var(--ink);background:#f9eeba;border-radius:7px;align-items:center;gap:16px;margin:25px 0 0;padding:14px 18px;display:flex;position:relative}.note-tag{white-space:nowrap;border:1px solid var(--ink);background:var(--white);box-shadow:2px 2px 0 var(--ink);padding:4px 9px;font-size:12px;font-weight:800;transform:rotate(-3deg)}.painting-note p{color:#6f6547;font-size:12px;line-height:1.8}.note-decoration{color:#a49b72;margin-left:auto;font-size:28px}footer{color:#9c97a0;letter-spacing:1px;justify-content:space-between;gap:20px;padding:23px 0 24px;font:12px Space Mono,monospace;display:flex}.footer-divider{margin:0 8px}.toast{background:var(--ink);color:#fff;border:2px solid var(--white);opacity:0;pointer-events:none;z-index:20;text-align:center;border-radius:8px;max-width:calc(100vw - 32px);padding:13px 21px;font-size:14px;transition:opacity .2s,transform .2s;position:fixed;bottom:28px;left:50%;transform:translate(-50%,14px);box-shadow:4px 4px #24273750}.toast.visible{opacity:1;transform:translate(-50%)}@media (width>=1450px){.intro{margin-top:44px;margin-bottom:34px}.wheel-stage{min-height:391px}.palette-wheel-wrap{width:370px}}@media (width<=1100px){.page-shell{padding:0 30px}.workbench{grid-template-columns:290px minmax(0,1fr);gap:21px}.control-body{padding:23px 20px}.panel-caption{display:none}.palette-panel .panel-heading{padding:16px 19px}.stage-label{display:none}.palette-wheel-wrap{width:min(345px,90%)}.palette-strip-area{padding:20px 18px}.palette-cards{gap:7px}.card-hex{font-size:12px}.palette-tip{max-width:150px}.copy-palette-button{padding:9px 10px;font-size:14px}.strip-heading>span{font-size:12px}}@media (width<=800px){.page-shell{padding:0 23px}.site-header{height:88px}.brand-word{font-size:41px}.brand-description{letter-spacing:0;padding-left:14px;font-size:12px}.brand{gap:15px}.header-note{display:none}.intro{margin:28px 0 23px}.intro h1{font-size:34px}.intro p{display:none}.eyebrow{font-size:12px}.workbench{grid-template-columns:255px minmax(0,1fr);gap:17px}.control-body{padding:21px 17px}.palette-panel .panel-heading{flex-wrap:wrap;row-gap:10px}.panel-heading h2{font-size:15px}.grayscale-toggle{gap:5px;font-size:12px}.palette-wheel-wrap{width:100%}.wheel-stage{min-height:300px}.wheel-center strong{font-size:14px}.wheel-center>span:first-child,.wheel-footnote{font-size:12px}.strip-heading{flex-direction:column;align-items:flex-start;gap:5px}.palette-cards{gap:5px}.card-color{height:70px}.card-name{font-size:14px}.card-hex{letter-spacing:-.6px;font-size:12px}.palette-actions{flex-direction:column;align-items:stretch;gap:12px;margin-top:15px}.palette-tip{max-width:none}.painting-note p{font-size:12px}footer>span:last-child{display:none}}@media (width<=760px){.page-shell{padding:0 18px}.site-header{height:80px}.brand-word{font-size:39px}.brand-description{font-size:12px}.intro{margin:27px 0 24px}.intro h1{letter-spacing:-1px;font-size:32px}.eyebrow{letter-spacing:1px;font-size:12px}.workbench{grid-template-columns:1fr;gap:23px}.panel-heading{min-height:61px;padding:15px 20px}.panel-heading h2{font-size:17px}.panel-caption{font-size:12px;display:block}.control-body{padding:21px 21px 24px}.base-input-row{grid-template-columns:64px 1fr}.hex-input-wrap input{font-size:17px}.color-controls{gap:20px}.range-label{font-size:14px}.range-label output{font-size:13px}.small-heading{font-size:12px}.mood-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.mood-option>span{flex-direction:column;justify-content:center;gap:1px;height:49px;padding:5px;font-size:12px}.mood-symbol{font-size:17px;line-height:19px}.mood-option input:checked+span:after{display:none}.contrast-field{margin-top:22px}.settings-divider{margin:22px 0 18px}.mood-field legend{font-size:14px}.grayscale-toggle{margin-left:auto;font-size:12px}.palette-panel .panel-heading{padding:15px 20px}.palette-wheel-wrap{width:min(350px,94%)}.wheel-stage{min-height:361px;padding:10px 5px 20px}.wheel-center strong{font-size:17px}.wheel-center>span:first-child,.wheel-center .center-copy,.wheel-footnote{font-size:12px}.palette-strip-area{padding:21px 16px}.strip-heading{flex-direction:row;align-items:center;gap:7px}.strip-heading h3{font-size:13px}.strip-heading>span{font-size:12px}.palette-cards{gap:6px}.card-color{height:79px}.card-name{font-size:14px}.card-hex{letter-spacing:-.4px;font-size:12px}.palette-actions{gap:13px}.copy-palette-button{padding:12px;font-size:13px}.palette-tip{text-align:center;font-size:12px}.painting-note{align-items:flex-start;gap:12px;padding:14px 13px}.painting-note p{font-size:12px;line-height:1.8}.note-tag{margin-top:1px;font-size:12px;line-height:1.8}.note-decoration{display:none}footer{letter-spacing:.4px;padding-top:22px;font-size:12px}.footer-divider{margin:0 3px}.toast{font-size:13px;bottom:18px}}@media (width<=360px){.page-shell{padding:0 13px}.brand-description{font-size:12px}.brand-word{font-size:35px}.intro h1{font-size:28px}.palette-panel .panel-heading{gap:8px;padding:15px 12px}.panel-heading h2{font-size:15px}.grayscale-toggle{font-size:12px}.palette-strip-area{padding:18px 10px}.card-hex{font-size:12px}.wheel-stage{min-height:315px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}}.advanced-controls>summary{display:none}.catalog-open-button{background:var(--soft-purple);border:1.5px solid var(--ink);width:100%;box-shadow:2px 2px 0 var(--ink);text-align:left;border-radius:5px;justify-content:space-between;align-items:center;gap:8px;margin-top:19px;padding:12px 10px;font-size:14px;font-weight:700;display:flex}.catalog-open-button:hover{background:#e2dcfa}.catalog-brand-hint{white-space:nowrap;font:400 12px Space Mono,monospace}.selected-paint{overflow-wrap:anywhere;padding:12px 1px 0}.selected-paint:not([hidden]){gap:4px;display:grid}.selected-paint-label{color:#6552ad;font:12px Space Mono,monospace}.selected-paint strong{font-size:14px;line-height:1.5}.selected-paint>span:last-child{color:var(--muted);font-size:12px;line-height:1.5}body.catalog-open{overflow:hidden}.catalog-dialog{border:2px solid var(--ink);background:var(--white);width:min(920px,100vw - 40px);max-width:none;height:min(840px,100dvh - 48px);max-height:none;color:var(--ink);box-shadow:7px 7px 0 var(--ink);border-radius:13px;margin:auto;padding:0;overflow:hidden}.catalog-dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#24273788}.catalog-layout{flex-direction:column;height:100%;min-height:0;display:flex}.catalog-heading{border-bottom:2px solid var(--ink);background:var(--yellow);flex-shrink:0;justify-content:space-between;align-items:center;padding:18px 25px;display:flex}.catalog-kicker{letter-spacing:2px;font:12px Space Mono,monospace}.catalog-heading h2{margin-top:2px;font-size:25px;font-weight:900;line-height:1.5}.catalog-close{background:var(--white);border:1.5px solid var(--ink);width:38px;height:38px;box-shadow:2px 2px 0 var(--ink);border-radius:6px;flex-shrink:0;place-items:center;font-size:27px;line-height:1;display:grid}.catalog-toolbar{flex-shrink:0;padding:18px 25px 0}.catalog-brands{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.catalog-brands button{border:1.5px solid var(--line);min-width:0;color:var(--muted);background:#fff;border-radius:6px;align-items:center;gap:8px;padding:11px 13px;font-size:14px;display:flex}.catalog-brands strong{letter-spacing:1px;color:var(--ink);font:23px Bangers,Impact,sans-serif}.catalog-brands button[aria-pressed=true]{background:var(--soft-purple);border-color:var(--ink);box-shadow:3px 3px 0 var(--ink);color:var(--ink)}.paint-brand-count{white-space:nowrap;margin-left:auto;font-size:12px}.catalog-filters{grid-template-columns:minmax(0,1fr) minmax(170px,.55fr);gap:15px;margin-top:20px;display:grid}.catalog-filters label{margin-bottom:7px;font-size:14px;font-weight:600;display:block}.catalog-filters input,.catalog-filters select{border:1.5px solid var(--ink);width:100%;min-width:0;height:42px;color:var(--ink);background:#fff;border-radius:5px;padding:8px 11px;font:14px Noto Sans SC,PingFang SC,sans-serif;display:block}.catalog-filters input::placeholder{color:#898490;font-size:12px}.catalog-count-row{color:#6d687a;justify-content:space-between;align-items:center;gap:10px;padding:14px 0 12px;font-size:12px;display:flex}.catalog-count-row>span:last-child{color:#827c8c}.catalog-results-area{overscroll-behavior:contain;background-image:radial-gradient(#bcb7ca50 .7px,#0000 .7px);background-size:7px 7px;flex:1;min-height:0;padding:4px 25px 20px;overflow:auto}.catalog-results{grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:14px;display:grid}.paint-swatch{background:var(--white);border:1.5px solid var(--ink);text-align:left;min-width:0;color:var(--ink);border-radius:7px;flex-direction:column;padding:0;transition:transform .12s,box-shadow .12s;display:flex;overflow:hidden}.paint-swatch:hover{box-shadow:3px 4px 0 var(--ink);transform:translate(-1px,-2px)}.paint-swatch[aria-pressed=true]{box-shadow:3px 3px 0 var(--purple);outline:2px solid var(--purple);outline-offset:1px}.paint-swatch-color{border-bottom:1.5px solid var(--ink);width:100%;height:51px}.paint-swatch-info{overflow-wrap:anywhere;gap:5px;padding:10px;display:grid}.paint-swatch-meta{color:#77717f;flex-wrap:wrap;justify-content:space-between;gap:4px;font:12px Space Mono,monospace;display:flex}.paint-swatch-info strong{font-size:14px;font-weight:700;line-height:1.4}.paint-swatch-range{color:#77717f;font-size:12px;line-height:1.4}.catalog-status{text-align:center;padding:36px 12px}.catalog-status strong{font-size:19px;line-height:1.6}.catalog-status p{color:var(--muted);margin:8px 0;font-size:14px;line-height:1.8}.catalog-status button{border:1.5px solid var(--ink);background:var(--yellow);border-radius:5px;margin-top:12px;padding:10px 18px;font-size:14px}.catalog-footer{border-top:1.5px solid var(--ink);background:var(--white);flex-shrink:0;padding:14px 25px 16px}.catalog-pagination{justify-content:center;align-items:center;gap:21px;display:flex}.catalog-pagination button{border:1.5px solid var(--ink);background:#fff;border-radius:4px;padding:7px 12px;font-size:14px}.catalog-pagination button:disabled{opacity:.4;cursor:default}.catalog-pagination>span{text-align:center;min-width:58px;font:12px Space Mono,monospace}.catalog-footer p{color:#797382;margin-top:12px;font-size:12px;line-height:1.8}.catalog-footer a{color:#6552ad;text-underline-offset:3px;text-decoration:underline}.catalog-dialog :focus-visible{outline-offset:3px;outline:3px solid #407fcc}@media (width<=760px){.catalog-dialog{width:calc(100vw - 24px);height:calc(100dvh - 32px);box-shadow:4px 4px 0 var(--ink);border-radius:10px}.catalog-heading{padding:12px 16px}.catalog-heading h2{font-size:22px}.catalog-toolbar{padding:14px 16px 0}.catalog-brands{gap:9px}.catalog-brands button{flex-wrap:wrap;gap:3px 6px;padding:9px 8px}.catalog-brands strong{font-size:22px}.catalog-brands button>span:nth-child(2){font-size:12px}.paint-brand-count{flex-basis:100%;margin-left:0;font-size:12px}.catalog-filters{grid-template-columns:minmax(0,1fr);gap:10px;margin-top:15px}.catalog-filters>div:last-child{align-items:center;gap:12px;display:flex}.catalog-filters>div:last-child label{white-space:nowrap;margin:0;font-size:14px}.catalog-filters>div:last-child select{height:38px}.catalog-filters input{font-size:16px}.catalog-count-row{flex-wrap:wrap;gap:4px;padding:11px 0 9px}.catalog-count-row>span:last-child{display:none}.catalog-results-area{padding:4px 16px 16px}.catalog-results{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.paint-swatch-color{height:44px}.paint-swatch-info{gap:5px;padding:8px}.catalog-footer{padding:10px 16px 12px}.catalog-pagination{gap:12px}.catalog-pagination button{padding:6px 9px}.catalog-footer p{margin-top:10px}.catalog-status{padding:25px 0}.advanced-controls>summary{cursor:pointer;border-top:1px dashed var(--line);justify-content:space-between;align-items:center;margin-top:20px;padding-top:15px;font-size:14px;font-weight:600;list-style:none;display:flex}.advanced-controls>summary::-webkit-details-marker{display:none}.advanced-controls[open]>summary>span{transform:rotate(45deg)}.advanced-controls>summary>span{font-size:19px;line-height:1}.palette-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.card-hex{letter-spacing:0;font-size:12px}.card-name{font-size:14px}.card-color{height:64px}.strip-heading{flex-direction:column;align-items:flex-start;gap:5px}.mood-option>span{font-size:12px}}@media (height<=650px){.catalog-dialog{overflow:auto}.catalog-layout{height:auto;min-height:100%}.catalog-results-area{flex:none;min-height:180px;max-height:50dvh}}.mode-switch{align-items:center;gap:8px;margin:-4px 0 23px;display:flex}.mode-switch button{border:1.5px solid var(--ink);background:var(--white);border-radius:6px;align-items:center;gap:12px;padding:11px 19px;font-size:15px;font-weight:700;display:flex}.mode-switch button span{color:#827b91;font:12px Space Mono,monospace}.mode-switch button[aria-selected=true]{background:var(--yellow);box-shadow:3px 3px 0 var(--ink)}.mode-switch button[data-mode=osl][aria-selected=true]{background:var(--purple);color:#fff}.mode-switch button[data-mode=osl][aria-selected=true] span{color:#f0eafb}.osl-controls{border-top:1px dashed var(--line);margin-top:24px;padding-top:22px}.osl-control-title{align-items:center;gap:10px;margin-bottom:20px;display:flex}.osl-color-input{grid-template-columns:48px minmax(0,1fr);align-items:center;gap:12px;display:grid}.osl-color-input input[type=color]{border:1.5px solid var(--ink);cursor:pointer;background:0 0;border-radius:6px;width:48px;height:51px;padding:0;overflow:hidden}.osl-color-input label{justify-content:space-between;margin-bottom:5px;font-size:14px;display:flex}.osl-color-input label span{color:var(--muted);font:12px Space Mono,monospace}.osl-color-input input[type=text]{border:1.5px solid var(--ink);width:100%;height:34px;color:var(--ink);text-transform:uppercase;background:#fff;border-radius:4px;padding:5px 9px;font:14px Space Mono,monospace}.osl-color-input input[aria-invalid=true]{border-color:#ac2744}.osl-presets{gap:7px;margin-top:14px;display:flex}.osl-presets button{white-space:nowrap;border:1px solid var(--line);background:#fff;border-radius:4px;flex:1;justify-content:center;align-items:center;gap:5px;padding:6px 3px;font-size:12px;display:flex}.osl-presets i{border:1px solid var(--ink);background:var(--preset);border-radius:50%;flex-shrink:0;width:9px;height:9px}.osl-presets button[aria-pressed=true]{background:var(--soft-purple);border-color:var(--ink)}.osl-range input[type=range]{accent-color:var(--purple);height:16px;margin:3px 0 5px;display:block}.osl-range .range-label{margin-bottom:5px}.osl-range .range-label output{color:#6552ad;font-size:13px}.osl-range .range-endpoints{line-height:1.5}.osl-advanced{border-top:1px dashed var(--line);margin-top:20px;padding-top:15px}.osl-advanced summary{cursor:pointer;justify-content:space-between;gap:10px;font-size:14px;font-weight:600;list-style:none;display:flex}.osl-advanced summary::-webkit-details-marker{display:none}.osl-advanced[open] summary>span{transform:rotate(45deg)}.osl-control-note{color:var(--muted);margin-top:6px;font-size:12px;line-height:1.6}.osl-ambient-color{flex-wrap:wrap;align-items:center;gap:8px;margin-top:20px;display:flex}.osl-ambient-color label{margin-right:auto;font-size:14px}.osl-ambient-color input{border:1px solid var(--ink);cursor:pointer;border-radius:3px;width:30px;height:30px;padding:0}.osl-ambient-color output{font:12px Space Mono,monospace}.osl-blocked{cursor:pointer;flex-wrap:wrap;align-items:center;gap:6px;margin-top:18px;font-size:14px;display:flex}.osl-blocked input{accent-color:var(--purple);width:15px;height:15px;margin:0}.osl-blocked span{color:var(--muted);font-size:12px}.osl-panel{flex-direction:column;min-width:0;display:flex}.osl-panel .panel-heading{padding-left:25px;padding-right:25px}.osl-preview{color:#f7f4ff;background:#272535 radial-gradient(#8e81a832 .8px,#0000 .8px) 0 0/8px 8px;flex:1;padding:24px 26px 23px}.osl-scene-heading{color:#cbc2dd;justify-content:space-between;align-items:center;gap:12px;font-size:12px;display:flex}.osl-scene-heading>span:first-child{letter-spacing:1px;font-family:Space Mono,Noto Sans SC,monospace}.osl-scene-heading>span:last-child{white-space:nowrap;border:1px solid #8f82a0;border-radius:4px;padding:4px 7px}.osl-source-row{border-bottom:1px dashed #71647f;grid-template-columns:1fr 2fr;align-items:center;gap:16px;margin-top:23px;padding-bottom:24px;display:grid}.osl-source-heading h3{margin-bottom:6px;font-size:17px}.osl-source-heading p{color:#c1b6d0;font-size:12px;line-height:1.6}.osl-source-colors{grid-template-columns:1fr 1fr;gap:12px;display:grid}.osl-source-card{color:#f7f4ff;background:#363045;border:1.5px solid #d6cbe5;border-radius:6px;flex-direction:column;min-width:0;padding:0;display:flex;overflow:hidden;box-shadow:3px 3px #100f18}.osl-source-color{letter-spacing:.4px;justify-content:center;align-items:center;min-height:58px;font:12px Space Mono,monospace;display:flex}.osl-source-name{padding:8px 3px;font-size:14px;display:block}.osl-source-name .card-name{font-size:14px;font-weight:500}.osl-comparison-title{justify-content:space-between;align-items:center;gap:14px;margin:22px 0 14px;display:flex}.osl-comparison-title h3{font-size:15px}.osl-comparison-title>span{color:#c1b6d0;font-size:12px}.osl-comparison{grid-template-columns:1fr 25px 1fr;align-items:center;gap:10px;display:grid}.osl-comparison-arrow{text-align:center;color:#f8d64d;font-size:24px}.osl-comparison-card{color:#fff;background:#363045;border:1.5px solid #d6cbe5;border-radius:7px;flex-direction:column;min-width:0;padding:0;display:flex;overflow:hidden;box-shadow:3px 3px #100f18}.osl-comparison-info{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;padding:11px 12px;font-size:14px;display:flex}.osl-comparison-info strong{color:#e2dbee;font:12px Space Mono,monospace}.osl-scene-note{color:#c1b6d0;margin-top:18px;font-size:12px;line-height:1.8}.osl-palette-area{border-top:2px solid var(--ink);padding:22px 25px 23px}.osl-palette-cards .card-name{font-size:13px}.osl-palette-cards .card-color{height:67px}.osl-palette-area .palette-tip{max-width:320px}.osl-method{border-top:1px dashed var(--line);padding:15px 25px 19px}.osl-method summary{cursor:pointer;color:#62586e;font-size:13px}.osl-method p{color:#746b80;margin-top:10px;font-size:13px;line-height:1.9}.osl-method a{color:#6552ad;text-underline-offset:3px;text-decoration:underline}.is-grayscale .osl-source-color{filter:grayscale()}@media (width<=1100px){.osl-source-row{grid-template-columns:1fr;gap:12px}.osl-source-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.osl-source-heading h3{margin:0}.osl-preview{padding:21px 20px}.osl-comparison-title{flex-direction:column;align-items:flex-start;gap:6px}.osl-comparison-info{flex-direction:column;align-items:flex-start;gap:6px;padding:10px}.osl-palette-area{padding:21px 18px}.osl-palette-cards .card-name{font-size:12px}.osl-method{padding:15px 18px 18px}}@media (width<=760px){.mode-switch{gap:10px;margin-bottom:23px}.mode-switch button{flex:1;justify-content:center;gap:7px;padding:11px 10px;font-size:14px}.mode-switch button span{font-size:12px}.osl-controls{margin-top:21px;padding-top:20px}.osl-control-title{margin-bottom:16px}.osl-presets button{padding:7px 3px;font-size:14px}.osl-range{margin-top:20px}.osl-panel .panel-heading{padding:15px 18px}.osl-preview{padding:19px 18px}.osl-source-row{margin-top:20px;padding-bottom:21px}.osl-source-color{min-height:61px}.osl-comparison-color{height:101px}.osl-comparison-info{align-items:center}.osl-comparison-title h3{font-size:15px}.osl-palette-area{padding:21px 16px}.osl-palette-cards .card-name{font-size:14px}.osl-palette-area .palette-tip{text-align:left;max-width:none}.osl-method{padding:15px 16px 18px}.osl-scene-heading>span:first-child{letter-spacing:0;font-size:12px}}@media (width<=390px){.mode-switch button span{display:none}.osl-scene-heading{flex-wrap:wrap;gap:8px}.osl-panel .panel-heading{gap:8px}.osl-panel .panel-heading h2{font-size:15px}.osl-source-colors{gap:10px}.osl-comparison{grid-template-columns:1fr 20px 1fr;gap:6px}.osl-preview{padding-left:15px;padding-right:15px}}@media (prefers-reduced-motion:reduce){.osl-panel *{transition:none!important}}:root{--control-border:2px solid var(--ink);--control-radius:6px;--control-shadow:3px 3px 0 var(--ink);--track-paper:#e9e5f0;--control-focus:#544092;--range-fill:var(--purple);--control-motion:.14s ease}.range-field input[type=range]{appearance:none;box-sizing:border-box;width:100%;height:36px;box-shadow:none;cursor:ew-resize;touch-action:pan-y;background:0 0;border:0;border-radius:0;outline:none;margin:0;padding:0;display:block}.range-field .comic-range::-webkit-slider-runnable-track{border:var(--control-border);height:12px;box-shadow:2px 2px 0 var(--ink);background:var(--range-gradient,linear-gradient(to right,var(--range-fill) 0%,var(--range-fill) var(--range-progress,0%),var(--track-paper) var(--range-progress,0%),var(--track-paper) 100%));border-radius:4px}.range-field .comic-range::-moz-range-track{box-sizing:border-box;border:var(--control-border);height:12px;box-shadow:2px 2px 0 var(--ink);background:var(--range-gradient,linear-gradient(to right,var(--range-fill) 0%,var(--range-fill) var(--range-progress,0%),var(--track-paper) var(--range-progress,0%),var(--track-paper) 100%));border-radius:4px}.range-field .comic-range::-webkit-slider-thumb{appearance:none;box-sizing:border-box;border:var(--control-border);background:linear-gradient(90deg,transparent 6px,var(--ink) 6px 8px,transparent 8px 11px,var(--ink) 11px 13px,transparent 13px) center / 20px 9px no-repeat,var(--yellow);width:24px;height:25px;box-shadow:2px 3px 0 var(--ink);transition:box-shadow var(--control-motion),background-color var(--control-motion);border-radius:5px;margin-top:-9px}.range-field .comic-range::-moz-range-thumb{box-sizing:border-box;border:var(--control-border);background:linear-gradient(90deg,transparent 6px,var(--ink) 6px 8px,transparent 8px 11px,var(--ink) 11px 13px,transparent 13px) center / 20px 9px no-repeat,var(--yellow);width:24px;height:25px;box-shadow:2px 3px 0 var(--ink);transition:box-shadow var(--control-motion),background-color var(--control-motion);border-radius:5px}.range-field .comic-range:active::-webkit-slider-thumb{background-color:var(--white);box-shadow:1px 1px 0 var(--ink)}.range-field .comic-range:active::-moz-range-thumb{background-color:var(--white);box-shadow:1px 1px 0 var(--ink)}.range-field .comic-range:focus-visible::-webkit-slider-thumb{outline:3px solid var(--control-focus);outline-offset:4px}.range-field .comic-range:focus-visible::-moz-range-thumb{outline:3px solid var(--control-focus);outline-offset:4px}.range-field .range-label{gap:12px;min-height:30px;margin-bottom:3px;font-size:14px;font-weight:700}.range-field .range-label output{border:1.5px solid var(--ink);min-width:49px;box-shadow:2px 2px 0 var(--ink);background:var(--soft-purple);color:var(--ink);text-align:center;white-space:nowrap;border-radius:4px;padding:2px 7px;font:700 12px/1.7 Space Mono,Noto Sans SC,monospace;display:inline-block;transform:rotate(-3deg)}.range-field .range-endpoints{color:#756c80;gap:12px;margin-top:1px;font-size:12px;line-height:1.6}.color-controls{gap:17px}.contrast-field .range-label output{font-family:Noto Sans SC,PingFang SC,sans-serif}.osl-range{margin-top:21px}.paint-color-trigger{border:var(--control-border);background:var(--picker-color,var(--base));box-shadow:var(--control-shadow);cursor:pointer;transition:transform var(--control-motion),box-shadow var(--control-motion);border-radius:9px;flex-shrink:0;padding:0;display:block;position:relative;overflow:hidden}.paint-color-trigger:before{content:"";pointer-events:none;border:1px solid #ffffff80;border-radius:4px;position:absolute;inset:5px}.paint-color-trigger .picker-cross{border:1.5px solid var(--ink);background:var(--white);width:21px;height:21px;color:var(--ink);box-shadow:1px 1px 0 var(--ink);border-radius:4px;font-weight:800;bottom:5px;right:5px;transform:rotate(-6deg)}.osl-color-input{grid-template-columns:58px minmax(0,1fr);gap:14px}.osl-color-input .paint-color-trigger{width:58px;height:62px}.base-color-button.paint-color-trigger{width:64px;height:67px}.osl-ambient-color .paint-color-trigger{border-radius:6px;width:38px;height:38px}.paint-color-trigger.compact:before{border-radius:2px;inset:4px}.paint-color-trigger.compact .picker-cross{border-radius:3px;width:14px;height:14px;font-size:12px;bottom:3px;right:3px}.osl-ambient-color output{background:var(--soft-purple);border:1px solid var(--line);border-radius:3px;padding:4px 6px;font-size:12px}.hex-field label,.osl-color-input label,.catalog-filters label{color:var(--ink);font-size:14px;font-weight:700}.hex-field label span,.osl-color-input label span{color:#84788e;font-size:12px}.hex-input-wrap{border:var(--control-border);border-radius:var(--control-radius);height:43px;box-shadow:var(--control-shadow);background:#fff}.hex-input-wrap input{font-size:16px}.hex-input-wrap>span{color:#776986;font-weight:700}.osl-color-input input[type=text]{border:var(--control-border);border-radius:var(--control-radius);height:38px;box-shadow:var(--control-shadow);font-size:15px;font-weight:700}.hex-input-wrap:focus-within{box-shadow:var(--control-shadow),0 0 0 4px #7968d829}.osl-color-input input[aria-invalid=true]{border-color:#ac2744;box-shadow:2px 2px #ac2744}.hex-input-wrap:has([aria-invalid=true]){border-color:#ac2744;box-shadow:2px 2px #ac2744}.catalog-filters input,.catalog-filters select{border:var(--control-border);border-radius:var(--control-radius);height:44px;box-shadow:var(--control-shadow);background-color:#fff;font-size:14px}.catalog-filters select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m7 9 5 6 5-6' fill='none' stroke='%23242737' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 7px center;background-repeat:no-repeat;background-size:23px;padding-right:37px}.catalog-filters select option{background:var(--white);color:var(--ink)}.catalog-filters select:disabled{opacity:.5;cursor:default}.catalog-search-field input{padding-left:12px}.toggle-track{border:var(--control-border);background:var(--track-paper);width:34px;height:21px;box-shadow:1px 2px 0 var(--ink);border-radius:5px}.toggle-track:before{background:var(--ink);border-radius:2px;width:11px;height:11px;top:3px;left:3px}.grayscale-toggle input:checked+.toggle-track:before{transform:translate(13px)}.grayscale-toggle{min-height:32px}.osl-blocked{gap:8px;min-height:30px}.osl-blocked input{appearance:none;border:var(--control-border);width:22px;height:22px;box-shadow:2px 2px 0 var(--ink);cursor:pointer;background:#fff;border-radius:4px;flex-shrink:0;display:inline-block}.osl-blocked input:checked{background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10 4 4 8-9' fill='none' stroke='%23242737' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px 18px no-repeat}.osl-blocked span{flex-basis:100%;margin-left:30px}.mode-switch button,.copy-palette-button,.catalog-open-button,.catalog-close,.catalog-brands button,.catalog-pagination button,.catalog-status button,.color-editor-footer button{border:var(--control-border);border-radius:var(--control-radius);box-shadow:var(--control-shadow);transition:transform var(--control-motion),box-shadow var(--control-motion),background-color var(--control-motion)}.mode-switch button{min-height:45px}.copy-palette-button{min-height:43px;font-size:14px}.catalog-open-button{padding:12px 10px}.catalog-brand-hint{font-size:12px}.catalog-brands button{border-color:var(--ink);background:var(--white);padding-top:12px;padding-bottom:12px}.catalog-brands button[aria-pressed=true]{background:var(--purple);color:#fff}.catalog-brands button[aria-pressed=true] strong{color:var(--yellow)}.catalog-pagination button{min-height:37px}.catalog-pagination button:disabled{box-shadow:none;opacity:.4}.osl-presets{gap:8px}.osl-presets button{border:1.5px solid var(--ink);box-shadow:2px 2px 0 var(--ink);transition:transform var(--control-motion),box-shadow var(--control-motion);border-radius:5px;padding:8px 3px}.osl-presets button[aria-pressed=true]{background:var(--yellow);font-weight:700}.osl-presets i{border-radius:3px;width:11px;height:11px}.mood-option>span{border:1.5px solid var(--ink);border-radius:5px;height:auto;min-height:40px;padding:8px 11px}.mood-option input:checked+span{background:var(--soft-purple);box-shadow:var(--control-shadow);border:var(--control-border)}.mood-option input:checked+span:after{background:var(--purple);color:#fff;border:1px solid var(--ink);border-radius:4px;place-items:center;width:18px;height:18px;display:grid}.preset-button{box-shadow:1px 2px 0 var(--ink)}.palette-card{border:var(--control-border);box-shadow:2px 2px 0 var(--ink)}.palette-card[data-base=true]{box-shadow:3px 3px 0 var(--purple)}.card-color{border-bottom:var(--control-border)}.paint-swatch{border:var(--control-border);box-shadow:2px 2px 0 var(--ink)}.paint-swatch[aria-pressed=true]{outline:2px solid var(--purple);outline-offset:2px;box-shadow:3px 3px 0 var(--purple)}.paint-swatch-color{border-bottom:var(--control-border)}.osl-advanced summary{border:1.5px solid var(--ink);background:var(--soft-purple);box-shadow:2px 2px 0 var(--ink);border-radius:5px;padding:10px 11px;line-height:1.5}.osl-advanced summary>span{flex-shrink:0;place-items:center;width:20px;height:20px;font-size:19px;line-height:1;display:grid}.osl-method summary{color:#625275;font-size:14px;line-height:1.6}.selected-paint:not([hidden]){background:#f4f0fd;border:1.5px dashed #9182a6;border-radius:6px;margin-top:15px;padding:11px 12px}.catalog-heading{background:var(--yellow);background-image:radial-gradient(#a89a382b .8px,#0000 .8px);background-size:6px 6px}.catalog-dialog{box-shadow:7px 7px 0 var(--ink)}.catalog-results-area{scrollbar-width:thin;scrollbar-color:var(--purple) #ece7f3}.catalog-results-area::-webkit-scrollbar{width:11px}.color-editor-body::-webkit-scrollbar{width:11px}.catalog-results-area::-webkit-scrollbar-track{border-left:1px solid var(--ink);background:#ece7f3}.color-editor-body::-webkit-scrollbar-track{border-left:1px solid var(--ink);background:#ece7f3}.catalog-results-area::-webkit-scrollbar-thumb{background:var(--purple);border:2px solid #ece7f3;border-radius:5px}.color-editor-body::-webkit-scrollbar-thumb{background:var(--purple);border:2px solid #ece7f3;border-radius:5px}.color-editor{border:var(--control-border);background:var(--white);width:min(460px,100vw - 32px);max-width:none;max-height:calc(100dvh - 40px);color:var(--ink);box-shadow:7px 7px 0 var(--ink);border-radius:12px;margin:auto;padding:0;overflow:hidden}.color-editor::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#24273799}.color-editor form{flex-direction:column;max-height:calc(100dvh - 40px);margin:0;display:flex}.color-editor-heading{border-bottom:var(--control-border);background:var(--yellow);flex-shrink:0;justify-content:space-between;align-items:center;gap:16px;padding:17px 22px;display:flex}.color-editor-heading h2{margin-top:3px;font-size:22px;font-weight:900;line-height:1.5}.color-editor-heading .catalog-kicker{letter-spacing:1.5px;font-size:12px}.color-editor-heading .catalog-close{width:36px;height:36px}.color-editor-body{scrollbar-width:thin;scrollbar-color:var(--purple) #ece7f3;min-height:0;padding:22px;overflow:auto}.color-editor-sv{aspect-ratio:2;border:var(--control-border);background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent),var(--picker-hue,red);width:100%;min-height:140px;box-shadow:3px 3px 0 var(--ink);touch-action:none;cursor:crosshair;-webkit-user-select:none;user-select:none;border-radius:7px;position:relative}.color-editor-marker{width:17px;height:17px;box-shadow:0 0 0 2px var(--ink),1px 2px 0 2px #24273760;pointer-events:none;border:2px solid #fff;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.color-editor-sliders{gap:9px;margin-top:22px;display:grid}.color-editor-sliders .range-label{font-size:14px}.color-editor-sliders .range-label label span{margin-left:5px;font-size:12px}.color-editor-sliders #color-editor-h{--range-gradient:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.color-editor-values{border-top:1px dashed var(--line);grid-template-columns:1.1fr 1fr;align-items:start;gap:18px;margin-top:19px;padding-top:17px;display:grid}.color-editor-samples{grid-template-columns:1fr 1fr;gap:10px;display:grid}.color-editor-samples>div{text-align:center;color:#786c85;flex-direction:column;gap:5px;min-width:0;font-size:12px;display:flex}.editor-sample{border:var(--control-border);height:42px;box-shadow:2px 2px 0 var(--ink);border-radius:5px}.color-editor-samples strong{color:var(--ink);letter-spacing:-.4px;font:12px Space Mono,monospace}.color-editor-hex-field label{justify-content:space-between;gap:8px;margin-bottom:8px;font-size:14px;font-weight:700;line-height:1.5;display:flex}.color-editor-hex-field label span{color:#87778e;font:12px Space Mono,monospace}.color-editor-hex-field input{border:var(--control-border);border-radius:var(--control-radius);width:100%;min-width:0;height:42px;box-shadow:var(--control-shadow);color:var(--ink);text-transform:uppercase;background:#fff;padding:8px 10px;font:700 15px Space Mono,monospace}.color-editor-hex-field input[aria-invalid=true]{border-color:#ac2744;box-shadow:2px 2px #ac2744}.color-editor-hex-field .field-error{font-size:12px;line-height:1.6}.color-editor-footer{border-top:var(--control-border);background:#f0ebf8;flex-shrink:0;justify-content:flex-end;align-items:center;gap:12px;padding:15px 22px 20px;display:flex}.color-editor-footer button{background:var(--white);min-height:42px;padding:9px 18px;font-size:14px;font-weight:700}.color-editor-footer button[type=submit]{background:var(--purple);color:#fff}.color-editor-footer button[type=submit] span{color:var(--yellow);margin-left:8px}.color-editor-footer button:disabled{opacity:.45;box-shadow:none;cursor:default}button:focus-visible,select:focus-visible,input:not([type=range]):focus-visible,summary:focus-visible{outline:3px solid var(--control-focus);outline-offset:4px}@media (hover:hover){.paint-color-trigger:hover,.mode-switch button:hover,.catalog-open-button:hover,.copy-palette-button:hover,.catalog-close:hover,.catalog-brands button:hover,.catalog-pagination button:not(:disabled):hover,.color-editor-footer button:not(:disabled):hover{box-shadow:4px 5px 0 var(--ink);transform:translate(-1px,-2px)}.osl-presets button:hover{box-shadow:2px 3px 0 var(--ink);transform:translateY(-1px)}}.paint-color-trigger:active,.mode-switch button:active,.catalog-open-button:active,.copy-palette-button:active,.catalog-close:active,.catalog-brands button:active,.catalog-pagination button:not(:disabled):active,.color-editor-footer button:not(:disabled):active,.osl-presets button:active{box-shadow:0 0 0 var(--ink);transform:translate(2px,2px)}@media (width<=760px){.range-field input[type=range]{height:40px}.range-field .comic-range::-webkit-slider-thumb{width:26px;height:27px;margin-top:-10px}.range-field .comic-range::-moz-range-thumb{width:26px;height:27px}.range-field .range-label{font-size:14px}.mood-option>span{min-height:54px;padding:6px 3px}.mood-option input:checked+span:after{display:none}.osl-color-input input[type=text],.catalog-filters input{font-size:16px}.catalog-filters>div:last-child select{height:42px}.grayscale-toggle{gap:7px}.toggle-track{width:32px}.grayscale-toggle input:checked+.toggle-track:before{transform:translate(11px)}.advanced-controls>summary{border:1.5px solid var(--ink);background:var(--soft-purple);box-shadow:2px 2px 0 var(--ink);border-radius:5px;padding:12px}.color-editor{width:calc(100vw - 28px);max-height:calc(100dvh - 30px);box-shadow:4px 4px 0 var(--ink)}.color-editor form{max-height:calc(100dvh - 30px)}.color-editor-body{padding:18px}.color-editor-heading{padding:14px 18px}.color-editor-heading h2{font-size:21px}.color-editor-values{gap:13px}.color-editor-hex-field input{font-size:16px}.color-editor-footer{padding:14px 18px 18px}.color-editor-footer button{padding:9px 14px}}@media (width<=380px){.catalog-brand-hint{font-size:12px}.color-editor-values{grid-template-columns:1fr}.color-editor-samples{grid-template-columns:1fr 1fr}.editor-sample{height:34px}.color-editor-samples>div{grid-template-columns:1fr;gap:4px;display:grid}.color-editor-heading .catalog-kicker{letter-spacing:1px}.mode-switch button{padding-left:9px;padding-right:9px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}}@media (forced-colors:active){.range-field input[type=range],.osl-blocked input{appearance:auto}.toggle-track,.paint-color-trigger,.editor-sample,.color-editor-sv{forced-color-adjust:none}.color-editor-marker{border-color:#fff;box-shadow:0 0 0 2px #000}}.preview-toolbar{justify-content:space-between;align-items:center;gap:12px;padding:16px 25px 0;display:flex}.preview-toolbar>span{color:var(--muted);font-size:12px}.preview-switch{border:1.5px solid var(--ink);border-radius:5px;flex-shrink:0;display:flex;overflow:hidden}.preview-switch button{background:var(--white);color:var(--ink);border:0;padding:9px 16px;font-size:14px;font-weight:600}.preview-switch button+button{border-left:1.5px solid var(--ink)}.preview-switch button[aria-pressed=true]{background:var(--yellow)}.model-preview{--model-paper:var(--white);--model-ink:var(--ink);--model-muted:#767181;--model-line:#dedbe5;--model-active:#f8edc1;--model-dot:#bcb7ca55;flex:1;min-width:0;padding:21px 25px 18px}.model-heading{color:var(--model-ink);justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;display:flex}.model-heading>span{letter-spacing:1px;font:12px Space Mono,monospace}.model-heading b{letter-spacing:0;font:500 14px Noto Sans SC,sans-serif}.model-reset,.model-copy{background:var(--model-paper);color:var(--model-ink);border:1.5px solid var(--model-ink);border-radius:4px;flex-shrink:0;padding:6px 12px;font-size:14px}.model-reset[aria-pressed=true]{background:var(--yellow);color:var(--ink);box-shadow:2px 2px 0 var(--model-ink)}.model-layout{grid-template-columns:minmax(0,1fr) 180px;align-items:center;gap:13px;min-height:340px;display:grid}.model-figure{aspect-ratio:1;isolation:isolate;border-radius:12px;min-width:0;position:relative}.model-figure canvas{cursor:crosshair;width:100%;height:100%;display:block}.model-pins{pointer-events:none;position:absolute;inset:0}.model-pin{border:1.5px solid var(--ink);background:var(--white);width:25px;height:25px;color:var(--ink);pointer-events:auto;border-radius:50%;padding:0;font:700 12px Space Mono,monospace;position:absolute;transform:translate(-50%,-50%);box-shadow:1px 2px #24273777}.model-pin[aria-pressed=true]{background:var(--yellow);box-shadow:0 0 0 3px var(--white),2px 3px 0 3px var(--ink);z-index:1}.model-pin:hover{background:var(--yellow)}.model-scene{justify-self:center;width:100%;max-width:410px}.model-light{border:1px solid var(--model-line);background:var(--model-paper);color:var(--model-muted);--source-color:var(--yellow);border-radius:999px;align-items:center;gap:7px;margin:4px 0 8px;padding:3px 11px 3px 5px;font-size:13px;line-height:1.4;display:inline-flex}.model-light svg{width:30px;height:30px;stroke:var(--model-ink);stroke-width:1.7px;stroke-linecap:round;fill:none;flex:none}.model-light .light-disc{fill:var(--source-color)}.model-light .light-beams{stroke:var(--model-muted);stroke-width:1.5px}.model-light.is-off .light-disc{fill:var(--model-line)}.model-light.is-off .light-beams,.model-light.is-off .light-spark{visibility:hidden}.model-status{background:var(--model-paper);width:85%;color:var(--model-ink);border:1.5px solid var(--model-line);border-radius:5px;padding:12px;font-size:14px;line-height:1.8;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.model-legend{align-content:center;gap:8px;display:grid}.model-region{text-align:left;border:1px solid var(--model-line);background:var(--model-paper);width:100%;color:var(--model-ink);border-radius:5px;grid-template-columns:24px 20px minmax(0,1fr);align-items:center;gap:7px;padding:10px 8px;display:grid;position:relative}.model-region:hover{border-color:var(--model-ink)}.model-region[aria-pressed=true]{background:var(--model-active);border-color:var(--model-ink);box-shadow:2px 2px 0 var(--model-ink)}.model-region-chip{border:1px solid var(--model-ink);border-radius:3px;width:24px;height:29px}.model-region-number{color:var(--model-muted);font:12px Space Mono,monospace}.model-region-info{gap:4px;min-width:0;display:grid}.model-region-info strong{font-size:14px;font-weight:600;line-height:1.4}.model-region-value{color:var(--model-muted);overflow-wrap:anywhere;font-variant-numeric:tabular-nums;font-size:12px;line-height:1.5}.model-caption{border-top:1px dashed var(--model-line);justify-content:space-between;align-items:center;gap:12px;min-height:51px;margin-top:8px;padding-top:13px;display:flex}.model-detail{color:var(--model-muted);font-size:14px;line-height:1.7}.model-copy{background:var(--yellow);color:var(--ink);white-space:nowrap}.model-method-note{color:var(--model-muted);margin-top:11px;font-size:12px;line-height:1.7}.model-preview-osl{--model-paper:#363045;--model-ink:#e3dbf0;--model-muted:#c1b6d0;--model-line:#62566f;--model-active:#4d415c;--model-dot:#8e81a832;border-bottom:1px dashed #71647f;padding:22px 0 16px}.model-preview-osl .model-layout{min-height:310px}.osl-comparison-color{height:48px}.model-figure{justify-self:center;max-width:410px}.model-pin:active{transform:translate(-50%,-50%)}.model-preview button:focus-visible,.preview-switch button:focus-visible{outline-offset:3px;outline:3px solid #407fcc}@media (width>=1450px){.model-layout{min-height:365px}}@media (width<=1100px){.preview-toolbar{padding:15px 18px 0}.preview-toolbar>span{display:none}.model-preview{padding:19px 18px 17px}.model-layout{grid-template-columns:minmax(0,1fr);gap:0}.model-scene{width:min(360px,100%)}.model-legend{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.model-region{padding:8px}.model-heading{margin-bottom:12px}.model-preview-osl{padding:20px 0 16px}.model-region:last-child{grid-column:1/-1}.model-region:last-child .model-region-info{justify-content:space-between;align-items:center;gap:10px;display:flex}.model-caption{margin-top:15px}}@media (width<=760px){.preview-toolbar{padding:16px 16px 0}.model-preview{padding:18px 16px}.model-scene{width:min(390px,100%)}.model-preview-osl{padding:20px 0 16px}.model-heading>span{letter-spacing:.5px}.model-caption{flex-wrap:wrap;align-items:flex-start}}@media (width<=390px){.model-region{grid-template-columns:21px minmax(0,1fr);gap:6px}.model-region-number{display:none}.model-region-chip{width:21px}.model-region:last-child .model-region-info{gap:4px;display:grid}.model-heading b{font-size:12px}}.reference-picker{justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px;display:flex}.reference-options{flex-shrink:0;gap:7px;display:flex}.reference-options button{color:#e9e1f1;background:#363045;border:1.5px solid #81738f;border-radius:5px;padding:8px 14px;font-size:14px;font-weight:600}.reference-options button[aria-pressed=true]{color:#33263d;background:#e6dffa;border-color:#e6dffa;box-shadow:2px 2px #141020}.reference-options button:focus-visible{outline-offset:3px;outline:3px solid #f8d64d}.reference-note{color:#c1b6d0;font-size:12px;line-height:1.7}.palette-panel>.reference-picker{margin:16px 25px 0}.palette-panel .reference-options button{background:var(--white);border-color:var(--line);color:var(--ink)}.palette-panel .reference-options button[aria-pressed=true]{background:var(--soft-purple);border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}.palette-panel .reference-note{color:var(--muted)}.model-region:disabled{opacity:.4;cursor:default}@media (width<=1100px){.reference-picker{flex-wrap:wrap;gap:8px}.palette-panel>.reference-picker{margin-left:18px;margin-right:18px}.reference-note{width:100%}}@media (width<=760px){.reference-picker{gap:8px;margin-bottom:14px}.reference-options{gap:6px;width:100%}.reference-options button{white-space:nowrap;flex:1;min-height:44px;padding:8px 6px}.palette-panel>.reference-picker{margin:14px 12px 0}.reference-note{font-size:12px}}.osl-preview>.reference-picker{margin-top:20px}.mobile-tools{display:none}.mobile-controls-dialog{border:2px solid var(--ink);background:var(--white);width:min(600px,100%);max-width:none;max-height:90dvh;color:var(--ink);box-shadow:0 -5px 0 var(--ink);border-bottom:0;border-radius:18px 18px 0 0;margin:auto auto 0;padding:0;overflow:hidden}.mobile-controls-dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#24273780}.mobile-sheet-layout{flex-direction:column;max-height:90dvh;display:flex}.mobile-sheet-heading{border-bottom:2px solid var(--ink);background:var(--yellow);flex-shrink:0;justify-content:space-between;align-items:center;gap:14px;padding:14px 18px;display:flex}.mobile-sheet-heading h2{font-size:18px;font-weight:800;line-height:1.5}.mobile-sheet-heading .catalog-close{width:44px;height:44px}.mobile-controls-body{overscroll-behavior:contain;scrollbar-width:thin;min-height:0;overflow:auto}.mobile-controls-body .control-panel{box-shadow:none;border:0;border-radius:0;overflow:visible}.mobile-sheet-footer{padding:12px 18px calc(12px + env(safe-area-inset-bottom));border-top:2px solid var(--ink);background:var(--soft-purple);flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;display:flex}.mobile-sheet-footer>span{color:#645874;font-size:12px}.mobile-sheet-footer button{border:2px solid var(--ink);min-height:46px;box-shadow:3px 3px 0 var(--ink);background:var(--purple);color:#fff;border-radius:6px;padding:10px 19px;font-size:15px;font-weight:700}.mobile-sheet-footer button span{color:var(--yellow);margin-left:10px}body.mobile-controls-open{overflow:hidden}@media (width<=760px),(width<=960px) and (height<=500px){:root{--shadow:3px 4px 0 var(--ink)}html{scroll-padding-top:76px;scroll-padding-bottom:110px}body{padding-bottom:calc(90px + env(safe-area-inset-bottom))}.page-shell{padding:0 max(14px,env(safe-area-inset-right)) 0 max(14px,env(safe-area-inset-left))}.site-header{gap:10px;height:64px}.brand{gap:14px;min-width:0}.brand-word{font-size:36px}.brand-description{letter-spacing:0;padding-left:12px;font-size:12px}.intro{margin:18px 0 13px}.intro .eyebrow,.intro p,.header-note{display:none}.intro h1{letter-spacing:-.8px;font-size:26px;line-height:1.45}.title-star{font-size:22px;top:-9px;right:-13px}.title-highlight:before{height:13px;bottom:4px}.mode-switch{z-index:5;background:var(--paper);grid-template-columns:1fr 1fr;gap:10px;margin:0 -2px 14px;padding:10px 2px 12px;display:grid;position:sticky;top:0}.mode-switch button{justify-content:center;gap:0;min-width:0;min-height:44px;padding:9px 6px;font-size:15px}.mode-switch button span{display:none}.workbench{grid-template-columns:minmax(0,1fr);gap:16px;min-width:0}.workbench>.comic-panel{min-width:0}.comic-panel{border-radius:10px}.panel-heading,.palette-panel .panel-heading,.osl-panel .panel-heading{flex-wrap:wrap;gap:8px;min-height:56px;padding:8px 12px}.panel-heading h2{white-space:normal;font-size:16px}.panel-caption{display:none}.step-badge{min-width:25px;font-size:12px;line-height:23px}.grayscale-toggle{gap:6px;min-height:40px;font-size:12px}.preview-toolbar{padding:12px 12px 0}.preview-switch{grid-template-columns:1fr 1fr;width:100%;display:grid}.preview-switch button{min-height:44px;padding:10px;font-size:14px}.preview-toolbar .preview-switch{grid-template-columns:repeat(2,minmax(0,1fr))}.model-preview{padding:12px}.model-preview-osl{padding:16px 0 12px}.model-heading{gap:8px;margin-bottom:9px}.model-heading>span{letter-spacing:0;font-size:12px}.model-heading b{font-size:13px}.model-reset,.model-copy{min-height:40px;padding:7px 12px}.model-layout,.model-preview-osl .model-layout{gap:10px;min-height:0}.model-scene{width:min(310px,100%)}.model-light{gap:6px;font-size:13px}.model-pin{width:28px;height:28px;font-size:12px}.model-pin:before{content:"";border-radius:50%;position:absolute;inset:-8px}.model-legend{grid-template-columns:1fr;gap:6px}.model-region{grid-template-columns:28px 22px minmax(0,1fr);gap:8px;min-height:48px;padding:8px 10px}.model-region:last-child{grid-column:auto}.model-region-number{font-size:12px;display:block}.model-region-chip{width:28px;height:28px}.model-region .model-region-info{justify-content:space-between;align-items:center;gap:10px;min-width:0;display:flex}.model-region-info strong{flex-shrink:0;font-size:14px}.model-region-value{text-align:right;overflow-wrap:normal;font-size:12px;line-height:1.5}.model-caption{gap:8px;min-height:0;margin-top:12px;padding-top:10px}.model-detail{font-size:13px;line-height:1.7}.model-copy{min-height:44px}.model-method-note{font-size:12px}.palette-strip-area,.osl-palette-area{padding:16px 12px}.strip-heading{gap:4px;margin-bottom:12px}.strip-heading h3{font-size:15px}.strip-heading>span{font-size:12px}.palette-cards{grid-template-columns:1fr;gap:8px}.palette-card{text-align:left;border-radius:5px;grid-template-columns:70px minmax(0,1fr);align-items:stretch;min-height:54px;display:grid}.palette-card .card-color{border-bottom:0;border-right:1.5px solid var(--ink);height:100%;min-height:54px}.card-info{flex-direction:row;justify-content:space-between;gap:10px;padding:10px 12px}.card-name,.osl-palette-cards .card-name{font-size:14px}.card-hex{letter-spacing:0;white-space:nowrap;font-size:13px}.palette-actions{gap:12px;margin-top:15px}.palette-tip,.osl-palette-area .palette-tip{text-align:left;font-size:13px}.copy-palette-button{min-height:46px;font-size:14px}.wheel-stage{min-height:0;padding:13px 5px 18px}.palette-wheel-wrap{width:min(315px,100%)}.wheel-footnote{font-size:12px}.osl-preview{padding:14px 12px}.osl-scene-heading{flex-wrap:wrap;gap:8px}.osl-scene-heading>span:first-child{letter-spacing:0;font-size:12px}.osl-source-row{gap:10px;margin-top:14px;padding-bottom:16px}.osl-source-heading h3{font-size:15px}.osl-source-heading p{font-size:12px}.osl-source-colors{gap:10px}.osl-source-color{min-height:46px}.osl-source-name{padding:8px 3px}.osl-source-name .card-name{font-size:13px}.osl-comparison-title{margin-top:16px}.osl-comparison{grid-template-columns:1fr 16px 1fr;gap:6px}.osl-comparison-info{padding:9px 6px;font-size:13px}.osl-comparison-color{height:44px}.osl-method{padding:15px 12px}.osl-method summary{min-height:32px;font-size:14px}.painting-note{gap:10px;margin-top:18px;padding:12px}.painting-note .note-tag,.painting-note p{font-size:12px}.page-shell footer{letter-spacing:0;padding:18px 0;font-size:12px}.mobile-tools{z-index:8;padding:10px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));border-top:2px solid var(--ink);background:var(--paper);grid-template-columns:minmax(0,1fr) 116px;gap:10px;display:grid;position:fixed;inset:auto 0 0;box-shadow:0 -3px 12px #24273710}.mobile-tools button{border:2px solid var(--ink);min-height:52px;box-shadow:2px 3px 0 var(--ink);border-radius:7px;padding:8px 10px;font-size:14px}#mobile-adjust{text-align:left;background:var(--yellow);align-items:center;gap:10px;min-width:0;display:flex}.mobile-base-chip{border:1.5px solid var(--ink);background:var(--base);border-radius:4px;flex-shrink:0;width:31px;height:34px}.mobile-adjust-label{gap:2px;min-width:0;display:grid}.mobile-adjust-label strong{font-size:14px;line-height:1.3}.mobile-adjust-label>span{font:12px Space Mono,monospace}.mobile-adjust-icon{margin-left:auto;font-size:21px}#mobile-paints{background:var(--white);align-content:center;gap:3px;display:grid}#mobile-paints strong{font-size:14px}#mobile-paints>span{letter-spacing:-.6px;white-space:nowrap;font:12px Space Mono,monospace}.mobile-controls-body .panel-heading{border:0;min-height:44px;padding:12px 18px}.mobile-controls-body .control-body{padding:0 18px 22px}.mobile-controls-body .base-input-row{gap:14px}.mobile-controls-body .catalog-open-button{min-height:46px;margin-top:15px}.mobile-controls-body .advanced-controls>summary{min-height:46px;margin-top:16px}.mobile-controls-body .color-controls{gap:12px;margin-top:18px}.range-field input[type=range]{height:44px}.range-field .range-label{font-size:14px}.range-field .comic-range::-webkit-slider-thumb{width:28px;height:29px;margin-top:-11px}.range-field .comic-range::-moz-range-thumb{width:28px;height:29px}.mobile-controls-body .presets{gap:8px;padding:3px 0}.preset-button{min-height:46px}.mobile-controls-body .mood-options{gap:8px}.mood-option>span{min-height:58px;font-size:13px}.mobile-controls-body .osl-controls{margin-top:14px;padding-top:16px}.osl-presets button{min-height:42px;font-size:14px}.osl-range{margin-top:15px}.osl-advanced summary{min-height:46px}.osl-blocked{min-height:44px}.osl-ambient-color .paint-color-trigger{width:44px;height:44px}.catalog-dialog,.color-editor{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);box-shadow:3px 4px 0 var(--ink);border-radius:12px}.catalog-dialog{height:calc(100dvh - 20px);overflow:hidden}.catalog-layout{height:100%;min-height:0}.catalog-heading,.color-editor-heading{gap:12px;padding:12px 14px}.catalog-heading h2,.color-editor-heading h2{font-size:21px}.catalog-close,.color-editor-heading .catalog-close{width:44px;height:44px}.catalog-kicker{letter-spacing:1px;font-size:12px}.catalog-toolbar{padding:12px 14px 0}.catalog-brands{gap:8px}.catalog-brands button{gap:3px 6px;min-height:65px;padding:8px}.catalog-brands button>span:nth-child(2){display:none}.paint-brand-count{font-size:12px}.catalog-filters{gap:9px;margin-top:12px}.catalog-filters label{font-size:14px}.catalog-filters input,.catalog-filters>div:last-child select{min-height:44px;font-size:16px}.catalog-count-row{padding:10px 0}.catalog-results-area{flex:1;min-height:0;max-height:none;padding:4px 14px 14px}.catalog-results{gap:10px}.paint-swatch-color{height:45px}.paint-swatch-info{gap:5px;padding:9px}.paint-swatch-info strong{font-size:14px;line-height:1.45}.catalog-footer{padding:10px 14px calc(12px + env(safe-area-inset-bottom))}.catalog-pagination{justify-content:space-between;gap:6px}.catalog-pagination button{min-height:44px;padding:8px 10px;font-size:14px}.catalog-footer p{margin-top:9px;font-size:12px;line-height:1.6}.color-editor{width:min(460px,100vw - 20px)}.color-editor form{max-height:calc(100dvh - 24px)}.color-editor-body{padding:16px}.color-editor-sv{aspect-ratio:2.2;min-height:120px}.color-editor-sliders{gap:7px;margin-top:16px}.color-editor-values{grid-template-columns:1fr;gap:14px;margin-top:15px;padding-top:14px}.color-editor-samples{gap:12px}.color-editor-samples>div{text-align:left;grid-template-rows:1fr 1fr;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:2px 7px;display:grid}.editor-sample{grid-row:1/3;height:38px}.color-editor-samples strong{font-size:12px}.color-editor-hex-field label{margin-bottom:6px}.color-editor-hex-field input{height:44px;font-size:16px}.color-editor-footer{padding:12px 16px calc(14px + env(safe-area-inset-bottom));grid-template-columns:1fr 1.6fr;gap:12px;display:grid}.color-editor-footer button{min-height:46px;padding:10px 8px;font-size:14px}.toast{bottom:calc(90px + env(safe-area-inset-bottom));font-size:14px}}@media (width<=360px){.page-shell{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}.brand-word{font-size:33px}.brand-description{padding-left:9px;font-size:12px}.brand{gap:10px}.intro h1{font-size:24px}.palette-panel .panel-heading,.osl-panel .panel-heading{gap:6px;padding-left:10px;padding-right:10px}.panel-heading h2{font-size:15px}.grayscale-toggle{gap:4px}.grayscale-toggle .toggle-track{width:29px}.model-region{grid-template-columns:25px 18px minmax(0,1fr);gap:6px;padding:8px}.model-region-chip{width:25px}.model-region .model-region-info{gap:5px}.model-region-info strong{font-size:13px}.model-region-value{font-size:12px}.mobile-tools{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));grid-template-columns:minmax(0,1fr) 110px;gap:8px}.mobile-tools button{padding:8px}.mobile-adjust-label strong{font-size:13px}.mobile-adjust-icon{display:none}.mobile-base-chip{width:26px}.card-info{gap:7px;padding:9px}.card-hex{font-size:12px}.palette-card{grid-template-columns:60px minmax(0,1fr)}.catalog-pagination button{padding:8px}.catalog-pagination{gap:4px}}@media (width<=760px) and (height<=600px),(width<=960px) and (height<=500px){.mobile-controls-dialog,.mobile-sheet-layout{max-height:100dvh}.mobile-controls-dialog{border-radius:0}.mobile-sheet-heading{padding:8px 14px}.mobile-sheet-footer{padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.catalog-heading,.color-editor-heading{padding:8px 12px}.catalog-heading .catalog-kicker,.color-editor-heading .catalog-kicker{display:none}.catalog-toolbar{padding-top:8px}.catalog-brands button{flex-wrap:nowrap;min-height:44px}.paint-brand-count{flex-basis:auto;margin-left:auto}.catalog-filters{margin-top:8px}.catalog-filters>div:first-child label,.catalog-count-row,.catalog-footer p{display:none}.catalog-results-area{padding-top:10px}.catalog-footer{padding-top:8px;padding-bottom:8px}.catalog-filters{grid-template-columns:minmax(0,1fr) minmax(0,.8fr)}.catalog-filters>div:last-child label{display:none}}.page-shell{max-width:1440px;padding-left:32px;padding-right:32px}.site-header{height:78px}.intro{margin:20px 0 18px}.intro h1{font-size:32px}.intro .eyebrow{margin-bottom:5px;font-size:10px}.intro p{font-size:14px}.workbench{grid-template-columns:minmax(0,1fr) 320px;align-items:start;gap:24px;scroll-margin-top:18px}.workbench>.control-panel{max-height:calc(100dvh - 36px);box-shadow:6px 7px 0 var(--ink);grid-area:1/2;position:sticky;top:18px;overflow:hidden}.control-panel .panel-heading{background:var(--yellow);min-height:55px;padding:14px 18px}.control-panel .panel-heading h2{font-size:17px}.inspector-live{white-space:nowrap;align-items:center;gap:5px;margin-left:auto;font-size:11px;display:flex}.inspector-live i{background:#26704c;border-radius:50%;width:6px;height:6px}.control-panel .control-body{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--purple) transparent;max-height:calc(100dvh - 93px);padding:18px;overflow-y:auto}.workbench>.palette-panel,.workbench>.osl-panel{grid-area:1/1;min-width:0;overflow:visible}.color-fine-tuning{border-block:1px dashed var(--line);margin-top:16px}.color-fine-tuning summary{cursor:pointer;justify-content:space-between;align-items:center;padding:12px 0;font-size:13px;font-weight:600;list-style:none;display:flex}.color-fine-tuning summary::-webkit-details-marker{display:none}.color-fine-tuning[open] summary>span{transform:rotate(45deg)}.color-fine-tuning .color-controls{gap:12px;margin:4px 0 12px}.advanced-controls{flex-direction:column;display:flex}.advanced-controls .preset-section{margin-top:18px}.advanced-controls .settings-divider{display:none}.mood-field{margin-top:18px}.presets{grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}.preset-button{background:0 0;border:0;border-radius:5px;min-height:38px;padding:3px}.preset-chip{border:1.5px solid var(--ink);width:100%;height:29px}.preset-button[aria-pressed=true]{outline:2px solid var(--ink);box-shadow:2px 3px 0 var(--ink);background:var(--yellow)}.mood-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.mood-option>span{white-space:nowrap;flex-direction:column;justify-content:center;gap:2px;height:58px;padding:7px 2px;font-size:12px;display:flex}.mood-option input:checked+span:after{display:none}.mood-symbol{font-size:20px}.contrast-field{margin-top:18px}.control-panel .osl-controls{margin-top:18px;padding-top:16px}.osl-control-title .step-badge{display:none}.osl-control-title h3{font-size:15px}.control-panel .osl-range{margin-top:14px}.range-label{margin-bottom:3px}.model-preview{z-index:3;background:var(--white);border-block:1px solid var(--line);padding:16px 20px 12px;position:sticky;top:18px;box-shadow:0 7px 12px #2427370c}.model-layout,.model-preview-osl .model-layout{grid-template-columns:minmax(0,1fr) 174px;gap:14px;min-height:0}.model-scene{width:min(360px,100%);min-width:160px;max-width:min(360px,100dvh - 270px)}.model-heading{margin-bottom:3px}.model-light{margin:0;padding:2px 8px 2px 4px;font-size:11px}.model-light svg{width:24px;height:24px}.model-caption{min-height:0;margin-top:3px;padding-top:8px}.model-detail{font-size:12px}.model-region{padding:9px 7px}.model-region-info strong{font-size:12px}.model-region-value{font-size:11px}.model-region-number{display:none}.model-region{grid-template-columns:24px minmax(0,1fr)}.model-region:last-child{grid-column:auto}.model-region:last-child .model-region-info{display:grid}.model-preview-osl{background:#30293d;border:1px solid #62566f;border-radius:8px;margin-top:12px}.model-preview-osl .model-method-note{font-size:11px}.osl-preview{overflow:visible}.palette-strip-area,.osl-palette-area{z-index:0;position:relative}.reference-note{width:auto}.reference-options{flex-shrink:1}body.color-editor-open{overflow:auto}.color-editor{z-index:20;width:320px;max-height:calc(100dvh - 36px);margin:0;position:fixed;inset:18px max(32px,50vw - 688px) auto auto}.color-editor form{max-height:calc(100dvh - 40px)}.color-editor-heading{padding:12px 16px}.color-editor-heading h2{font-size:18px}.color-editor-heading .catalog-kicker{font-size:10px}.color-editor-body{padding:16px}.color-editor-sv{aspect-ratio:1.8;min-height:110px}.color-editor-sliders{gap:5px;margin-top:15px}.color-editor-values{grid-template-columns:1fr;gap:12px;margin-top:10px;padding-top:12px}.color-editor-samples{grid-template-columns:1fr 1fr}.color-editor-samples>div{text-align:left;grid-template-rows:1fr 1fr;grid-template-columns:32px 1fr;gap:2px 6px;display:grid}.editor-sample{grid-row:1/3;height:32px}.color-editor-footer{gap:10px;padding:12px 16px}.color-editor-footer button{padding:9px 13px}body.color-editor-open .control-panel{visibility:hidden}@media (width>=761px) and (width<=1100px){.page-shell{padding-left:20px;padding-right:20px}.workbench{grid-template-columns:minmax(0,1fr) 290px;gap:16px}.color-editor{width:290px;right:20px}.model-layout,.model-preview-osl .model-layout{grid-template-columns:1fr;gap:5px}.model-scene{max-width:min(300px,100dvh - 280px)}.model-legend{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.model-region{justify-content:center;padding:5px;display:flex}.model-region-chip{width:100%;height:24px}.model-region-info{display:none!important}.model-heading b{font-size:12px}}@media (width<=760px),(width<=960px) and (height<=500px){:root{--live-height:44dvh;--desk-height:calc(56dvh - 12px)}.page-shell{padding-inline:12px}.site-header{height:60px}.intro{margin:14px 0 8px}.intro h1{font-size:25px}.mode-switch{gap:8px}.workbench{grid-template-columns:1fr}.workbench>.palette-panel,.workbench>.osl-panel{grid-column:1}.model-preview{box-shadow:none;padding:12px;position:static}.model-layout,.model-preview-osl .model-layout{grid-template-columns:1fr;gap:8px}.model-scene{width:min(310px,100%);min-width:0;max-width:none}.model-region{grid-template-columns:28px minmax(0,1fr);padding:8px 10px}.model-region-number{display:none}.model-region-info strong{font-size:14px}.model-region-value{font-size:12px}.model-region:last-child .model-region-info{display:flex}.model-caption{margin-top:10px}.model-detail{font-size:13px}.mobile-controls-dialog{width:calc(100% - 16px);height:var(--desk-height);max-height:var(--desk-height);border:2px solid var(--ink);box-shadow:3px 4px 0 var(--ink);z-index:12;border-radius:12px;margin:0;position:fixed;inset:auto 8px 8px}.mobile-sheet-layout{height:100%;max-height:100%}.mobile-sheet-heading{min-height:46px;padding:7px 12px}.mobile-sheet-heading h2{font-size:16px}.mobile-sheet-heading .catalog-close{width:34px;height:34px}.mobile-sheet-footer{padding:8px 12px calc(8px + env(safe-area-inset-bottom));gap:6px}.mobile-sheet-footer button{min-height:36px;padding:7px 12px;font-size:12px}.mobile-sheet-footer>span{font-size:11px}.mobile-controls-body .panel-heading{display:none}.mobile-controls-body .control-body{max-height:none;padding:14px 16px 20px;overflow:visible}.mobile-controls-body .control-panel{max-height:none;box-shadow:none;position:static}.mobile-controls-body .presets{gap:6px}.mobile-controls-body .preset-button{min-height:40px}.mobile-controls-body .mood-options{gap:7px}.mobile-controls-body .mood-option>span{min-height:56px;font-size:12px}body.mobile-controls-open,body.color-editor-open{overflow:hidden}body:is(.mobile-controls-open,.color-editor-open) .mobile-tools{display:none}body:is(.mobile-controls-open,.color-editor-open) .mode-switch{z-index:11;background:0 0;margin:0;padding:0;position:fixed;top:4px;left:12px;right:12px}.mode-switch button{min-height:42px}body:is(.mobile-controls-open,.color-editor-open) .model-preview:not([hidden]){z-index:10;height:calc(var(--live-height) - 62px);border:2px solid var(--ink);min-height:140px;box-shadow:3px 4px 0 var(--ink);border-radius:12px;margin:0;padding:8px 10px;position:fixed;top:56px;left:8px;right:8px;overflow:hidden}body:is(.mobile-controls-open,.color-editor-open) .model-heading,body:is(.mobile-controls-open,.color-editor-open) .model-caption,body:is(.mobile-controls-open,.color-editor-open) .model-method-note{display:none}body:is(.mobile-controls-open,.color-editor-open) .model-layout{grid-template-columns:minmax(0,1fr) 38px;gap:6px;height:100%;min-height:0;display:grid}body:is(.mobile-controls-open,.color-editor-open) .model-scene{aspect-ratio:1;justify-self:center;width:auto;max-width:100%;height:100%;position:relative}body:is(.mobile-controls-open,.color-editor-open) .model-light{z-index:1;background:0 0;border:0;padding:0;position:absolute;top:2px;left:-36px}body:is(.mobile-controls-open,.color-editor-open) .model-light>span{display:none}body:is(.mobile-controls-open,.color-editor-open) .model-figure{width:auto;height:100%}body:is(.mobile-controls-open,.color-editor-open) .model-legend{grid-template-rows:repeat(5,minmax(0,1fr));grid-template-columns:1fr;gap:4px;height:100%}body:is(.mobile-controls-open,.color-editor-open) .model-region{border:1px solid var(--model-line);min-height:0;padding:3px;display:block}body:is(.mobile-controls-open,.color-editor-open) .model-region-info{display:none!important}body:is(.mobile-controls-open,.color-editor-open) .model-region-chip{width:100%;height:100%;min-height:10px;display:block}body:is(.mobile-controls-open,.color-editor-open) .model-pin{width:23px;height:23px;font-size:10px}body.color-editor-open .mobile-controls-dialog{visibility:hidden}.color-editor{width:calc(100% - 16px);height:var(--desk-height);max-height:var(--desk-height);z-index:20;border-radius:12px;margin:0;inset:auto 8px 8px}.color-editor form{height:100%;max-height:100%}.color-editor-heading{min-height:46px;padding:7px 12px}.color-editor-heading .catalog-kicker{display:none}.color-editor-heading h2{margin:0;font-size:16px}.color-editor-heading .catalog-close{width:34px;height:34px}.color-editor-body{padding:12px 16px}.color-editor-sv{aspect-ratio:2.8;min-height:90px}.color-editor-footer{padding:8px 12px calc(8px + env(safe-area-inset-bottom));grid-template-columns:1fr 1fr}.color-editor-footer button{min-height:36px;padding:7px 12px;font-size:12px}.color-editor-samples>div{grid-template-columns:32px 1fr}.color-editor-hex-field input{font-size:16px}.toast{bottom:calc(var(--desk-height) + 16px)}}@media (width<=960px) and (height<=500px){:root{--live-height:100dvh;--desk-height:calc(100dvh - 16px)}body:is(.mobile-controls-open,.color-editor-open) .mode-switch{left:8px;right:52%}body:is(.mobile-controls-open,.color-editor-open) .model-preview:not([hidden]){height:calc(100dvh - 68px);right:52%}.mobile-controls-dialog,.color-editor{width:calc(50% - 8px);left:50%}}@media (width>=761px) and (height>=501px){.site-header{height:62px}.brand-word{font-size:40px}.intro{margin:10px 0 8px}.intro h1{font-size:24px}.intro .eyebrow,.intro p{display:none}.title-star{font-size:20px;top:-8px}.mode-switch{margin-bottom:16px}.mode-switch button{min-height:42px;padding:9px 18px}.workbench>.control-panel{max-height:calc(100dvh - 184px)}.control-panel .control-body{max-height:calc(100dvh - 241px)}.palette-panel .panel-heading,.osl-panel .panel-heading{min-height:54px;padding:10px 20px}.panel-heading h2{font-size:17px}.preview-options{justify-content:space-between;align-items:center;gap:10px;padding:12px 20px;display:flex}.preview-options .preview-toolbar{padding:0}.preview-options .reference-picker{margin:0}.preview-options .reference-note{display:none}.preview-switch button,.reference-options button{padding:8px 12px;font-size:13px}.model-scene{max-width:min(340px,100dvh - 397px)}.osl-preview{padding:14px 18px}.osl-scene-heading{margin-bottom:10px}.osl-preview>.reference-picker{margin:0}.model-preview-osl{margin-top:12px}.model-preview-osl .model-scene{max-width:min(320px,100dvh - 425px)}.model-preview-osl .model-method-note{margin-top:5px}.osl-source-row{margin-top:18px}}@media (width>=761px) and (width<=1100px) and (height>=501px){.preview-options{flex-wrap:wrap;gap:8px;padding:10px 14px}.model-scene{max-width:min(280px,100dvh - 425px)}.preview-options .reference-options button{padding:7px 9px}.model-preview{padding-inline:14px}}@media (width<=760px),(width<=960px) and (height<=500px){body:is(.mobile-controls-open,.color-editor-open) #wheel-stage:not([hidden]){z-index:10;height:calc(var(--live-height) - 62px);background:var(--white);border:2px solid var(--ink);box-shadow:3px 4px 0 var(--ink);border-radius:12px;padding:4px;position:fixed;top:56px;left:8px;right:8px}body:is(.mobile-controls-open,.color-editor-open) .palette-wheel-wrap{width:auto;height:100%}body:is(.mobile-controls-open,.color-editor-open) .wheel-footnote,body:is(.mobile-controls-open,.color-editor-open) .stage-label{display:none}body:is(.mobile-controls-open,.color-editor-open):after{content:"";background:var(--paper);z-index:9;pointer-events:none;position:fixed;inset:0}body:is(.mobile-controls-open,.color-editor-open) .model-scene,body:is(.mobile-controls-open,.color-editor-open) .model-legend{min-width:0;min-height:0}body:is(.mobile-controls-open,.color-editor-open) .model-light{left:0}.preview-options .reference-picker{margin:12px}.preview-options .reference-note{display:none}body:is(.mobile-controls-open,.color-editor-open) .model-heading{display:contents}body:is(.mobile-controls-open,.color-editor-open) .model-heading>span{display:none}body:is(.mobile-controls-open,.color-editor-open) .model-reset{z-index:2;min-height:34px;padding:5px 9px;font-size:12px;position:absolute;bottom:10px;left:10px}}@media (width<=960px) and (height<=500px){body:is(.mobile-controls-open,.color-editor-open) #wheel-stage:not([hidden]){height:calc(100dvh - 68px);right:52%}}.control-panel .selected-paint{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:3px 8px;padding:10px 12px;display:grid}.control-panel .selected-paint-label{font-size:11px}.control-panel .selected-paint strong{font-size:14px}.control-panel #selected-paint-range{grid-column:2;font-size:11px}.palette-panel{--preview-background:#dddad3}.palette-panel #palette-model,.palette-panel #wheel-stage{background-color:var(--preview-background);background-image:radial-gradient(#7f786f18 .7px,#0000 .7px);background-size:7px 7px}body:is(.mobile-controls-open,.color-editor-open) .palette-panel #wheel-stage:not([hidden]){background-color:var(--preview-background)}#palette-model{--model-muted:#5f5b64;--model-line:#c6c1b9}.palette-panel .stage-label>span:nth-child(2),.palette-panel .wheel-footnote{color:#5f5b64}.studio-help{z-index:15;flex:none;font-size:12px;position:relative}.studio-help>summary{cursor:pointer;border:1.5px solid var(--ink);background:var(--white);border-radius:5px;align-items:center;gap:8px;padding:8px 11px;font-weight:600;list-style:none;display:flex}.studio-help>summary::-webkit-details-marker{display:none}.studio-help>summary span{background:var(--yellow);border:1px solid var(--ink);border-radius:50%;place-items:center;width:19px;height:19px;font-family:Space Mono,monospace;display:grid}.studio-help[open]>summary{background:var(--yellow)}.studio-help-content{overscroll-behavior:contain;background:var(--white);border:2px solid var(--ink);width:min(440px,100vw - 32px);max-height:calc(100dvh - 100px);box-shadow:4px 5px 0 var(--ink);color:var(--ink);border-radius:8px;position:absolute;top:calc(100% + 12px);right:0;overflow:auto}.studio-help .painting-note{box-shadow:none;border:0;border-radius:0;gap:10px;margin:0;padding:18px}.studio-help .painting-note .note-decoration{display:none}.studio-help .painting-note p{font-size:13px;line-height:1.8}.studio-help .osl-method{padding:16px 18px}.studio-help .osl-method summary{font-size:13px}@media (width>=761px) and (height>=501px),(width>=961px){:root{--studio-gap:16px;--studio-edge:16px;--inspector-width:clamp(288px,26vw,340px)}html,body,body.color-editor-open{height:100%;overflow:hidden}body{padding:0}.page-shell{width:100%;max-width:none;height:100dvh;padding:12px calc(var(--studio-edge) + var(--inspector-width) + var(--studio-gap)) 16px var(--studio-edge);grid-template-rows:48px minmax(0,1fr);gap:10px;display:grid;overflow:hidden}.site-header{gap:14px;min-width:0;height:48px;padding-bottom:9px}.brand{gap:15px}.brand-word{font-size:37px}.brand-description{letter-spacing:0;padding-left:15px;font-size:12px}.site-header .header-note{display:none}.studio-help{margin-left:auto}.page-shell>main{grid-template-rows:40px minmax(0,1fr);gap:12px;min-width:0;min-height:0;display:grid}.intro,.page-shell>footer{display:none}.mode-switch{gap:8px;height:40px;margin:0;padding:0;position:static}.mode-switch button{height:38px;min-height:38px;padding:8px 16px;font-size:14px}.mode-switch button span{font-size:11px}.workbench{height:100%;min-height:0;scroll-margin:0;display:block}.workbench>.control-panel{inset:12px var(--studio-edge) 16px auto;width:var(--inspector-width);height:calc(100dvh - 28px);max-height:none;box-shadow:4px 5px 0 var(--ink);flex-direction:column;display:flex;position:fixed;overflow:hidden}.control-panel .panel-heading{flex:none;min-height:54px;padding:13px 16px}.control-panel .control-body{overscroll-behavior:contain;flex:1;min-height:0;max-height:none;padding:18px 16px;overflow-y:auto}.workbench>.palette-panel,.workbench>.osl-panel{height:100%;min-height:0;box-shadow:4px 5px 0 var(--ink);position:relative;overflow:hidden}.workbench>.palette-panel{grid-template-rows:46px 50px minmax(0,1fr) auto;display:grid}.workbench>.osl-panel{grid-template-rows:46px minmax(0,1fr) auto;display:grid}.palette-panel .panel-heading,.osl-panel .panel-heading{flex-wrap:nowrap;gap:8px;min-height:0;padding:6px 16px}.panel-heading h2{font-size:16px}.grayscale-toggle{min-height:30px;font-size:12px}.preview-options{flex-wrap:nowrap;gap:8px;min-width:0;padding:8px 16px;display:flex}.preview-options .preview-toolbar{padding:0}.preview-options .reference-picker{margin:0}.preview-switch button{padding:6px 10px;font-size:12px}.reference-options{gap:6px}.reference-options button{min-height:32px;padding:6px 10px;font-size:12px}.reference-note{display:none}.model-preview{min-height:0;box-shadow:none;border:0;flex-direction:column;padding:8px 16px;display:flex;position:relative;top:auto;overflow:hidden}.model-heading{display:contents}.model-heading>span{display:none}.model-reset{z-index:2;min-height:30px;padding:4px 9px;font-size:12px;position:absolute;bottom:44px;left:16px}.model-layout,.model-preview-osl .model-layout{flex:1;grid-template-columns:minmax(0,1fr) 174px;align-items:stretch;gap:14px;min-height:0;display:grid}.model-scene,.model-preview-osl .model-scene{place-items:center;width:100%;min-width:0;max-width:none;height:100%;min-height:0;display:grid;position:relative;container-type:size}.model-scene .model-figure{aspect-ratio:1;width:min(100cqw,100cqh);max-width:none;height:min(100cqw,100cqh)}.model-light{z-index:1;padding:2px 6px;font-size:11px;position:absolute;top:2px;left:0}.model-light svg{width:23px;height:23px}.model-legend{overscroll-behavior:contain;scrollbar-width:thin;grid-template-columns:1fr;align-content:center;gap:6px;min-height:0;display:grid;overflow-y:auto}.model-region{flex:none;grid-template-columns:23px minmax(0,1fr);gap:7px;min-height:44px;padding:7px 6px;display:grid}.model-region:last-child{grid-column:auto}.model-region-chip{width:23px;height:26px}.model-region-number{display:none}.model-region .model-region-info,.model-region:last-child .model-region-info{gap:3px;display:grid!important}.model-region-info strong{font-size:12px}.model-region-value{text-align:left;font-size:11px}.model-caption{flex:none;align-items:center;gap:8px;min-height:26px;max-height:58px;margin:5px 0 0;padding:5px 0 0;overflow-y:auto}.model-detail{font-size:12px;line-height:1.55}.model-copy{min-height:28px;padding:4px 8px;font-size:12px}.model-method-note{display:none}.palette-strip-area,.osl-palette-area{flex:none;padding:10px 16px 12px;overflow:hidden}.strip-heading{align-items:center;margin-bottom:7px}.strip-heading h3{font-size:13px}.strip-heading>span{font-size:11px}.palette-cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.palette-card{border-radius:5px;flex-direction:column;min-height:0;display:flex}.palette-card .card-color,.osl-palette-cards .card-color{height:36px;min-height:36px}.card-info{flex-direction:row;justify-content:space-between;align-items:center;gap:5px;padding:6px 7px;display:flex}.card-name,.osl-palette-cards .card-name{font-size:12px}.card-hex{letter-spacing:-.5px;white-space:nowrap;font-size:11px}.palette-actions{flex-direction:row;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;display:flex}.palette-tip,.osl-palette-area .palette-tip{text-align:left;max-width:none;font-size:11px;line-height:1.5}.copy-palette-button{white-space:nowrap;flex:none;min-height:32px;padding:6px 10px;font-size:12px}.copy-palette-button svg{width:15px;height:15px}.wheel-stage{min-height:0;padding:8px 16px 28px;overflow:hidden;container-type:size}.palette-wheel-wrap{flex:none;width:min(100cqw,100cqh);height:min(100cqw,100cqh);position:relative}.wheel-footnote{font-size:12px;position:absolute;bottom:5px}.stage-label{top:16px}.stage-label>span:first-child{font-size:18px}.osl-preview{grid-template-rows:34px minmax(0,1fr);grid-template-columns:minmax(0,1fr) 200px;gap:10px 14px;min-width:0;min-height:0;padding:10px 14px;display:grid;overflow:hidden}.osl-preview>.reference-picker{grid-area:1/1;align-self:center;margin:0}.osl-scene-heading{grid-area:1/2;justify-content:flex-end;margin:0}.osl-scene-heading>span:first-child{display:none}.model-preview-osl{background:0 0;border:0;border-radius:0;grid-area:2/1;margin:0;padding:6px 0 0}.model-preview-osl .model-layout{grid-template-columns:minmax(0,1fr) 145px;gap:10px}.model-preview-osl .model-reset{left:2px}.model-preview-osl .model-caption{max-height:58px}.model-preview-osl .model-region{grid-template-columns:20px minmax(0,1fr);gap:6px;padding:7px 5px}.model-preview-osl .model-region-chip{width:20px}.osl-reading{overscroll-behavior:contain;scrollbar-width:thin;grid-area:2/2;min-height:0;padding:2px 3px 4px 0;overflow-y:auto}.osl-reading .osl-source-row{margin:0;padding-bottom:14px;display:block}.osl-reading .osl-source-heading{justify-content:space-between;align-items:center;gap:6px;margin-bottom:8px;display:flex}.osl-source-heading h3{margin:0;font-size:13px}.osl-source-heading p{font-size:11px;line-height:1.5}.osl-source-colors{gap:8px}.osl-source-color{letter-spacing:0;min-height:47px;font-size:11px}.osl-source-name{padding:6px 3px}.osl-source-name .card-name{font-size:12px}.osl-comparison-title{flex-direction:column;align-items:flex-start;gap:4px;margin:13px 0 8px;display:flex}.osl-comparison-title h3{font-size:13px}.osl-comparison-title>span{font-size:11px;line-height:1.5}.osl-comparison{grid-template-columns:1fr 12px 1fr;gap:5px}.osl-comparison-arrow{font-size:16px}.osl-comparison-color{height:43px}.osl-comparison-info{flex-direction:column;align-items:center;gap:5px;padding:7px 2px;font-size:11px;display:flex}.osl-comparison-info strong{font-size:11px}.osl-scene-note{margin-top:12px;font-size:11px;line-height:1.7}.color-editor{inset:12px var(--studio-edge) 16px auto;width:var(--inspector-width);height:calc(100dvh - 28px);max-height:none;margin:0}.color-editor form{height:100%;min-height:0;max-height:100%}.color-editor-body{flex:1}.color-editor-footer{flex:none}.toast{bottom:20px;left:calc((100vw - var(--inspector-width) - var(--studio-gap))/2);max-width:calc(100vw - var(--inspector-width) - 48px)}}@media (width>=761px) and (width<=1100px) and (height>=501px),(width>=961px) and (width<=1100px){:root{--studio-edge:12px;--studio-gap:12px;--inspector-width:288px}.brand-description{display:none}.preview-options{padding-inline:12px}.preview-options .reference-options button{padding:6px 8px}.model-preview{padding-inline:12px}.model-layout{grid-template-columns:minmax(0,1fr) 150px;gap:10px}.osl-preview{grid-template-columns:minmax(0,1fr) 172px;gap:8px;padding:10px}.model-preview-osl .model-layout{grid-template-rows:minmax(0,1fr) 32px;grid-template-columns:minmax(0,1fr);gap:6px}.model-preview-osl .model-legend{grid-template-rows:32px;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;overflow:visible}.model-preview-osl .model-region{min-height:0;padding:3px;display:block}.model-preview-osl .model-region .model-region-info{display:none!important}.model-preview-osl .model-region-chip{width:100%;height:24px;display:block}.model-preview-osl .model-reset{bottom:76px}.palette-strip-area,.osl-palette-area{padding:8px 12px 10px}.palette-cards{gap:6px}.card-info{flex-direction:column;align-items:flex-start;gap:2px;padding:5px 6px}.palette-actions{gap:6px}.palette-tip{max-width:260px}.model-light>span{display:none}}@media (width>=961px) and (height<=600px){.page-shell{grid-template-rows:40px minmax(0,1fr);gap:8px;padding-top:8px;padding-bottom:12px}.site-header{height:40px;padding-bottom:5px}.brand-word{font-size:31px}.page-shell>main{grid-template-rows:34px minmax(0,1fr);gap:8px}.mode-switch,.mode-switch button{height:32px;min-height:32px}.mode-switch button{padding:5px 12px}.workbench>.palette-panel{grid-template-rows:40px 42px minmax(0,1fr) auto}.workbench>.osl-panel{grid-template-rows:40px minmax(0,1fr) auto}.model-region{min-height:36px;padding:4px 6px}.palette-card .card-color,.osl-palette-cards .card-color{height:25px;min-height:25px}.strip-heading{display:none}.palette-strip-area,.osl-palette-area{padding-top:8px;padding-bottom:8px}.palette-actions{margin-top:6px}.model-caption{max-height:38px}.osl-preview{gap:6px 12px;padding-top:6px}}@media (width<=760px),(width<=960px) and (height<=500px){.site-header .header-note{display:none}.studio-help>summary{gap:5px;padding:6px 8px;font-size:11px}.studio-help>summary span{display:none}.site-header{gap:8px}.brand-description{display:none}.studio-help-content{width:auto;max-height:calc(100dvh - 90px);position:fixed;top:64px;left:12px;right:12px}}@media (width>=761px) and (height>=501px),(width>=961px){.osl-reading .osl-source-row{padding-bottom:8px}.osl-reading .osl-source-heading{margin-bottom:6px}.osl-source-color{min-height:39px}.osl-source-name{padding:4px 3px;line-height:1.4}.osl-comparison-title{margin-top:9px}.osl-comparison-color{height:37px}.osl-comparison-info{gap:3px;padding:5px 2px}.osl-scene-note{margin-top:8px}}@media (width<=760px),(width<=960px) and (height<=500px){body:is(.mobile-controls-open,.color-editor-open) .studio-help{visibility:hidden}}.preview-options{background:var(--white);border-bottom:1px solid var(--line);grid-template-columns:auto minmax(0,1fr) 48px;align-items:center;gap:10px;padding:8px 16px;display:grid}.preview-options .reference-picker{flex-wrap:nowrap;min-width:0;margin:0}.preview-options .reference-note{display:none}.preview-options .preview-toolbar{justify-content:flex-end;min-width:0;padding:0}.preview-options .reference-options{gap:6px}.preview-options .reference-options button{background:var(--white);border-color:var(--line);min-height:32px;color:var(--ink);white-space:nowrap;padding:6px 10px;font-size:12px}.preview-options .reference-options button[aria-pressed=true]{background:var(--soft-purple);border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}.preview-options .model-reset{background:var(--white);width:48px;min-height:32px;color:var(--ink);border-color:var(--ink);padding:5px 7px;font-size:12px;position:static}.preview-options .model-reset[aria-pressed=true]{background:var(--yellow);box-shadow:2px 2px 0 var(--ink)}.preview-options .preview-status{border:1px solid var(--line);color:var(--muted);white-space:nowrap;border-radius:4px;align-items:center;gap:6px;padding:5px 8px;font-size:12px;display:inline-flex}.preview-status:before{content:"";background:var(--purple);border-radius:50%;width:6px;height:6px}.preview-options button:focus-visible{outline-offset:3px;outline:3px solid #407fcc}.control-panel .mood-option>span{gap:3px;height:64px;padding:6px 2px}.mood-symbol{width:28px;height:28px;color:var(--ink);place-items:center;line-height:0;display:grid}.mood-symbol svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:28px;height:28px;display:block}.mood-symbol .mood-hatching{stroke-width:1.1px;opacity:.6}.mood-option input[value=warm]:checked+span{background:#fff1d3}.mood-option input[value=cool]:checked+span{background:#e4f2fa}.mood-option:hover>span{border-color:var(--ink)}#osl-model .model-light{border-radius:9px;gap:7px;padding:4px 9px 4px 4px}#osl-model .model-light svg{width:44px;height:44px}#osl-model .light-core{fill:var(--core-color);stroke:none}#osl-model .light-label{gap:4px;font-size:10px;display:grid}#osl-model .light-core-value{color:var(--model-ink);font-size:11px;font-weight:600}#osl-model .model-light.is-off .light-core,#osl-model .model-light.is-occluded .light-beams,#osl-model .model-light.is-occluded .light-spark{visibility:hidden}.palette-stage{background:var(--preview-background);background-image:radial-gradient(#7f786f18 .7px,#0000 .7px);background-size:7px 7px}.palette-reading{color:var(--ink)}.palette-reading h3{margin:0 0 10px;font-size:13px}.overview-base{border:1.5px solid var(--ink);border-radius:6px;flex-direction:column;justify-content:space-between;gap:16px;padding:12px;display:flex;box-shadow:3px 3px #24273722}.overview-base>span{font-size:12px}.overview-base strong{font:700 18px Space Mono,monospace}.overview-settings{gap:10px;margin:17px 0 0;display:grid}.overview-settings>div{justify-content:space-between;gap:8px;font-size:12px;line-height:1.7;display:flex}.overview-settings dt{color:#5f5b64}.overview-settings dd{margin:0;font-weight:600}#overview-description{color:#5f5b64;margin-top:13px;font-size:12px;line-height:1.8}.overview-hsl{color:#5f5b64;border-top:1px dashed #aaa49c;justify-content:space-between;gap:8px;margin-top:14px;padding-top:11px;font:11px Space Mono,monospace;display:flex}.overview-hsl b{color:var(--ink);font-weight:400}@media (width>=761px) and (height>=501px),(width>=961px){.workbench>:is(.palette-panel,.osl-panel){grid-template-rows:46px 50px minmax(0,1fr) 148px;display:grid}.preview-stage{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr) 200px;gap:0;min-width:0;min-height:0;padding:0;display:grid;overflow:hidden}.preview-stage>.model-preview{min-height:0;box-shadow:none;border:0;border-radius:0;grid-area:1/1;margin:0;padding:8px 14px}.preview-stage>.model-preview .model-layout{grid-template-rows:minmax(0,1fr) 38px;grid-template-columns:minmax(0,1fr);gap:8px;min-height:0}.preview-stage .model-legend{grid-template-rows:38px;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;overflow:visible}.preview-stage .model-region{grid-template-columns:17px minmax(0,1fr);gap:5px;min-height:0;padding:5px;display:grid}.preview-stage .model-region-chip{width:17px;height:24px;display:block}.preview-stage .model-region .model-region-info{display:block!important}.preview-stage .model-region-info strong{white-space:nowrap;text-overflow:ellipsis;font-size:11px;display:block;overflow:hidden}.preview-stage .model-region-value{display:none}.preview-stage .model-scene{width:100%;min-width:0;max-width:none;height:100%;min-height:0}.preview-stage .model-caption{flex-wrap:nowrap;align-items:center;height:34px;min-height:34px;max-height:34px;margin:5px 0 0;padding-top:4px;overflow:hidden}.preview-stage .model-detail{overscroll-behavior:contain;scrollbar-width:thin;max-height:29px;font-size:11px;line-height:1.3;overflow-y:auto}.preview-stage .model-copy{min-height:27px;padding:4px 6px;font-size:11px}.preview-stage>:is(.palette-reading,.osl-reading){overscroll-behavior:contain;scrollbar-width:thin;grid-area:1/2;min-width:0;min-height:0;padding:12px 14px 12px 0;overflow-y:auto}.preview-stage>.wheel-stage{grid-area:1/1}.preview-stage .stage-label{display:none}.preview-stage .wheel-footnote{text-align:center;justify-content:center;font-size:11px;left:14px;right:14px}.palette-strip-area,.osl-palette-area{border-top:2px solid var(--ink);grid-template-rows:18px minmax(0,1fr) 32px;gap:7px;min-height:0;padding:10px 16px;display:grid}.palette-strip-area .strip-heading,.osl-palette-area .strip-heading{min-height:0;margin:0}.palette-cards .card-info{flex:1;min-height:0}.palette-actions{min-height:0;margin:0}.palette-actions .palette-tip{overscroll-behavior:contain;scrollbar-width:thin;max-height:32px;overflow-y:auto}.palette-actions .copy-palette-button{justify-content:center;width:132px;height:32px}.control-panel .control-body{flex-direction:column;padding:0;display:flex;overflow:hidden}.base-controls{border-bottom:1px dashed var(--line);flex:none;padding:18px 16px 14px}.parameter-controls{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--purple) transparent;flex:1;min-height:0;padding:0 16px 18px;overflow-y:auto}.control-panel .osl-controls{border-top:0;margin-top:18px;padding-top:0}}@media (width>=761px) and (width<=1100px) and (height>=501px),(width>=961px) and (width<=1100px){.workbench>:is(.palette-panel,.osl-panel){grid-template-rows:46px 50px minmax(0,1fr) 160px}.preview-options{gap:8px;padding-inline:12px}.preview-options .reference-options button{padding-inline:8px}.preview-stage{grid-template-columns:minmax(0,1fr) 180px}.preview-stage>.model-preview{padding-inline:12px}.preview-stage .model-region{grid-template-columns:13px minmax(0,1fr);gap:4px;padding:5px 3px}.preview-stage .model-region-chip{width:13px}.preview-stage>:is(.palette-reading,.osl-reading){padding-right:12px}.palette-strip-area,.osl-palette-area{padding-inline:12px}.palette-cards .card-color{height:28px;min-height:28px}.palette-cards .card-info{gap:1px;padding-block:3px}}@media (width>=961px) and (height<=600px){.workbench>:is(.palette-panel,.osl-panel){grid-template-rows:40px 42px minmax(0,1fr) 114px}.preview-options{padding-block:4px}.palette-strip-area,.osl-palette-area{grid-template-rows:minmax(0,1fr) 32px;gap:6px;padding-block:7px}.preview-stage>.model-preview{padding-block:4px}.preview-stage .model-caption{height:27px;min-height:27px;max-height:27px;margin-top:3px;padding-top:3px}.base-controls{padding-block:12px}}@media (width>=961px) and (width<=1100px) and (height<=600px){.workbench>:is(.palette-panel,.osl-panel){grid-template-rows:40px 42px minmax(0,1fr) 128px}}@media (width<=760px),(width<=960px) and (height<=500px){.workbench>:is(.palette-panel,.osl-panel){flex-direction:column;display:flex}.preview-options{grid-template-rows:40px 40px;grid-template-columns:minmax(0,1fr) 48px;gap:8px;padding:10px 12px}.preview-options .reference-picker{grid-area:1/1/auto/-1;margin:0}.preview-options .reference-options{gap:8px;width:100%}.preview-options .reference-options button{flex:1;min-height:40px;padding:7px 8px;font-size:13px}.preview-options .preview-toolbar{grid-row:2;justify-content:flex-start}.preview-options .preview-switch{width:100%;height:40px}.preview-options .preview-switch button{min-height:0;padding:7px;font-size:13px}.preview-options .preview-status{min-height:40px}.preview-options .model-reset{grid-area:2/2;min-height:40px}.preview-stage{padding:0;display:contents}.preview-stage>:is(.model-preview,.wheel-stage){order:2}.preview-stage>.model-preview{border:0;border-radius:0;margin:0;padding:12px}.preview-stage .model-scene{position:relative}.preview-stage .model-light{z-index:1;position:absolute;top:2px;left:0}.preview-stage .model-heading,.preview-stage .model-method-note{display:none}.preview-stage .model-caption{flex-wrap:nowrap;align-items:center;height:64px;min-height:64px;max-height:64px}.preview-stage .model-detail{overscroll-behavior:contain;scrollbar-width:thin;max-height:48px;overflow-y:auto}.preview-stage>:is(.palette-reading,.osl-reading){border-top:1px dashed #aaa49c;border-radius:0 0 8px 8px;order:4;padding:16px 12px}.preview-stage>.palette-reading{background:var(--preview-background)}.preview-stage>.osl-reading{background:#272535;border-color:#62566f}.palette-reading .overview-base{min-height:94px}.osl-reading .osl-source-row{margin-top:0}.palette-strip-area,.osl-palette-area{order:3;padding:18px 12px}.palette-actions .copy-palette-button{justify-content:center;min-height:44px}.palette-actions .palette-tip{overscroll-behavior:contain;scrollbar-width:thin;height:44px;max-height:44px;line-height:22px;overflow-y:auto}body:is(.mobile-controls-open,.color-editor-open) .preview-stage>.model-preview:not([hidden]){border:2px solid var(--ink);border-radius:12px;margin:0;padding:8px 10px}body:is(.mobile-controls-open,.color-editor-open) .preview-options .model-reset{top:calc(var(--live-height) - 50px);z-index:11;height:34px;min-height:34px;padding:5px 7px;position:fixed;bottom:auto;left:20px}body:is(.mobile-controls-open,.color-editor-open) #osl-model .model-light{background:0 0;border:0;flex-direction:column;gap:1px;padding:3px;display:flex}body:is(.mobile-controls-open,.color-editor-open) #osl-model .light-label{font-size:10px;display:block}body:is(.mobile-controls-open,.color-editor-open) #osl-model .light-direction{display:none}}@media (width<=960px) and (height<=500px){body:is(.mobile-controls-open,.color-editor-open) .preview-options .model-reset{top:auto;bottom:24px}}