:root,[data-theme=light]{--bg: #ffffff;--bg-elev: #ffffff;--bg-sunken: #f5f5f6;--bg-muted: #fafafa;--header-bg: rgba(255, 255, 255, .82);--ink: #111113;--ink-2: #52525b;--ink-3: #8a8a93;--line: #e7e7ea;--line-strong: #d4d4d8;--map-ocean: #eef2f7;--map-land: #e4e2dc;--map-coast: #cbd2d9;--map-grid: rgba(17, 17, 19, .075);--brand: #5b4be0;--brand-2: #22b8e6;--accent-1: #5b4be0;--accent-2: #22b8e6;--accent-3: #3fbf6a;--accent-4: #f5b22e;--accent-5: #ec6f9e;--rainbow: linear-gradient(90deg, var(--accent-1), var(--accent-2), var(--accent-3), var(--accent-4), var(--accent-5));--r-sm: 8px;--r-md: 12px;--r-lg: 16px;--r-xl: 22px;--r-full: 999px;--shadow-sm: 0 1px 2px rgba(17, 17, 19, .05);--shadow: 0 1px 2px rgba(17, 17, 19, .04), 0 10px 30px rgba(17, 17, 19, .06);--shadow-lg: 0 2px 4px rgba(17, 17, 19, .04), 0 18px 48px rgba(17, 17, 19, .1);--font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Noto Sans JP", "Noto Sans KR", "Noto Sans SC", sans-serif;--font-mono: ui-monospace, "SF Mono", "Cascadia Code", "Roboto Mono", Menlo, Consolas, monospace;--header-h: 64px;--container: 1152px;--ease: cubic-bezier(.22, 1, .36, 1)}[data-theme=dark]{--bg: #12101a;--bg-elev: #1a1822;--bg-sunken: #17151f;--bg-muted: #16141d;--header-bg: rgba(18, 16, 26, .82);--ink: #f5f5f7;--ink-2: #a1a1aa;--ink-3: #71717a;--line: rgba(255, 255, 255, .1);--line-strong: rgba(255, 255, 255, .2);--map-ocean: #11151e;--map-land: #252a35;--map-coast: #3b4351;--map-grid: rgba(255, 255, 255, .08);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 30px rgba(0, 0, 0, .35);--shadow-lg: 0 2px 4px rgba(0, 0, 0, .3), 0 18px 48px rgba(0, 0, 0, .45)}ruby{ruby-align:center}ruby rt{font-size:.42em;font-weight:500;color:var(--ink-3);ruby-position:over;letter-spacing:.02em}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}:lang(zh),:lang(ja){overflow-wrap:anywhere}:lang(ko){word-break:keep-all}body{margin:0;font-family:var(--font-ui);background:var(--bg);color:var(--ink);line-height:1.6;font-size:15.5px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background-color .25s var(--ease),color .25s var(--ease)}img,svg{display:block;max-width:100%}.icon{display:inline-block;vertical-align:-.125em;flex:none}a{color:inherit;text-decoration:none}h1,h2,h3,h4{line-height:1.2;margin:0 0 .5em;font-weight:700;letter-spacing:-.01em}p{margin:0 0 1em}:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:var(--r-sm)}.container{max-width:var(--container);margin:0 auto;padding:0 20px}@media(min-width:1700px){:root{--container: 1400px}}.muted{color:var(--ink-3);font-weight:500;font-size:12.5px;margin-left:6px}.header{position:sticky;top:0;z-index:50;height:var(--header-h);background:var(--header-bg);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line)}.header-inner{position:relative;display:flex;align-items:center;gap:0;width:100%;height:var(--header-h)}.header-spacer{flex:1 1 auto;min-width:0}.brand{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:17px;letter-spacing:-.02em;flex:none;margin-right:26px}.brand .logo{width:28px;height:28px}.brand-name{display:inline-flex;align-items:baseline}.brand-sub{font-size:11px;font-weight:500;color:var(--ink-3);margin-left:6px;letter-spacing:0}.nav{display:flex;align-items:center;gap:18px;min-width:0}.nav::-webkit-scrollbar{display:none}.nav-direct{font-size:13.5px;font-weight:600;color:var(--ink-2);white-space:nowrap;flex:none;transition:color .15s var(--ease)}.nav-direct:hover{color:var(--ink)}.nav-direct.with-icon{display:inline-flex;align-items:center;gap:5px}.nav-direct.with-icon .icon{color:var(--brand);opacity:.85}.nav-direct.with-icon:hover .icon{opacity:1}.nav-map{display:inline-flex;align-items:center;gap:5px;font-weight:600}.nav-map .icon{color:var(--brand);opacity:.85}.nav-map:hover .icon{opacity:1;transform:translateY(-1px)}.nav-map[aria-current=page]{color:var(--brand)}.tools-menu{position:relative;flex:none}.tools-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border:0;border-radius:var(--r-full);background:transparent;cursor:pointer;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--ink-2);white-space:nowrap;transition:background-color .15s var(--ease),color .15s var(--ease)}.tools-btn:hover,.tools-btn[aria-expanded=true]{background:var(--bg-sunken);color:var(--ink)}.tools-btn .icon{transition:transform .18s var(--ease)}.tools-btn[aria-expanded=true]>.icon:last-child{transform:rotate(180deg)}.tools-panel{position:absolute;top:calc(100% + 10px);left:-14px;z-index:60;width:720px;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;display:none}.tools-panel.open{display:block;animation:popIn .18s var(--ease)}.tp-cols{display:grid;grid-template-columns:minmax(0,1fr) 300px}.tp-menu{padding:6px 10px 14px;max-height:520px;overflow-y:auto;border-right:1px solid var(--line)}.tp-menu ul{list-style:none;margin:0;padding:0}.tp-menu li{margin:0}.tp-group-title{font-size:11px;font-weight:600;color:var(--ink-3);margin:12px 0 6px;text-transform:uppercase;letter-spacing:.08em}.tp-group:first-child .tp-group-title{margin-top:4px}.tp-item{display:flex;align-items:center;justify-content:space-between;gap:10px;height:34px;padding:0 10px;border-radius:var(--r-sm);font-size:14px;color:var(--ink-2);white-space:nowrap;transition:background-color .15s var(--ease),color .15s var(--ease)}.tp-item .icon{opacity:.45;transition:opacity .15s var(--ease),transform .15s var(--ease)}.tp-item:hover{background:var(--bg-sunken);color:var(--ink)}.tp-item:hover .icon{opacity:1;transform:translate(2px)}.tp-card{padding:16px;display:flex;flex-direction:column;gap:10px;border-left:1px solid var(--line)}.tp-card-visual{height:132px;border-radius:var(--r-md);background:var(--rainbow);box-shadow:inset 0 0 0 1px #0000000a}.tp-card-title{font-size:15px;font-weight:600;color:var(--ink);margin:0}.tp-card-desc{font-size:12.5px;color:var(--ink-2);margin:4px 0 0;line-height:1.5}.tp-card-link{display:inline-flex;align-items:center;gap:5px;margin-top:auto;font-size:13.5px;font-weight:600;color:var(--brand)}.tp-foot{display:flex;align-items:center;gap:20px;padding:12px 18px;border-top:1px solid var(--line);background:var(--bg-muted)}.tp-foot a{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--ink-2)}.tp-foot a:hover{color:var(--ink)}@media(max-width:1080px){.tools-panel{width:620px}}@media(max-width:900px){.tools-panel,.colors-panel{display:none!important}}.cp-trigger-icon{display:inline-flex;color:var(--brand)}.cp-trigger-icon .icon{width:15px;height:15px}.colors-panel{position:absolute;top:calc(100% + 10px);left:-14px;z-index:60;width:340px;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;display:none}.colors-panel.open{display:block;animation:popIn .18s var(--ease)}.cp-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}.cp-head-title{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ink)}.cp-head-title .icon{color:var(--brand)}.cp-count{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);background:var(--bg-sunken);padding:2px 8px;border-radius:var(--r-full)}.cp-list{padding:8px;display:grid;gap:2px;max-height:420px;overflow-y:auto}.cp-item{display:flex;align-items:center;gap:10px;min-height:38px;padding:0 10px;border-radius:var(--r-sm);font-size:13.5px;color:var(--ink-2);white-space:nowrap;transition:background-color .15s var(--ease),color .15s var(--ease)}.cp-icon{width:26px;height:26px;flex:none;display:grid;place-items:center;border-radius:8px;background:var(--bg-sunken);color:var(--brand)}.cp-icon .icon{width:15px;height:15px}.cp-item>span:nth-child(2){flex:1 1 auto;overflow:hidden;text-overflow:ellipsis}.cp-item>.icon{color:var(--ink-3);opacity:.5;transition:transform .15s var(--ease),opacity .15s var(--ease)}.cp-item:hover{background:var(--bg-sunken);color:var(--ink)}.cp-item:hover>.icon{opacity:1;transform:translate(2px)}.cp-item-map{background:color-mix(in srgb,var(--brand) 6%,transparent);color:var(--ink);font-weight:600}.cp-item-map .cp-icon{background:var(--rainbow);color:#fff}.cp-item-map .cp-icon .icon{filter:drop-shadow(0 1px 1px rgba(0,0,0,.22))}.cp-item-map:hover{background:color-mix(in srgb,var(--brand) 12%,transparent)}.cp-item-map.active{background:color-mix(in srgb,var(--brand) 14%,transparent)}.cp-foot{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-top:1px solid var(--line);background:var(--bg-muted);font-size:13px;font-weight:600;color:var(--brand)}.cp-foot:hover{color:var(--ink)}.header-right{display:flex;align-items:center;gap:8px;flex:none}.header-login{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:var(--r-full);font-size:13.5px;font-weight:500;color:var(--ink-2);white-space:nowrap;transition:background-color .15s var(--ease),color .15s var(--ease)}.header-login .icon{opacity:.7}.header-signup{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 16px;border-radius:var(--r-full);background:var(--ink);color:var(--bg);font-size:13.5px;font-weight:600;white-space:nowrap;transition:opacity .15s,transform .15s var(--ease)}.header-signup:hover{opacity:.88;transform:translateY(-1px)}.header-login:hover{background:var(--bg-sunken);color:var(--ink)}.header-cta{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 15px;border-radius:var(--r-full);background:var(--ink);color:var(--bg);font-size:12.5px;font-weight:600;white-space:nowrap;transition:opacity .15s,transform .15s var(--ease)}.header-cta:hover{opacity:.88;transform:translateY(-1px)}.lang-switch{position:relative}.lang-switch>button{display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 12px;border-radius:var(--r-full);border:1px solid var(--line);background:transparent;color:var(--ink-2);font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;transition:color .15s,border-color .15s}.header .lang-switch>button{width:36px;padding:0;justify-content:center}.header .lang-switch>button:hover{color:var(--ink);border-color:var(--line-strong)}.lang-switch>button:hover{color:var(--ink);border-color:var(--line-strong)}.lang-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:172px;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-lg);padding:5px;display:none;z-index:60}.lang-menu.open{display:block;animation:popIn .18s var(--ease)}.lang-menu a{display:block;padding:8px 12px;border-radius:var(--r-sm);font-size:13px;color:var(--ink-2)}.lang-menu a:hover,.lang-menu a.active{background:var(--bg-sunken);color:var(--ink)}.theme-toggle{width:36px;height:36px;border-radius:var(--r-full);border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s,transform .15s var(--ease)}.theme-toggle:hover{color:var(--ink);border-color:var(--line-strong);transform:scale(1.04)}.theme-toggle:active{transform:scale(.94)}.header-action{width:36px;height:36px;border-radius:var(--r-full);border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s,transform .15s var(--ease)}.header-action:hover{color:var(--ink);border-color:var(--line-strong);transform:scale(1.04)}.mobile-menu-btn{display:none;width:36px;height:36px;border-radius:var(--r-full);border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer;align-items:center;justify-content:center;transition:color .15s,border-color .15s,transform .15s var(--ease)}.mobile-menu-btn:hover{color:var(--ink);border-color:var(--line-strong);transform:scale(1.04)}.mobile-menu-btn:active{transform:scale(.94)}.mobile-sheet{display:none}.hero{position:relative;overflow:hidden;padding:74px 0 54px}.hero-tiles{position:absolute;inset:0 0 auto;height:740px;z-index:0;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 56%,transparent 92%);mask-image:linear-gradient(to bottom,#000 0%,#000 56%,transparent 92%)}.hero-tiles:before,.hero-tiles:after{content:"";position:absolute;width:440px;height:440px;border-radius:50%;filter:blur(120px);opacity:.16}.hero-tiles:before{background:#22b8e6;top:-160px;left:-100px}.hero-tiles:after{background:#ec6f9e;top:-140px;right:-80px}.tiles{position:absolute;top:0;bottom:0;width:min(22vw,290px);display:flex}.tiles.left{left:0;-webkit-mask-image:linear-gradient(to right,#000 0%,rgba(0,0,0,.35) 55%,transparent 100%);mask-image:linear-gradient(to right,#000 0%,rgba(0,0,0,.35) 55%,transparent 100%)}.tiles.right{right:0;flex-direction:row-reverse;-webkit-mask-image:linear-gradient(to left,#000 0%,rgba(0,0,0,.35) 55%,transparent 100%);mask-image:linear-gradient(to left,#000 0%,rgba(0,0,0,.35) 55%,transparent 100%)}.tiles i{flex:1}[data-theme=dark] .tiles{opacity:.6}.hero-inner{position:relative;z-index:1;text-align:center}.eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;letter-spacing:.01em;color:var(--ink-2);background:var(--bg-elev);border:1px solid var(--line);padding:6px 13px;border-radius:var(--r-full);margin-bottom:22px;box-shadow:var(--shadow-sm)}.hero h1{font-size:clamp(38px,5.2vw,62px);line-height:1.06;letter-spacing:-.045em;font-weight:800;max-width:900px;margin:0 auto 18px}.hero-sub{font-size:clamp(15px,1.7vw,17.5px);color:var(--ink-2);max-width:640px;margin:0 auto 32px;line-height:1.6}.hero-actions{display:flex;gap:10px;justify-content:center;margin-top:22px;flex-wrap:wrap}.studio{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:8px;text-align:left}.studio-canvas{display:flex;flex-direction:column;gap:10px;min-width:0}.studio-stage{position:relative;height:318px;border-radius:10px;border:1px solid rgba(0,0,0,.08);display:flex;align-items:flex-end;padding:16px;background-image:radial-gradient(circle at 28% 18%,rgba(255,255,255,.16),transparent 60%);transition:background-color .2s var(--ease)}.stage-hex{font-family:var(--font-mono);font-size:15px;font-weight:700;letter-spacing:.02em;padding:8px 12px;border-radius:8px;background:#ffffffeb;color:#111113;backdrop-filter:blur(10px)}.studio-controls{display:flex;align-items:center;gap:8px}.studio-controls input[type=text]{flex:1;max-width:none;font-family:var(--font-mono)}.studio-controls input[type=color]{width:52px;flex:none}.studio-presets{display:flex;gap:6px;margin-left:auto}.studio-preset{width:24px;height:24px;border-radius:var(--r-full);border:1px solid rgba(0,0,0,.12);cursor:pointer;padding:0;transition:transform .15s var(--ease)}.studio-preset:hover{transform:scale(1.16)}.studio-side{padding:18px 20px;border-left:1px solid var(--line);display:flex;flex-direction:column;min-width:0}.panel-title{font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}.panel-sub{font-size:13px;color:var(--ink-2);margin:0 0 10px;line-height:1.5}.value-rows{margin-top:auto}.value-row{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--line)}.value-row:last-child{border-bottom:none}.vr-k{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}.vr-v{font-family:var(--font-mono);font-size:12.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;font-size:13.5px;font-weight:600;line-height:1;min-height:42px;padding:0 20px;border-radius:var(--r-md);cursor:pointer;border:1px solid var(--line);background:var(--bg-elev);color:var(--ink);box-shadow:var(--shadow-sm);transition:transform .15s var(--ease),box-shadow .15s var(--ease),border-color .15s,background-color .15s}.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow);border-color:var(--line-strong)}.btn:active{transform:scale(.98)}.btn.primary{color:var(--bg);border-color:var(--ink);background:var(--ink)}.btn.primary:hover{box-shadow:0 8px 22px #11111338}.btn.ghost{background:transparent;box-shadow:none}.section{padding:52px 0}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:20px}.section-head h2{font-size:clamp(22px,2.6vw,27px);letter-spacing:-.03em;font-weight:700;margin:0}.link-more{font-size:13px;font-weight:600;color:var(--ink-3);display:inline-flex;align-items:center;gap:4px;flex:none}.link-more:hover{color:var(--ink)}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.tool-tile{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-elev);transition:border-color .15s,box-shadow .15s var(--ease),transform .15s var(--ease)}.tool-tile:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm);transform:translateY(-2px)}.tile-icon{width:40px;height:40px;border-radius:10px;background:var(--bg-sunken);display:grid;place-items:center;color:var(--ink)}.tile-body h3{font-size:14.5px;font-weight:600;margin:0 0 2px;letter-spacing:0}.tile-body p{font-size:12.5px;color:var(--ink-2);margin:0;line-height:1.45}.tile-arrow{color:var(--ink-3);opacity:0;transition:opacity .15s,transform .15s var(--ease)}.tool-tile:hover .tile-arrow{opacity:1;transform:translate(2px,-2px)}.culture-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.culture-grid.cols-2{grid-template-columns:repeat(2,1fr)}.culture-card{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--bg-elev);transition:border-color .15s,box-shadow .15s var(--ease),transform .15s var(--ease)}.culture-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm);transform:translateY(-2px)}.culture-swatches{height:62px}.culture-swatches.tall{height:104px}.culture-swatches .culture-strip{height:100%;gap:0;border-radius:0}.culture-info{padding:12px 14px}.culture-info h3{font-size:14.5px;font-weight:600;margin:0 0 2px}.culture-info p{font-size:12.5px;color:var(--ink-2);margin:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.step{border:1px solid var(--line);border-radius:var(--r-md);padding:20px;background:var(--bg-muted)}.step-num{width:28px;height:28px;border-radius:var(--r-full);background:var(--ink);color:var(--bg);font-size:12.5px;font-weight:700;display:grid;place-items:center;margin-bottom:14px}.step h3{font-size:15px;margin:0 0 6px}.step p{font-size:13.5px;color:var(--ink-2);margin:0;line-height:1.55}.faq-wrap{padding-bottom:70px}.faq{display:flex;flex-direction:column;gap:10px}.faq-item{border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-elev);overflow:hidden;transition:border-color .18s var(--ease),box-shadow .18s var(--ease)}.faq-item[open]{border-color:color-mix(in srgb,var(--brand) 38%,var(--line));box-shadow:var(--shadow-sm)}.faq-item summary{display:flex;align-items:center;gap:12px;padding:16px 18px;cursor:pointer;font-size:15px;font-weight:600;color:var(--ink);list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:hover{background:var(--bg-muted)}.faq-q{display:inline-flex;align-items:center;gap:12px;min-width:0;flex:1 1 auto}.faq-q-icon{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--bg-elev))}.faq-q-icon .icon{width:16px;height:16px}.faq-chev{color:var(--ink-3);display:inline-flex;flex:none;transition:transform .2s var(--ease),color .2s var(--ease)}.faq-item[open] .faq-chev{transform:rotate(180deg);color:var(--brand)}.faq-a{display:flex;align-items:flex-start;gap:10px;margin:0 18px 18px 60px;padding:12px 14px;background:var(--bg-sunken);border-radius:var(--r-sm);font-size:14px;color:var(--ink-2);line-height:1.7}.faq-a-icon{display:inline-flex;flex:none;color:var(--brand-2);margin-top:2px}.faq-a>span:last-child{min-width:0}.faq-plus{color:var(--ink-3);display:inline-flex;transition:transform .2s var(--ease)}.faq-item[open] .faq-plus{transform:rotate(45deg)}@media(max-width:760px){.faq-item summary{padding:14px;gap:10px}.faq-a{margin:0 14px 14px;padding:12px}}.page-head{padding:56px 0 10px}.page-head h1{font-size:clamp(30px,3.8vw,42px);letter-spacing:-.035em;font-weight:800;margin:0 0 8px}.page-head .lede{color:var(--ink-2);font-size:15px;margin:0;max-width:720px;line-height:1.6}.breadcrumb{font-size:12.5px;color:var(--ink-3);margin-bottom:14px}.breadcrumb a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:2px}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 18px}.filter-chip{font-size:12.5px;font-weight:500;color:var(--ink-2);padding:7px 13px;border:1px solid var(--line);border-radius:var(--r-full);background:var(--bg);transition:color .15s,border-color .15s,background-color .15s}.filter-chip:hover{border-color:var(--line-strong);color:var(--ink)}.filter-chip.active{background:var(--ink);color:var(--bg);border-color:var(--ink);font-weight:600}.culture-banner{height:88px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line);margin-top:22px}.culture-banner .culture-strip{height:100%;gap:0;border-radius:0}.swatch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:12px;padding-bottom:56px}.swatch-card{display:block;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;transition:border-color .15s,box-shadow .2s var(--ease),transform .2s var(--ease)}.swatch-card:hover{border-color:var(--line-strong);transform:translateY(-3px);box-shadow:var(--shadow)}.swatch-card .color{height:104px;display:flex;align-items:flex-end;padding:10px}.swatch-card .code{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.02em;padding:3px 7px;border-radius:6px;background:#ffffffeb;color:#111113}.swatch-card .meta{padding:11px 13px}.swatch-card .meta .name{font-weight:600;font-size:14px}.swatch-card .meta .hex{font-family:var(--font-mono);font-size:12px;color:var(--ink-2)}.swatch-grid .swatch-card{border-radius:10px}.culture-strip{display:flex;gap:6px;height:44px;border-radius:var(--r-sm);overflow:hidden}.culture-strip span{flex:1}.color-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}.color-head h1{font-size:clamp(38px,5vw,56px);margin:0;letter-spacing:-.04em;line-height:1.08}.meta-chips{display:flex;gap:8px;padding-bottom:6px}.meta-chip{font-size:11.5px;font-weight:600;padding:6px 10px;border:1px solid var(--line);border-radius:var(--r-full);color:var(--ink-2);background:var(--bg)}.meta-chip.mono{font-family:var(--font-mono)}.color-page{padding-top:22px}.color-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--bg-elev);box-shadow:var(--shadow-sm)}.color-stage{position:relative;min-height:342px;display:flex;align-items:flex-end;padding:18px;border-right:1px solid rgba(0,0,0,.06)}.color-stage:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 26% 16%,rgba(255,255,255,.18),transparent 62%)}.value-panel{padding:20px 22px;display:flex;flex-direction:column;min-width:0}.value-panel .value-rows{margin-top:auto}.content-split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;padding:28px 0 44px}.content-main{min-width:0}.content-side{position:sticky;top:calc(var(--header-h) + 20px);align-self:start}.section-title{font-size:15px;font-weight:700;letter-spacing:-.01em;margin:34px 0 14px;display:flex;align-items:center;gap:14px}.section-title:after{content:"";flex:1;height:1px;background:var(--line)}.content-main>.section-title:first-child{margin-top:0}.similar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.palette-row{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.pal-swatch{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg)}.pal-swatch .color{height:68px}.pal-swatch .hex{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-2);padding:6px 7px}.meta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}.meta-box{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--bg-muted)}.meta-box .k{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);margin-bottom:3px}.meta-box .v{font-size:14px;font-weight:600}.side-card{border:1px solid var(--line);border-radius:var(--r-md);padding:16px;background:var(--bg-muted);margin-bottom:12px}.side-card h3{font-size:13.5px;margin:0 0 10px;font-weight:700}.side-card p{font-size:13px;color:var(--ink-2);margin:0;line-height:1.55}.side-icon{display:inline-flex;color:var(--ink-2);margin-bottom:8px}.side-links a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink-2)}.side-links a:last-child{border-bottom:none}.side-links a:hover{color:var(--ink)}.a11y-line{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}.a11y-line:last-child{border-bottom:none}.a11y-line span{flex:1;color:var(--ink-2)}.a11y-line b{font-family:var(--font-mono);font-size:14px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;padding:48px 20px 64px;align-items:start;max-width:var(--container);margin:0 auto}.workspace-main{min-width:0}.workspace-side{position:sticky;top:calc(var(--header-h) + 20px);align-self:start}.tool-head{padding:0 0 18px}.tool-head h1{font-size:clamp(28px,3.4vw,38px);letter-spacing:-.035em;font-weight:800;margin-bottom:6px}.tool-head .desc{color:var(--ink-2);font-size:14.5px;margin:0}.tool-card{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-elev);padding:20px;margin:14px 0;box-shadow:var(--shadow-sm)}.tool-card h3{font-size:15px;margin-bottom:6px}.tool-card .desc{color:var(--ink-2);font-size:13.5px;margin:0}.field{margin-bottom:14px}.field label{display:block;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}.field-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}input[type=text],textarea,select{font-family:var(--font-mono);font-size:13.5px;background:var(--bg-sunken);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:11px 12px;width:100%;transition:border-color .15s,box-shadow .15s}input[type=text]:focus,textarea:focus,select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 18%,transparent)}input[type=text].code-input{max-width:170px}textarea{resize:vertical;min-height:104px}select{font-family:var(--font-ui);appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8a93' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:36px;cursor:pointer}input[type=color]{width:56px;height:42px;border:1px solid var(--line);border-radius:10px;background:var(--bg-sunken);padding:3px;cursor:pointer}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:7px}input[type=file]{width:100%;padding:26px 14px;border:1.5px dashed var(--line-strong);border-radius:12px;background:var(--bg-muted);color:var(--ink-2);font-size:13.5px;cursor:pointer;transition:border-color .15s,background-color .15s}input[type=file]:hover{border-color:var(--ink-3);background:var(--bg-sunken)}input[type=file]::file-selector-button{font-family:inherit;font-size:12.5px;font-weight:600;margin-right:12px;padding:8px 14px;border-radius:var(--r-full);border:1px solid var(--line);background:var(--bg-elev);color:var(--ink);cursor:pointer}.output-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px}.value-box{border:1px solid var(--line);border-radius:10px;background:var(--bg-muted);padding:10px 12px;position:relative;min-width:0}.value-box .k{font-size:10px;font-weight:700;color:var(--ink-3);letter-spacing:.07em;text-transform:uppercase;margin-bottom:3px}.value-box .v{font-family:var(--font-mono);font-size:12.5px;overflow-wrap:break-word;word-break:normal}.preview-bar .copy-btn,.value-box .copy-btn{position:absolute;top:7px;right:7px;opacity:0}.value-box:hover .copy-btn,.preview-bar:hover .copy-btn{opacity:1}.copy-btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-family:inherit;font-size:10.5px;font-weight:600;color:var(--ink-3);background:transparent;border:1px solid var(--line);border-radius:6px;min-width:26px;height:26px;padding:0 5px;cursor:pointer;opacity:.8;transition:color .15s,background-color .15s,opacity .15s}.copy-btn:hover{color:var(--ink);background:var(--bg-sunken);opacity:1}.ratio-big{font-size:34px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.level-chip{display:inline-block;font-size:11px;font-weight:700;padding:3px 9px;border-radius:var(--r-full);background:var(--bg-sunken);color:var(--ink-2);border:1px solid var(--line)}.level-chip.pass{background:color-mix(in srgb,var(--accent-3) 12%,var(--bg));color:color-mix(in srgb,var(--accent-3) 68%,var(--ink));border-color:color-mix(in srgb,var(--accent-3) 32%,transparent)}.level-chip.fail{background:color-mix(in srgb,var(--accent-5) 12%,var(--bg));color:color-mix(in srgb,var(--accent-5) 62%,var(--ink));border-color:color-mix(in srgb,var(--accent-5) 32%,transparent)}.preview-bar{border-radius:12px;border:1px solid rgba(0,0,0,.06);position:relative;display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;padding:22px 18px;font-family:var(--font-ui);font-size:19px;font-weight:600;letter-spacing:.01em;min-height:88px}.preview-bar .preview-sub{font-family:var(--font-mono);font-size:11.5px;font-weight:500;letter-spacing:.02em;opacity:.82}.bar{border-radius:10px;height:72px;position:relative}.cvd-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.cvd-item .label{font-size:12px;font-weight:600;color:var(--ink-2);margin:6px 0 2px}.cvd-item .swatch{aspect-ratio:1}.swatch{border-radius:var(--r-sm);border:1px solid rgba(0,0,0,.08);display:flex;align-items:flex-end;padding:7px;background:var(--bg-sunken)}.swatch .code{font-family:var(--font-mono);font-size:11px;font-weight:600;padding:2px 6px;border-radius:5px;background:#ffffffe6;color:#111113}.table-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.tbl{width:100%;border-collapse:collapse;font-size:12.5px}.tbl th,.tbl td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);font-family:var(--font-mono)}.tbl th{font-family:var(--font-ui);font-weight:600;color:var(--ink-2);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}.tbl td .dot{display:inline-block;width:13px;height:13px;border-radius:6px;margin-right:7px;vertical-align:-2px;border:1px solid rgba(0,0,0,.1)}.sys-strip{display:flex;height:54px;border-radius:10px;overflow:hidden;border:1px solid rgba(0,0,0,.08);margin-bottom:12px}.sys-sub-title{font-size:12.5px;font-weight:600;color:var(--ink-2);margin:2px 0 8px}.sys-strip button{flex:1;min-width:0;border:0;padding:0;cursor:pointer;transition:opacity .15s}.sys-strip button:hover{opacity:.84}.sys-code-card{margin-top:14px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg-muted)}.sys-code-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line);font-size:12px;font-weight:600;color:var(--ink-2)}.sys-code-head .copy-btn{opacity:1}.sys-code{margin:0;padding:14px;overflow:auto;max-height:320px;font-family:var(--font-mono);font-size:12.5px;line-height:1.65;color:var(--ink-2)}@media(max-width:760px){.sys-strip{height:46px}.sys-code{font-size:11.5px;max-height:260px}}.sys-out .tbl td:first-child,.sys-out .copy-btn{white-space:nowrap}@media(max-width:520px){.sys-tokens th:nth-child(3),.sys-tokens td:nth-child(3){display:none}}.gradient-code{font-family:var(--font-mono);font-size:12.5px;background:var(--bg-sunken);padding:12px;border-radius:10px;margin:0;overflow-x:auto}.palette-out .culture-strip{height:48px}.palette-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:14px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-muted)}.palette-toolbar .hint{font-size:12px;font-weight:600;color:var(--ink-3)}.palette-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.palette-actions .btn{min-height:34px;padding:0 12px;font-size:12.5px;box-shadow:none}.color-main .tool-card{border:0;background:transparent;box-shadow:none;padding:0;margin:14px 0 0}.icon-btn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-elev);color:var(--ink-2);cursor:pointer;transition:color .15s,border-color .15s,transform .15s var(--ease)}.icon-btn:hover{color:var(--ink);border-color:var(--line-strong);transform:translateY(-1px)}.icon-btn.is-done{color:var(--accent-3);border-color:color-mix(in srgb,var(--accent-3) 45%,var(--line))}.palette-circles{display:flex;align-items:flex-start;justify-content:center;gap:14px;flex-wrap:wrap;margin:24px 0 16px}.palette-color{display:flex;flex-direction:column;align-items:center;gap:8px}.palette-circle{width:76px;height:76px;border-radius:var(--r-full);border:2px solid var(--line);cursor:pointer;padding:0;transition:transform .15s var(--ease),box-shadow .18s var(--ease),border-color .15s}.palette-circle:hover{transform:scale(1.07);box-shadow:var(--shadow);border-color:var(--line-strong)}.palette-circle:active{transform:scale(.97)}.palette-circle.is-done{border-color:var(--accent-3)}.palette-hex{font-family:var(--font-mono);font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);background:transparent;border:0;padding:2px 5px;border-radius:6px;cursor:pointer}.palette-hex:hover{color:var(--brand)}.palette-gradient{height:68px;border-radius:var(--r-lg);border:1px solid rgba(0,0,0,.06);background:var(--bg-sunken)}.card{background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow-sm)}.card h3{font-size:16px;margin-bottom:8px}.card .desc{color:var(--ink-2);font-size:13.5px;margin:0}.tokens-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.token{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg-muted)}.token .sw{display:block;height:56px}.token .tk{display:block;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-2);padding:7px 9px}.prose{max-width:760px;padding:56px 20px 64px;margin:0 auto}.prose h1{font-size:clamp(30px,3.8vw,40px);font-weight:800;margin:0 0 16px;letter-spacing:-.035em}.prose p{color:var(--ink-2);font-size:15px;line-height:1.7}.prose code{font-family:var(--font-mono);font-size:12.5px;background:var(--bg-sunken);padding:2px 7px;border-radius:6px;border:1px solid var(--line)}.not-found{text-align:center;padding:110px 20px 80px}.not-found .big{font-size:96px;font-weight:800;line-height:1;background:var(--rainbow);-webkit-background-clip:text;background-clip:text;color:transparent}.not-found h1{font-size:26px;margin-top:12px}.footer{border-top:1px solid var(--line);background:var(--bg-muted);padding:48px 0 24px;margin-top:56px}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(5,1fr);gap:28px}.sec-card[id]{scroll-margin-top:calc(var(--header-h) + 16px)}.footer-brand .brand{margin-bottom:12px}.footer-slogan{font-size:13px;color:var(--ink-2);margin:0 0 6px}.footer-meta{font-size:12px;color:var(--ink-3);margin:0}.footer-col h3{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);margin:2px 0 12px}.footer-col a{display:block;font-size:13px;color:var(--ink-2);padding:4px 0}.footer-col a:hover{color:var(--ink)}.footer-col a.footer-map{display:inline-flex;align-items:center;gap:7px;font-weight:600;color:var(--brand)}.footer-col a.footer-map:before{content:"";width:7px;height:7px;border-radius:50%;flex:none;background:var(--rainbow)}.footer-col a.footer-map:hover,.footer-col a.footer-map[aria-current=page]{color:var(--ink)}.footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:36px;padding-top:18px;font-size:12px;color:var(--ink-3)}@media(max-width:1060px){.workspace{grid-template-columns:minmax(0,1fr) 260px;gap:24px}.content-split{grid-template-columns:minmax(0,1fr) 260px;gap:28px}}@media(max-width:920px){.studio{grid-template-columns:minmax(0,1fr)}.studio-side{border-left:none;border-top:1px solid var(--line)}.studio-stage{height:280px}.studio-side .value-rows{margin-top:6px}.tool-grid,.culture-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr}.footer-grid{grid-template-columns:1.4fr 1fr 1fr}.footer-brand{grid-column:1 / -1}.workspace{grid-template-columns:minmax(0,1fr)}.workspace-side{position:static;display:grid;grid-template-columns:1fr 1fr;gap:12px}.workspace-side .side-card{margin-bottom:0}.content-split{grid-template-columns:minmax(0,1fr)}.content-side{position:static;display:grid;grid-template-columns:1fr 1fr;gap:12px}.content-side .side-card{margin-bottom:0}.color-hero{grid-template-columns:minmax(0,1fr)}.color-stage{border-right:none;border-bottom:1px solid rgba(0,0,0,.06);min-height:280px}}@media(max-width:900px){.nav{display:none}.mobile-menu-btn{display:inline-flex}}@media(max-width:760px){.nav{display:none}.mobile-menu-btn{display:inline-flex}.lang-switch>button{width:36px;padding:0;justify-content:center}.lang-switch>button>span{display:none}.header-cta{display:none}.header-inner{gap:4px}.hero{padding:52px 0 40px}.hero h1{letter-spacing:-.035em}.hero-tiles{height:560px;opacity:.55}.tiles{width:34vw}.brand-sub{display:none}.section{padding:40px 0}.page-head{padding:40px 0 6px}.page-head h1{font-size:30px}.tool-grid,.culture-grid{grid-template-columns:1fr}.workspace{padding:32px 20px 48px}.workspace-side,.content-side{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer{padding-top:36px}.palette-row{grid-template-columns:repeat(3,1fr)}.color-head h1{font-size:42px}.not-found .big{font-size:76px}}@media(max-width:520px){.studio-stage{height:230px}.studio-controls{flex-wrap:wrap}.studio-presets{width:100%;margin-left:0}.swatch-grid,.similar-grid{grid-template-columns:repeat(2,1fr)}.meta-chips{padding-bottom:0}}@media(min-width:901px){.mobile-sheet,.mobile-menu-btn{display:none}}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes popIn{0%{opacity:0;transform:scale(.96) translateY(-4px)}to{opacity:1;transform:none}}.hero-inner>*{animation:fadeUp .55s var(--ease) both}.hero-inner>*:nth-child(2){animation-delay:.06s}.hero-inner>*:nth-child(3){animation-delay:.12s}.hero-inner>*:nth-child(4){animation-delay:.18s}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}:root{--muted-fg: #64748b;--link: #2563eb;--sec-radius: 24px;--card-radius: 16px;--r-in: 12px;--sec-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);--card-shadow: 0 18px 44px -24px rgba(0, 0, 0, .22);--card-shadow-hover: 0 24px 54px -22px rgba(0, 0, 0, .28);--success: #15803d;--success-bg: #f0fdf4;--success-border: #bbf7d0;--caution: #b45309;--caution-bg: #fffbeb;--caution-border: #fde68a}[data-theme=dark]{--muted-fg: #94a3b8;--link: #7cb0ff;--sec-shadow: 0 25px 50px -12px rgba(0, 0, 0, .6);--card-shadow: 0 18px 44px -24px rgba(0, 0, 0, .55);--card-shadow-hover: 0 24px 54px -22px rgba(0, 0, 0, .7);--success: #4ade80;--success-bg: #0d2a18;--success-border: #1c5230;--caution: #fbbf24;--caution-bg: #2a2210;--caution-border: #57431a}.page-heading{padding:36px 20px 8px;text-align:center}.page-heading .heading-container{max-width:1024px;margin:0 auto}.page-heading h1{font-size:clamp(28px,4vw,44px);line-height:1.08;letter-spacing:-.035em;font-weight:700;margin:0 auto 12px;max-width:1024px}.page-heading .sub{font-size:clamp(16px,1.6vw,18px);line-height:1.55;color:var(--ink);margin:0 auto;max-width:896px;font-weight:400}.page-heading .sub a{color:var(--link)}.shell{width:100%;margin:0 auto;padding-left:16px;padding-right:16px}.shell-896{max-width:896px}.shell-832{max-width:832px}.shell-1024{max-width:1024px}.shell-1280{max-width:1280px}.stack{display:flex;flex-direction:column;gap:24px}.sec-card{background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--sec-radius);box-shadow:var(--sec-shadow);padding:24px}.sec-head{display:flex;align-items:center;gap:8px;margin-bottom:24px}.sec-head h2{font-size:18px;font-weight:600;margin:0;letter-spacing:-.01em}.sec-head .icon{color:var(--brand);width:20px;height:20px;flex:none}.sec-sub{font-size:14px;line-height:1.55;color:var(--muted-fg);margin:12px 0 0}.in-card{border:1px solid var(--line);border-radius:var(--r-in);background:var(--bg-elev);padding:16px}.rel-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px}.rel-links a{color:var(--link);text-underline-offset:4px;display:inline-flex;align-items:center;gap:8px}.rel-links a:hover{text-decoration:underline}.rel-link-icon{display:inline-flex;color:var(--brand);flex:none}.rel-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.rel-card{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--line);border-radius:var(--r-in);background:var(--bg-elev);transition:box-shadow .2s var(--ease),transform .2s var(--ease)}.rel-card:hover{box-shadow:var(--card-shadow);transform:translateY(-1px)}.rel-card-icon{width:36px;height:36px;flex:none;display:grid;place-items:center;border-radius:10px;color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--bg-elev))}.rel-card-arrow{display:inline-flex;flex:none;margin-left:auto;color:var(--ink-3);transition:color .18s var(--ease),transform .18s var(--ease)}.rel-card:hover .rel-card-arrow{color:var(--brand);transform:translate(2px)}.rel-strip{display:flex;height:28px;border-radius:7px;overflow:hidden;background:var(--bg-muted)}.rel-strip span{flex:1}.rel-card h3{font-size:15.5px;font-weight:600;margin:0;letter-spacing:0}.rel-card p{font-size:13px;line-height:1.45;color:var(--muted-fg);margin:2px 0 0}.conv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.conv-card{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-in);background:var(--bg-elev);font-size:14px;font-weight:500;transition:box-shadow .2s var(--ease)}.conv-card:hover{box-shadow:var(--card-shadow)}.conv-swatch{width:16px;height:16px;border-radius:4px;border:1px solid var(--line);flex:none}.fmt-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.fmt-block h3{font-size:16px;font-weight:600;margin:0 0 8px}.fmt-block p{font-size:14px;line-height:1.65;color:var(--muted-fg);margin:0}.fmt-block dl{margin:12px 0 0;display:flex;flex-direction:column;gap:4px;font-size:14px}.fmt-block dl>div{display:flex;gap:8px}.fmt-block dt{color:var(--muted-fg);min-width:68px}.fmt-block dd{margin:0}.filter-card{margin-bottom:32px}.filter-body{display:flex;flex-direction:column;gap:24px}.filter-label{display:block;font-size:14px;font-weight:500;color:var(--muted-fg);margin-bottom:12px}.filter-search{position:relative}.filter-search .icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted-fg)}.filter-search input{height:40px;padding-left:36px;font-family:var(--font-ui);font-size:14px;border-radius:6px;background:var(--bg)}.pill-row{display:flex;flex-wrap:wrap;gap:8px}.pill-btn{display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-size:14px;font-weight:500;color:var(--ink);background:var(--bg-sunken);border:1px solid transparent;border-radius:999px;padding:8px 16px;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}.pill-btn:hover{background:var(--bg-muted);border-color:var(--line)}.pill-btn.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}.pill-dot{width:12px;height:12px;border-radius:50%;border:1px solid var(--line);flex:none}.filter-count{border-top:1px solid var(--line);padding-top:12px;font-size:14px;color:var(--muted-fg);margin:0}.listing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.listing-card{position:relative;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--card-radius);background:var(--bg-elev);box-shadow:var(--card-shadow);transition:box-shadow .2s var(--ease),transform .2s var(--ease)}.listing-card:hover{box-shadow:var(--card-shadow-hover);transform:translateY(-2px)}.listing-thumb{position:relative;display:block;aspect-ratio:16 / 9;width:100%;flex:none}.listing-thumb-cue{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;gap:6px;padding:10px;opacity:0;transition:opacity .18s var(--ease);color:#fff;background:linear-gradient(to top,#00000061,#0000 52%)}.listing-card:hover .listing-thumb-cue,.listing-thumb:focus-visible .listing-thumb-cue{opacity:1}.cue-hex{font-family:var(--font-mono);font-size:11.5px;line-height:1;padding:6px 8px;border-radius:6px;background:#00000061;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px)}.cue-go{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid rgba(255,255,255,.55);background:#ffffff29}.listing-body{display:flex;align-items:flex-start;gap:8px;padding:16px;min-width:0}.listing-title{min-width:0;flex:1}.listing-title h3{font-size:16px;font-weight:600;line-height:24px;margin:0;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.listing-title h3 a:after{content:"";position:absolute;inset:0}.listing-hex{font-family:var(--font-mono);font-size:14px;color:var(--muted-fg);margin-top:2px}.listing-actions{display:flex;gap:4px;align-items:center;position:relative;z-index:2}.icon-btn{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;border:0;background:transparent;color:var(--muted-fg);cursor:pointer}.icon-btn:hover{background:var(--bg-sunken);color:var(--ink)}.icon-btn.active{color:#e11d48}.listing-more{display:flex;justify-content:center;padding:32px 0}.spinner{animation:spin 1s linear infinite;color:var(--ink-3)}@keyframes spin{to{transform:rotate(360deg)}}.filter-empty{padding:40px 0;text-align:center;color:var(--muted-fg);font-size:14px}.color-shell{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:24px;align-items:start;padding-bottom:12px}.toc-card{position:sticky;top:calc(var(--header-h) + 20px);background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--sec-radius);box-shadow:var(--shadow);padding:12px}.toc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.toc-link{display:flex;align-items:center;gap:8px;padding:8px;border-radius:8px;font-size:14px;color:var(--muted-fg);line-height:1.35}.toc-link .icon{color:var(--muted-fg);opacity:.6;flex:none}.toc-link:hover{background:var(--bg-sunken)}.toc-link.active{background:var(--bg-sunken);color:var(--ink);font-weight:500}.toc-link.active .icon{color:var(--brand);opacity:1}.color-main{display:flex;flex-direction:column;gap:24px;min-width:0}.sec-card[id],.color-main>section[id]{scroll-margin-top:calc(var(--header-h) + 24px)}.conv-split{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);gap:32px}.mini-picker{border:1px solid var(--line);border-radius:8px;background:var(--bg);padding:12px;display:flex;flex-direction:column;gap:8px}.sat-square{position:relative;height:160px;border-radius:8px;border:1px solid var(--line);cursor:crosshair}.sat-thumb{position:absolute;width:16px;height:16px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 4px #0006;transform:translate(-50%,-50%)}.hue-track{height:12px;border-radius:999px;position:relative;background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.hue-thumb{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.25);transform:translate(-50%,-50%);box-shadow:0 1px 3px #0000004d}.mini-row{display:flex;align-items:center;gap:8px}.mini-row input[type=text]{height:32px;font-size:12px;border-radius:6px;padding:6px 8px}.mini-preview{width:32px;height:32px;border-radius:6px;border:1px solid var(--line);flex:none}.mini-row select{height:32px;width:100px;font-size:12px;padding:4px 28px 4px 8px;border-radius:6px}.mini-copy{width:32px;height:32px;padding:0;border-radius:6px;flex:none}.preview-banner{position:relative;min-height:128px;border-radius:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:24px}.preview-banner h2{font-size:30px;font-weight:700;margin:0}.preview-banner h2 span{font-size:18px;font-weight:400;margin-left:8px;opacity:.9}.banner-actions{position:absolute;top:12px;right:12px;display:flex;gap:6px}.banner-btn{width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--bg-elev);color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-sm)}.format-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.format-row{display:flex;align-items:center;padding:0 12px;min-height:48px;border:1px solid var(--line);border-radius:12px;background:var(--bg-elev);cursor:pointer;font:inherit;color:inherit;text-align:left}.format-row:hover{background:var(--bg-sunken)}.format-row .k{font-size:16px;color:var(--muted-fg);min-width:40px}.format-row .sep{width:1px;height:40px;background:var(--line);margin-right:12px;flex:none}.format-row .v{flex:1;font-family:var(--font-mono);font-size:16px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.format-row .icon{color:var(--ink-3);flex:none}.fmt-note{font-size:12px;color:var(--muted-fg);margin:12px 0 0}.alias-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.alias-pill{display:inline-flex;padding:4px 12px;border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:500}.tagline{font-style:italic;color:var(--muted-fg);font-size:14px;margin:12px 0 0}.about-desc{font-size:14px;line-height:1.7;color:var(--muted-fg);margin:12px 0 0}.tip-box{margin-top:20px;border:1px solid color-mix(in srgb,var(--brand) 18%,var(--line));background:color-mix(in srgb,var(--brand) 5%,var(--bg));border-radius:8px;padding:16px}.tip-label{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-fg);margin:0}.tip-box p:last-child{margin:6px 0 0;font-size:14px;line-height:1.6}.mood-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px}.mood-pill{padding:4px 12px;border-radius:999px;background:var(--bg-sunken);font-size:12px;font-weight:500}.subsec{margin-top:40px}.subsec-head{display:flex;align-items:center;gap:8px;margin-bottom:20px}.subsec-head h3{font-size:16px;font-weight:600;margin:0}.subsec-head .icon{color:var(--muted-fg);flex:none}.subsec-sub{font-size:12px;color:var(--muted-fg);margin:6px 0 0}.block-label{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-fg);margin:20px 0 0}.block-body{font-size:14px;line-height:1.65;margin:6px 0 0}.callout-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.callout{border:1px solid var(--line);border-radius:8px;padding:16px}.callout.pos{border-color:var(--success-border);background:var(--success-bg)}.callout.neg{border-color:var(--caution-border);background:var(--caution-bg)}.callout .cap{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;margin:0}.callout.pos .cap{color:var(--success)}.callout.neg .cap{color:var(--caution)}.callout p{margin:8px 0 0;font-size:14px;line-height:1.6}.app-list{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin:0}.app-item{border-top:1px solid var(--line);padding:16px 0}.app-item:nth-child(-n+2){border-top:0;padding-top:0}.app-item dt{font-size:14px;font-weight:500;margin:0}.app-item dd{font-size:14px;line-height:1.6;color:var(--muted-fg);margin:6px 0 0}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.guide-card{border:1px solid var(--line);border-radius:8px;padding:16px}.guide-card.pos{border-color:var(--success-border);background:var(--success-bg)}.guide-card.neg{border-color:var(--caution-border);background:var(--caution-bg)}.guide-card .cap{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;margin:0}.guide-card.pos .cap{color:var(--success)}.guide-card.neg .cap{color:var(--caution)}.guide-card ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.55}.guide-card li{display:flex;gap:8px}.guide-card li:before{content:"";width:4px;height:4px;border-radius:50%;margin-top:9px;flex:none}.guide-card.pos li:before{background:var(--success)}.guide-card.neg li:before{background:var(--caution)}.pair-list{display:flex;flex-direction:column;gap:8px}.pair-row{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--line);border-radius:8px}.pair-swatches{display:flex;flex:none}.pair-swatches span{width:24px;height:24px;border-radius:6px;border:1px solid var(--line)}.pair-swatches span+span{margin-left:-6px}.pair-hex{font-family:var(--font-mono);font-size:12px;color:var(--muted-fg);flex:none}.pair-desc{font-size:14px;color:var(--muted-fg);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.protip{background:var(--bg-muted);border-radius:8px;padding:16px;margin-bottom:32px;font-size:14px;color:var(--muted-fg)}.shade-block{margin-bottom:40px}.shade-block h3{font-size:16px;font-weight:600;margin:0 0 4px}.shade-desc{font-size:14px;color:var(--muted-fg);margin:0 0 12px}.shade-grid{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));border-radius:12px;overflow:hidden}.shade-cell{height:64px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px;padding-bottom:6px;text-decoration:none;position:relative;transition:transform .16s var(--ease)}.shade-cell .hex{font-family:var(--font-mono);font-size:10px}.shade-cell .pct{font-family:var(--font-mono);font-size:9px;font-weight:600;opacity:.85}.shade-cell:hover,.shade-cell:focus-visible{transform:translateY(-3px);z-index:1;box-shadow:inset 0 0 0 2px #fffc,0 4px 12px #00000038}.use-cases{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}.use-card{border:1px solid var(--line);border-radius:8px;padding:16px;font-size:14px}.use-card h3{font-size:14px;font-weight:600;margin:0 0 8px}.use-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;color:var(--muted-fg)}.use-card li:before{content:"•";margin-right:6px}.howto{background:var(--bg-muted);border-radius:8px;padding:16px;margin-bottom:32px;display:grid;grid-template-columns:1fr 1fr;gap:16px}.howto h3{font-size:14px;font-weight:500;margin:0 0 8px}.howto p{font-size:13px;line-height:1.55;color:var(--muted-fg);margin:0}.harmony-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.harmony-block h3{font-size:16px;font-weight:600;margin:0 0 6px}.harmony-desc{font-size:14px;color:var(--muted-fg);margin:0;min-height:80px}.harmony-strip{display:flex;height:48px;border-radius:999px;overflow:hidden;border:1px solid var(--line);margin-top:16px;box-shadow:var(--shadow-sm)}.harmony-strip>a{flex:1;position:relative;display:block;text-decoration:none;transition:flex-grow .18s var(--ease)}.harmony-strip>a:hover,.harmony-strip>a:focus-visible{flex-grow:1.35;box-shadow:inset 0 0 0 2px #ffffffbf}.harmony-strip .lbl{position:absolute;inset:0;display:grid;place-items:center}.harmony-strip .lbl span{font-family:var(--font-mono);font-size:14px;font-weight:500;padding:4px 12px;border-radius:6px;background:#0003;backdrop-filter:blur(4px);color:#fff}.best-for{font-size:12px;color:var(--muted-fg);padding-left:8px;margin-top:6px}.principles{margin-top:40px}.principles h3{font-size:16px;margin:0 0 12px}.principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.principle{border:1px solid var(--line);border-radius:8px;padding:16px}.principle h4{font-size:14px;margin:0 0 6px}.principle p{font-size:13px;color:var(--muted-fg);margin:0}.contrast-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.contrast-card{background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--sec-radius);box-shadow:var(--sec-shadow);padding:24px}.field-label{display:block;font-size:14px;font-weight:500;color:var(--muted-fg);margin:0 0 8px}.color-input-wrap{position:relative}.color-input-wrap input{height:40px;padding-right:48px;font-size:16px}.color-input-wrap .dot{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;border:2px solid var(--line)}.contrast-panel{margin-top:20px;background:var(--bg-sunken);border:1px solid var(--line);border-radius:12px;padding:24px;text-align:center}.contrast-panel .ratio{font-size:36px;font-weight:700}.fail-pill{display:inline-flex;padding:4px 10px;border-radius:999px;background:#fef2f2;color:#b91c1c;font-size:12px;font-weight:600;margin-top:6px}.stars{display:flex;gap:2px;color:#facc15;margin-top:8px}.stars .star{display:inline-flex;opacity:.3}.stars .star.on{opacity:1}.contrast-quote{margin-top:20px;padding:16px;border:1px solid var(--line);border-radius:8px;font-size:14px}.contrast-preview{display:flex;align-items:center;justify-content:center;min-height:100%;border-radius:var(--sec-radius);border:1px solid var(--line);box-shadow:var(--sec-shadow);padding:48px;text-align:center;font-size:28px;font-weight:600;line-height:1.3}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.pricing-grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:760px){.pricing-grid{grid-template-columns:1fr}}.mini-card{border:1px solid var(--line);border-radius:12px;background:var(--bg-muted);padding:16px}.mini-card .k{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-fg)}.mini-card .v{font-family:var(--font-mono);font-size:15px;margin-top:6px;overflow-wrap:anywhere}.mini-card p{font-size:13px;color:var(--muted-fg);margin:8px 0 0;line-height:1.55}.cvd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.cvd-tile{display:block;color:inherit;text-decoration:none;transition:transform .16s var(--ease)}.cvd-tile:hover,.cvd-tile:focus-visible{transform:translateY(-3px)}.cvd-tile .swatch{aspect-ratio:1;border-radius:12px}.cvd-tile .name{font-size:13px;font-weight:600;margin-top:8px}.cvd-tile .val{font-family:var(--font-mono);font-size:12px;color:var(--muted-fg)}.recipe-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.recipe-grid>.recipe-card:last-child{grid-column:1 / -1}.recipe-card{border:1px solid var(--line);border-radius:12px;background:var(--bg-muted);padding:14px}.recipe-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.recipe-card-head h4{font-size:14px;font-weight:600;margin:0}.recipe-code{margin:0;max-height:150px;overflow:auto;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);font-family:var(--font-mono);font-size:11px;line-height:1.55;color:var(--muted-fg);white-space:pre}.similar-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg);color:inherit;text-decoration:none;transition:transform .16s var(--ease),box-shadow .16s var(--ease)}.similar-card:hover,.similar-card:focus-visible{transform:translateY(-2px);box-shadow:var(--shadow-md)}.similar-sw{display:block;height:62px}.similar-name{font-size:12.5px;font-weight:600;padding:8px 10px 2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.similar-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 10px 8px}.similar-hex,.similar-de{font-family:var(--font-mono);font-size:10.5px;color:var(--muted-fg)}.creative-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.faq-ref:not(.sec-card){max-width:768px;margin:48px auto 32px;padding:0 16px}.faq-ref:not(.sec-card) h2{font-size:24px;font-weight:400;text-align:center;margin:0 0 32px}.sec-card.faq-ref{max-width:none;margin:0}.faq-ref .faq-item summary{font-size:15.5px;font-weight:600}.home-hero{position:relative;background:var(--bg);border-bottom:1px solid var(--line);overflow:clip}.home-hero-inner{max-width:1280px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,500px);gap:48px;align-items:center;min-height:min(calc(100svh - 64px),680px)}.home-hero-copy{max-width:640px;padding:56px 0}.hero-kicker{display:flex;align-items:center;gap:9px;margin:0 0 18px;font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}.hero-kicker .kdot{width:9px;height:9px;border-radius:50%;background:conic-gradient(var(--accent-1),var(--accent-2),var(--accent-3),var(--accent-4),var(--accent-5),var(--accent-1))}.home-hero h1{font-size:clamp(36px,4.6vw,64px);line-height:1.02;letter-spacing:-.045em;font-weight:700;margin:0 0 20px;text-wrap:balance}.hero-lede{font-size:clamp(16px,1.45vw,18.5px);line-height:1.6;color:var(--ink-2);margin:0;max-width:560px}.hero-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:30px}.hero-btn{min-height:48px;padding:0 22px;font-size:15px;border-radius:var(--r-full)}.hero-note{display:flex;align-items:center;gap:8px;margin:20px 0 0;font-size:13px;line-height:1.5;color:var(--ink-3)}.hero-note svg{flex:none;color:var(--ink-3)}.home-hero-bands{height:min(62vh,520px);min-height:380px;display:flex;border-radius:3px;overflow:hidden}.hero-band{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:14px 4px;background:var(--band);color:var(--band-ink);text-decoration:none;transition:flex .5s var(--ease),filter .25s var(--ease);animation:bandIn .72s var(--ease) both;animation-delay:calc(var(--i) * 55ms + 90ms)}.hero-band:hover,.hero-band:focus-visible{flex:2.1 1 0;filter:saturate(1.08)}.hb-name{writing-mode:vertical-rl;letter-spacing:.14em;font-size:15px;font-weight:600;white-space:nowrap}.hb-name.hb-sideways{text-orientation:sideways;letter-spacing:.04em;font-size:12px}.hb-culture{position:absolute;bottom:11px;left:0;right:0;text-align:center;pointer-events:none;font-family:var(--font-mono);font-size:9.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;opacity:.7}.hb-lat,.hb-hex{display:none;font-family:var(--font-mono);font-size:10.5px;line-height:1.4;opacity:.9;white-space:nowrap}.hero-band:hover .hb-name,.hero-band:focus-visible .hb-name{display:none}.hero-band:hover .hb-lat,.hero-band:hover .hb-hex,.hero-band:focus-visible .hb-lat,.hero-band:focus-visible .hb-hex{display:block}.hero-band:hover .hb-culture,.hero-band:focus-visible .hb-culture{bottom:12px;opacity:.95}.hero-rule{height:4px;background:var(--rainbow)}.home-section{max-width:1120px;margin:0 auto;padding:84px 24px 0}.home-section[id],.home-work{scroll-margin-top:84px}.home-sec-head{max-width:740px;margin-bottom:36px}.sec-kicker{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}.sec-kicker:before{content:"";width:20px;height:1px;background:var(--ink-3)}.home-section h2,.proof-col h2,.home-final h2{font-size:clamp(28px,3.4vw,42px);line-height:1.06;letter-spacing:-.035em;font-weight:700;margin:0;text-wrap:balance}.sec-body{font-size:16px;line-height:1.65;color:var(--ink-2);margin:14px 0 0;max-width:640px}.sec-link{display:inline-flex;align-items:center;gap:8px;margin-top:24px;font-size:14.5px;font-weight:600;color:var(--brand)}.sec-link svg{transition:transform .2s var(--ease)}.sec-link:hover svg{transform:translate(4px)}.home-work-frame .picker-card{max-width:none;margin:0;box-shadow:none;border-radius:4px;padding:18px}.fmt-rail{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.fmt-item{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:18px 14px 20px;border:0;border-right:1px solid var(--line);background:transparent;cursor:pointer;text-align:left;transition:background .2s var(--ease)}.fmt-item:last-child{border-right:0}.fmt-item:hover{background:var(--bg-sunken)}.fmt-k{font-size:10.5px;font-weight:600;letter-spacing:.14em;color:var(--ink-3)}.fmt-v{font-family:var(--font-mono);font-size:clamp(10.5px,1vw,12.5px);line-height:1.4;color:var(--ink);word-break:break-all}.fmt-copy{position:absolute;top:12px;right:10px;color:var(--ink-3);opacity:0;transition:opacity .2s}.fmt-item:hover .fmt-copy,.fmt-item:focus-visible .fmt-copy{opacity:1}.cul-list{border-top:1px solid var(--line)}.cul-row{display:grid;grid-template-columns:150px minmax(0,1fr) 220px 56px 20px;gap:20px;align-items:center;padding:18px 10px;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;transition:background .2s var(--ease),padding .2s var(--ease)}.cul-row:hover{background:var(--bg-muted);padding-left:18px}.cul-name{font-size:15px;font-weight:600;color:var(--ink)}.cul-name:hover{color:var(--brand)}.cul-swatches{display:flex;gap:4px;overflow:hidden}.cul-sw{width:42px;height:28px;border-radius:3px;flex:none;position:relative;transition:transform .16s var(--ease),box-shadow .16s var(--ease)}.cul-sw:hover,.cul-sw:focus-visible{transform:translateY(-2px);box-shadow:0 0 0 2px var(--bg-elev),0 4px 10px #0000002e;z-index:1}.cul-native{font-size:12.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cul-count{font-family:var(--font-mono);font-size:12px;color:var(--ink-3);text-align:right}.cul-arrow{color:var(--ink-3);display:inline-flex}.home-proof{padding-bottom:0}.proof-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;border-top:1px solid var(--line);padding-top:56px}.proof-col h2{font-size:clamp(24px,2.6vw,32px)}.sys-list{margin-top:22px;border-top:1px solid var(--line)}.sys-row{display:grid;grid-template-columns:minmax(0,1fr) auto 18px;gap:3px 12px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none}.sys-name{font-size:14.5px;font-weight:600}.sys-count{font-family:var(--font-mono);font-size:12px;color:var(--ink-3)}.sys-arrow{color:var(--ink-3);display:inline-flex;justify-self:end}.sys-src{grid-column:1 / 3;font-family:var(--font-mono);font-size:11px;color:var(--ink-3)}.sys-row:hover .sys-name{color:var(--brand)}.proof-a11y{border-left:2px solid var(--ink);padding-left:32px;align-self:start}.a11y-chips{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 26px}.a11y-chips span{padding:4px 10px;border:1px solid var(--line-strong);border-radius:var(--r-full);font-family:var(--font-mono);font-size:11px;color:var(--ink-2)}.a11y-links a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:center;padding:14px 0;border-top:1px solid var(--line);color:var(--ink);text-decoration:none}.a11y-links a svg{grid-row:span 2;color:var(--ink-3)}.a11y-links a:hover .al-name{color:var(--brand)}.al-name{font-size:15px;font-weight:600}.al-sub{font-size:12px;color:var(--ink-3)}.home-final{max-width:1120px;margin:84px auto 0;padding:72px 24px 96px;border-top:1px solid var(--line);text-align:center}.home-final p{margin:14px 0 28px;font-size:16px;color:var(--ink-2)}.home-final .btn{display:inline-flex}@keyframes bandIn{0%{opacity:0;transform:translateY(16px) scaleY(.96)}to{opacity:1;transform:none}}.home-hero-copy>*{animation:riseIn .7s var(--ease) both}.home-hero-copy>:nth-child(2){animation-delay:60ms}.home-hero-copy>:nth-child(3){animation-delay:.12s}.home-hero-copy>:nth-child(4){animation-delay:.18s}.home-hero-copy>:nth-child(5){animation-delay:.24s}@keyframes riseIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@media(max-width:900px){.home-hero-inner{grid-template-columns:1fr;gap:0;padding:0 20px;min-height:0}.home-hero-copy{padding:44px 0 30px;max-width:none}.home-hero-bands{height:170px;min-height:0;margin-bottom:40px}.home-hero h1{font-size:clamp(34px,8vw,52px)}.hero-band{animation:none}.fmt-rail{grid-template-columns:repeat(3,minmax(0,1fr))}.fmt-item:nth-child(3n){border-right:0}.fmt-item:nth-child(n+4){border-top:1px solid var(--line)}.cul-row{grid-template-columns:110px minmax(0,1fr) 44px 18px;gap:12px}.cul-native{display:none}.proof-grid{grid-template-columns:1fr;gap:48px}.proof-a11y{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:40px}}@media(max-width:600px){.home-section{padding:64px 16px 0}.home-sec-head{margin-bottom:26px}.home-hero-bands{height:132px}.hero-band{padding:10px 2px}.hb-name{font-size:13px;letter-spacing:.08em}.hb-name.hb-sideways{font-size:10px;letter-spacing:.02em}.hb-culture{bottom:7px;font-size:8px;letter-spacing:.04em}.hero-actions .btn{flex:1;justify-content:center}.fmt-rail{grid-template-columns:repeat(2,minmax(0,1fr))}.fmt-item:nth-child(3n){border-right:1px solid var(--line)}.fmt-item:nth-child(2n){border-right:0}.fmt-item:nth-child(n+3){border-top:1px solid var(--line)}.cul-row{grid-template-columns:1fr 44px 18px}.cul-swatches{grid-column:1 / 3;grid-row:2}.cul-count{grid-row:1}.home-work-frame .picker-card{padding:10px}.home-final{margin-top:64px;padding:56px 16px 72px}}@media(prefers-reduced-motion:reduce){.hero-band,.home-hero-copy>*{animation:none!important}.hero-band,.cul-row,.sec-link svg{transition:none!important}}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}.home-heading{padding:36px 16px 0;text-align:center}.home-heading h1{font-size:clamp(28px,4vw,44px);line-height:1.08;letter-spacing:-.035em;font-weight:700;margin:0 auto 12px;max-width:1024px}.home-heading .sub{font-size:clamp(16px,1.6vw,18px);line-height:1.55;margin:0 auto;max-width:896px}.picker-card{max-width:1024px;margin:24px auto 48px;padding:14px;background:var(--bg-elev);border:1px solid var(--line);border-radius:16px;box-shadow:var(--sec-shadow)}.picker-grid{display:grid;grid-template-columns:minmax(0,500px) minmax(0,1fr);gap:24px}.picker-left{min-width:0}.picker-image{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--line);aspect-ratio:500 / 334;background:radial-gradient(circle at 30% 40%,#22b8e6,#2563eb 32%,#7c3aed 58%,#ec6f9e 76%,#f5b22e);cursor:crosshair}.picker-image .marker{position:absolute;width:22px;height:22px;border-radius:50%;border:3px solid #fff;box-shadow:0 1px 6px #0006;transform:translate(-50%,-50%);pointer-events:none}.picker-toolbar{position:relative;display:flex;justify-content:center;margin-top:-24px;z-index:3}.picker-toolbar-inner{display:flex;align-items:center;gap:4px;padding:5px;border:1px solid var(--line);border-radius:12px;background:var(--bg-elev);box-shadow:var(--shadow-lg)}.btn-sm{min-height:36px;padding:0 12px;font-size:14px;border-radius:8px}.privacy-badge{display:inline-flex;gap:8px;align-items:flex-start;max-width:440px;margin-top:12px;padding:7px 13px;border:1px solid var(--success-border);background:var(--success-bg);color:var(--success);border-radius:10px;font-size:13px;font-weight:500;line-height:1.4;text-align:left}.picker-right{min-width:0}.picker-right h2{font-size:13px;font-weight:600;margin:0 0 8px}.picker-swatch{height:60px;border-radius:10px;border:1px solid var(--line);position:relative;margin-bottom:10px}.picker-swatch .chip{position:absolute;right:8px;top:8px;width:22px;height:22px;border-radius:6px;border:2px solid #fff;box-shadow:0 1px 3px #0000004d}.picker-rows{display:flex;flex-direction:column;gap:6px}.picker-row{display:flex;align-items:center;height:34px;border:1px solid var(--line);border-radius:8px;font-size:13px;overflow:hidden}.picker-row .k{width:46px;flex:none;padding-left:10px;color:var(--muted-fg);font-size:12px;border-right:1px solid var(--line);line-height:32px}.picker-row .v{flex:1;min-width:0;padding-left:10px;font-family:var(--font-mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.picker-row .copy-btn{position:static;opacity:1;margin-right:4px;border:0;width:32px;height:32px}.picker-actions{display:flex;flex-direction:column;gap:8px;margin-top:12px}.picker-actions .btn{width:100%}.picker-links{display:flex;gap:12px;margin-top:10px;font-size:13.5px;font-weight:500}.picker-links a{color:var(--link)}.picker-foot{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}.picker-foot-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.picker-foot-head h2{font-size:13px;font-weight:600;margin:0}.picker-foot-head .count{font-size:12.5px;color:var(--muted-fg);border:0;background:transparent;height:26px;border-radius:7px;padding:0 6px}.picker-foot-head .hint{font-size:12.5px;color:var(--muted-fg);line-height:1.3}.picker-foot-actions{margin-left:auto;display:flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--bg)}.picker-foot-actions button{width:34px;height:30px;border:0;background:transparent;color:var(--ink-2);display:grid;place-items:center;cursor:pointer}.picker-foot-actions button+button{border-left:1px solid var(--line)}.palette-strip{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));margin-top:10px;border-radius:12px;overflow:hidden}.palette-strip>span{height:76px;position:relative;display:block}.palette-strip .hex{position:absolute;left:0;right:0;bottom:8px;text-align:center;font-family:var(--font-mono);font-size:11px;font-weight:500;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.palette-strip .rm{position:absolute;right:4px;top:4px;width:24px;height:24px;border-radius:50%;border:1px solid var(--line);background:var(--bg-elev);color:var(--ink-2);display:grid;place-items:center;cursor:pointer;opacity:0}.palette-strip>span:hover .rm{opacity:1}.explainer{max-width:832px;margin:0 auto;padding:24px 16px 56px;display:flex;flex-direction:column;gap:32px}.explainer-intro{display:flex;gap:32px;align-items:center}.explainer-intro>div{flex:1;min-width:0}.explainer-intro h2{font-size:clamp(24px,3vw,34px);font-weight:700;line-height:1.1;letter-spacing:-.03em;margin:0}.explainer-intro .p1{font-size:18px;line-height:1.65;margin:12px 0 0}.explainer-intro .p2{font-size:15.5px;line-height:1.65;color:var(--muted-fg);margin:12px 0 0}.explainer-art{width:240px;height:240px;flex:none;display:grid;place-items:center;opacity:.12}.explainer-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.explainer-step{border:1px solid var(--line);border-radius:12px;background:var(--bg-elev);padding:16px}.explainer-step .num{display:inline-grid;width:26px;height:26px;place-items:center;border-radius:50%;background:var(--bg-sunken);font-size:13px;font-weight:600}.explainer-step h3{display:block;font-size:15.5px;font-weight:600;margin:10px 0 0;letter-spacing:0}.explainer-step p{font-size:13.5px;line-height:1.4;color:var(--muted-fg);margin:4px 0 0}.more-tools{max-width:832px;margin:0 auto;padding:0 16px 40px}.more-tools h2{font-size:clamp(22px,2.6vw,28px);font-weight:700;letter-spacing:-.03em;margin:0 0 20px}.more-tools-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.more-tool{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--bg-elev);transition:box-shadow .2s var(--ease)}.more-tool:hover{box-shadow:var(--card-shadow)}.more-tool .strip{height:28px;border-radius:7px;overflow:hidden;display:flex;background:var(--bg-muted)}.more-tool .strip span{flex:1}.more-tool h3{font-size:15.5px;font-weight:600;margin:0;letter-spacing:0}.more-tool p{font-size:13px;line-height:1.4;color:var(--muted-fg);margin:2px 0 0}.tool-index-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tool-index-card{display:flex;flex-direction:column;gap:10px;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--bg-elev);box-shadow:var(--card-shadow);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}.tool-index-card:hover{transform:translateY(-2px);box-shadow:var(--card-shadow-hover)}.tool-index-card .tile-icon{width:40px;height:40px;border-radius:12px;background:var(--bg-sunken);display:grid;place-items:center;color:var(--ink)}.tool-index-card h3{font-size:16px;font-weight:600;margin:0;letter-spacing:0}.tool-index-card p{font-size:13.5px;color:var(--muted-fg);margin:0;line-height:1.5}.tool-index-card .go{margin-top:auto;font-size:13px;font-weight:600;color:var(--link);display:inline-flex;align-items:center;gap:4px}.tool-widget-card .tool-card{border:0;background:transparent;box-shadow:none;padding:0;margin:0}@media(max-width:1060px){.color-shell{grid-template-columns:minmax(0,1fr)}.toc-card{position:static}.toc-list{display:grid;grid-template-columns:1fr 1fr}}@media(max-width:920px){.picker-grid{grid-template-columns:minmax(0,1fr)}.rel-cards,.conv-grid,.tool-index-grid,.more-tools-grid,.listing-grid{grid-template-columns:repeat(2,1fr)}.fmt-grid,.harmony-grid,.contrast-grid,.callout-grid,.guide-grid,.app-list,.mini-grid,.creative-grid,.use-cases{grid-template-columns:1fr}.explainer-intro{gap:16px}.explainer-art{display:none}.cvd-grid{grid-template-columns:repeat(2,1fr)}.conv-split{grid-template-columns:minmax(0,1fr)}.sec-card,.contrast-card{padding:20px}.principle-grid{grid-template-columns:1fr}}@media(max-width:760px){.page-heading{padding-top:28px}.rel-cards,.conv-grid,.tool-index-grid,.more-tools-grid,.listing-grid,.explainer-steps,.format-grid{grid-template-columns:1fr}.shade-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.harmony-desc{min-height:0}.palette-strip{grid-template-columns:repeat(5,minmax(0,1fr))}.palette-strip>span:nth-child(n+6){display:none}.howto,.toc-list{grid-template-columns:1fr}.listing-grid{gap:16px}.palette-circles{gap:10px;margin:18px 0 14px}.palette-circle{width:58px;height:58px}.palette-gradient{height:52px}.palette-toolbar{padding:8px}}@media(max-width:520px){.palette-strip>span:nth-child(n+4){display:none}.palette-circle{width:48px;height:48px}.palette-circles{gap:6px}.palette-hex{font-size:10.5px;letter-spacing:.02em}.palette-actions .btn span{display:none}.palette-actions .btn{padding:0 10px}.output-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.preview-banner h2{font-size:22px}.preview-banner h2 span{display:block;margin:4px 0 0}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.rel-card.flat{flex-direction:row;align-items:center;gap:10px;padding:14px 16px}.rel-card.flat>div{min-width:0;flex:1 1 auto}.rel-card.flat p{margin-top:2px}.sec-head:has(+.sec-sub){margin-bottom:6px}.sec-head+.sec-sub{margin:0 0 24px}.subsec-head:has(+.subsec-sub){margin-bottom:6px}.subsec-head+.subsec-sub{margin:0 0 20px}.prose-static p{font-size:15px;line-height:1.7;color:var(--ink-2)}.tool-shell{padding-bottom:24px}.tool-steps{display:grid;gap:14px;margin-top:4px}.tool-step{display:flex;gap:14px;padding:16px;background:var(--bg-sunken);border-radius:12px}.tool-step .num{width:26px;height:26px;border-radius:999px;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:600;flex:none}.tool-step h3{font-size:14px;margin:2px 0 4px}.tool-step p{margin:0;font-size:13px;line-height:1.6;color:var(--muted-fg)}.feature-list{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px}.feature-list li{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--ink-2)}.feature-list .icon{color:var(--brand);flex:none;margin-top:2px}.format-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.format-block{padding:18px}.format-block h3{font-size:15px;margin:0 0 8px}.format-block p{margin:0 0 12px;font-size:13px;line-height:1.6;color:var(--muted-fg)}.format-sample,.format-use{display:flex;gap:6px;align-items:center;font-size:12px}.format-sample{font-family:var(--font-mono);color:var(--ink-2);margin-bottom:6px}.format-use{color:var(--muted-fg)}.anchor-wrap[id]{scroll-margin-top:calc(var(--header-h) + 24px)}.value-box.active{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 18%,transparent)}@media(max-width:760px){.format-grid{grid-template-columns:1fr}}.tw-page{padding-top:24px;padding-bottom:64px}.tw-search{border-radius:var(--r-full);padding:2px;background:linear-gradient(90deg,#f472b6,#fbbf24,#34d399,#60a5fa,#a78bfa)}.tw-search-inner{display:flex;align-items:center;gap:10px;height:44px;padding:0 18px;background:var(--bg-elev);border-radius:var(--r-full);color:var(--ink-3)}.tw-search-inner input{flex:1;min-width:0;height:100%;border:0;background:transparent;outline:none;font-family:inherit;font-size:14px;color:var(--ink)}.tw-search-inner input::placeholder{color:var(--ink-3)}.tw-search-inner:focus-within{box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 16%,transparent)}.tw-head{margin:30px 0 26px}.tw-head h1{font-size:30px;font-weight:700;letter-spacing:-.02em;margin:0 0 6px}.tw-sub,.tw-count{margin:0;font-size:13.5px;color:var(--ink-2);line-height:1.5}.tw-count{color:var(--ink-3)}.tw-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.tw-card{background:var(--bg-elev);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:var(--shadow-sm)}.tw-card-head{position:relative;min-height:128px;padding:18px;display:grid;place-items:center}.tw-card-head h3{font-size:24px;font-weight:700;letter-spacing:-.02em;margin:0}.tw-main-hex{position:absolute;right:10px;bottom:10px;padding:4px 8px;border:0;cursor:pointer;border-radius:6px;background:#ffffff38;color:inherit;font-family:var(--font-mono);font-size:10px;letter-spacing:.02em;backdrop-filter:blur(8px)}.tw-main-hex:hover{background:#ffffff57}.tw-bar{display:flex;height:32px}.tw-swatch{flex:1;border:0;padding:0;cursor:pointer;transition:transform .15s var(--ease),box-shadow .15s}.tw-swatch:hover{transform:translateY(-2px);box-shadow:0 4px 10px #00000029;position:relative;z-index:1}.tw-labels{padding:12px}.tw-shades-title{margin:0 0 8px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}.tw-shade-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.tw-shade{height:40px;border:0;border-radius:8px;cursor:pointer;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:9.5px;line-height:1.15;transition:transform .15s var(--ease),box-shadow .15s}.tw-shade .tw-step{font-weight:600}.tw-shade .tw-hex{opacity:.66}.tw-shade:hover{transform:scale(1.05);position:relative;z-index:1;box-shadow:0 4px 12px #00000029}.tw-empty{text-align:center;padding:56px 0;color:var(--ink-3);font-size:14px}.tw-token-card .tw-card-head{min-height:96px}.tw-token-body{padding:14px 16px 16px}.tw-token-var{margin:0;font-family:var(--font-mono);font-size:12px;color:var(--ink-2);word-break:break-all}.tw-token-note{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:var(--ink-3)}.tw-source{margin:28px 0 0;font-size:12px;color:var(--ink-3)}.tw-intro{margin:8px 0 30px;padding:22px 24px;background:var(--bg-sunken);border:1px solid var(--line);border-radius:14px;display:grid;gap:16px}.tw-intro-block h2{margin:0 0 8px;font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}.tw-intro-block h3{margin:0 0 6px;font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}.tw-intro-block p{margin:0;font-size:14px;line-height:1.68;color:var(--ink-2)}.tw-intro-doc{margin:2px 0 0;font-size:13px}.tw-intro-doc a{color:var(--brand);font-weight:600;text-decoration:none}.tw-intro-doc a:hover{text-decoration:underline}@media(min-width:880px){.tw-intro{grid-template-columns:1fr 1fr;align-items:start}.tw-intro-doc{grid-column:1 / -1}}@media(max-width:680px){.tw-intro{padding:18px 16px;margin:6px 0 24px}}@media(max-width:1100px){.tw-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.tw-grid{grid-template-columns:1fr;gap:16px}.tw-head{margin:24px 0 20px}.tw-head h1{font-size:24px}.tw-card-head{min-height:112px}.tw-shade-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tw-shade{height:36px}}.tool-tabs{display:flex;gap:4px;padding:4px;background:var(--bg-sunken);border-radius:var(--r-full);margin-bottom:16px;width:fit-content;max-width:100%;overflow-x:auto}.tool-tabs button{border:0;background:transparent;color:var(--ink-2);font:inherit;font-size:12.5px;font-weight:600;padding:7px 14px;border-radius:var(--r-full);cursor:pointer;white-space:nowrap}.tool-tabs button:hover{color:var(--ink)}.tool-tabs button.active{background:var(--bg-elev);color:var(--ink);box-shadow:var(--shadow-sm)}.range-row{display:flex;align-items:center;gap:12px;margin-bottom:12px}.range-row label{min-width:120px;font-size:12.5px;font-weight:600;color:var(--ink-2)}.range-row input[type=range]{flex:1;accent-color:var(--brand)}.contrast-result{text-align:center;margin:18px 0 4px}.suggest-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.suggest-chip{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-elev);cursor:pointer;text-align:left;font:inherit}.suggest-chip:hover{border-color:var(--line-strong)}.suggest-swatch{width:44px;height:44px;border-radius:10px;flex:none;border:1px solid rgba(0,0,0,.06)}.suggest-text{display:flex;flex-direction:column;gap:2px;font-size:12.5px}.suggest-text em{font-style:normal;color:var(--ink-3);font-family:var(--font-mono);font-size:11.5px}.palette-editor{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:16px 0 8px}.pal-item{position:relative;min-height:204px;border-radius:var(--r-lg);padding:12px;display:flex;flex-direction:column;justify-content:space-between;cursor:grab;overflow:hidden;transition:transform .15s var(--ease),box-shadow .15s var(--ease)}.pal-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}.pal-item.is-dragging{opacity:.5}.pal-item.is-locked{outline:2px solid rgba(255,255,255,.75);outline-offset:-4px}.pal-item-top,.pal-item-bottom{display:flex;align-items:center;justify-content:space-between;gap:6px;opacity:.6;transition:opacity .15s var(--ease)}.pal-item:hover .pal-item-top,.pal-item:hover .pal-item-bottom{opacity:1}.pal-edit{width:28px;height:28px;border-radius:50%;overflow:hidden;border:1px solid rgba(255,255,255,.5);display:inline-grid;place-items:center;cursor:pointer;background:transparent}.pal-edit input[type=color]{width:40px;height:40px;border:0;padding:0;background:transparent;cursor:pointer}.pal-ico{width:28px;height:28px;border-radius:50%;border:0;background:#ffffff2e;color:inherit;display:inline-grid;place-items:center;cursor:pointer;transition:background-color .15s}.pal-ico:hover{background:#ffffff57}.pal-add{border:1px dashed currentColor;background:transparent}.pal-hex{border:0;background:transparent;color:inherit;font-family:var(--font-mono);font-size:14px;font-weight:800;letter-spacing:.05em;cursor:pointer;padding:14px 0;align-self:center}.pal-item.is-locked .pal-add{display:none}.palette-css{color:var(--ink-2)}.grad-stops{display:flex;flex-direction:column;gap:8px;margin-top:14px}.grad-stop{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-muted)}.grad-stop input[type=range]{flex:1;min-width:80px;accent-color:var(--brand)}.grad-pos{width:44px;text-align:right;font-family:var(--font-mono);font-size:12px;color:var(--ink-3)}.grad-dot{width:24px;height:24px;border-radius:50%;flex:none;border:1px solid var(--line-strong)}.grad-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px;margin-top:16px}.grad-options .field{margin:0}.grad-options select{width:100%;min-height:36px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-elev);color:var(--ink);padding:0 10px;font:inherit;font-size:13px}.angle-val{width:46px;text-align:right;font-family:var(--font-mono);font-size:12px;color:var(--ink-3)}.preset-row{display:flex;gap:6px;flex-wrap:wrap}.chip-btn{border:1px solid var(--line);background:var(--bg-elev);color:var(--ink-2);border-radius:var(--r-full);padding:6px 10px;font:inherit;font-size:12px;cursor:pointer}.chip-btn:hover{border-color:var(--line-strong);color:var(--ink)}.css-row{display:flex;align-items:flex-start;gap:8px;margin-top:14px}.css-row .gradient-code{flex:1;font-family:var(--font-mono);font-size:12.5px;background:var(--bg-sunken);padding:12px;border-radius:var(--r-sm);margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.cvd-row{grid-template-columns:repeat(2,minmax(0,1fr))}.cvd-item{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--bg-elev)}.cvd-head{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-bottom:1px solid var(--line);font-size:12.5px;font-weight:600}.cvd-pair{display:grid;grid-template-columns:1fr 1fr;min-height:90px}.cvd-half{display:flex;flex-direction:column;justify-content:flex-end;gap:2px;padding:10px}.cvd-half span{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.72}.cvd-half em{font-style:normal;font-family:var(--font-mono);font-size:11.5px;font-weight:700}.cvd-half:nth-child(odd){border-right:1px solid rgba(0,0,0,.08)}@media(max-width:760px){.palette-editor{grid-template-columns:repeat(3,minmax(0,1fr))}.pal-item{min-height:132px}.grad-options,.cvd-row,.suggest-grid{grid-template-columns:1fr}.css-row{flex-wrap:wrap}}.preview-large{font-size:26px;font-weight:700;line-height:1.25;margin-top:10px}.preview-large .preview-sub{font-size:11.5px}.scale-tiles{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:6px}.scale-tile{border:0;border-radius:10px;padding:12px 8px 10px;min-height:104px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:10px;cursor:pointer;text-align:left;transition:transform .16s ease}.scale-tile:hover{transform:translateY(-2px)}.scale-step{font-family:var(--font-mono);font-size:12.5px;font-weight:700}.scale-hex{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.03em;opacity:.82}.scale-exports{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.scale-exports button{border:1px solid var(--line);background:transparent;color:var(--ink-2);border-radius:999px;padding:6px 13px;font-size:12.5px;cursor:pointer}.scale-exports button:hover{background:var(--bg-sunken);color:var(--ink)}.scale-exports button.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}.scale-code,.wairo-code,.mesh-code{font-family:var(--font-mono);font-size:12px;line-height:1.6;background:var(--bg-sunken);border-radius:10px;padding:12px;margin:0;overflow-x:auto;white-space:pre;color:var(--ink-2)}.nearest-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}.nearest-card{border:1px solid var(--line);border-radius:14px;padding:8px;background:var(--bg)}.nearest-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 8px 10px;font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted-fg)}.nearest-swatch{width:18px;height:18px;border-radius:50%;flex:none}.nearest-row{width:100%;display:flex;align-items:center;gap:9px;padding:8px;border:0;border-radius:9px;background:transparent;cursor:pointer;text-align:left}.nearest-row:hover{background:var(--bg-sunken)}.nearest-dot{width:12px;height:12px;border-radius:4px;flex:none}.nearest-info{display:flex;flex-direction:column;min-width:0;flex:1}.nearest-info strong{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nearest-info em{font-style:normal;font-size:10.5px;color:var(--muted-fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nearest-de{font-family:var(--font-mono);font-size:10.5px;color:var(--muted-fg);flex:none}.nearest-hex{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-2);flex:none}.wairo-controls{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}.wairo-controls .field{min-width:150px}.wairo-palette{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.wairo-swatch{border:0;border-radius:12px;min-height:138px;padding:12px 11px;display:flex;flex-direction:column;justify-content:space-between;gap:8px;text-align:left;cursor:pointer}.wairo-swatch:hover{filter:brightness(1.03)}.wairo-name{font-size:15px;font-weight:600;line-height:1.3}.wairo-lat{font-size:10.5px;opacity:.76}.wairo-hex{font-family:var(--font-mono);font-size:10.5px;opacity:.86}.cm-wrap{overflow-x:auto}.cm-table{border-collapse:separate;border-spacing:4px}.cm-table th{padding:4px 6px;font-family:var(--font-mono);font-size:10px;font-weight:500;color:var(--muted-fg);white-space:nowrap}.cm-dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:middle;border:1px solid rgba(0,0,0,.14)}.cm-cell{width:64px;height:54px;border:0;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:4px}.cm-cell.is-self{cursor:default}.cm-ratio{font-family:var(--font-mono);font-size:11.5px;font-weight:700;background:#ffffffeb;color:#111;padding:1px 6px;border-radius:5px}.cm-tag{font-size:9px;font-weight:700;letter-spacing:.05em;background:#ffffffeb;padding:1px 5px;border-radius:4px}.cm-tag.pass{color:#0b7a3b}.cm-tag.fail{color:#b21e35}.contrast-summary{font-weight:500;color:var(--ink);margin-top:14px}.cvd-sim-row{display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line)}.cvd-sim-label{width:96px;flex:none;font-size:11.5px;font-weight:600;color:var(--muted-fg)}.cvd-swatches{display:flex;gap:6px;flex-wrap:wrap}.cvd-chip{width:44px;height:30px;border:0;border-radius:8px;cursor:pointer}.cvd-title{font-size:14px;margin:26px 0 10px}.cvd-hit-list{display:grid;gap:6px}.cvd-hit{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:9px;padding:8px 10px}.cvd-hit-dots{display:flex;flex:none}.cvd-hit-dots span{width:22px;height:22px;border-radius:5px}.cvd-hit-dots span+span{margin-left:-5px;border:1px solid var(--bg)}.cvd-hit-text{display:flex;flex-direction:column}.cvd-hit-text b{font-family:var(--font-mono);font-size:11.5px;font-weight:600}.cvd-hit-text em{font-style:normal;font-size:10.5px;color:var(--muted-fg)}.mesh-colors{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}.mesh-preview{height:280px;border-radius:14px;border:1px solid var(--line)}.mesh-actions{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}@media(max-width:860px){.scale-tiles{grid-template-columns:repeat(6,minmax(0,1fr))}.wairo-palette{grid-template-columns:repeat(3,minmax(0,1fr))}.mesh-colors{grid-template-columns:1fr}}@media(max-width:560px){.scale-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}.scale-tile{min-height:92px}.wairo-palette{grid-template-columns:1fr 1fr}.cvd-sim-label{width:72px}.mesh-preview{height:220px}}:root{--bottom-nav-h: 58px}.bottom-nav{display:none}@keyframes sheetUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@media(max-width:900px){body{padding-bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom))}body.menu-open{overflow:hidden}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:5px 6px calc(5px + env(safe-area-inset-bottom));background:var(--bg-elev);border-top:1px solid var(--line);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);box-shadow:0 -6px 18px #1111130f}.bottom-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;min-height:46px;padding:4px 2px;border:0;border-radius:10px;background:transparent;color:var(--ink-3);font-family:inherit;font-size:10.5px;font-weight:600;line-height:1.2;text-align:center;cursor:pointer;transition:color .15s,background-color .15s}.bottom-nav-item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bottom-nav-item .icon{width:20px;height:20px}.bottom-nav-item.active{color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent)}.bottom-nav-item:active{background:var(--bg-sunken)}.mobile-sheet{display:block;position:fixed;inset:0;z-index:90;visibility:hidden;pointer-events:none}.mobile-sheet.open{visibility:visible;pointer-events:auto}.mobile-sheet-scrim{position:absolute;inset:0;background:#11111366;opacity:0;transition:opacity .2s var(--ease)}.mobile-sheet.open .mobile-sheet-scrim{opacity:1}.mobile-sheet-panel{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--bg-elev);color:var(--ink);transform:translate(100%);transition:transform .28s var(--ease)}.mobile-sheet.open .mobile-sheet-panel{transform:none}.mobile-sheet-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:8px;height:56px;padding:0 6px 0 14px;border-bottom:1px solid var(--line)}.mobile-sheet-close{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:var(--r-full);background:transparent;color:var(--ink-2);cursor:pointer;transition:background-color .15s,color .15s}.mobile-sheet-close:hover{background:var(--bg-sunken);color:var(--ink)}.mobile-sheet-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 14px calc(24px + env(safe-area-inset-bottom))}.mobile-sheet-auth{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mobile-sheet-auth .btn{min-height:42px;justify-content:center;border-radius:10px;font-size:14.5px}.mobile-sheet-auth .btn[hidden]{display:none!important}.mobile-sheet-auth:has(.btn[hidden]){grid-template-columns:1fr}.ms-group h2{margin:16px 0 2px;padding:0 10px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}.ms-list{list-style:none;margin:0;padding:0}.ms-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:42px;padding:0 10px;border-radius:10px;font-size:15px;font-weight:500;color:var(--ink);transition:background-color .15s}.ms-row .icon{color:var(--ink-3);flex:none}.ms-row:hover{background:var(--bg-sunken)}.ms-row[aria-current=page]{background:var(--bg-sunken);font-weight:600}.mobile-sheet-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}.mobile-sheet-foot .lang-menu{top:auto;bottom:calc(100% + 8px)}.mobile-sheet-foot .lang-switch>button{width:auto;padding:0 12px;justify-content:flex-start}.mobile-sheet-foot .lang-switch>button>span,.mobile-sheet-foot .lang-switch>button>svg:last-child{display:inline-flex}.header-right>.header-login,.header-right>.header-action,.header-right>.theme-toggle{display:none}}@media(max-width:760px){body{font-size:15px}.container{padding:0 16px}.header-right{gap:6px}.header-login{padding:8px;font-size:12.5px}.page-heading{padding:24px 16px 4px}.page-heading h1{font-size:clamp(26px,7.4vw,34px)}.page-heading .sub{font-size:15px;line-height:1.5}.sec-card{padding:18px 16px;border-radius:18px}.sec-head{margin-bottom:18px}.sec-head h2{font-size:17px}.in-card{padding:14px}.tool-index-card,.rel-card,.conv-card{padding:16px}.tool-step{padding:14px 12px;gap:10px}.tool-step .num{width:24px;height:24px;font-size:12px}.prose{padding:40px 16px 48px}.footer{padding-top:34px}.footer-grid{gap:24px 16px}.tbl{font-size:12px}.tbl th,.tbl td{padding:8px 10px}.sec-card:has(.tbl){overflow-x:auto}.sec-card:has(.tbl) .tbl{min-width:560px}.sec-card:has(.tbl) .sec-head{position:sticky;left:0}.tool-tabs,.meta-chips,.palette-actions,.scale-exports{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.code-input,.gradient-code,.scale-code,.wairo-code,.mesh-code,.sys-code{font-size:11.5px}.cm-cell{width:56px;height:48px}.toc-card{padding:8px;border-radius:16px}.toc-list{display:flex;flex-direction:row;gap:6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px}.toc-list::-webkit-scrollbar{display:none}.toc-list li{flex:0 0 auto}.toc-link{white-space:nowrap;padding:8px 11px;min-height:38px;border-radius:999px;background:var(--bg-sunken);font-size:12.5px;gap:6px}.toc-link .icon{width:14px;height:14px}.toc-link:hover,.toc-link.active{background:color-mix(in srgb,var(--brand) 12%,var(--bg-sunken));color:var(--ink)}.listing-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.listing-thumb{aspect-ratio:4 / 3}.listing-body{padding:10px;gap:4px}.listing-title h3{font-size:14px;line-height:1.4}.listing-hex{font-size:11.5px}.listing-card .icon-btn{width:28px;height:28px}.cvd-sim-label{width:66px;font-size:11px}.cvd-swatches{flex-wrap:nowrap;gap:6px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch}.cvd-chip{width:38px;height:30px;flex:0 0 auto}}@media(max-width:520px){.header-login{display:none}.brand{font-size:16px}.brand .logo{width:26px;height:26px}.page-heading h1{font-size:26px}.sec-card{padding:16px 14px}.in-card{padding:12px}.footer-grid{grid-template-columns:1fr 1fr;gap:22px 14px}.footer-bottom{font-size:11px}.palette-editor{grid-template-columns:1fr 1fr}.scale-exports button{min-height:36px}.bottom-nav-item{font-size:10px}.recipe-grid{grid-template-columns:1fr}.recipe-card{min-width:0}.recipe-code{font-size:10.5px}}@media(max-width:380px){.brand-name{font-size:15px}.header-right{gap:4px}.lang-switch>button,.theme-toggle,.mobile-menu-btn{width:34px;height:34px}.bottom-nav-item span{font-size:9.5px}}.shell-640{max-width:640px}.shell-1040{max-width:1040px}.acct-shell{display:flex;flex-direction:column;gap:16px}.acct-footnote{color:var(--ink-3);font-size:12.5px;text-align:center;margin:4px 0 0}.acct-auth{padding:26px 24px}.acct-auth-head{display:flex;align-items:center;gap:10px}.acct-auth-head h2{margin:0;font-size:20px;letter-spacing:-.02em}.acct-form{display:flex;flex-direction:column;gap:14px;margin-top:18px}.acct-field{display:flex;flex-direction:column;gap:6px}.acct-field label{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}.acct-field input,.acct-field select,.acct-dialog-field input,.acct-dialog-field select{width:100%;min-height:42px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg-elev);color:var(--ink);font:inherit}.acct-field input:focus,.acct-field select:focus,.acct-dialog-field input:focus{outline:none;border-color:var(--brand)}.acct-code-input{font-family:var(--font-mono);font-size:20px;letter-spacing:.24em;text-align:center}.acct-submit{min-height:44px;width:100%;margin-top:2px}.acct-inline-links{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.acct-link{background:none;border:0;color:var(--brand);font:inherit;font-size:13px;cursor:pointer;padding:0}.acct-link:disabled{color:var(--ink-3);cursor:default}.acct-hint{color:var(--ink-3);font-size:12.5px;line-height:1.55;margin:0}.acct-error{margin:4px 0 0;padding:10px 12px;border-radius:var(--r-sm);font-size:13px;color:#b4123c;background:#ec6f9e1f}.acct-sent{margin:0;font-size:13.5px;color:var(--ink-2)}.acct-switch{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:13.5px;color:var(--ink-2)}.acct-switch a{color:var(--brand);font-weight:600}.acct-top{padding:22px 24px}.acct-top-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.acct-identity{min-width:0}.acct-email{font-size:18px;font-weight:650;letter-spacing:-.015em}.acct-sub{color:var(--ink-3);font-size:13px;margin:4px 0 0;max-width:560px}.acct-top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.acct-plan{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand);border:1px solid color-mix(in srgb,var(--brand) 28%,var(--line));background:color-mix(in srgb,var(--brand) 8%,transparent);padding:5px 9px;border-radius:var(--r-full)}.acct-quota{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}.acct-meter-top{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--ink-3);margin-bottom:6px}.acct-meter-top span:last-child{font-variant-numeric:tabular-nums;color:var(--ink-2)}.acct-meter-bar{height:4px;border-radius:4px;background:var(--bg-sunken);overflow:hidden}.acct-meter-bar i{display:block;height:100%;background:var(--brand);border-radius:4px}.acct-meter.is-full .acct-meter-bar i{background:var(--accent-5)}.acct-meter.is-full .acct-meter-top span:last-child{color:var(--accent-5);font-weight:600}.acct-layout{display:grid;grid-template-columns:252px minmax(0,1fr);gap:16px;align-items:start}.acct-side{position:sticky;top:calc(var(--header-h) + 16px);border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-elev);padding:14px;box-shadow:var(--shadow-sm)}.acct-side-head{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);padding:2px 6px 8px}.acct-nav{display:flex;flex-direction:column;gap:2px}.acct-nav-item,.acct-collection{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;color:var(--ink-2);font:inherit;font-size:13.5px;padding:8px 9px;border-radius:var(--r-sm);cursor:pointer;text-align:left}.acct-nav-item .icon{color:var(--ink-3);flex:none}.acct-nav-item:hover,.acct-collection:hover{background:var(--bg-sunken);color:var(--ink)}.acct-nav-item.active,.acct-collection.active{background:color-mix(in srgb,var(--brand) 8%,transparent);color:var(--ink);font-weight:600}.acct-nav-item.active .icon{color:var(--brand)}.acct-nav-item span:nth-child(2),.acct-collection span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.acct-count{font-size:11.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}.acct-collections{display:flex;flex-direction:column;gap:2px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.acct-collection{padding-left:9px}.acct-collection:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--line-strong);flex:none}.acct-collection.active:before{background:var(--brand)}.acct-main{border:1px solid var(--line);border-radius:var(--r-md);background:var(--bg-elev);padding:18px;box-shadow:var(--shadow-sm);min-height:320px}.acct-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}.acct-toolbar h2{margin:0;font-size:17px;letter-spacing:-.015em}.acct-search{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:var(--r-full);padding:0 12px;height:36px;min-width:220px;color:var(--ink-3);background:var(--bg-muted)}.acct-search input{flex:1;border:0;background:none;font:inherit;font-size:13px;color:var(--ink);min-width:0}.acct-search input:focus{outline:none}.acct-search .icon{width:15px;height:15px;flex:none}.acct-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(225px,1fr));gap:12px}.acct-item{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--bg-elev);display:flex;flex-direction:column;transition:border-color .18s var(--ease),transform .18s var(--ease)}.acct-item:hover{border-color:var(--line-strong);transform:translateY(-1px)}.acct-preview{display:flex;height:72px}.acct-preview span{flex:1}.acct-preview-gradient{display:block;height:84px}.acct-preview-empty{background:repeating-linear-gradient(135deg,var(--bg-sunken) 0 8px,var(--bg-muted) 8px 16px)}.acct-item-body{padding:10px 12px 11px;display:flex;flex-direction:column;gap:4px}.acct-item-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.acct-item-top h3{margin:0;font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.acct-item-top h3 a{color:inherit}.acct-kind{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line);border-radius:var(--r-full);padding:2px 6px;flex:none}.acct-item-meta{margin:0;font-size:11.5px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.acct-item-actions{display:flex;gap:2px;margin-top:6px}.acct-item-actions .icon-btn{width:30px;height:30px}.acct-item-actions .icon-btn.is-fav{color:var(--accent-4);border-color:color-mix(in srgb,var(--accent-4) 40%,var(--line))}.acct-empty{text-align:center;padding:44px 16px;border:1px dashed var(--line-strong);border-radius:var(--r-md)}.acct-empty-icon{width:52px;height:52px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--brand) 8%,transparent);color:var(--brand);margin-bottom:10px}.acct-empty h3{margin:0 0 5px;font-size:16px}.acct-empty p{margin:0 0 14px;color:var(--ink-3);font-size:13px}.acct-empty .btn{display:inline-flex}.acct-signedout{display:flex;justify-content:center;padding:40px 0 56px}.acct-signedout-inner{text-align:center;max-width:420px}.acct-signedout-icon{width:58px;height:58px;border-radius:50%;margin:0 auto 12px;display:flex;align-items:center;justify-content:center;background:var(--bg-sunken);color:var(--ink-3)}.acct-signedout-inner h2{margin:0 0 6px;font-size:19px}.acct-signedout-inner p{margin:0 0 16px;color:var(--ink-3);font-size:13.5px}.acct-cta-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.acct-settings{padding:22px 24px}.acct-settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}.acct-setting-block{display:flex;flex-direction:column;gap:10px}.acct-setting-block form{display:flex;flex-direction:column;gap:12px}.acct-block-title{margin:0;font-weight:650;font-size:14.5px}.acct-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.acct-saved{display:inline-flex;align-items:center;gap:4px;color:var(--accent-3);font-size:12.5px;font-weight:600}.acct-check{display:flex;gap:9px;align-items:flex-start;font-size:13px}.acct-check input{width:16px;height:16px;margin-top:2px;flex:none}.acct-danger{border-left:2px solid color-mix(in srgb,#e11d48 45%,var(--line));padding-left:16px}.acct-danger-btn{color:#b4123c;border-color:color-mix(in srgb,#e11d48 35%,var(--line))}.acct-danger-btn:hover{background:#e11d480f;border-color:#e11d48}.acct-dialog{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;background:#1111136b;padding:20px}.acct-dialog-card{width:min(420px,100%);background:var(--bg-elev);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:10px}.acct-dialog-card h3{margin:0;font-size:17px}.acct-dialog-field{display:flex}.acct-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}.acct-toast{position:fixed;left:50%;bottom:84px;transform:translate(-50%,12px);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:var(--r-full);font-size:13px;font-weight:500;opacity:0;pointer-events:none;transition:opacity .22s var(--ease),transform .22s var(--ease);z-index:70;max-width:calc(100vw - 32px)}.acct-toast.is-on{opacity:1;transform:translate(-50%)}.acct-save-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}.acct-save-head{margin-left:auto;display:inline-flex;align-items:center;gap:10px;flex:none}.acct-save-head .btn{white-space:nowrap}@media(max-width:560px){.acct-save-head .btn span{display:none}}.acct-save-msg{font-size:12.5px;color:var(--accent-3);font-weight:600;opacity:0;transition:opacity .2s var(--ease)}.acct-save-msg.is-on{opacity:1}@media(max-width:860px){.acct-layout{grid-template-columns:1fr}.acct-side{position:static;order:2}.acct-main{order:1}.acct-quota{grid-template-columns:1fr 1fr}}@media(max-width:520px){.acct-auth,.acct-top,.acct-settings{padding:18px 16px}.acct-quota{grid-template-columns:1fr 1fr;gap:12px}.acct-grid{grid-template-columns:1fr 1fr}.acct-top-actions{width:100%}}.acct-dialog[hidden],.acct-signedout[hidden],.acct-empty[hidden],.acct-settings[hidden],.acct-workspace[hidden],.acct-top[hidden],.acct-field[hidden],.acct-save-msg[hidden],.acct-dialog-field[hidden]{display:none!important}.theme-previews{display:grid;grid-template-columns:1fr 1fr;gap:16px}.theme-preview{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px;box-shadow:var(--shadow-sm)}.tp-head{display:flex;align-items:center;gap:8px;margin-bottom:12px}.tp-dot{width:10px;height:10px;border-radius:50%;background:var(--accent-3);flex:none}.tp-label{font-size:13.5px;font-weight:600;color:var(--ink)}.tp-code{margin-left:auto;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3)}.tp-body{background:var(--bg-sunken);border-radius:var(--r-md);padding:14px}.tp-title{font-size:26px;font-weight:700;letter-spacing:-.03em;color:var(--ink);line-height:1.1}.tp-text{font-size:12.5px;color:var(--ink-2);margin:8px 0 12px;line-height:1.5}.tp-row{display:flex;align-items:center;gap:8px}.tp-btn{background:var(--brand);color:#fff;border-radius:var(--r-full);padding:5px 12px;font-size:12px;font-weight:600}.tp-chip{border:1px solid var(--line-strong);color:var(--ink-2);border-radius:var(--r-full);padding:5px 12px;font-size:12px}.tp-bar{height:8px;border-radius:var(--r-full);margin-top:12px;background:var(--rainbow)}.token-group{margin-bottom:20px}.token-group:last-child{margin-bottom:0}.token-group-title{font-size:13px;font-weight:600;color:var(--ink-3);margin:0 0 8px;text-transform:uppercase;letter-spacing:.06em}.token-table{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}.token-row{display:grid;grid-template-columns:26px minmax(120px,1.1fr) minmax(90px,1fr) minmax(90px,1fr);gap:10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line)}.token-row:last-child{border-bottom:none}.token-row:nth-child(2n){background:var(--bg-muted)}.tk-sw{width:22px;height:22px;border-radius:var(--r-sm);display:block}.tk-name{font-family:var(--font-mono);font-size:12.5px;color:var(--ink)}.tk-val{font-family:var(--font-mono);font-size:12px;color:var(--ink-2);overflow-wrap:anywhere}.tk-val-alt{color:var(--ink-3)}.brand-swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.brand-swatch{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}.bs-color{display:block;height:56px}.bs-name{display:block;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-2);padding:8px 10px 0}.bs-hex{display:block;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);padding:0 10px 9px}.brand-gradient{height:44px;border-radius:var(--r-md);background:var(--rainbow);margin-top:16px}@media(max-width:760px){.theme-previews{grid-template-columns:1fr}.token-row{grid-template-columns:22px 1fr;row-gap:2px}.tk-val,.tk-val-alt{grid-column:2}}.doc-lead{font-size:15px;color:var(--ink-2);line-height:1.7;margin:0 0 22px}.doc-section{padding:18px 0;border-top:1px solid var(--line)}.doc-section:first-of-type{border-top:none;padding-top:0}.doc-sec-head{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}.doc-sec-num{font-family:var(--font-mono);font-size:11.5px;color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent);border-radius:var(--r-full);padding:2px 8px;flex:none}.doc-sec-head h2{font-size:17px;font-weight:650;color:var(--ink);margin:0;letter-spacing:-.01em}.doc-section p{margin:0;font-size:14.5px;color:var(--ink-2);line-height:1.72}.logo-show{display:grid;grid-template-columns:156px minmax(0,1fr);gap:20px;align-items:start}.logo-plate{display:grid;place-items:center;padding:16px;border-radius:var(--r-lg);background:var(--bg-sunken);border:1px solid var(--line)}.logo-plate img{width:124px;height:124px;display:block}.logo-text p{margin:0 0 12px;font-size:14.5px;color:var(--ink-2);line-height:1.7}.logo-points{list-style:none;margin:0;padding:0;display:grid;gap:8px}.logo-points li{display:grid;grid-template-columns:minmax(96px,140px) minmax(0,1fr);gap:12px;align-items:baseline;padding:8px 10px;border-radius:var(--r-sm);background:var(--bg-muted)}.logo-points b{font-size:13.5px;color:var(--ink);font-weight:600}.logo-points span{font-size:13px;color:var(--ink-2);line-height:1.6}.logo-sizes{display:flex;align-items:flex-end;gap:20px;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line);flex-wrap:wrap}.logo-size{display:grid;justify-items:center;gap:6px}.logo-size img{display:block}.logo-size em{font-style:normal;font-family:var(--font-mono);font-size:11px;color:var(--ink-3)}.type-scale{margin-top:14px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}.type-row{display:grid;grid-template-columns:88px 132px minmax(0,1fr);gap:12px;align-items:baseline;padding:10px 14px;border-bottom:1px solid var(--line)}.type-row:last-child{border-bottom:none}.type-row:nth-child(2n){background:var(--bg-muted)}.type-name{font-size:12.5px;font-weight:600;color:var(--ink-2)}.type-size{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3)}.type-sample{color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.radius-row{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}.radius-chip{display:inline-grid;place-items:center;min-width:76px;height:56px;padding:0 14px;border:1px solid var(--line-strong);background:var(--bg-sunken);font-family:var(--font-mono);font-size:11.5px;color:var(--ink-2)}@media(max-width:760px){.logo-show{grid-template-columns:1fr}.logo-points li{grid-template-columns:1fr;gap:2px}.type-row{grid-template-columns:74px minmax(0,1fr)}.type-sample{grid-column:1 / -1}}.stats-head{padding:8px 0 4px}.stats-eyebrow{font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-4);margin:0 0 8px}.stats-title{font-size:clamp(30px,4.4vw,44px);font-weight:700;letter-spacing:-.035em;color:var(--ink);margin:0 0 12px;line-height:1.1}.stats-intro{font-size:15px;color:var(--ink-2);line-height:1.72;margin:0;max-width:62ch}.stats-cta{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}.stats-labelrow{display:flex;align-items:center;gap:14px;margin:30px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}.stats-label{font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}.stats-labelrow:after{content:"";flex:1 1 auto;height:1px;background:var(--line);order:1}.stats-label-right{font-size:11.5px;color:var(--ink-3);white-space:nowrap;order:2}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--bg-elev)}.stat-cell{display:flex;flex-direction:column;gap:4px;padding:14px 16px 16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-width:0}.stat-cell:nth-child(4n){border-right:none}.stat-key{font-family:var(--font-mono);font-size:11px;color:var(--ink-3);letter-spacing:.02em}.stat-val{font-size:27px;font-weight:700;letter-spacing:-.03em;color:var(--ink);line-height:1.15}.stat-sub{font-size:11.5px;color:var(--ink-3);line-height:1.45;overflow-wrap:anywhere}.stats-chart-card{margin-top:0}.stat-chart{width:100%;height:auto;display:block;overflow:visible}.stat-chart .sc-axis{font-family:var(--font-mono);font-size:10.5px;fill:var(--ink-3)}.stat-chart .sc-strong{fill:var(--ink);font-family:var(--font-ui);font-size:13px;font-weight:600}.stat-chart .sc-val{font-family:var(--font-mono);font-size:11px;fill:var(--ink-2)}.stats-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.anatomy-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.anatomy-block{border:1px solid var(--line);border-radius:var(--r-md);padding:14px;background:var(--bg-muted)}.anatomy-title{font-size:13px;font-weight:650;color:var(--ink);margin:0 0 10px}.anatomy-rows{display:grid;gap:6px}.anatomy-row{display:flex;align-items:center;gap:8px;font-size:13px}.anatomy-dot{width:14px;height:14px;border-radius:4px;flex:none;border:1px solid var(--line-strong)}.anatomy-label{color:var(--ink-2)}.anatomy-count{margin-left:auto;font-family:var(--font-mono);font-size:12px;color:var(--ink)}.anatomy-note{font-size:11.5px;color:var(--ink-3);margin:10px 0 0}.stats-tbl td code{font-size:12px}@media(max-width:900px){.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-cell:nth-child(4n){border-right:1px solid var(--line)}.stat-cell:nth-child(2n){border-right:none}.anatomy-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.stats-two,.anatomy-grid{grid-template-columns:1fr}.stat-val{font-size:23px}}.stats-usage-card{border-color:color-mix(in srgb,var(--brand) 28%,var(--line))}.usage-note{display:flex;align-items:center;gap:7px;margin:0 0 14px;font-size:12.5px;color:var(--ink-3)}.usage-note .icon{color:var(--accent-3);flex:none}.usage-totals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}.usage-totals>div{display:flex;flex-direction:column;gap:2px;padding:11px 13px;background:var(--bg-muted);border:1px solid var(--line);border-radius:var(--r-md)}.usage-totals b{font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-.02em}.usage-totals span{font-size:11.5px;color:var(--ink-3)}.usage-empty{margin:0 0 16px;padding:22px 16px;text-align:center;border:1px dashed var(--line-strong);border-radius:var(--r-md);font-size:13.5px;color:var(--ink-3);background:var(--bg-muted)}.usage-charts{display:grid;grid-template-columns:1fr 1fr;gap:18px}.usage-chart-wide{grid-column:1 / -1}.usage-chart h3{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin:0 0 8px}@media(max-width:760px){.usage-totals{grid-template-columns:repeat(2,minmax(0,1fr))}.usage-charts{grid-template-columns:1fr}}.stats-live-card{border-color:color-mix(in srgb,var(--brand) 28%,var(--line))}.sc-legend-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:10px}.sc-legend{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-2)}.sc-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}.stats-live-card .usage-totals{margin-top:14px}.browse-shell{padding-top:8px;padding-bottom:32px}.browse-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}.filter-console{grid-column:1 / -1;padding:0;overflow:hidden}.browse-results{min-width:0}.browse-aside{min-width:0;position:sticky;top:calc(var(--header-h) + 20px);max-height:calc(100vh - var(--header-h) - 40px);overflow-y:auto;scrollbar-width:thin}.browse-results .listing-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.filter-top{display:flex;align-items:center;gap:16px;padding:20px 24px}.filter-heading{display:flex;align-items:center;gap:12px;min-width:0;flex:0 1 auto}.filter-heading-icon{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;flex:none;color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--bg-elev))}.filter-heading-text{min-width:0}.filter-heading-text h2{font-size:17px;font-weight:600;margin:0;letter-spacing:-.01em}.filter-heading-text p{font-size:13px;line-height:1.45;color:var(--muted-fg);margin:3px 0 0}.filter-top-actions{display:flex;align-items:center;gap:10px;flex:none}.filter-badge{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;background:var(--bg-sunken);color:var(--ink-2);font-size:13px;font-variant-numeric:tabular-nums}.filter-badge b{font-size:14px;font-weight:600;color:var(--ink)}.filter-reset{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--bg-elev);color:var(--muted-fg);font-family:inherit;font-size:13px;cursor:pointer;transition:color .15s var(--ease),border-color .15s var(--ease)}.filter-reset .icon{width:14px;height:14px}.filter-reset:hover{color:var(--ink);border-color:var(--ink-3)}.filter-console.is-filtered .filter-reset{color:var(--brand);border-color:color-mix(in srgb,var(--brand) 35%,var(--line))}.filter-console .filter-search{position:relative;flex:0 1 320px;min-width:180px;max-width:440px;margin-left:auto}.pill-ico{display:inline-flex;flex:none;opacity:.72}.pill-btn.active .pill-ico{opacity:1}.filter-console .filter-search .icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted-fg)}.filter-console .filter-search input{width:100%;height:44px;padding-left:40px;font-family:var(--font-ui);font-size:14px;border:1px solid var(--line);border-radius:10px;background:var(--bg-sunken);color:var(--ink)}.filter-rows{padding:0 24px}.filter-row{display:grid;grid-template-columns:132px minmax(0,1fr);gap:16px;align-items:start;padding:14px 0;border-top:1px solid var(--line)}.filter-row-label{display:flex;align-items:center;gap:7px;padding-top:8px;font-size:13.5px;font-weight:600;color:var(--ink-2)}.filter-row-label .icon{color:var(--brand);width:15px;height:15px;flex:none}.filter-row .pill-row{gap:7px}.filter-row .pill-btn{font-size:13px;padding:7px 13px}.filter-status{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;border-top:1px solid var(--line);background:var(--bg-sunken)}.filter-active{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:26px}.filter-active:empty{min-height:0}.filter-active-label{font-size:12.5px;color:var(--ink-3);margin-right:2px}.filter-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--brand) 28%,var(--line));background:color-mix(in srgb,var(--brand) 8%,var(--bg-elev));color:var(--ink);font-family:inherit;font-size:12.5px;cursor:pointer}.filter-chip .chip-x{display:inline-flex;color:var(--ink-3);flex:none}.filter-chip:hover .chip-x{color:var(--brand)}.filter-chip:hover{border-color:var(--brand)}.filter-console .filter-count{border:0;padding:0;font-size:13px;color:var(--muted-fg);margin:0;white-space:nowrap}.culture-panel{padding:0;overflow:hidden}.cp-hero{padding:20px 20px 16px;border-bottom:1px solid var(--line);background:var(--bg-sunken)}.cp-kicker{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}.cp-kicker .icon{width:14px;height:14px}.cp-hero h2{font-size:19px;font-weight:650;margin:8px 0 12px;letter-spacing:-.02em}.cp-strip{display:flex;height:26px;border-radius:8px;overflow:hidden;border:1px solid var(--line)}.cp-strip span{flex:1}.cp-body{padding:18px 20px}.cp-section-title{display:flex;align-items:center;gap:8px;margin-bottom:12px}.cp-section-title .icon{color:var(--brand);width:16px;height:16px}.cp-section-title h3{font-size:14px;font-weight:600;margin:0}.cp-block{margin-bottom:16px}.cp-block h3{display:flex;align-items:center;gap:7px;margin:0 0 6px;font-size:12.5px;font-weight:600;color:var(--ink-2)}.cp-block h3 .icon{width:14px;height:14px;color:var(--ink-3)}.cp-block p{font-size:13px;line-height:1.65;color:var(--muted-fg);margin:0}.cp-facts{border-top:1px dashed var(--line);padding-top:16px;margin-top:4px}.cp-facts dl{margin:0;display:flex;flex-direction:column;gap:10px}.cp-facts dl>div{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px}.cp-facts dt{color:var(--ink-3)}.cp-facts dd{margin:0;font-weight:600;color:var(--ink);text-align:right}.cp-fact-strip{width:96px;height:18px;display:flex;border-radius:5px;overflow:hidden}.cp-fact-strip span{flex:1}.cp-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 20px;border-top:1px solid var(--line);background:var(--bg-sunken);color:var(--link);font-size:13px;font-weight:500}.cp-foot:hover{color:var(--brand)}.explore-panel{padding:20px}.explore-panel .sec-head{margin-bottom:8px}.explore-panel .sec-sub{margin:0 0 14px}.explore-list{display:flex;flex-direction:column;gap:4px}.explore-item{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:10px;border:1px solid transparent;transition:background-color .15s var(--ease),border-color .15s var(--ease)}.explore-item:hover{background:var(--bg-sunken);border-color:var(--line)}.explore-icon{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none;color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--bg-elev))}.explore-meta{display:flex;flex-direction:column;min-width:0;flex:1}.explore-meta b{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.explore-meta small{font-size:11px;color:var(--ink-3)}.explore-strip{display:flex;width:44px;height:18px;border-radius:5px;overflow:hidden;flex:none}.explore-strip i{flex:1}.explore-arrow{display:inline-flex;color:var(--ink-3);flex:none}@media(max-width:1024px){.browse-layout{grid-template-columns:minmax(0,1fr)}.filter-console{order:-2}.browse-aside{order:-1;position:static;max-height:none;overflow:visible}.browse-results{order:0}.browse-results .listing-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}}@media(max-width:760px){.browse-results .listing-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.filter-top{flex-direction:column;align-items:stretch;padding:16px}.filter-console .filter-search{flex:none;width:100%;max-width:none;margin:0}.filter-top-actions{justify-content:flex-start}.filter-rows{padding:0 16px}.filter-row{grid-template-columns:minmax(0,1fr);gap:8px;padding:12px 0}.filter-row-label{padding-top:0}.filter-status{padding:10px 16px;flex-direction:column;align-items:flex-start}.filter-console .filter-count{white-space:normal}}html{scroll-padding-top:calc(var(--header-h) + 16px)}.map-shell{padding-top:8px;padding-bottom:32px;display:flex;flex-direction:column;gap:24px}.map-toolbar{padding:20px 24px;display:flex;flex-direction:column;gap:16px}.map-toolbar-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.map-toolbar-head{display:flex;align-items:center;gap:12px;min-width:0}.map-toolbar-head h2{font-size:17px;font-weight:600;margin:0}.map-toolbar-head p{font-size:13px;color:var(--muted-fg);margin:3px 0 0;line-height:1.45}.map-pills{gap:7px}.map-pills .pill-btn{font-size:13px;padding:7px 13px}.map-stats{display:flex;gap:18px;padding-top:12px;border-top:1px solid var(--line);font-size:13px;color:var(--muted-fg)}.map-stats span{display:inline-flex;align-items:center;gap:6px}.map-stats .icon{color:var(--brand)}.map-stats b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}.map-view-switch{display:inline-flex;gap:4px;padding:3px;flex:none;border:1px solid var(--line);border-radius:var(--r-full);background:var(--bg-sunken)}.map-view-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:0;border-radius:var(--r-full);background:transparent;color:var(--ink-2);font:500 12.5px var(--font-ui);cursor:pointer;transition:background-color .15s var(--ease),color .15s var(--ease)}.map-view-btn:hover{color:var(--ink)}.map-view-btn.active{background:var(--bg-elev);color:var(--ink);box-shadow:var(--shadow-sm)}.map-view-btn .icon{color:var(--brand)}.map-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}.map-stage{min-width:0}.map-canvas{width:100%;aspect-ratio:1000 / 560;border:1px solid var(--line);border-radius:var(--sec-radius);overflow:hidden;background:var(--map-ocean)}.map-svg{display:block;width:100%;height:100%}.map-ocean{fill:var(--map-ocean)}.map-grid line{fill:none;stroke:var(--map-grid);stroke-width:.7}.map-grid .map-equator{stroke-dasharray:4 4}.map-land{fill:var(--map-land);stroke:var(--map-coast);stroke-width:.8;stroke-linejoin:round}.map-leader{stroke:var(--ink-3);stroke-width:1;stroke-dasharray:3 3;opacity:.55}.map-anchor{fill:var(--brand);stroke:var(--bg-elev);stroke-width:1.2}.map-hub,.map-dot{transition:opacity .2s var(--ease)}.map-hub.is-dim,.map-dot.is-dim{opacity:.1}.map-dot.is-dim{pointer-events:none}.map-hub-label{font:600 10px var(--font-ui);letter-spacing:.04em;fill:var(--ink-2);paint-order:stroke fill;stroke:var(--map-ocean);stroke-width:3px;stroke-linejoin:round}.map-dot{stroke:var(--bg-elev);stroke-width:.8;cursor:pointer;transform-box:fill-box;transform-origin:center;transition:opacity .2s var(--ease),transform .18s var(--ease)}.map-dot:hover{transform:scale(1.45);stroke-width:1.1}.map-dot.is-selected{stroke:var(--ink);stroke-width:2.2}.map-swatch-group[hidden]{display:none!important}.map-side{display:flex;flex-direction:column;gap:24px;min-width:0}.map-picked .sec-head,.map-legend .sec-head{margin-bottom:16px}.mp-body{min-height:96px}.mp-empty{font-size:13px;line-height:1.6;color:var(--muted-fg);background:var(--bg-sunken);border:1px dashed var(--line);border-radius:var(--r-in);padding:14px}.mp-swatch{height:96px;border-radius:var(--r-in);border:1px solid var(--line);margin-bottom:12px}.mp-meta{display:flex;flex-direction:column;gap:3px;font-size:13px}.mp-meta b{font-size:16px}.mp-meta span{color:var(--muted-fg)}.mp-meta code{font-family:var(--font-mono);font-size:13px;color:var(--ink)}.mp-meta small{color:var(--brand)}.mp-link{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;padding:9px 12px;border-radius:var(--r-in);background:var(--bg-sunken);color:var(--link);font-size:13px;font-weight:500}.mp-link:hover{color:var(--brand)}.map-legend-list{display:flex;flex-direction:column;gap:4px}.map-legend-item{display:flex;width:100%;align-items:center;gap:10px;padding:8px 9px;border:1px solid transparent;border-radius:10px;background:transparent;font-family:inherit;text-align:left;cursor:pointer;transition:background-color .15s var(--ease),border-color .15s var(--ease)}.map-legend-item:hover,.map-legend-item.active{background:var(--bg-sunken);border-color:var(--line)}.map-legend-item.active .explore-icon{color:#fff;background:var(--brand)}.explore-map-link{display:flex;align-items:center;gap:8px;margin-top:14px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-in);background:var(--bg-sunken);color:var(--link);font-size:13px;font-weight:500}.explore-map-link span{flex:1}.explore-map-link:hover{color:var(--brand);border-color:var(--brand)}.map-swatches{margin-top:16px}.map-swatches>h3{display:flex;align-items:center;gap:8px;font-size:15px;margin:0 0 14px}.map-swatches>h3 .icon{color:var(--brand)}.map-swatch-group{margin-bottom:16px}.map-swatch-title{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:13px}.map-swatch-title small{color:var(--ink-3)}.map-swatch-title a{margin-left:auto;display:inline-flex;color:var(--link)}.map-swatch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:6px}.map-swatch{position:relative;display:block;height:52px;border-radius:8px;border:1px solid var(--line);overflow:hidden}.map-swatch span{position:absolute;left:0;right:0;bottom:0;padding:3px 5px;font-family:var(--font-mono);font-size:9.5px;background:#00000059;color:#fff;text-align:center}.map-note .sec-head{margin-bottom:12px}.map-note-body{font-size:13.5px;line-height:1.7;color:var(--muted-fg);margin:0}@media(max-width:1024px){.map-layout{grid-template-columns:minmax(0,1fr)}}@media(max-width:760px){.map-canvas{aspect-ratio:1000 / 660}.map-toolbar{padding:16px}.map-toolbar-top{gap:12px}.map-view-switch{width:100%}.map-view-btn{flex:1;justify-content:center}.map-stats{flex-wrap:wrap;gap:10px 16px}}.share-dock{position:fixed;right:22px;bottom:24px;z-index:65;display:flex;flex-direction:column;align-items:flex-end;gap:12px}.share-dock [hidden]{display:none!important}html:not(.has-js) .share-dock,html:not(.has-js) .footer-rise{display:none}@keyframes sharePop{0%{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}.share-panel{position:relative;width:min(320px,calc(100vw - 32px));background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden;transform-origin:bottom right;animation:sharePop .22s var(--ease) both}.share-panel-rainbow{height:5px;background:var(--rainbow)}.share-panel-head{display:flex;align-items:flex-start;gap:10px;padding:15px 16px 12px}.share-panel-head>div{min-width:0}.share-panel-head h2{font-size:15px;font-weight:700;margin:0 0 3px}.share-panel-head p{font-size:11.5px;line-height:1.45;color:var(--muted-fg);margin:0}.share-close{flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-left:auto;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--bg-sunken);color:var(--ink-2);cursor:pointer}.share-close:hover{color:var(--ink);border-color:var(--brand)}.share-current{display:flex;align-items:center;gap:8px;margin:0 16px 12px;padding:7px 10px;background:var(--bg-sunken);border-radius:var(--r-in);font-size:11.5px;color:var(--ink-2)}.share-current-chip{flex:none;width:22px;height:22px;border:1px solid var(--line);border-radius:6px}.share-current code{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--ink)}.share-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 16px 14px}.share-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:4px;min-height:88px;padding:10px;border:0;border-radius:var(--r-sm);color:#fff;text-align:left;font-family:inherit;text-decoration:none;cursor:pointer;overflow:hidden;background:linear-gradient(160deg,#ffffff24,#00000042),var(--swatch);transition:transform .18s var(--ease),box-shadow .18s var(--ease)}.share-card:hover{transform:translateY(-3px);box-shadow:0 8px 18px #11111333}.share-card:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.share-card>span{position:relative;z-index:1}.share-card-ico{display:inline-flex;opacity:.95}.share-card-label{font-size:11.5px;font-weight:600;line-height:1.2;overflow-wrap:anywhere}.share-card-hex{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.02em;opacity:.85}.share-native{display:flex;align-items:center;justify-content:center;gap:8px;width:calc(100% - 32px);margin:0 16px 16px;padding:9px 12px;border:1px solid var(--line);border-radius:var(--r-in);background:var(--bg-sunken);color:var(--ink);font:500 12.5px var(--font-ui);cursor:pointer}.share-native:hover{border-color:var(--brand);color:var(--brand)}.share-toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%,8px);padding:7px 14px;border-radius:var(--r-full);background:var(--ink);color:var(--bg);font-size:12px;font-weight:500;white-space:nowrap;opacity:0;pointer-events:none;max-width:calc(100% - 28px);overflow:hidden;text-overflow:ellipsis;transition:opacity .2s var(--ease),transform .2s var(--ease)}.share-toast.show{opacity:1;transform:translate(-50%)}.share-fab,.btt-fab{position:relative;display:grid;place-items:center;flex:none;width:52px;height:52px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer}.share-fab-ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from -30deg,#5b4be0,#22b8e6,#3fbf6a,#f5b22e,#ec6f9e,#5b4be0);box-shadow:var(--shadow);transition:transform .5s var(--ease)}.share-fab:hover .share-fab-ring{transform:rotate(60deg)}.share-fab.is-open .share-fab-ring{transform:rotate(120deg)}.share-fab-inner{position:relative;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--bg-elev);color:var(--brand)}.btt-ring{position:absolute;inset:0;width:52px;height:52px;transform:rotate(-90deg)}.btt-track{fill:var(--bg-elev);stroke:var(--line);stroke-width:3}.btt-progress{fill:none;stroke:url(#bttRainbow);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:119.38;stroke-dashoffset:119.38;transition:stroke-dashoffset .12s linear}.btt-inner{position:relative;display:inline-flex;color:var(--ink)}.btt-fab:hover .btt-inner{color:var(--brand)}.footer-rise{position:relative;margin-top:64px;padding-top:0;text-align:center}.footer-rise-rainbow{height:4px;border-radius:var(--r-full);background:var(--rainbow);opacity:.9}.footer-top-btn{display:inline-flex;align-items:center;gap:10px;margin-top:12px;padding:9px 16px;border:1px solid var(--line);border-radius:var(--r-full);background:var(--bg-elev);color:var(--ink);font:600 12.5px var(--font-ui);cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .18s var(--ease),border-color .18s var(--ease)}.footer-top-btn:hover{transform:translateY(-3px);border-color:var(--brand)}.footer-top-dots{display:inline-flex;gap:3px}.footer-top-dots i{display:block;width:8px;height:8px;border-radius:50%}.footer-top-arrow{display:inline-flex;color:var(--brand)}.footer-rise+.footer-bottom{margin-top:24px}@media(max-width:900px){.footer-rise{margin-top:48px}}@media(max-width:900px){.share-dock{right:12px;bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom) + 12px);gap:10px}.share-panel{width:min(300px,calc(100vw - 24px))}.share-fab,.btt-fab,.btt-ring{width:48px;height:48px}.share-fab-inner{width:38px;height:38px}}@media(max-width:380px){.share-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.share-card{min-height:76px}}@media(prefers-reduced-motion:reduce){.share-panel{animation:none}.share-fab-ring,.share-card,.footer-top-btn,.btt-progress{transition:none}}.ct-pair{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:12px;margin:4px 0 18px}.ct-color{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--bg-elev);min-width:0}.ct-color-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line)}.ct-color-name{font-size:13px;font-weight:600;color:var(--ink-2)}.ct-color-hex{width:104px;text-align:right;font-family:var(--font-mono);font-size:13px;font-weight:600;border:0;background:transparent;color:var(--ink);padding:4px 6px;border-radius:6px}.ct-color-hex:focus{outline:2px solid color-mix(in srgb,var(--brand) 40%,transparent)}.ct-color-sw{position:relative;min-height:132px}.ct-color-sw input[type=color]{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;opacity:0;cursor:pointer}.ct-swap{align-self:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--bg-elev);color:var(--ink-2);cursor:pointer;display:grid;place-items:center;transition:transform .18s var(--ease),color .15s}.ct-swap:hover{color:var(--brand);transform:rotate(180deg)}.ct-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 20px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-muted);margin-bottom:16px}.ct-ratio{display:inline-flex;align-items:baseline;gap:4px}.ct-ratio .ratio-big{font-size:48px;line-height:1;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--ink)}.ct-ratio>span{font-size:22px;font-weight:700;color:var(--ink-3)}.ct-ratio.pass .ratio-big{color:color-mix(in srgb,var(--accent-3) 78%,var(--ink))}.ct-ratio.fail .ratio-big{color:color-mix(in srgb,var(--accent-5) 78%,var(--ink))}.chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.ct-hero-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.ct-lum{font-family:var(--font-mono);font-size:11px;color:var(--ink-3)}.ct-lum b{color:var(--ink-2);font-weight:700}.ct-largetag{font-size:11px;font-weight:700;color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent);padding:2px 8px;border-radius:var(--r-full)}.ct-largetag[hidden]{display:none}.ct-links{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0 0}.ct-links a{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-3);text-decoration:none;padding:3px 8px;border:1px solid var(--line);border-radius:var(--r-full)}.ct-links a:hover{color:var(--brand);border-color:color-mix(in srgb,var(--brand) 40%,var(--line))}.ct-sample{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-bottom:16px;background:var(--bg-elev)}.ct-sample-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}.ct-size{display:inline-flex;align-items:center;gap:10px;font-size:12.5px;color:var(--ink-2)}.ct-size input[type=range]{width:150px;accent-color:var(--brand)}.ct-size span{font-family:var(--font-mono);font-size:12px;color:var(--ink-3);min-width:38px}.ct-weight{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-full);overflow:hidden}.ct-weight button{border:0;background:transparent;padding:6px 12px;font-size:13px;cursor:pointer;color:var(--ink-2)}.ct-weight button.active{background:var(--bg-sunken);color:var(--ink)}.ct-preview{padding:26px 22px;display:flex;flex-direction:column;gap:8px;min-height:120px;transition:background-color .15s,color .15s}.ct-preview-title{margin:0;font-size:26px;font-weight:800;line-height:1.15;letter-spacing:-.02em}.ct-preview-body{margin:0;font-size:16px;line-height:1.5;opacity:.92}.ct-wcag{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-bottom:16px;background:var(--bg-elev)}.ct-wcag-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}.ct-wcag-row:last-child{border-bottom:0}.ct-wcag-lv{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--ink-2)}.ct-wcag-res{display:inline-flex;align-items:center;gap:6px;font-style:normal}.ct-dot{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%}.ct-dot.pass{background:color-mix(in srgb,var(--accent-3) 16%,transparent);color:color-mix(in srgb,var(--accent-3) 80%,var(--ink))}.ct-dot.fail{background:color-mix(in srgb,var(--accent-5) 16%,transparent);color:color-mix(in srgb,var(--accent-5) 80%,var(--ink))}.ct-need{font-family:var(--font-mono);font-size:12px;color:color-mix(in srgb,var(--accent-5) 70%,var(--ink))}.ct-suggest{border:1px solid var(--line);border-radius:var(--r-lg);padding:14px;background:var(--bg-elev)}.ct-suggest .suggest-grid{margin-top:0}.ct-fix{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}@media(max-width:720px){.ct-pair{grid-template-columns:1fr}.ct-swap{justify-self:center}.ct-color-sw{min-height:104px}.ct-ratio .ratio-big{font-size:38px}}.cvd-input{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-elev);margin-bottom:20px}.cvd-input-sw{position:relative;width:64px;height:64px;border-radius:var(--r-md);border:1px solid var(--line);overflow:hidden;flex:none}.cvd-input-sw input[type=color]{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;opacity:0;cursor:pointer}.cvd-input-meta{display:flex;flex-direction:column;gap:4px}.cvd-input-lbl{font-size:12px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}.cvd-input-hex{width:120px;font-family:var(--font-mono);font-size:15px;font-weight:700;border:1px solid var(--line);border-radius:8px;padding:7px 10px;background:var(--bg-sunken);color:var(--ink)}.cvd-groups{display:flex;flex-direction:column;gap:22px}.cvd-group-title{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);margin:0 0 10px}.cvd-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.cvd-card{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--bg-elev)}.cvd-card-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:10px 12px}.cvd-card-name{font-size:13px;font-weight:700;color:var(--ink)}.cvd-card-prev{font-size:11px;color:var(--ink-3);font-variant-numeric:tabular-nums}.cvd-card-swatches{display:grid;grid-template-columns:1fr 1fr;height:92px}.cvd-card-sw{display:flex;flex-direction:column;justify-content:flex-end;gap:1px;padding:8px}.cvd-card-sw span{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;opacity:.82}.cvd-card-sw em{font-family:var(--font-mono);font-size:11px;font-style:normal;font-weight:700}.cvd-card-foot{display:flex;align-items:center;gap:8px;padding:9px 12px;border-top:1px solid var(--line)}.cvd-sim-bar{flex:1 1 auto;height:5px;border-radius:3px;background:var(--bg-sunken);overflow:hidden}.cvd-sim-bar i{display:block;height:100%;border-radius:3px;background:var(--brand)}.cvd-sim-val{font-size:11px;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}@media(max-width:560px){.cvd-cards{grid-template-columns:1fr 1fr}.cvd-card-swatches{height:78px}}.stats-layout{display:grid;grid-template-columns:minmax(0,1fr) 236px;gap:36px;align-items:start}.stats-main{min-width:0}.stats-toc{position:sticky;top:calc(var(--header-h) + 20px);background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--sec-radius);box-shadow:var(--shadow);padding:12px}.stats-toc .toc-link{font-size:13.5px}.stats-layout [id]{scroll-margin-top:calc(var(--header-h) + 24px)}@media(max-width:1080px){.stats-layout{grid-template-columns:1fr}.stats-toc{display:none}}.culture-bars{display:grid;grid-template-columns:1fr 1fr;gap:16px 32px}.culture-bar{min-width:0}.culture-bar-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:6px}.culture-name{font-size:13px;font-weight:600;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.culture-count{font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--ink)}.culture-bar-track{height:10px;border-radius:6px;background:var(--bg-sunken);overflow:hidden}.culture-bar-track i{display:block;height:100%;border-radius:6px}.culture-swatches{display:flex;gap:3px;margin-top:6px}.culture-swatches span{width:12px;height:12px;border-radius:3px}@media(max-width:640px){.culture-bars{grid-template-columns:1fr}}.stat-rank{display:flex;flex-direction:column}.stat-rank-row{display:grid;grid-template-columns:24px 12px minmax(0,1fr) minmax(60px,38%) 60px;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--line)}.stat-rank-row:last-child{border-bottom:0}.stat-rank-n{font-family:var(--font-mono);font-size:11px;color:var(--ink-3);text-align:right}.stat-rank-sw{width:12px;height:12px;border-radius:3px}.stat-rank-label{font-size:13px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stat-rank-bar{height:8px;border-radius:4px;background:var(--bg-sunken);overflow:hidden}.stat-rank-bar i{display:block;height:100%;border-radius:4px;background:var(--brand)}.stat-rank-val{font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--ink-2);text-align:right}@media(max-width:560px){.stat-rank-row{grid-template-columns:20px 10px minmax(0,1fr) 52px}.stat-rank-bar{display:none}}