:root{--bg:#f7f9fc;--surface:#fff;--surface-soft:#f1f5f9;--border:#d9e1ec;--text:#132238;--muted:#60708a;--accent:#1d66d9;--accent-soft:#e8f1ff;--success:#138a52;--success-bg:#def7e9;--warning:#9a6811;--warning-bg:#fff2cc;--danger:#c0333a;--danger-bg:#ffe1e5;--shadow:0 12px 30px #27354b14}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);letter-spacing:0;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans Thai,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.62}.center-screen,.login-screen{place-items:center;min-height:100vh;padding:24px;display:grid}.login-panel{background:var(--surface);border:1px solid var(--border);width:min(430px,100%);box-shadow:var(--shadow);border-radius:8px;padding:28px}.login-panel h1{margin:16px 0 6px;font-size:26px;line-height:1.2}.login-panel p{color:var(--muted);margin:0 0 22px}.brand-mark{background:var(--accent);color:#fff;border-radius:8px;place-items:center;width:42px;height:42px;font-weight:800;display:grid}.login-form,.form-grid{gap:14px;display:grid}label{color:var(--muted);text-transform:none;gap:7px;font-size:13px;font-weight:700;display:grid}input,select,textarea{border:1px solid var(--border);width:100%;min-height:40px;color:var(--text);background:#fff;border-radius:7px;outline:none;padding:9px 11px}textarea{resize:vertical;min-height:88px}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.app-shell{grid-template-columns:260px 1fr;min-height:100vh;display:grid}.sidebar{border-right:1px solid var(--border);background:#f8fbff;flex-direction:column;gap:24px;padding:18px 14px;display:flex}.brand-row{grid-template-columns:42px 1fr;align-items:center;gap:12px;display:grid}.brand-row strong{font-size:18px;display:block}.brand-row span,.user-pill small,td small{color:var(--muted);font-size:12px;line-height:1.45;display:block}.nav-list{gap:8px;display:grid}.nav-button,.ghost-button,.secondary-button,.primary-button,.danger-button,.link-button,.icon-button,.toast{border:0;border-radius:7px;justify-content:center;align-items:center;gap:8px;min-height:38px;padding:8px 12px;font-size:14px;font-weight:750;display:inline-flex}.nav-button{color:#34465f;background:0 0;justify-content:flex-start}.nav-button svg,.ghost-button svg,.secondary-button svg,.primary-button svg,.danger-button svg,.link-button svg{flex:none;width:17px;height:17px}.nav-button.active{color:var(--accent);background:var(--accent-soft)}.sidebar-footer{gap:12px;margin-top:auto;display:grid}.user-pill{border:1px solid var(--border);background:#fff;border-radius:8px;padding:12px}.user-pill span{font-weight:800;display:block}.workspace{grid-template-rows:auto 1fr;min-width:0;display:grid}.topbar{border-bottom:1px solid var(--border);background:var(--surface);align-items:center;gap:14px;min-height:70px;padding:14px 20px;display:flex}.global-search{width:min(700px,100%);color:var(--muted);grid-template-columns:20px 1fr;align-items:center;gap:8px;display:grid}.global-search input{box-shadow:none;border:0;padding-left:0}.content-grid{grid-template-columns:minmax(0,1fr) 390px;gap:16px;min-width:0;padding:20px;display:grid}.main-pane,.detail-pane,.panel,.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:8px}.main-pane{min-width:0;padding:18px}.detail-pane{min-width:0;overflow:hidden}.section-heading{justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px;display:flex}h1,h2,h3,p{margin-top:0}h1{margin-bottom:5px;font-size:28px;line-height:1.15}h2{font-size:18px;line-height:1.25}h3{margin-bottom:12px;font-size:15px}.section-heading p{color:var(--muted);margin-bottom:0}.stat-grid,.quality-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px;display:grid}.stat-card{grid-template-columns:38px 1fr;align-items:center;gap:12px;padding:16px;display:grid}.stat-button{width:100%;min-height:92px;color:var(--text);text-align:left}.stat-button:hover,.stat-button.selected{border-color:var(--accent);background:#eef6ff}.stat-card svg{color:var(--accent)}.stat-card.success svg{color:var(--success)}.stat-card.warning svg{color:var(--warning)}.stat-card.danger svg{color:var(--danger)}.stat-card strong{font-size:26px;line-height:1;display:block}.stat-card span{color:var(--muted);margin-top:6px;font-size:13px;font-weight:700;display:block}.issue-card-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin-bottom:12px;display:grid}.issue-card{border:1px solid var(--border);min-height:74px;color:var(--text);text-align:left;cursor:pointer;background:#fff;border-radius:8px;padding:12px}.issue-card:hover,.issue-card.selected{border-color:var(--accent);background:#eef6ff}.issue-card strong{font-size:24px;line-height:1;display:block}.issue-card span{color:var(--muted);margin-top:8px;font-size:13px;font-weight:750;display:block}.panel{padding:16px}.panel-title{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.panel-title h2{margin:0}.panel-title span{color:var(--muted);font-size:13px;font-weight:700}.issue-list{gap:8px;display:grid}.issue-list button{border:1px solid var(--border);text-align:left;background:#fff;border-radius:7px;grid-template-columns:78px 70px 1fr;align-items:center;gap:10px;padding:10px;display:grid}.filter-row{flex-wrap:wrap;gap:10px;margin-bottom:12px;display:flex}.filter-row select{width:auto;min-width:160px}.filter-row label{min-width:180px}.multi-filter{border:1px solid var(--border);background:#fff;border-radius:8px;flex-wrap:wrap;align-items:center;gap:8px;min-width:220px;max-width:100%;margin:0;padding:8px 10px;display:flex}.multi-filter legend{color:var(--muted);padding:0 4px;font-size:12px;font-weight:750}.filter-chip{border:1px solid var(--border);min-height:28px;color:var(--text);cursor:pointer;background:#fff;border-radius:999px;padding:4px 10px;font-weight:750}.filter-chip.active{border-color:var(--primary);color:var(--primary);background:#eaf1ff}.filter-check{white-space:nowrap;min-width:0!important}.temporal-summary{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:12px;display:flex}.temporal-summary span{color:var(--muted);font-size:13px;font-weight:750}.table-wrap{border:1px solid var(--border);border-radius:8px;overflow:auto}table{border-collapse:collapse;width:100%;font-size:13px}th,td{border-bottom:1px solid var(--border);text-align:left;vertical-align:middle;padding:12px}th{z-index:1;background:var(--surface-soft);color:#3d4d65;font-size:12px;position:sticky;top:0}.table-sort-button{min-height:0;color:inherit;text-align:left;background:0 0;border:0;padding:0;font-size:12px;font-weight:850}tbody tr{background:#fff}tbody tr:hover,tbody tr.selected{background:#eef6ff}.code-cell{color:#254466;white-space:nowrap;font-weight:800}.name-cell{overflow-wrap:anywhere;min-width:250px;max-width:440px}.badge{white-space:nowrap;border-radius:6px;align-items:center;min-height:24px;padding:3px 8px;font-size:12px;font-weight:800;display:inline-flex}.badge.success{color:var(--success);background:var(--success-bg)}.badge.warning{color:var(--warning);background:var(--warning-bg)}.badge.danger{color:var(--danger);background:var(--danger-bg)}.badge.muted{color:var(--muted);background:var(--surface-soft)}.severity{border-radius:6px;align-items:center;width:max-content;min-height:24px;padding:3px 8px;font-size:12px;font-weight:800;display:inline-flex}.severity.critical{color:var(--danger);background:var(--danger-bg)}.severity.warning{color:var(--warning);background:var(--warning-bg)}.severity.info{color:var(--muted);background:var(--surface-soft)}.detail-header{border-bottom:1px solid var(--border);padding:18px}.client-code{background:var(--surface-soft);color:#33465f;border-radius:6px;padding:4px 8px;font-size:12px;font-weight:850;display:inline-flex}.detail-header h2{overflow-wrap:anywhere;margin:10px 0}.detail-status-row{flex-wrap:wrap;gap:8px;display:flex}.tab-row{border-bottom:1px solid var(--border);grid-template-columns:repeat(5,1fr);display:grid}.tab-row button{min-height:46px;color:var(--muted);background:#fff;border:0;font-size:13px;font-weight:800}.tab-row button.active{color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}.detail-section{gap:12px;padding:16px;display:grid}.section-actions,.record-actions{flex-wrap:wrap;gap:8px;display:flex}.field-row{grid-template-columns:128px minmax(0,1fr);align-items:start;gap:10px;font-size:13px;display:grid}.field-row span{color:var(--muted)}.field-row strong{overflow-wrap:anywhere}.field-row.wide-field{border:1px solid var(--border);background:var(--surface-soft);border-radius:7px;grid-template-columns:1fr;gap:4px;padding:10px}.record-card{border:1px solid var(--border);border-radius:8px;gap:10px;padding:12px;display:grid}.timeline-group{gap:10px;display:grid}.timeline-group h4{color:#33465f;margin:8px 0 0;font-size:13px}.record-card>div:first-child strong,.record-card>div:first-child span{display:block}.record-card>div:first-child span{color:var(--muted);margin-top:3px;font-size:12px}.source-link{color:var(--accent);font-weight:800}.primary-button{background:var(--accent);color:#fff}.secondary-button{border:1px solid var(--border);color:#2c4059;background:#fff}.danger-button{background:var(--danger);color:#fff}.ghost-button{color:#33465f;background:0 0;justify-content:flex-start}.link-button{min-height:0;color:var(--accent);background:0 0;justify-content:flex-start;padding:0}.link-button.danger,.danger-soft{color:var(--danger)}.full,.wide{width:100%}.icon-button{border:1px solid var(--border);width:34px;height:34px;color:var(--muted);background:#fff;padding:0}.error-banner,.toast{justify-content:flex-start;margin:12px 20px 0}.error-banner{background:var(--danger-bg);color:var(--danger);border-radius:7px;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;font-size:13px;font-weight:800;display:flex}.error-banner .icon-button{width:28px;height:28px;color:var(--danger);background:#ffffffa6;border-color:#b91c1c38;flex:none}.toast{z-index:10;background:var(--text);color:#fff;box-shadow:var(--shadow);position:fixed;bottom:24px;right:24px}.error-text{color:var(--danger);font-size:13px;font-weight:800}.empty-state{color:var(--muted);text-align:center;margin:0;padding:18px}.modal-backdrop{z-index:20;background:#0a142373;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-panel{border:1px solid var(--border);background:#fff;border-radius:8px;width:min(680px,100%);max-height:min(760px,100vh - 40px);padding:18px;overflow:auto;box-shadow:0 24px 60px #040f2340}.modal-panel header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.modal-panel h2{margin:0}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid .wide,.form-grid .check-control,.confirm-copy{grid-column:1/-1}.check-control{color:var(--text);align-items:center;gap:8px;font-size:13px;display:inline-flex}.check-control input{width:16px;min-height:16px}.confirm-copy{background:var(--surface-soft);border:1px solid var(--border);color:var(--muted);border-radius:8px;gap:4px;padding:12px;font-size:13px;display:grid}.confirm-copy strong{color:var(--text)}.dbd-lookup-row{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;display:grid}.dbd-lookup-row .secondary-button{white-space:nowrap;min-height:40px}.help-text{color:var(--muted);margin:-4px 0 0;font-size:13px;line-height:1.55}.segmented-control{border:1px solid var(--border);background:#fff;border-radius:8px;padding:3px;display:inline-flex}.segmented-control button{min-height:34px;color:var(--muted);background:0 0;border:0;border-radius:6px;padding:0 12px}.segmented-control button.active{background:var(--accent);color:#fff}.row-actions{flex-wrap:wrap;gap:10px;display:flex}.confirm-stack{gap:16px;display:grid}.spin{animation:.85s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:1180px){.app-shell{grid-template-columns:86px 1fr}.brand-row{grid-template-columns:1fr}.brand-row div:last-child,.nav-button{font-size:0}.nav-button svg{width:20px;height:20px}.content-grid{grid-template-columns:1fr}.detail-pane{min-height:420px}}@media (max-width:760px){.app-shell{grid-template-columns:1fr}.sidebar{z-index:5;flex-direction:row;align-items:center;position:sticky;top:0;overflow-x:auto}.nav-list{grid-auto-columns:max-content;grid-auto-flow:column}.sidebar-footer{display:none}.topbar{flex-wrap:wrap}.content-grid,.main-pane{padding:12px}.stat-grid,.quality-summary,.form-grid,.dbd-lookup-row,.field-row{grid-template-columns:1fr}}