body { font-family: 'Inter', ui-sans-serif, system-ui, sans-serif; }
        .card { background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.03); }
        .pill { display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:600; }
        .pill-o  { background:#fff3de;color:#b45309;border:1px solid #ffe0a8; }
        .pill-g  { background:#ecfdf5;color:#047857;border:1px solid #a7f3d0; }
        .pill-b  { background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe; }
        .pill-r  { background:#fef2f2;color:#b91c1c;border:1px solid #fecaca; }
        .pill-gr { background:#f3f4f6;color:#374151;border:1px solid #e5e7eb; }
        .pill-p  { background:#f5f3ff;color:#6d28d9;border:1px solid #ddd6fe; }
        .pill-y  { background:#fefce8;color:#a16207;border:1px solid #fde68a; }
        .pill-t  { background:#f0fdfa;color:#0f766e;border:1px solid #99f6e4; }
        code.inline { background:#f3f4f6;padding:1px 6px;border-radius:4px;font-size:12px; }
        .spin { animation: spin 1s linear infinite; display:inline-block; }
        @keyframes spin { to { transform: rotate(360deg); } }
        details[open] > summary .chev { transform: rotate(90deg); }
        .chev { transition: transform .2s; }
        .switch { position:relative;width:36px;height:20px;display:inline-block; }
        .switch input { opacity:0;width:0;height:0; }
        .switch .track { position:absolute;inset:0;background:#d1d5db;border-radius:999px;cursor:pointer;transition:all .2s; }
        .switch .track:before { content:'';position:absolute;left:2px;top:2px;width:16px;height:16px;background:#fff;border-radius:50%;transition:.2s; }
        .switch input:checked + .track { background:#ffa300; }
        .switch input:checked + .track:before { transform: translateX(16px); }
        /* Table */
        table.grid { width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px; }
        table.grid thead th { background:#fafafa;border-bottom:1px solid #e5e7eb;padding:10px 10px;text-align:left;font-weight:700;color:#374151;white-space:nowrap;position:sticky;top:0;cursor:pointer;user-select:none;z-index:1; }
        table.grid thead th:hover { background:#fff3de; }
        table.grid tbody td { padding:8px 10px;border-bottom:1px solid #f3f4f6;vertical-align:top; }
        table.grid tbody tr:hover { background:#fffbf2; }
        table.grid tbody tr.grouped { background:#fafafa; font-weight:600; }
        .truncate-cell { max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
        .tabbtn.active { color:#ffa300;border-color:#ffa300; }
        .progress-bar { transition: width .3s; }
        .preview-input { width:100%;border:none;background:transparent;padding:4px 2px;font-family:ui-monospace, SFMono-Regular, Menlo, monospace;font-size:12.5px; }
        .preview-input:focus { outline:2px solid #ffa300;background:#fff; border-radius:3px; }
        .kind-tag { display:inline-block;padding:1px 7px;border-radius:4px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em; }
        .kind-exact    { background:#fff3de;color:#b45309; }
        .kind-typo     { background:#eff6ff;color:#1d4ed8; }
        .kind-homo     { background:#f5f3ff;color:#6d28d9; }
        .kind-phon     { background:#f0fdfa;color:#0f766e; }
        .kind-hyphen   { background:#f3f4f6;color:#374151; }
        .kind-pad      { background:#fefce8;color:#a16207; }
        .kind-bitsquat { background:#fef2f2;color:#b91c1c; }
        .kind-combo    { background:#ecfdf5;color:#047857; }
        .kind-custom   { background:#fde68a;color:#78350f; }
        .page-btn { padding:4px 10px;border:1px solid #e5e7eb;border-radius:4px;font-size:12px;cursor:pointer;background:#fff; }
        .page-btn:hover:not(:disabled) { border-color:#ffa300;color:#ffa300; }
        .page-btn:disabled { opacity:.35;cursor:not-allowed; }
        .page-btn.active { background:#ffa300;color:#fff;border-color:#ffa300;font-weight:700; }
        @media print { nav, #inputCard, #previewCard, .no-print { display:none !important; } }