:root{--bg: var(--figma-color-bg, #ffffff);--bg-2: var(--figma-color-bg-secondary, #f5f5f5);--bg-3: var(--figma-color-bg-tertiary, #ebebeb);--text: var(--figma-color-text, #1a1a1a);--text-2: var(--figma-color-text-secondary, #6b6b6b);--border: var(--figma-color-border, #e0e0e0);--brand: var(--figma-color-bg-brand, #0d99ff);--brand-text: var(--figma-color-text-onbrand, #ffffff);--danger: var(--figma-color-text-danger, #d92b2b);--warn: #b25e00;--radius: 6px;--pad: 12px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:11px/1.45 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}.app{display:flex;flex-direction:column;height:100%;overflow:hidden}.topbar{display:flex;align-items:center;gap:8px;padding:10px var(--pad);border-bottom:1px solid var(--border);flex:0 0 auto}.topbar h1{font-size:12px;font-weight:600;margin:0;flex:1}.scroll{flex:1 1 auto;overflow-y:auto;padding:var(--pad)}.footer{flex:0 0 auto;border-top:1px solid var(--border);padding:10px var(--pad);display:flex;gap:8px;align-items:center}button{font:inherit;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:var(--radius);padding:6px 11px;cursor:pointer;white-space:nowrap}button:hover:not(:disabled){background:var(--bg-2)}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--brand);border-color:var(--brand);color:var(--brand-text);font-weight:500}button.primary:hover:not(:disabled){filter:brightness(1.08)}button.ghost{border-color:transparent;background:transparent;padding:4px 6px;color:var(--text-2)}button.ghost:hover:not(:disabled){background:var(--bg-2);color:var(--text)}input[type=text],input[type=number],select{font:inherit;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:5px 7px;width:100%;min-width:0}input:focus,select:focus{outline:1px solid var(--brand);border-color:var(--brand)}label.field{display:block;margin-bottom:10px}label.field>span{display:block;color:var(--text-2);margin-bottom:4px}.row{display:flex;gap:8px;align-items:center}.stack{display:flex;flex-direction:column;gap:8px}.card{border:1px solid var(--border);border-radius:var(--radius);padding:10px;background:var(--bg)}.muted{color:var(--text-2)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px}.section-title{font-weight:600;margin:16px 0 8px}.section-title:first-child{margin-top:0}.notice{border-radius:var(--radius);padding:10px;border:1px solid var(--border);background:var(--bg-2)}.notice.warn{border-color:var(--warn);color:var(--warn);background:transparent}.notice.error{border-color:var(--danger);color:var(--danger);background:transparent}.empty{text-align:center;padding:40px 20px;color:var(--text-2)}.empty strong{display:block;color:var(--text);margin-bottom:4px;font-size:12px}.progress{height:3px;background:var(--bg-3);border-radius:2px;overflow:hidden}.progress>div{height:100%;background:var(--brand);transition:width .12s linear}.badge{display:inline-block;padding:1px 5px;border-radius:3px;background:var(--bg-3);color:var(--text-2);font-size:10px}.badge.warn{background:transparent;border:1px solid var(--warn);color:var(--warn)}.swatch{width:34px;height:34px;border-radius:4px;border:1px solid var(--border);flex:0 0 auto}table.grid{width:100%;border-collapse:collapse}table.grid th{text-align:left;font-weight:500;color:var(--text-2);padding:4px 6px;border-bottom:1px solid var(--border)}table.grid td{padding:4px 6px;border-bottom:1px solid var(--border);vertical-align:middle}
