:root{color:#102033;background:#f4f7fb;font-family:Noto Sans Thai,Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}*{box-sizing:border-box;margin:0}body{margin:0}button{color:#fff;cursor:pointer;background:#2563eb;border:0;border-radius:10px;padding:.6rem 1.1rem;font-size:.88rem;font-weight:600;transition:background .15s}button:hover{background:#1d4ed8}button:disabled{opacity:.45;cursor:not-allowed}button.secondary{background:#334155}button.secondary:hover{background:#1e293b}button.sm{padding:.35rem .7rem;font-size:.8rem}button.green{background:#16a34a}button.green:hover{background:#15803d}button.icon-btn{color:#64748b;background:0 0;padding:.3rem .5rem;font-size:1.2rem}button.icon-btn:hover{color:#0f172a;background:#f1f5f9}input,textarea,select{width:100%;font:inherit;background:#fff;border:1px solid #d7deea;border-radius:10px;margin-bottom:.8rem;padding:.7rem}textarea{resize:vertical;min-height:100px}label{color:#475569;margin-bottom:.3rem;font-size:.85rem;font-weight:600;display:block}code{color:#3730a3;background:#eef2ff;border-radius:6px;padding:2px 6px;font-size:.85em}.shell{width:min(1200px,100% - 32px);margin:0 auto;padding:20px 0 60px}.topbar{flex-wrap:wrap;align-items:center;gap:16px;margin-bottom:24px;display:flex}.logo{color:#0f172a;align-items:center;gap:8px;font-size:1.15rem;font-weight:800;display:flex}.logo-icon{font-size:1.5rem}.tabs{flex:1;gap:4px;display:flex}.tab{color:#475569;background:0 0;border-radius:8px;padding:.5rem .9rem;font-weight:500}.tab:hover{color:#0f172a;background:#e2e8f0}.tab.active{color:#fff;background:#0f172a}.content{min-height:400px}.content h3{color:#1e293b;margin:24px 0 10px;font-size:1rem}.stats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;margin-bottom:24px;display:grid}.stat-card{text-align:center;background:#fff;border:1px solid #e1e7f0;border-radius:16px;padding:18px 20px;box-shadow:0 4px 20px #0f172a0a}.stat-card.highlight{background:#fffbeb;border-color:#fbbf24}.stat-num{color:#0f172a;font-size:2rem;font-weight:800;display:block}.stat-card.highlight .stat-num{color:#d97706}.stat-label{color:#64748b;font-size:.82rem;font-weight:500}table{border-collapse:collapse;background:#fff;border:1px solid #e1e7f0;border-radius:14px;width:100%;margin-bottom:20px;overflow:hidden;box-shadow:0 4px 20px #0f172a0a}thead{background:#f8fafc}th{text-align:left;color:#64748b;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid #e2e8f0;padding:12px 14px;font-size:.8rem;font-weight:700}td{vertical-align:middle;border-bottom:1px solid #f1f5f9;padding:12px 14px;font-size:.9rem}tr:hover td{background:#f8fafc}td.truncate{text-overflow:ellipsis;white-space:nowrap;max-width:220px;overflow:hidden}.badge{text-transform:uppercase;letter-spacing:.03em;border-radius:20px;padding:3px 10px;font-size:.75rem;font-weight:700;display:inline-block}.badge.green{color:#14532d;background:#dcfce7}.badge.yellow{color:#713f12;background:#fef9c3}.badge.gray{color:#475569;background:#f1f5f9}.tab-bar{align-items:center;gap:10px;margin-bottom:16px;display:flex}.modal-overlay{z-index:100;background:#0f172a66;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:20px;width:min(520px,100% - 32px);max-height:80vh;overflow-y:auto;box-shadow:0 25px 100px #0f172a33}.modal-header{border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;padding:18px 22px;display:flex}.modal-header h2{font-size:1.1rem}.modal-body{padding:22px}.modal-body button{width:100%;margin-top:10px}.notice{color:#14532d;background:#dcfce7;border:1px solid #86efac;border-radius:12px;margin-bottom:18px;padding:12px 18px;font-size:.9rem;font-weight:600}.connect-box{text-align:center;max-width:520px;margin:80px auto}.connect-box h1{margin:.5rem 0;font-size:2rem}.connect-box p{margin:.5rem 0}.connect-box button{margin-top:18px}.btn-group{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.btn-group button{flex:1;min-width:100px}.check-row{gap:16px;margin-bottom:10px;display:flex}.check{align-items:center;gap:4px;font-weight:400;display:flex}.check input{width:auto;margin:0}.muted{color:#64748b;font-size:.88rem}@media (width<=768px){.topbar{flex-direction:column;align-items:flex-start}.tabs{width:100%;overflow-x:auto}table{font-size:.82rem}th,td{padding:8px 10px}}