:root{--bg: #f5f6f8;--surface: #ffffff;--border: #e8eaee;--text-primary: #161a23;--text-secondary: #5b6473;--text-muted: #99a1b0;--accent: #4f46e5;--accent-2: #2563eb;--accent-light: #eef0fe;--sidebar: #11141d;--sidebar-2: #1b2030;--sidebar-line: rgba(255,255,255,.08);--success: #16a34a;--success-bg: #f0fdf4;--error: #dc2626;--error-bg: #fef2f2;--warning: #d97706;--warning-bg: #fffbeb;--radius: 9px;--radius-lg: 14px;--shadow-sm: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);--shadow: 0 4px 16px rgba(16,24,40,.07);--font: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", sans-serif;--font-mono: "Fira Code", "Consolas", monospace}*{box-sizing:border-box}body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text-primary);font-size:14px;-webkit-font-smoothing:antialiased}.shell{display:flex;min-height:100vh}.sidebar{width:268px;flex-shrink:0;position:sticky;top:0;align-self:flex-start;height:100vh;background:linear-gradient(180deg,var(--sidebar),var(--sidebar-2));color:#cdd2dc;display:flex;flex-direction:column;padding:22px 16px}.brand{display:flex;align-items:center;gap:12px;padding:4px 6px 20px}.brand-mark{border-radius:10px;box-shadow:0 6px 16px #4f46e573;flex-shrink:0}.brand-logo{width:42px;height:42px;display:block;flex-shrink:0}.brand-name{font-size:17px;font-weight:700;color:#fff;letter-spacing:-.2px}.brand-sub{font-size:11px;color:#8b93a4;margin-top:1px}.side-nav{display:flex;flex-direction:column;gap:4px}.side-link{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:transparent;border:0;color:#aab1c0;cursor:pointer;padding:10px 12px;border-radius:10px;font-size:14px;transition:all .15s}.side-link:hover{background:#ffffff0d;color:#fff}.side-link.active{background:linear-gradient(90deg,#4f46e5e6,#2563ebd9);color:#fff;box-shadow:var(--shadow-sm)}.side-step{width:22px;height:22px;border-radius:6px;background:#ffffff14;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}.side-link.active .side-step{background:#ffffff38}.side-projects{margin-top:22px;padding-top:18px;border-top:1px solid var(--sidebar-line);display:flex;flex-direction:column;min-height:0;flex:1}.side-h{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#7f8799;margin-bottom:10px}.proj-name{width:100%;background:#ffffff0f;border:1px solid var(--sidebar-line);color:#fff;border-radius:8px;padding:8px 10px;font-size:13px}.proj-name::placeholder{color:#6b7280}.proj-name:focus{outline:none;border-color:var(--accent);background:#ffffff1a}.proj-actions{display:flex;gap:8px;margin-top:8px}.pj-btn{flex:1;padding:7px;border-radius:8px;border:1px solid var(--sidebar-line);background:#ffffff0f;color:#cdd2dc;cursor:pointer;font-size:13px}.pj-btn:hover{background:#ffffff1f}.pj-btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.pj-btn.primary:hover{background:#4338ca}.pj-status{font-size:11px;margin-top:8px;padding:4px 8px;border-radius:6px}.pj-status.ok{background:#16a34a2e;color:#86efac}.pj-status.err{background:#dc26262e;color:#fca5a5}.proj-list{list-style:none;margin:12px 0 0;padding:0;overflow-y:auto;flex:1}.proj-item{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;cursor:pointer;color:#aab1c0;font-size:13px}.proj-item:hover{background:#ffffff0d;color:#fff}.proj-item.active{background:#4f46e52e;color:#fff}.proj-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}.proj-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.proj-del{background:transparent;border:0;color:#6b7280;cursor:pointer;font-size:16px;line-height:1;opacity:0}.proj-item:hover .proj-del{opacity:1}.proj-del:hover{color:#fca5a5}.proj-empty{color:#6b7280;font-size:12px;padding:8px 10px}.side-foot{margin-top:14px;padding-top:14px;border-top:1px solid var(--sidebar-line);display:flex;flex-direction:column;gap:6px;font-size:11px;color:#6b7280}.builder-pill{align-self:flex-start;background:#ffffff14;color:#cdd2dc;padding:3px 10px;border-radius:20px}.main{flex:1;min-width:0;padding:36px 40px}.main-inner{max-width:1280px;margin:0 auto}.page-head{margin-bottom:22px}.page-head h1{font-size:24px;margin:0;letter-spacing:-.4px}.page-sub{color:var(--text-secondary);margin:6px 0 0;font-size:14px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:22px;margin-bottom:18px;box-shadow:var(--shadow-sm)}.card h3{margin:0 0 14px;font-size:15px}.card h4{margin:18px 0 8px;font-size:13px;color:var(--text-secondary)}.card-head{display:flex;justify-content:space-between;align-items:center}.card-head h3{margin:0}.callout{background:var(--accent-light);border-color:var(--border)}.callout ol{margin:0;padding-left:20px;line-height:1.9}.callout code{background:#fff;padding:1px 6px;border-radius:4px}label{display:block;margin:12px 0 4px;font-size:12px;color:var(--text-secondary)}input,select,textarea{width:100%;border:1px solid var(--border);border-radius:var(--radius);padding:8px 12px;font-size:14px;font-family:var(--font);background:#fff}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #4f46e524}textarea{resize:vertical}textarea.mono{font-family:var(--font-mono);font-size:12.5px;line-height:1.5}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.grid-2 .span-2{grid-column:1 / -1}.check{display:flex;align-items:center;gap:8px;margin:8px 0;font-size:14px;color:var(--text-primary)}.check input{width:auto}.btn-primary{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#fff;border:none;padding:10px 20px;border-radius:var(--radius);cursor:pointer;font-size:14px;font-weight:600;box-shadow:0 6px 16px #4f46e540;transition:transform .12s,box-shadow .12s,opacity .12s}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 20px #4f46e552}.btn-secondary{background:#fff;border:1px solid var(--border);padding:9px 19px;color:var(--text-primary);border-radius:var(--radius);cursor:pointer;font-size:14px;transition:all .12s}.btn-secondary:hover{border-color:var(--accent);color:var(--accent)}.btn-primary:disabled,.btn-secondary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.row-actions{display:flex;align-items:center;gap:12px;margin-top:16px}.mode-toggle{display:flex;gap:8px;margin-bottom:14px}.seg{flex:1;padding:8px;border:1px solid var(--border);background:#fff;border-radius:var(--radius);cursor:pointer;font-size:13px;color:var(--text-secondary)}.seg.active{border-color:var(--accent);color:var(--text-primary);font-weight:600;background:var(--accent-light)}.badge-success{background:var(--success-bg);color:var(--success);padding:3px 10px;border-radius:20px;font-size:12px}.badge-error{background:var(--error-bg);color:var(--error);padding:3px 10px;border-radius:20px;font-size:12px}.badge-loading{background:var(--accent-light);color:var(--text-secondary);padding:3px 10px;border-radius:20px;font-size:12px}.alert-success{background:var(--success-bg);color:var(--success);padding:10px 12px;border-radius:var(--radius);margin-top:12px;font-size:13px}.alert-error{background:var(--error-bg);color:var(--error);padding:10px 12px;border-radius:var(--radius);margin-top:12px;font-size:13px}.alert-warning{background:var(--warning-bg);color:var(--warning);padding:10px 12px;border-radius:var(--radius);margin-top:12px;font-size:13px}.swatch-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.swatch-cell{text-align:center;font-size:11px;min-width:0}.swatch{width:32px;height:32px;border-radius:50%;border:1px solid var(--border);margin:0 auto 4px}.swatch-name{color:var(--text-secondary);max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.swatch-hex{color:var(--text-muted);font-family:var(--font-mono);max-width:100%;overflow:hidden;text-overflow:ellipsis}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:12.5px;table-layout:fixed}th,td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--border);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}td:first-child,th:first-child{max-width:240px}th{color:var(--text-secondary);font-weight:600}.audit{margin-top:14px}.audit-summary{font-size:13px;color:var(--text-primary);background:var(--accent-light);padding:10px 12px;border-radius:var(--radius);margin-bottom:6px}.btn-style{border:1px solid var(--border);border-radius:var(--radius);padding:8px 10px}.btn-style-row{display:flex;align-items:center;gap:6px}.btn-style .sw{width:18px;height:18px;border-radius:4px;border:1px solid var(--border);display:inline-block}.btn-style-label{font-size:12px;font-weight:600}.btn-style-meta{font-size:11px;color:var(--text-muted);font-family:var(--font-mono);margin-top:4px}.sec-flag{display:flex;flex-direction:column;gap:2px;border:1px solid var(--border);border-left-width:4px;border-radius:var(--radius);padding:8px 10px;min-width:170px}.sec-flag.simple{border-left-color:var(--success)}.sec-flag.moderate{border-left-color:var(--warning)}.sec-flag.complex{border-left-color:var(--error);background:var(--error-bg)}.sec-name2{font-size:12px;font-weight:600}.sec-level{font-size:11px;text-transform:uppercase;color:var(--text-secondary);letter-spacing:.5px}.sec-reasons{font-size:11px;color:var(--text-muted)}.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.asset-cell{border:1px solid var(--border);border-radius:var(--radius);padding:8px}.asset-thumb{width:100%;height:84px;object-fit:contain;background:#f3f4f6;border-radius:6px}.asset-name{font-size:11px;font-weight:600;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.asset-meta{font-size:10.5px;color:var(--text-muted);font-family:var(--font-mono);margin-top:2px}.figma-embed{width:100%;height:520px;border:1px solid var(--border);border-radius:var(--radius);background:#fff}.local-fig{background:var(--accent-light);border:1px solid var(--border);border-radius:var(--radius);padding:14px}.local-fig-head{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.manual-tokens{margin-top:16px;padding-top:14px;border-top:1px dashed var(--border)}.link-btn{background:none;border:0;color:var(--accent);cursor:pointer;font-size:13px;padding:0;text-align:left}.link-btn:hover{text-decoration:underline}.frame-picker{margin-top:14px}.frame-chip{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:var(--accent-light);border:1px solid var(--border);border-radius:20px;padding:4px 12px;font-size:12px;cursor:pointer;color:var(--text-secondary)}.frame-chip:hover{border-color:var(--accent);color:var(--text-primary)}.frame-chip.active{border-color:var(--accent);color:var(--text-primary);font-weight:600}.frame-chip:disabled{opacity:.5;cursor:not-allowed}.chip-row{display:flex;flex-wrap:wrap;gap:8px}.spacing-card{border:1px solid var(--border);border-radius:var(--radius);padding:8px 10px;font-size:12px}.spacing-name{color:var(--text-secondary)}.spacing-vals{font-family:var(--font-mono)}.pill{background:var(--accent-light);border-radius:20px;padding:3px 10px;font-size:12px;font-family:var(--font-mono)}.muted{color:var(--text-muted);font-size:13px}.section-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}.section-row .drag{color:var(--text-muted);cursor:grab;-webkit-user-select:none;user-select:none}.section-row .sec-name{flex:1}.section-row select{width:auto;min-width:180px}.btn-x{background:transparent;border:1px solid var(--border);border-radius:var(--radius);width:32px;height:34px;cursor:pointer;color:var(--text-secondary)}.btn-x:disabled{opacity:.4;cursor:not-allowed}.btn-x.sm{width:26px;height:28px;font-size:12px}.section-block{border:1px solid transparent;border-radius:var(--radius);margin-bottom:8px}.btn-img{background:transparent;border:1px solid var(--border);border-radius:var(--radius);height:34px;min-width:44px;padding:0 8px;cursor:pointer;color:var(--text-secondary);font-size:13px}.btn-img.has{border-color:var(--accent);color:var(--text-primary);font-weight:600}.img-panel{background:var(--accent-light);border:1px solid var(--border);border-radius:var(--radius);padding:12px;margin:0 0 8px 24px}.img-panel-head{font-size:12px;color:var(--text-secondary);margin-bottom:10px}.img-slot{display:flex;align-items:center;gap:8px;margin-bottom:8px}.img-role{flex:1;max-width:240px}.img-thumb{width:56px;height:40px;object-fit:cover;border-radius:6px;border:1px solid var(--border)}.img-status{font-size:12px;color:var(--warning)}.img-id{font-size:11px;color:var(--text-muted);font-family:var(--font-mono)}.btn-secondary.sm{padding:5px 12px;font-size:12px}.builder-segs{display:flex;flex-wrap:wrap;gap:8px}.builder-segs .seg{flex:0 0 auto;padding:7px 14px}.img-grid{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:10px}.img-chip{display:flex;flex-direction:column;gap:4px;width:120px}.img-chip .img-thumb{width:120px;height:76px;object-fit:cover;border-radius:8px;border:1px solid var(--border)}.img-chip .img-role{width:100%;font-size:11px;padding:4px 6px}.img-chip .btn-x.sm{width:100%;height:22px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f0f0f73;display:flex;align-items:center;justify-content:center;z-index:100;padding:24px}.modal{background:var(--surface);border-radius:var(--radius-lg);width:100%;max-width:760px;max-height:86vh;display:flex;flex-direction:column;padding:20px}.modal-head{display:flex;justify-content:space-between;align-items:center}.modal-head h3{margin:0}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;overflow-y:auto;margin:12px 0;padding:2px}.media-cell{position:relative;border:2px solid var(--border);border-radius:8px;background:#fff;padding:0;cursor:pointer;overflow:hidden;text-align:center}.media-cell img{width:100%;height:88px;object-fit:cover;display:block}.media-cell.sel{border-color:var(--accent)}.media-name{display:block;font-size:10px;color:var(--text-secondary);padding:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.media-check{position:absolute;top:4px;right:4px;background:var(--accent);color:#fff;width:20px;height:20px;border-radius:50%;font-size:12px;display:flex;align-items:center;justify-content:center}.modal-foot{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid var(--border)}.iter-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.iter-card{border:1px solid var(--border);border-radius:var(--radius);padding:12px;cursor:pointer;transition:border-color .15s}.iter-card:hover{border-color:var(--accent)}.iter-title{font-weight:600;font-size:13px;margin-bottom:6px}.iter-text{font-size:11.5px;color:var(--text-secondary);line-height:1.5}.iter-copy{font-size:11px;color:var(--text-muted);margin-top:8px}.links{display:flex;gap:16px;margin-top:8px}.links a{color:var(--accent);font-weight:600}.foot{text-align:center;color:var(--text-muted);font-size:11px;margin-top:24px}@media (max-width: 640px){.grid-2,.iter-grid{grid-template-columns:1fr}.swatch-grid{grid-template-columns:repeat(4,1fr)}}.side-step.glyph{display:inline-flex;align-items:center;justify-content:center}.proj-folder{flex-shrink:0;color:#6b7280}.proj-item.active .proj-folder,.proj-item:hover .proj-folder{color:var(--accent)}.proj-item.active .proj-folder{color:#a5b4fc}.proj-label{display:flex;flex-direction:column;gap:1px;min-width:0}.proj-when{font-size:10.5px;color:#6b7280}.proj-item.active .proj-when{color:#9aa2b4}.pf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}.pf-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:box-shadow .15s,border-color .15s}.pf-card:hover{box-shadow:var(--shadow);border-color:#d5d9e2}.pf-card.current{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.pf-top{display:flex;align-items:center;gap:13px;cursor:pointer}.pf-icon{color:var(--accent);flex-shrink:0}.pf-id{min-width:0;flex:1}.pf-name{font-size:15.5px;font-weight:650;letter-spacing:-.2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pf-page{font-size:12px;color:var(--text-muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pf-badge{background:var(--accent-light);color:var(--accent);font-size:10.5px;font-weight:650;text-transform:uppercase;letter-spacing:.6px;padding:3px 8px;border-radius:20px;flex-shrink:0}.pf-meta{display:flex;gap:22px;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--border)}.pf-meta dt{font-size:10.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted)}.pf-meta dd{margin:3px 0 0;font-size:12.5px;color:var(--text-secondary)}.pf-pills{display:flex;gap:7px;margin-top:13px}.pf-pill{background:#f2f4f7;color:var(--text-secondary);font-size:11.5px;padding:3px 9px;border-radius:20px}.pf-actions{display:flex;gap:7px;margin-top:16px}.pf-btn{flex:1;padding:8px 10px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text-primary);cursor:pointer;font-size:12.5px;font-family:var(--font);transition:background .15s,border-color .15s}.pf-btn:hover:not(:disabled){background:#f7f8fa;border-color:#d5d9e2}.pf-btn:disabled{opacity:.45;cursor:not-allowed}.pf-btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.pf-btn.primary:hover:not(:disabled){background:#4338ca;border-color:#4338ca}.pf-btn.danger{flex:0 0 auto;color:var(--error)}.pf-btn.danger:hover:not(:disabled){background:var(--error-bg);border-color:#f5c2c2}.pf-btn.small{flex:0 0 auto;padding:5px 12px;font-size:11.5px}.pf-history{margin-top:15px;padding-top:13px;border-top:1px dashed var(--border)}.pf-rev{display:flex;align-items:center;gap:10px;padding:7px 0}.pf-rev+.pf-rev{border-top:1px solid var(--border)}.pf-rev-when{flex:1;min-width:0;display:flex;flex-direction:column}.pf-rev-when span:first-child{font-size:12.5px;color:var(--text-primary)}.pf-rev-ago{font-size:10.5px;color:var(--text-muted)}.pf-rev-sections{font-size:11.5px;color:var(--text-secondary);flex-shrink:0}.pf-rev-empty{font-size:12.5px;color:var(--text-muted);padding:4px 0}.pf-empty{text-align:center;padding:30px 20px;color:var(--text-secondary)}.pf-empty .pf-icon{color:#cdd3de}.pf-empty h3{margin:12px 0 6px;font-size:16px;color:var(--text-primary)}.pf-empty p{margin:0 auto;max-width:430px;font-size:13px;line-height:1.65}.pf-error{background:var(--error-bg);border:1px solid #f5c2c2;color:var(--error);border-radius:var(--radius);padding:10px 13px;margin-bottom:15px;font-size:13px}.pf-trash{padding:0;margin-top:18px;overflow:hidden}.pf-trash-head{display:flex;align-items:center;gap:9px;width:100%;padding:15px 20px;background:transparent;border:0;cursor:pointer;font-family:var(--font);font-size:13.5px;font-weight:600;color:var(--text-primary);text-align:left}.pf-trash-head:hover{background:#f7f8fa}.pf-trash-head svg{color:var(--text-muted)}.pf-trash-count{background:#f2f4f7;color:var(--text-secondary);font-size:11.5px;font-weight:500;padding:2px 8px;border-radius:20px}.pf-trash-chev{margin-left:auto;color:var(--text-muted);font-size:11px}.pf-trash-body{padding:2px 20px 16px;border-top:1px solid var(--border)}.pf-trash-row{display:flex;align-items:center;gap:10px;padding:11px 0}.pf-trash-row+.pf-trash-row{border-top:1px solid var(--border)}.pf-trash-id{flex:1;min-width:0}.pf-trash-name{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pf-trash-when{font-size:11.5px;color:var(--text-muted);margin-top:2px}