:root{--c-bg:#f6f7f9;--c-surface:#fff;--c-border:#dfe3e8;--c-text:#1c2530;--c-muted:#6b7784;--c-primary:#1f6b4a;--c-primary-dark:#185339;--c-primary-soft:#e7f2ec;--c-danger:#b3261e;--c-danger-soft:#fdecea;--c-warn:#8a5a00;--c-warn-soft:#fff4e0;--c-info-soft:#e8f0fe;--radius:10px;--shadow:0 1px 2px #1018280f, 0 1px 3px #1018281a}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--c-bg);color:var(--c-text);font-family:IBM Plex Sans Thai,Sarabun,Noto Sans Thai,system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.6}a{color:var(--c-primary)}.app-shell{min-height:100%;display:flex}.sidebar{background:var(--c-surface);border-right:1px solid var(--c-border);flex-direction:column;flex:0 0 232px;gap:4px;width:232px;padding:20px 12px;display:flex}.sidebar-brand{color:var(--c-primary);padding:0 12px 16px;font-size:16px;font-weight:700;line-height:1.3}.nav-link{color:var(--c-text);border-radius:8px;padding:9px 12px;font-size:14.5px;text-decoration:none;display:block}.nav-link:hover{background:var(--c-bg)}.nav-link.active{background:var(--c-primary-soft);color:var(--c-primary-dark);font-weight:600}.sidebar-footer{border-top:1px solid var(--c-border);color:var(--c-muted);margin-top:auto;padding:14px 12px 0;font-size:13px}.content{flex:1;min-width:0;max-width:1240px;padding:28px 32px}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.page-head h1{margin:0;font-size:23px}.page-head p{color:var(--c-muted);margin:4px 0 0;font-size:14px}.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 20px}.card+.card{margin-top:16px}.card h2{margin:0 0 14px;font-size:16px}.grid{gap:16px;display:grid}.grid-4{grid-template-columns:repeat(auto-fit,minmax(196px,1fr))}.grid-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.stat-label{color:var(--c-muted);font-size:13px}.stat-value{margin-top:2px;font-size:28px;font-weight:700;line-height:1.25}.stat-sub{color:var(--c-muted);margin-top:2px;font-size:12.5px}.stat-value.warn{color:var(--c-warn)}.stat-value.danger{color:var(--c-danger)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;border-bottom:1px solid var(--c-border);vertical-align:middle;white-space:nowrap;padding:10px 12px}th{color:var(--c-muted);background:#fafbfc;font-size:13px;font-weight:600}tbody tr:hover{background:#fafbfc}td.wrap,th.wrap{white-space:normal}.row-link{color:var(--c-primary);font-weight:500;text-decoration:none}.row-link:hover{text-decoration:underline}.field{margin-bottom:14px}.field label{margin-bottom:5px;font-size:13.5px;font-weight:600;display:block}.field .hint{color:var(--c-muted);margin-top:4px;font-size:12.5px}input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],input[type=search],select,textarea{border:1px solid var(--c-border);width:100%;font:inherit;color:inherit;background:#fff;border-radius:8px;padding:8px 11px}input:focus,select:focus,textarea:focus{outline:2px solid var(--c-primary-soft);border-color:var(--c-primary)}input[aria-invalid=true]{border-color:var(--c-danger)}textarea{resize:vertical;min-height:84px}.form-row{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;display:grid}.checkbox{align-items:flex-start;gap:9px;font-size:14px;display:flex}.checkbox input{flex:none;width:auto;margin-top:4px}button,.btn{font:inherit;cursor:pointer;background:var(--c-primary);color:#fff;border:1px solid #0000;border-radius:8px;padding:8px 16px;font-weight:600;text-decoration:none;display:inline-block}button:hover:not(:disabled),.btn:hover{background:var(--c-primary-dark)}button:disabled{opacity:.55;cursor:not-allowed}button.secondary,.btn.secondary,button.ghost,.btn.ghost{color:var(--c-text);border-color:var(--c-border);background:#fff}button.secondary:hover:not(:disabled),button.ghost:hover:not(:disabled),.btn.ghost:hover{background:var(--c-bg)}button.danger{background:var(--c-danger)}button.danger:hover:not(:disabled){background:#8f1e18}button.link{color:var(--c-primary);background:0 0;border:none;padding:0;font-weight:500}button.link:hover{background:0 0;text-decoration:underline}.btn-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.badge{background:var(--c-bg);color:var(--c-muted);border:1px solid var(--c-border);white-space:nowrap;border-radius:999px;padding:2px 9px;font-size:12.5px;font-weight:600;display:inline-block}.badge.green{background:var(--c-primary-soft);color:var(--c-primary-dark);border-color:#bfdcce}.badge.amber{background:var(--c-warn-soft);color:var(--c-warn);border-color:#f0d9a8}.badge.red{background:var(--c-danger-soft);color:var(--c-danger);border-color:#f2c0bc}.badge.blue{background:var(--c-info-soft);color:#17458c;border-color:#c3d5f5}.alert{border:1px solid;border-radius:8px;margin-bottom:14px;padding:11px 14px;font-size:14px}.alert.error{background:var(--c-danger-soft);color:var(--c-danger);border-color:#f2c0bc}.alert.success{background:var(--c-primary-soft);color:var(--c-primary-dark);border-color:#bfdcce}.alert.info{background:var(--c-info-soft);color:#17458c;border-color:#c3d5f5}.alert.warn{background:var(--c-warn-soft);color:var(--c-warn);border-color:#f0d9a8}.empty{text-align:center;color:var(--c-muted);padding:42px 16px;font-size:14.5px}.muted{color:var(--c-muted)}.small{font-size:13px}.mono{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:13px}.login-page{justify-content:center;align-items:center;min-height:100%;padding:24px;display:flex}.login-card{width:100%;max-width:388px}.login-card h1{margin:0 0 4px;font-size:20px}.toolbar{flex-wrap:wrap;align-items:flex-end;gap:10px;margin-bottom:16px;display:flex}.toolbar .field{min-width:168px;margin-bottom:0}.toolbar .grow{flex:240px}.detail-list{grid-template-columns:168px 1fr;gap:9px 16px;font-size:14px;display:grid}.detail-list dt{color:var(--c-muted)}.detail-list dd{margin:0}.modal-backdrop{z-index:50;background:#10182873;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{border-radius:var(--radius);background:#fff;width:100%;max-width:520px;max-height:88vh;padding:22px;overflow-y:auto}.modal h2{margin-top:0}@media (width<=860px){.app-shell{flex-direction:column}.sidebar{flex-flow:wrap;flex:none;width:100%;padding:12px}.sidebar-brand{width:100%;padding-bottom:8px}.sidebar-footer{width:100%;margin-top:8px}.content{padding:18px 16px}.detail-list{grid-template-columns:1fr;gap:2px 0}.detail-list dt{margin-top:8px}}