:root{color-scheme:light only;--color-bg: #f8fafc;--color-surface: #ffffff;--color-border: #e2e8f0;--color-border-strong: #cbd5e1;--color-text: #0f172a;--color-text-muted: #475569;--color-text-subtle: #64748b;--color-primary: #4f46e5;--color-primary-hover: #4338ca;--color-primary-bg: #eef2ff;--color-good-bg: #dcfce7;--color-good-text: #15803d;--color-good-border: #86efac;--color-fair-bg: #fef3c7;--color-fair-text: #92400e;--color-fair-border: #fcd34d;--color-bad-bg: #fee2e2;--color-bad-text: #b91c1c;--color-bad-border: #fca5a5;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .04), 0 1px 1px rgba(15, 23, 42, .03);--shadow-md: 0 8px 24px rgba(15, 23, 42, .06), 0 2px 6px rgba(15, 23, 42, .04);--font-heading: "Prompt", "IBM Plex Sans Thai", system-ui, sans-serif;--font-body: "IBM Plex Sans Thai", "Prompt", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);-webkit-font-smoothing:antialiased}body{padding:2rem 1.5rem 4rem}#app{max-width:1180px;margin:0 auto}.app-header{margin-bottom:1.5rem}h1{font-family:var(--font-heading);font-weight:700;font-size:1.875rem;letter-spacing:-.01em;margin:0 0 .35rem;color:var(--color-text)}.meta{color:var(--color-text-muted);font-size:.9rem;margin:0}.meta code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.controls{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:1rem 1.25rem;margin:1.25rem 0}.controls input,.controls select{font-family:var(--font-body);padding:.55rem .8rem;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);font-size:.9rem;color:var(--color-text);background:var(--color-surface);transition:border-color .2s ease,box-shadow .2s ease}.controls input::placeholder{color:var(--color-text-subtle)}.controls input:focus-visible,.controls select:focus-visible,.controls button:focus-visible,.expand-btn:focus-visible{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-bg)}.controls button{font-family:var(--font-body);font-weight:500;padding:.55rem .9rem;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);cursor:pointer;font-size:.9rem;transition:background-color .2s ease,border-color .2s ease}.controls button:hover{background:#f1f5f9;border-color:var(--color-border-strong)}.controls label{display:flex;align-items:center;gap:.45rem;font-size:.9rem;color:var(--color-text-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.controls input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--color-primary);cursor:pointer}.table-scroll{overflow-x:auto;border-radius:var(--radius-md);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);background:var(--color-surface)}table{width:100%;border-collapse:collapse;min-width:720px}th,td{padding:.7rem 1rem;text-align:left;font-size:.875rem;border-bottom:1px solid var(--color-border);vertical-align:middle}thead th{position:sticky;top:0;background:var(--color-surface);font-family:var(--font-heading);font-weight:600;font-size:.8rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;border-bottom:1px solid var(--color-border-strong)}tbody tr.row-main{cursor:pointer;transition:background-color .15s ease}tbody tr.row-main:hover{background:#f8fafc}tbody tr:last-child td{border-bottom:none}.mobile-no{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:500;letter-spacing:.01em}.score{display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;font-weight:600;font-size:.85rem;border-radius:999px;padding:.2rem .65rem;border:1px solid transparent}.score.high{background:var(--color-good-bg);color:var(--color-good-text);border-color:var(--color-good-border)}.score.mid{background:var(--color-fair-bg);color:var(--color-fair-text);border-color:var(--color-fair-border)}.score.low{background:var(--color-bad-bg);color:var(--color-bad-text);border-color:var(--color-bad-border)}.grade-text{font-weight:500;text-transform:capitalize}.tags{display:flex;gap:.35rem;flex-wrap:wrap}.tag{font-size:.75rem;font-weight:600;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;padding:.15rem .5rem;border-radius:6px;border:1px solid transparent}.tag.pair-green{background:var(--color-good-bg);color:var(--color-good-text);border-color:var(--color-good-border)}.tag.pair-yellow{background:var(--color-fair-bg);color:var(--color-fair-text);border-color:var(--color-fair-border)}.tag.pair-red{background:var(--color-bad-bg);color:var(--color-bad-text);border-color:var(--color-bad-border)}.expand-btn{border:none;background:none;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;border-radius:6px;color:var(--color-text-subtle);transition:background-color .15s ease,color .15s ease,transform .15s ease}.expand-btn:hover{background:var(--color-primary-bg);color:var(--color-primary)}.expand-btn svg{width:16px;height:16px;transition:transform .15s ease}.expand-btn[data-open=true] svg{transform:rotate(90deg)}.row-detail td{background:#f8fafc;padding:1rem 1.25rem}.pagination{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:.9rem;font-size:.85rem;color:var(--color-text-muted)}.pagination-controls{display:flex;align-items:center;gap:.5rem}.pagination-controls select,.pagination-controls button{font-family:var(--font-body);font-size:.85rem;padding:.4rem .7rem;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.pagination-controls button:hover:not(:disabled){background:#f1f5f9}.pagination-controls button:disabled{cursor:not-allowed;color:var(--color-text-subtle);opacity:.6}.ext-card{padding:.85rem 0;border-bottom:1px solid var(--color-border)}.ext-card:last-child{border-bottom:none}.ext-card-title{font-family:var(--font-heading);font-weight:600;font-size:.9rem;color:var(--color-text);margin-bottom:.4rem;display:block}.ext-fields{display:flex;gap:1.25rem;flex-wrap:wrap;font-size:.85rem;color:var(--color-text-muted);margin:.2rem 0 .5rem}.ext-fields b{color:var(--color-text);font-weight:600}.ext-card .tags{margin-top:.25rem}.ext-empty{color:var(--color-text-subtle);font-size:.85rem;margin:0}.empty{margin:2.5rem 0;padding:2.5rem;text-align:center;color:var(--color-text-muted);background:var(--color-surface);border:1px dashed var(--color-border-strong);border-radius:var(--radius-md)}code{background:#eef2f7;color:var(--color-text);padding:.1rem .4rem;border-radius:5px;font-size:.85em}@media (prefers-reduced-motion: reduce){*{transition:none!important}}