:root{--bg: var(--ts-bg, #0e0f13);--panel: var(--ts-panel, #14161c);--bg-elev: var(--ts-bg-elev, color-mix(in oklab, var(--panel), var(--text) 6%));--bg-elev-2: var(--ts-bg-elev-2, color-mix(in oklab, var(--panel), var(--text) 12%));--border: var(--ts-border, #272b36);--border-soft: var(--ts-border-soft, #1f232d);--text: var(--ts-text, #e6e9f0);--text-dim: var(--ts-text-dim, #9aa3b2);--text-faint: var(--ts-text-faint, #6b7280);--accent: var(--ts-accent, #5b9dff);--accent-dim: color-mix(in oklab, var(--accent), var(--bg) 58%);--danger: var(--ts-danger, #ff6b6b);--warning: var(--ts-warning, #ffb454);--success: var(--ts-success, #4ade80);--info: var(--ts-info, #67c2ff);--radius: 8px;--mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--sans: "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;color-scheme:dark;--hairline: color-mix(in oklab, var(--text) 16%, transparent);--checker: color-mix(in oklab, var(--text) 14%, transparent);--plot-line: color-mix(in oklab, var(--text) 24%, transparent);--plot-line-dim: color-mix(in oklab, var(--text) 6%, transparent);--plot-ring: var(--text);--on-accent: var(--ts-on-accent, #06122a);--scrim: color-mix(in oklab, #000 70%, transparent)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}button{font:inherit;cursor:pointer}input,textarea,select{font:inherit;color:inherit}.app{display:flex;flex-direction:column;height:100%}.topbar{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--panel);flex-shrink:0}.brand{display:flex;align-items:baseline;gap:8px;font-weight:700;letter-spacing:-.01em}.brand .dot{width:12px;height:12px;border-radius:3px;background:linear-gradient(135deg,#5b9dff,#c46bff,#ff7eb6);align-self:center}.brand small{color:var(--text-faint);font-weight:500}.tabs{display:flex;gap:2px;margin-left:8px;min-width:0;overflow-x:auto;scrollbar-width:thin}.tab{white-space:nowrap}:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-radius:4px}.tab{background:transparent;border:1px solid transparent;color:var(--text-dim);padding:6px 12px;border-radius:6px}.tab:hover{color:var(--text);background:var(--bg-elev)}.tab.active{color:var(--text);background:var(--bg-elev-2);border-color:var(--border)}.tab .badge{margin-left:6px;font-size:11px;padding:1px 6px;border-radius:10px;background:color-mix(in oklab,var(--accent) 22%,transparent);color:var(--accent)}.spacer{flex:1}.btn{background:var(--bg-elev-2);border:1px solid var(--border);color:var(--text);padding:7px 12px;border-radius:6px}.btn:hover{border-color:var(--accent-dim)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}.btn.ghost{background:transparent}.btn.small{padding:4px 8px;font-size:12px}.app-canvas{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.content{flex:1;overflow:auto;padding:20px;scroll-padding-block:20px}.content.split{display:grid;grid-template-columns:minmax(360px,460px) 1fr;gap:0;padding:0;overflow:hidden}.col{overflow:auto;min-height:0;padding:20px;scroll-padding-block:20px}.split-toggle{display:none}.section-title{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim)}.section-title .count{color:var(--text-faint)}.card{background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:16px;margin-bottom:16px}.muted{color:var(--text-dim)}.faint{color:var(--text-faint)}.mono{font-family:var(--mono)}.token-group{margin-bottom:18px}.token-group h4{margin:0 0 8px;font-size:12px;font-family:var(--mono);color:var(--text-dim)}.row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:6px;border:1px solid transparent}.row:hover{background:var(--bg-elev);border-color:var(--border-soft)}.row.selected{background:var(--bg-elev-2);border-color:var(--accent-dim)}.row .swatch{width:22px;height:22px;border-radius:5px;border:1px solid var(--hairline);flex-shrink:0;background-image:linear-gradient(45deg,var(--checker) 25%,transparent 25%),linear-gradient(-45deg,var(--checker) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checker) 75%),linear-gradient(-45deg,transparent 75%,var(--checker) 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}.row .swatch i{display:block;width:100%;height:100%;border-radius:4px}.row .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:12.5px}.row .val{color:var(--text-dim);font-family:var(--mono);font-size:12px;max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row .val.ref{color:var(--info)}.editor{border:1px solid var(--accent-dim);background:var(--bg-elev);border-radius:8px;padding:12px;margin:6px 0 10px;display:grid;gap:10px}.field{display:grid;gap:4px}.field label{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint)}.field input,.field select,textarea{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:8px 10px;font-family:var(--mono);font-size:13px;width:100%}.field input:focus,.field select:focus,textarea:focus{outline:none;border-color:var(--accent)}.editor .actions,.link-row{display:flex;gap:8px;align-items:center}.link-row select{flex:1}.swatch-lg{width:100%;height:44px;border-radius:6px;border:1px solid var(--border)}input[type=color]{width:44px;height:38px;padding:2px;background:var(--bg);border:1px solid var(--border);border-radius:6px}.ramp{margin-bottom:18px}.ramp h4{margin:0 0 8px;font-family:var(--mono);font-size:12px;color:var(--text-dim)}.swatches{display:flex;flex-wrap:wrap;gap:8px}.swatch-card{width:92px;border:1px solid var(--border-soft);border-radius:8px;overflow:hidden;background:var(--panel)}.swatch-card .chip{height:64px;position:relative}.swatch-card .chip .alias{position:absolute;top:4px;right:4px;font-size:10px;background:#00000073;color:#fff;border-radius:4px;padding:1px 5px}.swatch-card .meta{padding:6px 7px;font-family:var(--mono);font-size:10.5px}.swatch-card .meta .s{color:var(--text);font-weight:600}.swatch-card .meta .v{color:var(--text-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ramp-misc .swatch-card{width:136px}.ramp-misc .swatch-card .meta .s{white-space:normal;overflow-wrap:anywhere;line-height:1.3}.spacing-row{display:grid;grid-template-columns:160px 80px 1fr;align-items:center;gap:12px;padding:6px 0;border-bottom:1px solid var(--border-soft)}.spacing-row .bar{height:16px;background:linear-gradient(90deg,var(--accent),#c46bff);border-radius:4px;min-width:2px}.type-sample{padding:12px 0;border-bottom:1px solid var(--border-soft)}.type-sample .lbl{font-family:var(--mono);font-size:11px;color:var(--text-faint);margin-bottom:4px;display:flex;gap:10px}.plot-wrap{display:flex;gap:20px;flex-wrap:wrap}.plot-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}.seg{display:inline-flex;border:1px solid var(--border);border-radius:6px;overflow:hidden}.seg button{background:var(--bg-elev);border:none;color:var(--text-dim);padding:6px 12px}.seg button.active{background:var(--bg-elev-2);color:var(--text)}.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px}.legend .item{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;color:var(--text-dim)}.legend .item i{width:12px;height:12px;border-radius:50%;border:1px solid var(--hairline)}.issue{display:flex;gap:10px;padding:10px 12px;border:1px solid var(--border-soft);border-radius:8px;margin-bottom:8px;background:var(--panel)}.issue .sev{font-size:11px;font-weight:700;text-transform:uppercase;padding:2px 7px;border-radius:5px;height:fit-content;letter-spacing:.04em}.sev.error{background:#ff6b6b29;color:var(--danger)}.sev.warning{background:#ffb45429;color:var(--warning)}.sev.info{background:#67c2ff29;color:var(--info)}.issue .body{flex:1}.issue .rule{font-family:var(--mono);font-size:11px;color:var(--text-faint)}.issue .msg{margin-top:2px}.issue-swatches{display:flex;gap:4px;margin-top:6px}.issue-swatch{width:22px;height:22px;border-radius:4px;border:1px solid var(--hairline)}.pill-summary{display:flex;gap:8px;margin-bottom:14px}.pill{display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;border:1px solid var(--border);font-size:12px;background:var(--panel)}.pill b{font-family:var(--mono)}.contrast-grid{border-collapse:collapse;font-family:var(--mono);font-size:11px}.contrast-grid th,.contrast-grid td{border:1px solid var(--border-soft);padding:0;text-align:center}.contrast-grid th{padding:4px 6px;color:var(--text-dim);font-weight:500;white-space:nowrap}.contrast-grid th.col{writing-mode:vertical-rl;transform:rotate(180deg);max-height:130px}.contrast-cell{width:42px;height:34px;font-weight:700;cursor:default}.contrast-cell.pass-aaa{outline:2px solid var(--success);outline-offset:-3px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--scrim);display:flex;align-items:center;justify-content:center;z-index:50;padding:24px}.modal{background:var(--bg-elev);border:1px solid var(--border);border-radius:12px;width:min(760px,100%);max-height:86vh;display:flex;flex-direction:column;overflow:hidden}.modal.token-edit-modal{width:min(440px,100%)}.modal header{display:flex;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border)}.modal header h3{margin:0;font-size:15px}.modal .body{padding:18px;overflow:auto}.modal footer{display:flex;gap:10px;justify-content:flex-end;padding:14px 18px;border-top:1px solid var(--border)}.modal textarea{min-height:280px;resize:vertical;line-height:1.5}.link-error-bar{display:flex;align-items:center;gap:12px;padding:8px 16px;background:color-mix(in oklab,var(--warning) 16%,var(--panel));border-bottom:1px solid var(--border);color:var(--text);font-size:13px;flex-shrink:0}.link-error-bar .btn{margin-left:auto}.export-files{display:flex;flex-direction:column;gap:14px}.export-file textarea{min-height:150px}.export-file-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:12px;color:var(--text-dim)}.hint{color:var(--text-faint);font-size:12px;margin:6px 0 0}.empty{text-align:center;color:var(--text-faint);padding:60px 20px}.toggle{display:inline-flex;align-items:center;gap:6px;color:var(--text-dim);font-size:12px}.search{width:100%;margin-bottom:12px}.text-input{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:8px 10px;font-family:var(--mono);font-size:13px;width:100%}.text-input:focus{outline:none;border-color:var(--accent)}.empty-hero{max-width:720px;margin:40px auto;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}.empty-actions{display:flex;gap:10px}.code-block{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:14px 16px;font-family:var(--mono);font-size:12.5px;line-height:1.55;color:var(--text-dim);overflow:auto;margin:0;white-space:pre}.group-header.top{margin:14px 0 6px}.group-header.sub{margin:6px 0 4px 10px}.group-label{background:transparent;border:none;color:var(--text-dim);font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.02em;display:inline-flex;align-items:center;gap:8px;padding:2px 4px;border-radius:4px}.group-header.sub .group-label{color:var(--text-faint);font-weight:500}.group-label-static{color:var(--text-faint);font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.02em;padding:2px 4px;font-style:italic}.group-header.synthetic{gap:6px}.group-label:hover{background:var(--bg-elev);color:var(--text)}.rename-hint{opacity:0;font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:.05em}.group-label:hover .rename-hint{opacity:1}.group-header{display:flex;align-items:center;gap:2px}.group-menu{position:relative}.group-kebab{opacity:0;background:transparent;border:none;color:var(--text-faint);padding:0 6px;border-radius:4px;font-size:15px;line-height:1}.group-header:hover .group-kebab,.group-kebab[aria-expanded=true]{opacity:1}.group-kebab:hover{background:var(--bg-elev);color:var(--text)}@media (pointer: coarse){.group-kebab{opacity:1}}.ci{border-top:1px solid var(--border-soft);padding-top:10px}.ci-head{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin-bottom:8px}.ci-row{display:flex;flex-wrap:wrap;gap:8px}.ci-chip{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:54px}.ci-sample{width:100%;height:34px;border-radius:6px;border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}.ci-score{font-family:var(--mono);font-size:11px;font-weight:700}.ci-score.aaa,.ci-score.aa{color:var(--success)}.ci-score.large{color:var(--warning)}.ci-score.fail{color:var(--danger)}.ci-label{font-size:9.5px;color:var(--text-faint);max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dup-preview{display:flex;flex-wrap:wrap;gap:8px 14px}.dup-pair{display:flex;align-items:center;gap:4px}.dup-chip{width:26px;height:26px;border-radius:6px;border:1px solid var(--hairline)}.dup-arrow{color:var(--text-faint);font-size:11px}.group-edit{max-width:220px;padding:4px 8px;font-size:12px}.subgroup{border-left:1px solid var(--border-soft);margin-left:6px;padding-left:6px}.issue-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;display:inline-block;margin-left:6px}.issue-dot.error{background:var(--danger)}.issue-dot.warning{background:var(--warning)}.issue-dot.info{background:var(--info)}.chip-dot{position:absolute;bottom:4px;right:4px;width:9px;height:9px;border-radius:50%;border:1px solid rgba(0,0,0,.4)}.chip-dot.error{background:var(--danger)}.chip-dot.warning{background:var(--warning)}.chip-dot.info{background:var(--info)}.badge.warn{background:#ffb45433;color:var(--warning)}.layer-section{margin-bottom:8px}.layer-divider{display:flex;align-items:center;justify-content:center;margin:18px 0;color:var(--text-faint);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.layer-divider:before,.layer-divider:after{content:"";flex:1;height:1px;background:var(--border-soft);margin:0 12px}.warn-pill{margin-left:10px;border-color:#ffb45466;color:var(--warning);background:#ffb4541a;padding:2px 8px;font-size:11px}.swatch-card{cursor:pointer;transition:transform .08s ease}.swatch-card:hover{transform:translateY(-2px)}.swatch-card.unused{opacity:.5}.swatch-card.unused:hover{opacity:1}.unused-tag{position:absolute;bottom:4px;left:4px;font-size:9px;text-transform:uppercase;letter-spacing:.04em;background:#ffb454d9;color:#2a1a00;border-radius:4px;padding:1px 5px;font-weight:700}.row-size{width:130px;flex-shrink:0;display:flex;align-items:center}.sp-track{width:100%;height:14px;display:flex;align-items:center}.sp-bar-h{height:10px;border-radius:3px;display:block}.sp-height-track{height:120px;display:flex;align-items:flex-end;justify-content:center}.sp-bar-v{width:16px;border-radius:3px;display:block}.sp-gap{display:flex;align-items:center}.sp-block{width:16px;height:26px;background:var(--bg-elev-2);border:1px solid var(--border);border-radius:3px;flex-shrink:0}.sp-pad{background:var(--accent-dim);display:inline-block;border-radius:5px}.sp-pad-inner{display:block;width:28px;height:28px;background:var(--bg);border-radius:3px}.sp-radius{width:64px;height:64px;background:var(--bg-elev-2);border:2px solid var(--accent);border-top-left-radius:inherit}.sp-stroke{width:90px;border-top-style:solid;border-top-color:var(--accent)}.viz-grid{display:flex;flex-direction:column;gap:4px}.viz-grid.viz-tiles{flex-direction:row;flex-wrap:wrap;gap:16px;align-items:flex-end}.viz-item{display:flex;align-items:center;gap:14px;padding:6px 8px;border-radius:6px;cursor:pointer}.viz-item:hover{background:var(--bg-elev)}.viz-tiles .viz-item{flex-direction:column;align-items:center;gap:8px;width:96px;text-align:center}.viz-preview{width:240px;flex-shrink:0;display:flex;align-items:center}.viz-tiles .viz-preview{width:auto;justify-content:center}.viz-meta{display:flex;flex-direction:column;min-width:0}.viz-tiles .viz-meta{align-items:center}.viz-name{font-size:12px;display:inline-flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.viz-val{font-size:11px}.plot-hero{max-width:620px;margin:0 auto}.plot3d{margin:0;background:var(--panel);border:1px solid var(--border-soft);border-radius:10px;padding:12px}.plot3d-bar{display:flex;align-items:center;gap:14px;margin-bottom:8px}.plot3d-bar .spacer{flex:1}.plot3d-svg{width:100%;height:auto;display:block;border-radius:8px;background:radial-gradient(120% 120% at 50% 25%,var(--bg-elev) 0%,var(--panel) 70%);cursor:grab;touch-action:none}.plot3d-svg.grabbing{cursor:grabbing}.plot3d figcaption{margin-top:6px;text-align:center;font-size:11px;color:var(--text-faint)}.plot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.plot{margin:0;background:var(--panel);border:1px solid var(--border-soft);border-radius:10px;padding:10px}.plot.big{padding:14px}.plot-svg{width:100%;height:auto;display:block}.plot figcaption{margin-top:6px;text-align:center;font-size:11px;color:var(--text-dim)}.type-style-list{border:1px solid var(--border-soft);border-radius:10px;overflow:hidden;margin-bottom:16px}.type-style+.type-style{border-top:1px solid var(--border-soft)}.type-style-row{width:100%;display:flex;align-items:center;gap:18px;padding:9px 14px;background:transparent;border:none;text-align:left}.type-style-row:hover{background:var(--bg-elev)}.type-style-head{flex:0 0 210px;display:flex;flex-direction:column;gap:2px;min-width:0}.type-style-name{font-size:12.5px;color:var(--text);display:flex;align-items:center;gap:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.type-style-specs{font-size:10.5px;display:flex;align-items:center;gap:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.type-style-sample{flex:1;min-width:0;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:5px 12px;border-radius:6px;border:1px solid var(--hairline)}.type-style-caret{flex:0 0 auto;color:var(--text-faint);font-size:11px}@media (max-width: 720px){.type-style-head{flex-basis:130px}}.type-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-bottom:16px}.type-card{background:var(--panel);border:1px solid var(--border-soft);border-radius:10px;padding:16px}.type-card-head{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--text-dim);margin-bottom:10px}.type-card-sample{color:var(--text);margin-bottom:12px;word-break:break-word}.type-card-tokens{display:flex;flex-wrap:wrap;gap:6px}.chip-btn{background:var(--bg-elev);border:1px solid var(--border-soft);color:var(--text-dim);border-radius:5px;padding:3px 8px;font-size:11px;display:inline-flex;align-items:center}.chip-btn:hover{border-color:var(--accent-dim);color:var(--text)}.issue.clickable{cursor:pointer}.issue.clickable:hover{border-color:var(--accent-dim)}.goto{align-self:center;color:var(--accent);font-size:12px;white-space:nowrap}.rules-list{margin:0;padding-left:18px;line-height:1.7;font-size:13px}.plot-metrics{display:flex;justify-content:center;gap:12px;margin-top:4px;font-size:10.5px;color:var(--text-faint)}.plot-metrics .warn{color:var(--warning)}.type-preview{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:20px 18px;margin-bottom:16px;color:var(--text);min-height:64px;display:flex;align-items:center;word-break:break-word}.type-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.type-form-grid .field:first-child{grid-column:1 / -1}.plot-cell{cursor:pointer;border-radius:12px;transition:outline-color .1s ease;outline:2px solid transparent}.plot-cell:hover{outline-color:var(--accent-dim)}.plot-cell.focused{outline-color:var(--accent)}.plot{position:relative}.plot-svg.interactive{cursor:grab;touch-action:none}.plot-svg.interactive:active{cursor:grabbing}.plot-reset{position:absolute;top:10px;right:10px;z-index:2}.plot-edit-hint{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:10px;text-align:center}.tier-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:8px}.tier-col{position:relative;background:var(--panel);border:1px solid var(--border-soft);border-radius:10px;padding:14px}.tier-head{display:flex;align-items:baseline;justify-content:space-between}.tier-name{font-weight:700;letter-spacing:-.01em}.tier-count{font-family:var(--mono);font-size:18px;color:var(--accent)}.tier-chips{display:flex;flex-wrap:wrap;gap:5px}.tier-arrow{position:absolute;right:-11px;top:50%;transform:translateY(-50%);color:var(--text-faint);font-size:16px;z-index:1}.mini-swatch{width:10px;height:10px;border-radius:3px;border:1px solid var(--hairline);margin-right:5px;display:inline-block;vertical-align:-1px}.cov-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}.cov-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border-soft);border-radius:8px;background:var(--bg)}.cov-item.missing{border-style:dashed;border-color:#ffb45459}.cov-status{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}.cov-item.present .cov-status{background:#4ade8029;color:var(--success)}.cov-item.missing .cov-status{background:#ffb45429;color:var(--warning)}.cov-body{flex:1;min-width:0}.cov-key{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cov-desc{font-size:11px}.create-preview{display:flex;align-items:center;gap:14px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border-soft)}.docs h4{margin:18px 0 6px;font-size:14px}.docs p{line-height:1.6;color:var(--text-dim);margin:6px 0}.docs .code-block{margin:8px 0}.ramp-profile{margin-top:8px}.ramp-profile .plot-svg{height:84px;background:var(--panel);border:1px solid var(--border-soft);border-radius:8px}.ramp-profile-cap{text-align:center;font-size:10px;margin-top:3px}.dropzone{border:1.5px dashed var(--border);border-radius:8px;padding:16px;text-align:center;color:var(--text-faint);font-size:12.5px;cursor:pointer;margin-bottom:12px;transition:border-color .1s ease,background .1s ease}.dropzone:hover{border-color:var(--accent-dim)}.dropzone.over{border-color:var(--accent);background:var(--bg-elev);color:var(--text)}.seg button:disabled{opacity:.35;cursor:default}.pairing-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px}.pairing{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border-soft);border-radius:8px;background:var(--bg)}.pairing.fail{border-color:#ff6b6b66}.pairing.large{border-color:#ffb45459}.pairing-chip{width:40px;height:34px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0;border:1px solid var(--hairline)}.pairing-meta{min-width:0}.pairing-names{font-size:11.5px;display:flex;flex-direction:column;gap:1px;min-width:0}.pairing-names>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pairing-bg{color:var(--text-dim)}.pairing-score{font-size:11px;color:var(--text-dim);margin-top:2px}.pairing-tag.pass{color:var(--success)}.pairing-tag.large{color:var(--warning)}.pairing-tag.fail{color:var(--danger)}.vision-chip{display:inline-flex;align-items:center;gap:6px;text-transform:capitalize;background:color-mix(in oklab,var(--warning),transparent 84%);border:1px solid color-mix(in oklab,var(--warning),transparent 50%);color:var(--warning);border-radius:20px;padding:5px 11px;font-size:12px;font-weight:600;white-space:nowrap}.vision-chip:hover{background:color-mix(in oklab,var(--warning),transparent 74%)}.vision-eye{font-size:13px;line-height:1}.vision-x{opacity:.65;font-size:10px}.vision-select{background:var(--bg-elev-2);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:6px 8px;font-size:12px}.vision-select:focus{outline:none;border-color:var(--accent)}.fix-btn{width:100%;margin-top:8px}.graph-scroll{overflow:auto;border:1px solid var(--border-soft);border-radius:10px;background:var(--panel)}.graph-svg{display:block}.graph-col-label{fill:var(--text-dim);font-size:12px;text-transform:uppercase;letter-spacing:.06em}.graph-node{cursor:pointer}.graph-rect{fill:var(--bg-elev);stroke:var(--border);stroke-width:1}.graph-node:hover .graph-rect{stroke:var(--accent)}.graph-rect.unused{stroke:var(--warning);stroke-dasharray:4 3}.graph-rect.dangling{stroke:var(--danger)}.graph-text{fill:var(--text);font-family:var(--mono);font-size:11.5px}.mode-switch button{text-transform:capitalize}@media (max-width: 880px){body{font-size:13.5px}.topbar{gap:8px;padding:8px 10px}.tabs{-webkit-overflow-scrolling:touch}.content.split{display:flex;flex-direction:column;overflow:auto;gap:16px;padding:14px}.content.split .col{overflow:visible;min-height:0;width:100%;flex:0 0 auto;padding:0}.content{padding:14px}.split-toggle{display:inline-flex;align-self:flex-start;order:-1}.content.split .list-col{display:none}.content.split.show-list .list-col{display:block}.tier-overview{grid-template-columns:1fr}.tier-arrow{display:none}.type-form-grid,.cov-grid,.pairing-grid,.type-card-grid{grid-template-columns:1fr}.plot-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.plot-hero{max-width:100%}.link-row{flex-wrap:wrap}.link-row select{flex:1 1 100%}.row{padding:9px 8px}.btn,.tab{padding:8px 12px}.modal{width:100%;max-height:92vh;border-radius:12px}.modal .body{padding:14px}.modal-backdrop{padding:10px}.modal textarea{min-height:200px}.viz-preview{width:160px}}@media (max-width: 520px){.brand small{display:none}.btn{padding:8px 10px;font-size:13px}.viz-grid .viz-item{gap:10px}.viz-preview{width:120px}.contrast-cell{width:36px;height:30px}.seg button{min-width:34px;min-height:32px}}@media (pointer: coarse){.btn,.tab,.seg button,.chip-btn{min-height:34px}.group-label{padding:6px}}.themed-chip{font-size:11px;padding:2px 8px;border-radius:20px;border:1px solid var(--accent-dim);color:var(--accent);background:color-mix(in oklab,var(--accent),transparent 86%);white-space:nowrap}.component-preview{--cp-bg: var(--background, var(--bg, var(--app-bg, #fff)));--cp-fg: var(--foreground, var(--text, var(--default-font-color, #111)));--cp-muted: var(--muted-foreground, var(--text-muted, #6b7280));--cp-surface: var(--card, var(--surface-raised, var(--surface, var(--panel-bg, var(--background, #fff)))));--cp-surface-fg: var(--card-foreground, var(--foreground, var(--text, #111)));--cp-border: var(--border, var(--control-border, #e5e7eb));--cp-primary: var(--primary, var(--color-primary, var(--button-primary-bg, var(--button-bg, #111))));--cp-primary-fg: var(--primary-foreground, var(--on-primary, var(--button-primary-text, var(--button-text, #fff))));--cp-primary-hover: var(--color-primary-hover, var(--button-primary-bg-hover, var(--button-bg-hover, var(--cp-primary))));--cp-secondary: var(--secondary, var(--button-secondary-bg, var(--surface-raised, #f1f1f1)));--cp-secondary-fg: var(--secondary-foreground, var(--button-secondary-text, var(--text-link, var(--cp-fg))));--cp-secondary-border: var(--button-secondary-border, var(--cp-border));--cp-danger: var(--destructive, var(--danger, var(--error, #dc2626)));--cp-danger-fg: var(--destructive-foreground, var(--on-danger, #fff));--cp-info: var(--info, var(--info-color, #2563eb));--cp-success: var(--success, var(--success-color, #16a34a));--cp-warning: var(--warning, var(--warning-color, #d97706));--cp-info-surface: var(--toast-info-bg, var(--surface-info, transparent));--cp-success-surface: var(--toast-success-bg, var(--surface-success, transparent));--cp-warning-surface: var(--toast-warning-bg, var(--surface-warning, transparent));--cp-danger-surface: var(--toast-danger-bg, var(--surface-danger, transparent));--cp-control-bg: var(--control-bg, var(--input-bg, var(--cp-surface)));--cp-control-border: var(--control-border, var(--input-border-color, var(--cp-border)));--cp-control-fg: var(--control-text, var(--input-text-text-color, var(--cp-fg)));--cp-placeholder: var(--control-placeholder, var(--placeholder, var(--cp-muted)));--cp-ring: var(--focus-ring, var(--ring, var(--control-focus-ring, var(--cp-primary))));--cp-radius: var(--radius-control, var(--control-radius, var(--input-radius, var(--rounded-input, var(--radius-2, var(--rounded, var(--border-radius, .375rem)))))));--cp-btn-radius: var(--button-radius, var(--radius-button, var(--radius-2, var(--rounded, var(--border-radius, var(--radius-md, .375rem))))));--cp-radius-lg: var(--radius-card, var(--panel-radius, var(--dialog-radius, var(--radius-6, var(--rounded-md, .75rem)))));--cp-radius-pill: var(--chip-radius, 9999px);--cp-btn-primary-bg: var(--button-primary-bg, var(--primary, var(--color-primary, var(--button-bg, #111))));--cp-btn-primary-bg-hover: var(--button-primary-bg-hover, var(--button-bg-hover, var(--color-primary-hover, var(--cp-btn-primary-bg))));--cp-btn-primary-bg-active: var(--button-primary-bg-active, var(--button-bg-active, var(--color-primary-active, var(--cp-btn-primary-bg-hover))));--cp-btn-primary-fg: var(--button-primary-text, var(--primary-foreground, var(--on-primary, var(--button-text, #fff))));--cp-btn-secondary-bg: var(--button-secondary-bg, var(--secondary, var(--surface-raised, transparent)));--cp-btn-secondary-bg-hover: var(--button-secondary-bg-hover, var(--color-primary-subtle, var(--cp-btn-secondary-bg)));--cp-btn-secondary-bg-active: var(--button-secondary-bg-active, var(--cp-btn-secondary-bg-hover));--cp-btn-secondary-fg: var(--button-secondary-text, var(--secondary-foreground, var(--text-link, var(--cp-fg))));--cp-btn-secondary-border: var(--button-secondary-border, var(--cp-border));--cp-btn-tertiary-bg: var(--button-tertiary-bg, transparent);--cp-btn-tertiary-bg-hover: var(--button-tertiary-bg-hover, var(--color-primary-subtle, var(--surface-hover, var(--cp-surface))));--cp-btn-tertiary-bg-active: var(--button-tertiary-bg-active, var(--cp-btn-tertiary-bg-hover));--cp-btn-tertiary-fg: var(--button-tertiary-text, var(--text-link, var(--cp-secondary-fg)));--cp-btn-skeleton-bg: var(--button-skeleton-bg, transparent);--cp-btn-skeleton-bg-hover: var(--button-skeleton-bg-hover, var(--surface-subtle, var(--cp-surface)));--cp-btn-skeleton-bg-active: var(--button-skeleton-bg-active, var(--cp-btn-skeleton-bg-hover));--cp-btn-skeleton-fg: var(--button-skeleton-text, var(--text-link, var(--cp-secondary-fg)));--cp-btn-skeleton-border: var(--button-skeleton-border, var(--cp-border));--cp-btn-disabled-bg: var(--button-primary-disabled-bg, var(--surface-disabled, var(--cp-btn-primary-bg)));--cp-btn-disabled-fg: var(--button-primary-disabled-text, var(--text-disabled, var(--cp-btn-primary-fg)));--cp-shadow-sm: var(--shadow-sm, var(--shadow-1, var(--shadow-low, var(--elevation-1, var(--shadow-xs, 0 1px 2px rgba(0, 0, 0, .08))))));--cp-shadow: var(--shadow-raised, var(--shadow-md, var(--shadow-2, var(--elevation-2, var(--shadow, 0 4px 12px rgba(0, 0, 0, .1))))));--cp-shadow-lg: var(--shadow-overlay, var(--shadow-lg, var(--shadow-high, var(--shadow-4, var(--elevation-4, var(--shadow-xl, 0 16px 40px rgba(0, 0, 0, .18)))))));--cp-gap: var(--space-3, var(--spacing-3, var(--gap-md, .75rem)));--cp-gap-lg: var(--space-5, var(--spacing-5, var(--gap-lg, 1.25rem)));--cp-pad-card: var(--space-card-padding, var(--card-padding, var(--dialog-padding, var(--space-6, var(--spacing-6, 1.5rem)))));--cp-btn-px: var(--button-padding-x, var(--space-4, var(--spacing-4, 1rem)));--cp-btn-py: var(--button-padding-y, var(--space-2, var(--spacing-2, .5rem)));--cp-chip-bg: var(--chip-bg, var(--select-chip-bg, var(--cp-secondary)));--cp-chip-fg: var(--chip-text, var(--select-chip-text, var(--cp-secondary-fg)));--cp-chip-border: var(--chip-border, transparent);--cp-table-header: var(--table-header-text, var(--table-header-muted-text, var(--cp-muted)));--cp-table-fg: var(--table-row-text, var(--cp-fg));--cp-table-border: var(--table-border, var(--cp-border));--cp-table-hover: var(--table-row-hover-bg, var(--surface-hover, var(--cp-surface)));--cp-tab-fg: var(--tabs-trigger-text, var(--cp-muted));--cp-tab-active-fg: var(--tabs-trigger-text-active, var(--text-link, var(--cp-primary)));--cp-tab-indicator: var(--tabs-indicator-active, var(--color-primary, var(--cp-primary)));--cp-tab-border: var(--tabs-list-border, var(--cp-border));font-family:var(--font-family-sans, var(--font-stack, var(--sans)));background:var(--cp-bg);color:var(--cp-fg);border:1px solid var(--cp-border);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:28px}.component-preview section{margin:0}.cp-h{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--cp-muted);margin-bottom:12px}.cp-row{display:flex;flex-wrap:wrap;gap:var(--cp-gap);align-items:center}.cp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--cp-gap-lg)}.cp-stack{display:flex;flex-direction:column;gap:var(--cp-gap)}.cp-btn{font:inherit;font-family:var(--button-font-family, inherit);font-weight:var(--button-font-weight, 500);font-size:var(--button-font-size, var(--text-body-sm-size, .875rem));text-transform:var(--button-text-transform, none);padding:var(--cp-btn-py) var(--cp-btn-px);border-radius:var(--cp-btn-radius);border:1px solid transparent;cursor:pointer;line-height:1.2;transition:background-color .12s ease,border-color .12s ease,color .12s ease}.cp-btn--primary{background:var(--cp-btn-primary-bg);color:var(--cp-btn-primary-fg)}.cp-btn--primary:hover{background:var(--cp-btn-primary-bg-hover)}.cp-btn--primary:active{background:var(--cp-btn-primary-bg-active)}.cp-btn--secondary{background:var(--cp-btn-secondary-bg);color:var(--cp-btn-secondary-fg);border-color:var(--cp-btn-secondary-border)}.cp-btn--secondary:hover{background:var(--cp-btn-secondary-bg-hover)}.cp-btn--secondary:active{background:var(--cp-btn-secondary-bg-active)}.cp-btn--tertiary{background:var(--cp-btn-tertiary-bg);color:var(--cp-btn-tertiary-fg)}.cp-btn--tertiary:hover{background:var(--cp-btn-tertiary-bg-hover)}.cp-btn--tertiary:active{background:var(--cp-btn-tertiary-bg-active)}.cp-btn--skeleton{background:var(--cp-btn-skeleton-bg);color:var(--cp-btn-skeleton-fg);border-color:var(--cp-btn-skeleton-border);border-style:dashed}.cp-btn--skeleton:hover{background:var(--cp-btn-skeleton-bg-hover)}.cp-btn--skeleton:active{background:var(--cp-btn-skeleton-bg-active)}.cp-btn:disabled{cursor:not-allowed;opacity:.55}.cp-btn--primary:disabled{background:var(--cp-btn-disabled-bg);color:var(--cp-btn-disabled-fg);opacity:1}.cp-hint{margin:10px 0 0;font-size:12px;color:var(--cp-muted)}.cp-badge{display:inline-flex;align-items:center;padding:.15rem .6rem;border-radius:var(--cp-radius-pill);font-size:12px;font-weight:600;border:1px solid transparent}.cp-badge--default{background:var(--cp-primary);color:var(--cp-primary-fg)}.cp-badge--secondary{background:var(--cp-chip-bg);color:var(--cp-chip-fg);border-color:var(--cp-chip-border)}.cp-badge--outline{border-color:var(--cp-border);color:var(--cp-fg)}.cp-badge--destructive{background:var(--cp-danger);color:var(--cp-danger-fg)}.cp-card{background:var(--cp-surface);color:var(--cp-surface-fg);border:1px solid var(--cp-border);border-radius:var(--cp-radius-lg);box-shadow:var(--cp-shadow);padding:var(--cp-pad-card)}.cp-card-title{font-size:var(--text-subheading-size, var(--dialog-title-font-size, 1.125rem));font-weight:var(--text-subheading-weight, 600);line-height:1.2}.cp-card-desc{color:var(--cp-muted);font-size:var(--text-body-sm-size, var(--body-small-font-size, .875rem));margin-top:4px}.cp-field label{display:block;font-size:var(--text-label-size, var(--label-mono-uppercase-font-size, .875rem));font-weight:var(--text-label-weight, 500);color:var(--label-text, var(--cp-fg));margin-bottom:6px}.cp-input{width:100%;background:var(--cp-control-bg);color:var(--cp-control-fg);border:1px solid var(--cp-control-border);border-radius:var(--cp-radius);padding:0 var(--cp-btn-px);height:var(--control-height, var(--input-height, 2.375rem));font:inherit;font-size:var(--control-font-size, var(--input-font-size, var(--text-body-sm-size, .875rem)))}.cp-input::placeholder{color:var(--cp-placeholder)}.cp-input:focus{outline:2px solid var(--cp-ring);outline-offset:1px;border-color:var(--cp-ring)}.cp-input--invalid{border-color:var(--control-border-invalid, var(--cp-danger))}.cp-input:disabled{background:var(--control-bg-disabled, var(--surface-disabled, var(--cp-surface)));color:var(--control-text-disabled, var(--text-disabled, var(--cp-muted)));cursor:not-allowed}.cp-help{color:var(--cp-muted);font-size:12px;margin-top:6px}.cp-chip{display:inline-flex;align-items:center;gap:6px;background:var(--cp-chip-bg);color:var(--cp-chip-fg);border:1px solid var(--cp-chip-border);border-radius:var(--chip-radius, var(--cp-radius));padding:3px 10px;font-size:var(--chip-font-size, .8125rem);font-weight:var(--chip-font-weight, 600)}.cp-chip small{opacity:.7;cursor:pointer}.cp-elev-row{display:flex;flex-wrap:wrap;gap:var(--cp-gap-lg)}.cp-elev{flex:1 1 150px;min-width:140px;background:var(--cp-surface);color:var(--cp-surface-fg);border:1px solid var(--cp-border);border-radius:var(--cp-radius-lg);padding:var(--cp-gap);min-height:76px;display:flex;flex-direction:column;justify-content:space-between}.cp-elev--sm{box-shadow:var(--cp-shadow-sm)}.cp-elev--md{box-shadow:var(--cp-shadow)}.cp-elev--lg{box-shadow:var(--cp-shadow-lg)}.cp-elev-name{font-weight:600;font-size:var(--text-body-sm-size, .875rem)}.cp-elev-tag{font-size:10.5px;color:var(--cp-muted)}.cp-alert{display:flex;gap:10px;padding:12px 14px;border-radius:var(--toast-radius, var(--cp-radius));border:1px solid;font-size:var(--text-body-sm-size, .875rem)}.cp-alert strong{display:block;font-weight:600}.cp-alert-body{color:var(--cp-muted)}.cp-alert-dot{width:10px;height:10px;border-radius:50%;margin-top:5px;flex-shrink:0}.cp-alert--info{border-color:var(--toast-info-border, var(--cp-info));background:var(--cp-info-surface);color:var(--toast-info-text, var(--cp-fg))}.cp-alert--info .cp-alert-dot{background:var(--cp-info)}.cp-alert--success{border-color:var(--toast-success-border, var(--cp-success));background:var(--cp-success-surface);color:var(--toast-success-text, var(--cp-fg))}.cp-alert--success .cp-alert-dot{background:var(--cp-success)}.cp-alert--warning{border-color:var(--toast-warning-border, var(--cp-warning));background:var(--cp-warning-surface);color:var(--toast-warning-text, var(--cp-fg))}.cp-alert--warning .cp-alert-dot{background:var(--cp-warning)}.cp-alert--destructive{border-color:var(--toast-danger-border, var(--cp-danger));background:var(--cp-danger-surface);color:var(--toast-danger-text, var(--cp-fg))}.cp-alert--destructive .cp-alert-dot{background:var(--cp-danger)}.cp-table{width:100%;border-collapse:collapse;font-size:var(--text-body-sm-size, .875rem)}.cp-table th{text-align:left;padding:8px 12px;font-family:var(--table-header-font-family, inherit);font-size:var(--table-header-font-size, .75rem);font-weight:var(--table-header-font-weight, 600);color:var(--cp-table-header);border-bottom:1px solid var(--cp-table-border)}.cp-table td{padding:9px 12px;color:var(--cp-table-fg);border-bottom:1px solid var(--cp-table-border)}.cp-table tr:last-child td{border-bottom:none}.cp-table tbody tr:hover td{background:var(--cp-table-hover)}.cp-tabs{display:flex;gap:4px;border-bottom:1px solid var(--cp-tab-border)}.cp-tab-trigger{font:inherit;font-size:var(--tabs-label-font-size, 1rem);font-weight:var(--tabs-label-font-weight, 600);background:transparent;border:none;cursor:pointer;padding:8px 14px 10px;color:var(--cp-tab-fg);border-bottom:2px solid transparent;margin-bottom:-1px}.cp-tab-trigger.active{color:var(--cp-tab-active-fg);border-bottom-color:var(--cp-tab-indicator)}.cp-type{display:flex;flex-direction:column;gap:14px}.cp-type-row{display:flex;align-items:baseline;gap:14px}.cp-type-tag{flex:0 0 86px;font-family:var(--mono);font-size:11px;color:var(--cp-muted)}.cp-type p{margin:0}.cp-display{font-size:var(--text-display-size, var(--page-title-font-size, 1.875rem));font-weight:var(--text-display-weight, var(--page-title-font-weight, 700));line-height:var(--text-display-leading, var(--page-title-line-height, 1.2));letter-spacing:var(--text-display-tracking, var(--page-title-letter-spacing, -.025em));text-transform:var(--text-display-transform, var(--page-title-text-transform, var(--display-text-transform, none)))}.cp-title{font-size:var(--text-title-size, var(--dialog-title-font-size, 1.5rem));font-weight:var(--text-title-weight, 600);line-height:var(--text-title-leading, 1.1);letter-spacing:var(--text-title-tracking, -.02em);text-transform:var(--text-title-transform, var(--dialog-title-text-transform, none))}.cp-heading{font-size:var(--text-heading-size, var(--notification-title-font-size, var(--tabs-label-font-size, 1.25rem)));font-weight:var(--text-heading-weight, 700);line-height:var(--text-heading-leading, 1.25);text-transform:var(--text-heading-transform, var(--heading-text-transform, none))}.cp-subheading{font-size:var(--text-subheading-size, var(--suggestion-label-font-size, 1.125rem));font-weight:var(--text-subheading-weight, 600);line-height:var(--text-subheading-leading, 1.2)}.cp-body{font-size:var(--text-body-size, var(--body-default-font-size, 1rem));font-weight:var(--text-body-weight, var(--body-default-font-weight, 400));line-height:var(--text-body-leading, var(--body-default-line-height, 1.5))}.cp-body-sm{font-size:var(--text-body-sm-size, var(--body-small-font-size, .875rem));font-weight:var(--text-body-sm-weight, 400);line-height:var(--text-body-sm-leading, 1.5)}.cp-label{font-size:var(--text-label-size, var(--label-mono-uppercase-font-size, .875rem));font-weight:var(--text-label-weight, 500);text-transform:var(--text-label-transform, var(--label-text-transform, var(--label-mono-uppercase-text-transform, none)))}.cp-caption{font-size:var(--text-caption-size, var(--badge-tiny-font-size, .75rem));color:var(--cp-muted)}.shadow-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px;padding:24px 20px;border:1px solid var(--border);border-radius:12px;margin-top:10px}.shadow-grid.backdrop-light{background:#f3f3f5}.shadow-grid.backdrop-dark{background:#18181b}.shadow-cell{display:flex;flex-direction:column;gap:12px;align-items:stretch;padding:0;border:none;background:none;text-align:left;cursor:pointer;font:inherit}.shadow-tile{height:64px;border-radius:10px}.backdrop-light .shadow-tile{background:#fff}.backdrop-dark .shadow-tile{background:#2a2a2e}.shadow-meta{display:flex;flex-direction:column;gap:3px;min-width:0}.shadow-name{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.backdrop-light .shadow-name{color:#18181b}.backdrop-dark .shadow-name{color:#f3f3f5}.shadow-tags{display:flex;gap:5px;flex-wrap:wrap;min-height:0}.shadow-tag{font-size:9.5px;text-transform:uppercase;letter-spacing:.04em;padding:1px 5px;border-radius:4px;background:#7f7f7f2e}.backdrop-light .shadow-tag{color:#52525b}.backdrop-dark .shadow-tag{color:#d4d4d8}.shadow-val{font-size:10px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.backdrop-light .shadow-val{color:#71717a}.backdrop-dark .shadow-val{color:#a1a1aa}.shadow-cell:hover .shadow-tile{transform:translateY(-1px);transition:transform .1s ease}.dup-group{border:1px solid var(--border-soft);border-radius:8px;padding:8px 10px;margin-top:8px;background:var(--panel)}.dup-group.trivial{opacity:.6}.dup-group-head{display:flex;align-items:center;gap:8px}.dup-swatch{width:22px;height:22px;border-radius:5px;border:1px solid var(--hairline);flex-shrink:0}.dup-swatch.glyph{display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--text-faint);background:var(--bg-elev)}.dup-value{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:280px}.dup-tag{font-size:10px;border-radius:4px;padding:1px 6px;border:1px solid var(--border-soft);color:var(--text-dim)}.dup-tag.warn{color:var(--warning);border-color:var(--warning)}.dup-tag.muted{color:var(--text-faint)}.dup-names{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.dup-alias-mark{color:var(--accent)}.motion-dur-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}.motion-dur-row{display:flex;align-items:center;gap:16px;padding:8px;border-radius:6px;cursor:pointer}.motion-dur-row:hover{background:var(--bg-elev)}.motion-dur-track{position:relative;flex:1;min-width:120px;height:10px;border-radius:999px;background:var(--bg-elev-2);overflow:hidden}.motion-dur-bar{position:absolute;inset:0 auto 0 0;width:100%;border-radius:999px;background:var(--accent);transform-origin:left center;animation-name:motion-fill;animation-timing-function:linear;animation-iteration-count:1;animation-fill-mode:both}@keyframes motion-fill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.motion-meta{display:flex;flex-direction:column;gap:2px;min-width:0}.motion-name{font-size:12px;color:var(--text);display:inline-flex;align-items:center}.motion-tags{display:flex;gap:5px;flex-wrap:wrap}.motion-tag{font-size:9.5px;text-transform:uppercase;letter-spacing:.04em;padding:1px 5px;border-radius:4px;background:var(--bg-elev-2);color:var(--text-dim)}.motion-val{font-size:10.5px;color:var(--text-faint)}.motion-ease-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;margin-top:8px}.motion-ease-cell{display:flex;flex-direction:column;gap:10px;padding:0;border:none;background:none;text-align:left;cursor:pointer;font:inherit}.motion-ease-plot{position:relative;width:100%;aspect-ratio:1 / 1;border:1px solid var(--border);border-radius:10px;background:var(--bg-elev)}.motion-curve-svg{position:absolute;top:8px;right:8px;bottom:8px;left:8px;width:calc(100% - 16px);height:calc(100% - 16px);overflow:visible}.motion-curve-box{fill:none;stroke:var(--border-soft);stroke-width:1}.motion-curve-ref{stroke:var(--border-soft);stroke-width:1;stroke-dasharray:3 3}.motion-curve-handle{stroke:var(--accent-dim);stroke-width:1}.motion-curve-path{fill:none;stroke:var(--accent);stroke-width:2}.motion-curve-cp{fill:var(--accent)}.motion-curve-na{fill:var(--text-faint);font-size:12px;font-family:var(--mono)}.motion-ease-dot{position:absolute;left:8px;top:0;width:9px;height:9px;margin:-4px 0 0 -4px;border-radius:50%;background:var(--accent);animation-name:motion-dot;animation-duration:1.2s;animation-iteration-count:1;animation-fill-mode:both}@keyframes motion-dot{0%{top:calc(100% - 8px)}to{top:8px}}@media (prefers-reduced-motion: reduce){.motion-dur-bar,.motion-ease-dot{animation:none}.motion-dur-bar{transform:scaleX(1)}}.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.theme-card{display:flex;flex-direction:column;gap:0;padding:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;overflow:hidden;text-align:left;transition:transform .08s ease,border-color .1s ease}.theme-card:hover{transform:translateY(-2px);border-color:var(--accent)}.theme-prev{padding:16px 16px 12px;display:flex;flex-direction:column;gap:10px}.theme-prev-card{border:1px solid;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:6px}.theme-prev-line{height:6px;border-radius:3px;opacity:.9}.theme-prev-row{display:flex;gap:8px;margin-top:6px}.theme-prev-btn{font-size:10.5px;font-weight:600;padding:4px 10px;border-radius:6px;border:1px solid transparent}.theme-prev-btn.ghost{background:transparent;border-style:solid}.theme-prev-ramp{display:flex;height:12px;border-radius:4px;overflow:hidden}.theme-prev-ramp span{flex:1}.theme-meta{padding:12px 14px 14px;border-top:1px solid var(--border-soft)}.theme-name{font-weight:700;display:flex;align-items:center;gap:8px}.theme-mode{font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;padding:1px 6px;border-radius:10px;border:1px solid var(--border);color:var(--text-faint);font-weight:600}.theme-blurb{font-size:12px;color:var(--text-dim);margin-top:4px;line-height:1.45}.gen-body{display:grid;gap:18px}.gen-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 16px}.gen-controls .field label{color:var(--text-dim)}.gen-controls input[type=range]{width:100%;accent-color:var(--accent)}.gen-ramp-preview{display:flex;gap:6px;flex-wrap:wrap}.gen-ramp-chip{flex:1 1 0;min-width:62px;display:flex;flex-direction:column;gap:3px;text-align:center}.gen-ramp-color{height:56px;border-radius:8px;border:1px solid var(--hairline);position:relative}.gen-dup{position:absolute;top:3px;right:4px;width:16px;height:16px;border-radius:50%;background:var(--warning);color:#2a1a00;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}.gen-ramp-step{font-size:11px;font-weight:700;color:var(--text-dim)}.gen-ramp-hex{font-size:10px;color:var(--text-faint)}.gen-ramp-l{font-size:9.5px;color:var(--text-faint)}.gen-num-preview{display:flex;flex-direction:column;gap:2px}.gen-num-row{display:grid;grid-template-columns:minmax(120px,1.4fr) 64px 1fr auto;align-items:center;gap:12px;padding:5px 6px;border-radius:6px;border:1px solid transparent}.gen-num-row:hover{background:var(--bg-elev)}.gen-num-row.dup{opacity:.55}.gen-num-label{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gen-num-val{font-size:12px;color:var(--text-dim)}.gen-num-bar-wrap{display:flex;align-items:center;min-width:0}.gen-num-bar{height:16px;background:linear-gradient(90deg,var(--accent),#c46bff);border-radius:4px;min-width:2px;display:flex;align-items:center;justify-content:center;color:var(--on-accent);font-weight:700;line-height:1;overflow:hidden}.gen-dup-tag{font-size:9.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--warning);font-weight:700}@media (max-width: 880px){.gen-controls{grid-template-columns:1fr 1fr}.gen-num-row{grid-template-columns:minmax(90px,1fr) 56px 1fr auto}}.oklch{display:grid;gap:12px}.oklch-swatch{height:52px;border-radius:8px;border:1px solid var(--hairline);position:relative;background-image:linear-gradient(45deg,var(--checker) 25%,transparent 25%),linear-gradient(-45deg,var(--checker) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checker) 75%),linear-gradient(-45deg,transparent 75%,var(--checker) 75%);background-size:12px 12px}.oklch-clamp{position:absolute;bottom:5px;right:6px;font-size:9.5px;text-transform:uppercase;letter-spacing:.04em;font-weight:700;background:#0000008c;color:#fff;border-radius:4px;padding:1px 6px}.oklch-slider{display:grid;gap:5px}.oklch-slider-head{display:flex;justify-content:space-between;align-items:baseline;font-size:11px}.oklch-axis{color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em}.oklch-axis b{color:var(--text-dim);font-family:var(--mono);margin-right:4px}.oklch-val{color:var(--text-dim);font-size:11.5px}.oklch-track-wrap{position:relative;height:18px;display:flex;align-items:center}.oklch-track{position:absolute;top:4px;right:0;bottom:4px;left:0;border-radius:5px;border:1px solid var(--hairline);pointer-events:none}.oklch-marker{position:absolute;top:1px;bottom:1px;width:2px;background:var(--text);opacity:.55;transform:translate(-1px);pointer-events:none;border-radius:1px}.oklch-track-wrap input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;width:100%;height:18px;background:transparent;margin:0;cursor:pointer}.oklch-track-wrap input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.55);box-shadow:0 1px 3px #0006}.oklch-track-wrap input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid rgba(0,0,0,.55)}.oklch-track-wrap input[type=range]::-moz-range-track{background:transparent}.oklch-hex{display:flex;gap:8px;align-items:center}.oklch-hex .text-input{flex:1}.brand{flex:0 0 auto;align-items:center}.brand-name{white-space:nowrap}.tabs{flex:1 1 auto}.toolbar{display:flex;align-items:center;gap:8px;flex:0 0 auto}.toolbar .mode-switch{text-transform:capitalize}.icon-btn{font-size:16px;line-height:1;padding:6px 11px}.themed-chip{font-size:12px;line-height:1}.tb-menu{position:relative}.tb-menu-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:55}.tb-menu-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:224px;max-width:calc(100vw - 24px);background:var(--bg-elev);border:1px solid var(--border);border-radius:10px;padding:6px;display:flex;flex-direction:column;box-shadow:0 16px 40px var(--scrim)}.tb-item{text-align:left;background:transparent;border:none;color:var(--text);padding:8px 10px;border-radius:6px;font-size:13px;white-space:nowrap}.tb-item:hover:not(:disabled){background:var(--bg-elev-2)}.tb-item:disabled{opacity:.4;cursor:default}.tb-item.active{color:var(--accent)}.tb-item.danger{color:var(--danger)}.tb-item.danger:hover:not(:disabled){background:color-mix(in oklab,var(--danger),transparent 86%)}.tb-sep{height:1px;background:var(--border-soft);margin:5px 4px}.tb-label{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);padding:6px 10px 2px}
