@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";.app{display:flex;flex-direction:column;min-height:100vh}.app-header{background:var(--bg2);border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm)}.header-hero{position:relative;text-align:center;padding:32px 24px 20px}.logo{font-size:26px;font-weight:700;color:var(--accent);letter-spacing:-.02em;margin-bottom:6px}.logo-subtitle{font-size:13px;color:var(--text2)}.palette-tabs-row{display:flex;align-items:center;justify-content:center;gap:6px;padding:0 24px 12px;flex-wrap:wrap}.palette-tab{display:flex;align-items:center;gap:6px;padding:5px 12px 5px 8px;border-radius:20px;border:1px solid var(--border2);background:var(--bg3);color:var(--text2);font-size:12px;font-weight:500;transition:all var(--transition);white-space:nowrap}.palette-tab:hover{border-color:var(--accent);color:var(--text)}.palette-tab.active{border-color:var(--accent);background:var(--accent-light);color:var(--accent)}.palette-tab-dots{display:flex;gap:2px}.palette-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 0 0 1px #0000001f}.palette-tab-name{max-width:120px;overflow:hidden;text-overflow:ellipsis}.palette-count{color:var(--text3);font-size:11px}.btn-add-palette{width:28px;height:28px;border-radius:50%;border:1px dashed var(--border2);background:transparent;color:var(--text3);font-size:16px;display:flex;align-items:center;justify-content:center;transition:all var(--transition)}.btn-add-palette:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}.section-tabs{display:flex;justify-content:center;gap:0;border-top:1px solid var(--border)}.section-tab{padding:10px 20px;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--text2);font-size:13px;font-weight:500;transition:all var(--transition);position:relative;top:1px}.section-tab:hover{color:var(--text)}.section-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.app-content{flex:1;max-width:1400px;width:100%;margin:0 auto;padding:28px 32px}.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:72px 24px;gap:12px}.empty-icon{font-size:40px;opacity:.35}.empty-state p{color:var(--text2);max-width:340px;line-height:1.7;font-size:14px}.palette-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden;margin-bottom:16px}.palette-card-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border)}.palette-card-title{font-size:13px;font-weight:600;color:var(--text)}.palette-card-actions{display:flex;gap:6px}.btn-figma{display:flex;align-items:center;gap:5px;padding:5px 12px;border-radius:6px;border:1px solid var(--pass);background:var(--pass-bg);color:var(--pass);font-size:11px;font-weight:600;transition:all var(--transition)}.btn-figma:hover{background:var(--pass);color:#fff}.btn-outline-sm{padding:5px 12px;border-radius:6px;border:1px solid var(--border2);background:transparent;color:var(--text2);font-size:11px;font-weight:500;transition:all var(--transition)}.btn-outline-sm:hover{border-color:var(--accent);color:var(--accent)}.btn-danger-sm{padding:5px 12px;border-radius:6px;border:1px solid rgba(220,38,38,.25);background:var(--fail-bg);color:var(--fail);font-size:11px;font-weight:600;transition:all var(--transition)}.btn-danger-sm:hover{background:var(--fail);color:#fff}.btn-move{width:26px;height:26px;border-radius:5px;border:1px solid var(--border2);background:transparent;color:var(--text2);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:all var(--transition);flex-shrink:0}.btn-move:hover:not(:disabled){background:var(--bg3);color:var(--text)}.btn-move:disabled{opacity:.25;cursor:default}.btn-secondary-sm{padding:5px 12px;border-radius:6px;border:1px solid var(--border2);background:transparent;color:var(--text2);font-size:11px;font-weight:600;transition:all var(--transition)}.btn-secondary-sm:hover{background:var(--bg3);color:var(--text)}.semantic-chips{display:flex;gap:6px;flex-wrap:wrap;padding:10px 18px;border-bottom:1px solid var(--border)}.chips-hint{font-size:10px;color:var(--text3);align-self:center;white-space:nowrap;margin-right:4px}.semantic-chip{padding:3px 12px;border-radius:20px;border:1px solid var(--border2);background:transparent;color:var(--text2);font-size:11px;font-weight:500;cursor:default}.semantic-chip.draggable{cursor:grab;-webkit-user-select:none;user-select:none;transition:all var(--transition)}.semantic-chip.draggable:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}.semantic-chip.draggable:active{cursor:grabbing;opacity:.7}.semantic-chip.has-color{border-color:var(--accent);background:var(--accent-light);color:var(--accent)}.swatch-preview.drag-over{outline:2px dashed var(--accent);outline-offset:3px;transform:scale(1.04)}.swatch-roles{display:flex;flex-direction:column;gap:2px;width:100%}.swatch-role-chip{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 2px 6px;border-radius:4px;background:var(--accent-light);border:1px solid rgba(43,76,255,.2);font-size:8px;cursor:grab;-webkit-user-select:none;user-select:none}.swatch-role-chip:active{cursor:grabbing}.role-chip-label{font-weight:600;color:var(--accent);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.role-chip-remove{background:none;border:none;color:var(--accent);font-size:12px;padding:0 0 0 3px;cursor:pointer;line-height:1;opacity:.6;flex-shrink:0}.role-chip-remove:hover{opacity:1}.swatch-drop-hint{font-size:8px;color:var(--text3);text-align:center;padding:3px 0;border:1px dashed var(--border2);border-radius:4px;transition:all var(--transition)}.swatch-drop-hint.active{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}.swatches-area{padding:16px 18px}.swatches-row{display:flex;flex-wrap:wrap;gap:8px}.color-swatch{display:flex;flex-direction:column;align-items:center;gap:5px;width:64px}.swatch-preview{position:relative;width:64px;height:64px;border-radius:8px;cursor:pointer;box-shadow:inset 0 0 0 1px #0000001a;transition:transform var(--transition),box-shadow var(--transition);overflow:hidden;flex-shrink:0}.swatch-preview:hover{transform:translateY(-2px);box-shadow:0 6px 16px #00000026,inset 0 0 0 1px #00000014}.swatch-role-label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px;text-align:center;font-size:8px;font-weight:700;line-height:1.3;gap:1px;pointer-events:none;white-space:pre-line}.swatch-copy-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition);font-size:10px;font-family:var(--mono);font-weight:500;color:#fff}.swatch-preview:hover .swatch-copy-overlay{opacity:1}.swatch-labels{text-align:center}.swatch-name{display:block;font-size:10px;font-weight:500;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:64px}.swatch-step-name{display:block;font-family:var(--mono);font-size:13px;font-weight:700;color:var(--text);text-align:center}.swatch-hex{display:block;font-family:var(--mono);font-size:9px;color:var(--text3)}.swatch-with-controls{display:flex;flex-direction:column;align-items:stretch;gap:4px;width:80px}.swatch-with-controls select{width:72px;font-size:9px;padding:2px 3px;border-radius:5px;background:var(--bg2);border:1px solid var(--border2);color:var(--text);cursor:pointer}.swatch-with-controls select option:checked{background:var(--accent-light);color:var(--accent)}.btn-scale{width:64px;padding:3px;border:1px solid var(--border2);border-radius:5px;background:transparent;color:var(--text2);font-size:9px;transition:all var(--transition)}.btn-scale:hover{border-color:var(--accent);color:var(--accent)}.mode-toggle{display:flex;gap:8px;margin-bottom:20px}.mode-btn{padding:7px 14px;border:1px solid var(--border2);border-radius:7px;background:var(--bg2);color:var(--text2);font-size:12px;transition:all var(--transition);box-shadow:var(--shadow-sm)}.mode-btn:hover{border-color:var(--accent);color:var(--text)}.mode-btn.active{background:var(--accent-light);border-color:var(--accent);color:var(--accent);font-weight:600}.manual-paste{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow)}.manual-paste p{color:var(--text2);margin-bottom:12px;font-size:13px}.manual-paste textarea{width:100%;min-height:110px;resize:vertical;font-family:var(--mono);font-size:12px}.tonal-scale{display:flex;gap:3px;overflow-x:auto;padding:4px 0 8px}.scale-step{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:48px;flex:1}.scale-color{width:100%;height:44px;border-radius:6px;box-shadow:inset 0 0 0 1px #00000014}.scale-step-name{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--text2);text-align:center}.scale-step.selectable{cursor:pointer}.scale-step.selectable:hover .scale-color{opacity:.85}.scale-step--selected .scale-color{box-shadow:0 0 0 2px var(--accent),0 0 0 4px #5551ff26}.scale-color{position:relative}.scale-check{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.4);background:#5551ff40;border-radius:inherit}.scale-selection-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 4px 2px;gap:12px}.scale-selection-hint{font-size:12px;color:var(--text3)}.scale-role-pin{font-size:9px;font-weight:700;color:var(--accent);text-align:center;max-width:48px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scale-hsb{font-family:var(--mono);font-size:9px;color:var(--text3);text-align:center}.ant-scale-pair{display:flex;gap:12px;width:100%}.ant-scale-col{flex:1;border-radius:12px;overflow:hidden;border:1px solid var(--border);background:#fff}.ant-scale-col--dark{background:#141414}.ant-scale-col-header{padding:12px 16px;font-size:11px;font-weight:600;border-bottom:1px solid rgba(0,0,0,.08);background:inherit}.ant-scale-row{display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:54px;font-size:11px;font-weight:600;font-family:var(--mono);letter-spacing:.03em;transition:filter .15s}.ant-scale-row:hover{filter:brightness(1.06);cursor:default}.ant-step-name{font-size:13px;font-weight:700;opacity:.85;min-width:28px}.ant-step-hex{font-size:11px;opacity:.75;text-transform:uppercase}.portals-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.portal-chip{display:flex;align-items:center;gap:6px;background:var(--bg3);border:1px solid var(--border2);border-radius:20px;padding:4px 10px;font-size:12px}.portal-chip input{background:transparent;border:none;padding:0;width:80px;font-size:12px;box-shadow:none}.portal-chip input:focus{box-shadow:none;border-color:transparent}.portal-chip input[type=number]{width:36px}.portal-chip button{background:transparent;border:none;color:var(--text3);font-size:14px;line-height:1;padding:0;transition:color var(--transition)}.portal-chip button:hover{color:var(--fail)}.btn-add-portal{padding:5px 14px;border:1px dashed var(--border2);border-radius:20px;background:transparent;color:var(--text2);font-size:12px;transition:all var(--transition)}.btn-add-portal:hover{border-color:var(--accent);color:var(--accent)}.tab-section{margin-bottom:24px}.tab-section>h3{margin-bottom:12px}.alert-warning{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--warn-bg);border:1px solid rgba(217,119,6,.25);border-radius:var(--radius);color:var(--warn);font-size:13px;margin-bottom:20px}.contrast-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}.contrast-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)}.contrast-preview{height:52px;display:flex;align-items:center;justify-content:center}.contrast-info{padding:10px 12px;display:flex;flex-direction:column;gap:4px}.contrast-label{font-size:12px;color:var(--text2)}.contrast-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:4px;font-size:11px;font-family:var(--mono);font-weight:600;align-self:flex-start;color:#fff}.harmony-chips{display:flex;gap:8px;flex-wrap:wrap}.harmony-chip{padding:5px 14px;border-radius:20px;font-size:12px;font-weight:500;border:1px solid}.harmony-chip.pass{background:var(--pass-bg);border-color:#16a34a4d;color:var(--pass)}.harmony-chip.fail{background:var(--fail-bg);border-color:#dc26264d;color:var(--fail)}.dark-progress{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;font-size:13px;color:var(--text2);box-shadow:var(--shadow-sm)}.btn-approve-all{padding:5px 14px;border-radius:6px;border:1px solid var(--pass);background:var(--pass-bg);color:var(--pass);font-size:12px;font-weight:600;transition:all var(--transition)}.btn-approve-all:hover{background:var(--pass);color:#fff}.dark-list{display:flex;flex-direction:column;gap:8px}.dark-row{display:grid;grid-template-columns:1fr auto 1fr auto;align-items:center;gap:12px;padding:12px 16px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:border-color var(--transition)}.dark-row.approved{border-color:#16a34a4d}.dark-row.excluded{opacity:.45}.working-toggle{width:16px;height:16px;border-radius:50%;border:2px solid var(--border2);background:transparent;flex-shrink:0;cursor:pointer;padding:0;margin-right:4px;transition:all var(--transition)}.working-toggle.in{background:var(--accent);border-color:var(--accent)}.working-toggle.out{background:transparent;border-color:var(--border2)}.working-toggle.out:hover{border-color:var(--accent)}.dark-row-contrast{grid-column:1 / -1;display:flex;gap:6px;flex-wrap:wrap;padding-top:8px;border-top:1px solid var(--border);margin-top:4px}.dark-row-contrast-chip{font-size:10px;font-weight:600;padding:2px 7px;border-radius:4px;font-family:var(--mono)}.dark-row-contrast-chip.pass{background:var(--pass-bg);color:var(--pass)}.dark-row-contrast-chip.fail{background:var(--fail-bg);color:var(--fail)}.dark-row-light,.dark-row-suggestion{display:flex;align-items:center;gap:10px}.dark-swatch{width:36px;height:36px;border-radius:7px;flex-shrink:0;box-shadow:inset 0 0 0 1px #0000001a}.dark-label{display:block;font-size:12px;font-weight:500}.dark-hsb{display:block;font-family:var(--mono);font-size:10px;color:var(--text3)}.dark-arrow{color:var(--text3);font-size:18px}.dark-hex-input{display:block;width:92px;font-family:var(--mono);font-size:12px;padding:3px 7px;margin-bottom:2px;background:var(--bg3);border:1px solid var(--border2);border-radius:5px;color:var(--text)}.dark-suggestion-fields{display:flex;flex-direction:column;gap:6px}.dark-hsb-inputs{display:flex;gap:6px;align-items:center}.dark-hsb-field{display:flex;align-items:center;gap:2px}.dark-hsb-key{font-size:9px;font-weight:700;color:var(--text3);width:10px;text-align:right}.dark-hsb-input{width:44px;font-family:var(--mono);font-size:11px;padding:2px 4px;background:var(--bg3);border:1px solid var(--border2);border-radius:4px;color:var(--text);text-align:center}.dark-hsb-unit{font-size:9px;color:var(--text3);width:8px}.dark-row-actions{display:flex;gap:6px;flex-shrink:0}.btn-lock,.btn-unlock,.btn-approve{padding:4px 10px;border-radius:6px;font-size:11px;font-weight:500;transition:all var(--transition)}.btn-lock{border:1px solid var(--border2);background:transparent;color:var(--text2)}.btn-lock:hover{border-color:var(--warn);color:var(--warn)}.btn-unlock,.btn-approve{border:1px solid rgba(22,163,74,.3);background:var(--pass-bg);color:var(--pass)}.btn-approve:hover{background:var(--pass);border-color:var(--pass);color:#fff}.approved-badge{font-size:11px;color:var(--pass);font-weight:600}.export-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.export-btn{padding:14px 18px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text2);font-size:13px;font-weight:500;text-align:left;transition:all var(--transition);display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-sm)}.export-btn:hover{border-color:var(--border2);color:var(--text);transform:translateY(-1px);box-shadow:var(--shadow)}.export-mode-toggle{display:flex;gap:6px;padding:4px;background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);width:fit-content}.export-mode-btn{padding:6px 14px;border-radius:calc(var(--radius) - 2px);border:none;background:transparent;color:var(--text2);font-size:12px;font-weight:500;cursor:pointer;transition:all var(--transition)}.export-mode-btn.active{background:var(--bg);color:var(--text);box-shadow:var(--shadow-sm)}.export-figma{border-color:#2b4cff40;background:var(--accent-light);color:var(--accent);font-weight:600;grid-column:1 / -1}.export-figma:hover{background:var(--accent);color:#fff;border-color:var(--accent)}.export-figma-scale{border-color:#783cdc33;background:#783cdc0f;color:#7a3cdc}.export-figma-scale:hover{background:#7a3cdc;color:#fff;border-color:#7a3cdc}.group-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);margin-bottom:20px;overflow:hidden}.group-card-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}.group-card-title{font-size:15px;font-weight:700;color:var(--text)}.btn-add-palette-group{padding:6px 14px;border-radius:7px;border:1px solid var(--accent);background:var(--accent-light);color:var(--accent);font-size:12px;font-weight:600;transition:all var(--transition)}.btn-add-palette-group:hover{background:var(--accent);color:#fff}.group-semantic-chips{display:flex;gap:6px;flex-wrap:wrap;padding:10px 20px;border-bottom:1px solid var(--border);background:var(--bg3)}.group-palettes{padding:14px;display:flex;flex-direction:column;gap:12px}.group-empty{padding:28px;text-align:center;color:var(--text2);font-size:13px;border:1px dashed var(--border2);border-radius:var(--radius)}.inner-palette-card{border:1px solid var(--border2);border-radius:var(--radius);overflow:hidden}.inner-palette-header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--bg3);border-bottom:1px solid var(--border)}.inner-palette-title{display:flex;align-items:center;gap:8px}.inner-palette-name{font-size:13px;font-weight:600;color:var(--text);cursor:pointer;border-bottom:1px dashed transparent;transition:border-color var(--transition)}.inner-palette-name:hover{border-bottom-color:var(--text3)}.inner-palette-count{font-size:11px;color:var(--text3)}.semantic-palettes-section{border-top:1px solid var(--border);padding:14px 16px 16px}.semantic-palettes-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.semantic-palettes-label{font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:.05em}.semantic-palettes-empty{font-size:12px;color:var(--text3);margin:0}.btn-add-semantic{font-size:11px;font-weight:500;padding:4px 10px;background:#2b4cff12;color:var(--accent);border:1px solid rgba(43,76,255,.2);border-radius:6px;cursor:pointer;transition:all var(--transition)}.btn-add-semantic:hover{background:#2b4cff24}.semantic-palette-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;margin-bottom:10px;overflow:hidden}.semantic-palette-header{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#2b4cff0a;border-bottom:1px solid var(--border)}.semantic-palette-name-input{flex:1;font-size:13px;font-weight:600;color:var(--accent);background:transparent;border:none;outline:none;padding:0}.semantic-palette-name-input::placeholder{color:var(--text3);font-weight:400}.semantic-token-list{padding:10px 12px;display:flex;flex-direction:column;gap:6px}.semantic-token-row{display:flex;align-items:center;gap:8px}.semantic-token-name-input{width:140px;font-size:12px;font-weight:500;padding:4px 8px;border-radius:6px;border:1px solid var(--border);background:var(--bg);color:var(--text);outline:none;transition:border-color var(--transition);flex-shrink:0}.semantic-token-name-input:focus{border-color:var(--accent)}.semantic-token-name-input::placeholder{color:var(--text3)}.token-add-row{display:flex;gap:6px;margin-top:2px}.btn-add-token{font-size:11px;color:var(--text3);background:transparent;border:1px dashed var(--border);border-radius:6px;padding:3px 10px;cursor:pointer;transition:all var(--transition)}.btn-add-token:hover,.btn-add-token.active{color:var(--accent);border-color:var(--accent);border-style:solid}.role-chips-picker{display:flex;flex-wrap:wrap;gap:5px;padding:8px;background:#2b4cff08;border:1px solid var(--border);border-radius:6px;margin-top:2px}.role-chip-option{font-size:11px;padding:3px 8px;border-radius:20px;border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer;transition:all var(--transition);display:flex;align-items:center;gap:4px}.role-chip-option:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:#2b4cff0f}.role-chip-option.used,.role-chip-option:disabled{opacity:.35;cursor:not-allowed}.chip-preview{font-size:10px;color:var(--accent);opacity:.7}.sem-palette-section{border-top:1px solid var(--border);padding:12px 16px 14px;background:#2b4cff05;display:flex;gap:24px;align-items:flex-start}.sem-palette-body{flex-shrink:0;min-width:220px}.sem-palette-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.sem-palette-label{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}.sem-palette-name-input{font-size:13px;font-weight:600;color:var(--accent);background:transparent;border:none;border-bottom:1.5px solid rgba(43,76,255,.25);outline:none;padding:1px 4px;width:160px;transition:border-color var(--transition)}.sem-palette-name-input:focus{border-color:var(--accent)}.sem-palette-name-input::placeholder{color:var(--text3);font-weight:400;font-style:italic}.sem-palette-empty{font-size:11px;color:var(--text3);margin:0;font-style:italic}.sem-palette-tokens{display:flex;flex-direction:column;gap:5px}.sem-token-row{display:flex;align-items:center;gap:7px;font-size:12px}.sem-token-name-edit{width:130px;flex-shrink:0;font-weight:500;color:var(--text2);font-size:11px;background:transparent;border:none;border-bottom:1px solid transparent;outline:none;padding:1px 2px;cursor:text;transition:border-color var(--transition)}.sem-token-name-edit:hover{border-bottom-color:var(--border)}.sem-token-name-edit:focus{border-bottom-color:var(--accent);color:var(--text)}.sem-token-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 0 0 1px #0000001f}.sem-token-hex{font-family:monospace;font-size:11px;color:var(--text3)}.sem-token-sep{color:var(--text3);font-size:10px}.contrast-mini-stack{display:flex;flex-direction:column;gap:12px;flex:1;min-width:0}.contrast-mini-block{display:flex;flex-direction:column;gap:6px}.contrast-mini-title{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text3)}.contrast-mini{display:flex;gap:6px;flex-wrap:wrap;align-items:flex-start;padding-top:2px}.contrast-mini-col{display:flex;flex-direction:column;align-items:center;gap:4px;width:62px}.contrast-mini-label{font-size:9px;color:var(--text3);text-align:center;line-height:1.35;min-height:26px}.contrast-mini-dots{display:flex;gap:3px}.contrast-mini-dot{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 1px #0000001f}.contrast-mini-dot-fg{margin-left:-8px;box-shadow:inset 0 0 0 1px #0000001f,-1px 0 0 2px var(--bg2)}.contrast-mini-badge{font-size:9px;font-weight:700;padding:2px 5px;border-radius:4px;letter-spacing:.03em}.contrast-mini-badge.aaa{background:var(--pass-bg);color:var(--pass)}.contrast-mini-badge.aa{background:var(--accent-light);color:var(--accent)}.contrast-mini-badge.fail{background:var(--fail-bg);color:var(--fail)}.contrast-mini-ratio{font-size:10px;font-weight:600;color:var(--text2);font-family:var(--mono)}.chip-remove-btn{background:none;border:none;cursor:pointer;color:inherit;opacity:.5;font-size:13px;line-height:1;padding:0 0 0 3px;margin-left:1px}.chip-remove-btn:hover{opacity:1}.chip-add-input{font-size:11px;font-weight:500;padding:3px 8px;border-radius:20px;border:1px dashed var(--border);background:transparent;color:var(--text3);outline:none;width:90px;transition:all var(--transition)}.chip-add-input:focus{border-color:var(--accent);color:var(--text);width:130px}.chip-add-input::placeholder{color:var(--text3)}.color-picker-wrap{position:relative;flex:1}.color-picker-trigger{display:flex;align-items:center;gap:6px;width:100%;padding:4px 8px;border-radius:6px;border:1px solid var(--border);background:var(--bg);cursor:pointer;font-size:11px;color:var(--text);transition:border-color var(--transition);text-align:left}.color-picker-trigger:hover{border-color:var(--accent)}.color-picker-trigger.empty{color:var(--text3)}.cp-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 0 0 1px #0000001a}.cp-hex{font-family:monospace;color:var(--text2)}.cp-name{color:var(--text3)}.cp-placeholder{font-style:italic}.color-picker-popover{position:absolute;top:calc(100% + 4px);left:0;z-index:100;background:var(--card);border:1px solid var(--border);border-radius:8px;padding:8px;display:flex;flex-wrap:wrap;gap:4px;width:220px;box-shadow:0 4px 16px #0000001f}.cp-swatch{width:24px;height:24px;border-radius:50%;border:2px solid transparent;cursor:pointer;box-shadow:inset 0 0 0 1px #0000001a;transition:transform var(--transition),border-color var(--transition)}.cp-swatch:hover{transform:scale(1.15)}.cp-swatch.selected{border-color:var(--accent);transform:scale(1.1)}.palette-semantic-name-tag{font-size:11px;font-weight:500;padding:2px 9px;border-radius:20px;cursor:pointer;transition:all var(--transition)}.palette-semantic-name-tag.has-value{background:#2b4cff14;color:var(--accent);border:1px solid rgba(43,76,255,.2)}.palette-semantic-name-tag.empty{background:transparent;color:var(--text3);border:1px dashed var(--border)}.palette-semantic-name-tag:hover{border-color:var(--accent);color:var(--accent)}.palette-semantic-name-input{font-size:11px;font-weight:500;padding:2px 8px;border-radius:20px;width:140px;border:1px solid var(--accent);background:#2b4cff0d;color:var(--accent);outline:none}.palette-name-input{font-size:13px;font-weight:600;padding:2px 6px;border-radius:4px;width:200px}.inner-palette-swatches{padding:14px}.palette-mode-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text3);margin-bottom:6px;padding-top:4px}.palette-mode-label:first-child{padding-top:0}.scale-section{padding:0 14px 14px}.scale-section-label{font-size:11px;font-weight:600;color:var(--text2);margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em}.ct-table{border-collapse:collapse;font-size:11px;table-layout:fixed;width:100%}.ct-corner{width:130px}.ct-col-header{text-align:center;padding:0 2px 10px;vertical-align:bottom}.ct-th-swatch{width:28px;height:28px;border-radius:6px;margin:4px auto 0;box-shadow:inset 0 0 0 1px #0000001f}.ct-th-name{font-size:10px;font-weight:600;color:var(--text);white-space:normal;word-break:break-word}.ct-th-hex{font-family:var(--mono);font-size:9px;color:var(--text3)}.ct-row-header{text-align:center;padding:4px 8px 4px 4px;vertical-align:middle}.ct-rh-swatch{width:22px;height:22px;border-radius:5px;margin:0 auto 4px;box-shadow:inset 0 0 0 1px #0000001f}.ct-cell-td{padding:3px;vertical-align:top}.ct-cell{width:100%;border-radius:6px;overflow:hidden;box-shadow:inset 0 0 0 1px #00000014}.ct-sample{display:flex;align-items:center;justify-content:center;height:26px;font-size:10px;font-weight:600;letter-spacing:-.01em;overflow:hidden;white-space:nowrap}.ct-footer{display:flex;align-items:center;justify-content:center;gap:5px;padding:3px 5px;background:var(--bg3);border-top:1px solid var(--border)}.ct-badge{font-size:9px;font-weight:700;color:#fff;padding:1px 5px;border-radius:10px;font-family:var(--mono);white-space:nowrap}.ct-ratio{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--text2)}.ct-cell-self{width:100%;height:57px;opacity:.25;border-radius:6px}.ct-section-title{font-size:13px;font-weight:600;color:var(--text2);margin:0 0 16px;padding-bottom:8px;border-bottom:1px solid var(--border)}.ct-legend-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 16px;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:20px;box-shadow:var(--shadow-sm)}.ct-legend-title{font-size:11px;font-weight:600;color:var(--text2);white-space:nowrap}.ct-legend-chip{font-size:10px;font-weight:600;color:#fff;padding:3px 10px;border-radius:20px}.ct-neutral-options{display:flex;flex-wrap:wrap;gap:8px;padding:12px 18px 16px}.ct-neutral-opt{display:flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--border2);border-radius:20px;cursor:pointer;font-size:11px;transition:all var(--transition);background:var(--bg2)}.ct-neutral-opt:hover{border-color:var(--accent)}.ct-neutral-opt.selected{border-color:var(--accent);background:var(--accent-light)}.ct-neutral-opt input{display:none}.ct-neutral-swatch{width:14px;height:14px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 0 0 1px #00000026}.ct-neutral-name{font-weight:500;color:var(--text)}.ct-neutral-hex{font-family:var(--mono);font-size:9px;color:var(--text3)}.dark-selector{display:flex;align-items:center;gap:10px;margin-bottom:16px}.dark-selector-label{font-size:13px;color:var(--text2);font-weight:500;white-space:nowrap}.dark-selector select{width:auto;min-width:240px}.manual-paste{background:var(--bg2);border:1px dashed var(--border2);border-radius:var(--radius-lg);padding:18px 20px;margin-top:4px}.manual-paste p{color:var(--text2);margin-bottom:10px;font-size:13px}.manual-paste textarea{width:100%;resize:vertical;font-family:var(--mono);font-size:12px;min-height:90px}.scale-generator{border-top:1px solid var(--border);background:var(--bg3)}.scale-generator-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:12px 14px}.scale-generator-label{font-size:11px;color:var(--text2);font-style:italic}.scale-generator-controls{display:flex;align-items:center;gap:8px}.step-label{font-size:12px;font-weight:500;color:var(--text2)}.step-input{width:60px;padding:5px 8px;font-size:13px;text-align:center}.btn-generate{padding:6px 16px;border-radius:7px;border:1px solid var(--accent);background:var(--accent);color:#fff;font-size:12px;font-weight:600;transition:all var(--transition)}.btn-generate:hover:not(:disabled){opacity:.88}.btn-generate:disabled{opacity:.38;cursor:not-allowed}.scale-result{padding:0 14px 14px;overflow-x:auto}.swatch-hsb-block{display:flex;flex-direction:column;gap:1px;width:64px}.hsb-row{display:flex;align-items:center;gap:4px;font-family:var(--mono);font-size:9px;color:var(--text2)}.hsb-key{font-weight:700;color:var(--accent);width:10px}.semantic-mapped-swatch{display:flex;flex-direction:column;align-items:center;gap:4px;width:64px}.semantic-swatch-block{width:64px;height:40px;border-radius:7px;box-shadow:inset 0 0 0 1px #0000001a}.semantic-swatch-role{font-size:9px;font-weight:700;color:var(--accent);text-align:center;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.semantic-swatch-hex{font-family:var(--mono);font-size:9px;color:var(--text3)}.hsb-input{width:38px;padding:1px 3px;font-family:var(--mono);font-size:9px;text-align:right;border-radius:3px;border:1px solid var(--border2);background:var(--bg2);color:var(--text);-moz-appearance:textfield}.hsb-input::-webkit-inner-spin-button,.hsb-input::-webkit-outer-spin-button{-webkit-appearance:none}.hsb-input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px var(--accent-light)}.hsb-unit{font-family:var(--mono);font-size:9px;color:var(--text3)}.add-color-section{padding:10px 14px;border-top:1px solid var(--border);background:var(--bg2)}.add-color-row{display:flex;align-items:center;gap:6px}.add-color-preview{width:28px;height:28px;border-radius:5px;flex-shrink:0;box-shadow:inset 0 0 0 1px #0000001f}.format-badge{padding:4px 8px;border-radius:5px;border:1px solid var(--border2);background:var(--bg3);color:var(--text2);font-size:10px;font-weight:700;font-family:var(--mono);cursor:pointer;transition:all var(--transition);white-space:nowrap;flex-shrink:0}.format-badge:hover{border-color:var(--accent);color:var(--accent)}.add-color-input{flex:1.5;min-width:0;font-family:var(--mono);font-size:12px;padding:5px 8px}.add-color-input.error{border-color:var(--fail)!important;box-shadow:0 0 0 2px var(--fail-bg)}.add-color-name{flex:1;min-width:0;font-size:12px;padding:5px 8px}.btn-add-color{width:28px;height:28px;border-radius:6px;border:1px solid var(--accent);background:var(--accent);color:#fff;font-size:18px;font-weight:300;line-height:1;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity var(--transition)}.btn-add-color:hover:not(:disabled){opacity:.85}.btn-add-color:disabled{opacity:.35;cursor:not-allowed}.wizard-palette-swatches{display:flex;gap:6px;padding:12px 0 4px}.wizard-swatch{display:flex;flex-direction:column;align-items:center;gap:5px;flex:1;min-width:0}.wizard-swatch-color{width:100%;height:72px;border-radius:8px;border:1px solid rgba(0,0,0,.07)}.wizard-swatch-name{font-size:9px;color:var(--text2);font-weight:500;text-align:center;line-height:1.3;word-break:break-all;width:100%}.wizard-swatch-hex{font-size:9px;color:var(--text3);font-family:monospace;text-align:center}.wizard-page-tabs{display:flex;align-items:flex-end;gap:4px;padding:0;margin-bottom:20px;border-bottom:2px solid var(--border)}.wizard-palette-card{border-top:1px solid var(--border);padding-top:8px;margin-top:8px}.wizard-palette-card:first-child{border-top:none;margin-top:0;padding-top:0}.wizard-step-tabs{display:flex;gap:4px;padding:10px 0 0;border-bottom:1px solid var(--border);margin-bottom:12px}.wizard-step-tab{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:6px 6px 0 0;border:1px solid transparent;border-bottom:none;background:none;cursor:pointer;font-size:12px;font-weight:500;color:var(--text2);margin-bottom:-1px;transition:background .1s}.wizard-step-tab:hover{background:var(--bg3);color:var(--text)}.wizard-step-tab.active{background:var(--bg2);border-color:var(--border);color:var(--text);font-weight:600}.wizard-step-tab.done .wizard-step-tab-badge{background:var(--success, #16a34a)}.wizard-step-tab-badge{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--border2);color:var(--text2);font-size:11px;font-weight:700}.wizard-step-tab.active .wizard-step-tab-badge{background:var(--accent);color:#fff}.wizard-step-tab-label{white-space:nowrap}.wizard-tabs-divider{width:1px;background:var(--border);margin:4px 4px 0;align-self:stretch}.wizard-palette-section{border-top:1px solid var(--border);padding:20px 0 16px}.wizard-palette-section:first-child{border-top:none;padding-top:8px}.wizard-palette-section-name{font-size:13px;font-weight:600;color:var(--text);margin-bottom:12px;display:flex;align-items:center;gap:10px}.wizard-sel-count{font-size:11px;font-weight:400;color:var(--text3)}.wizard-step-content{padding:0 18px 16px}.wizard-step-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.setup-wizard{padding:16px 14px 14px;border-top:1px solid var(--border)}.setup-wizard-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px;gap:8px;flex-wrap:wrap}.setup-wizard-title{font-size:13px;font-weight:600;color:var(--text)}.setup-wizard-hint{font-size:11px;color:var(--text3)}.setup-preset-row{display:flex;align-items:center;gap:8px;margin-bottom:14px;flex-wrap:wrap}.setup-preset-label{font-size:11px;color:var(--text3);font-weight:500}.setup-preset-btn{padding:4px 10px;border-radius:5px;border:1px solid var(--border2);background:var(--bg3);color:var(--text2);font-size:12px;font-weight:500;transition:all var(--transition)}.setup-preset-btn:hover{border-color:var(--accent);color:var(--accent)}.setup-preset-btn.active{border-color:var(--accent);background:var(--accent-light);color:var(--accent)}.setup-count{font-size:11px;color:var(--text3);margin-left:auto}.setup-swatches{display:flex;flex-wrap:nowrap;gap:4px;margin-bottom:14px;width:100%}.setup-swatch{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer}.setup-swatch-color{width:100%;aspect-ratio:1;border-radius:6px;position:relative;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px #0000001f;transition:transform var(--transition),box-shadow var(--transition)}.setup-swatch:hover .setup-swatch-color{transform:scale(1.08)}.setup-swatch--selected .setup-swatch-color{box-shadow:inset 0 0 0 2px #0000004d,0 0 0 2px var(--accent)}.setup-swatch-check{font-size:16px;font-weight:700;line-height:1}.setup-swatch-step{font-size:10px;color:var(--text3);font-family:var(--mono)}.setup-confirm-row{display:flex;align-items:center;gap:10px;justify-content:flex-end}.setup-error{font-size:11px;color:var(--fail)}.setup-empty{padding:16px 14px;color:var(--text3);font-size:12px}.swatches-fill{flex-wrap:nowrap;overflow-x:auto}.swatches-fill>.color-swatch,.swatches-fill>.swatch-with-controls{flex:1 1 0;min-width:0;width:auto}.swatches-fill .swatch-preview{width:100%;height:auto;aspect-ratio:1}.group-card-header-actions{display:flex;align-items:center;gap:10px}.tamangui-toggle{display:flex;align-items:center;gap:5px;cursor:pointer;-webkit-user-select:none;user-select:none}.tamangui-toggle input[type=checkbox]{accent-color:var(--accent);width:14px;height:14px;cursor:pointer}.tamangui-label{font-size:12px;font-weight:600;color:var(--text2);letter-spacing:.02em}.tamangui-toggle:has(input:checked) .tamangui-label{color:var(--accent)}.setup-global-controls{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--bg2);flex-wrap:wrap}.setup-global-right{display:flex;align-items:center;gap:10px;margin-left:auto}:root{--bg: #eef0f6;--bg2: #ffffff;--bg3: #f5f6fb;--bg4: #eaecf4;--border: rgba(0,0,0,.07);--border2: rgba(0,0,0,.14);--text: #0d0d1a;--text2: #6b7280;--text3: #adb5bd;--accent: #2b4cff;--accent-light: rgba(43,76,255,.08);--pass: #16a34a;--pass-bg: rgba(22,163,74,.08);--fail: #dc2626;--fail-bg: rgba(220,38,38,.08);--warn: #d97706;--warn-bg: rgba(217,119,6,.08);--shadow: 0 1px 3px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.04);--shadow-sm: 0 1px 2px rgba(0,0,0,.05);--radius: 10px;--radius-lg: 14px;--font: "Inter", sans-serif;--mono: "JetBrains Mono", monospace;--transition: .14s ease}[data-theme=dark]{--bg: #0d1117;--bg2: #161b22;--bg3: #1c2128;--bg4: #2d333b;--border: rgba(255,255,255,.07);--border2: rgba(255,255,255,.13);--text: #e6edf3;--text2: #8b949e;--text3: #6e7681;--accent: #6ea8fe;--accent-light: rgba(110,168,254,.12);--pass: #3fb950;--pass-bg: rgba(63,185,80,.1);--fail: #f85149;--fail-bg: rgba(248,81,73,.1);--warn: #d29922;--warn-bg: rgba(210,153,34,.1);--shadow: 0 1px 4px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.3);--shadow-sm: 0 1px 2px rgba(0,0,0,.3)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}button{font-family:var(--font);cursor:pointer}input,textarea,select{font-family:var(--font);background:var(--bg3);color:var(--text);border:1px solid var(--border2);border-radius:7px;padding:6px 10px;font-size:13px;outline:none;transition:border-color var(--transition),box-shadow var(--transition)}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}select option{background:var(--bg3);color:var(--text)}h3{font-size:13px;font-weight:600;color:var(--text2);letter-spacing:.03em;text-transform:uppercase}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:3px}