:root{--primary: #0284C7;--primary-light: #38BDF8;--ink: #0F1B2D;--success: #16A34A;--success-text: #15803D;--success-bg: #F0FBF4;--success-border: #C7EBD3;--warning: #E8A33D;--warning-text: #B45309;--warning-bg: #FFF8EB;--warning-border: #F3DFB6;--danger: #DC2626;--danger-bg: #FDECEC;--text-2: #475569;--text-3: #64748B;--text-4: #94A3B8;--border: #E2E8F0;--surface: #F4F6F9;--bg-app: #EEF1F5;--bg-screen: #E9EDF2;--font-sans: "IBM Plex Sans", "IBM Plex Sans Thai", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, monospace;--grad-primary: linear-gradient(135deg, #38BDF8, #0284C7)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:var(--font-sans);color:var(--ink);background:var(--bg-screen)}button,input,select{font-family:inherit}input::placeholder{color:#94a3b8}a{-webkit-tap-highlight-color:transparent}@keyframes tm-ping{0%{transform:scale(.6);opacity:.7}to{transform:scale(2.4);opacity:0}}@keyframes tm-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes tm-pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.08)}to{transform:scale(1);opacity:1}}@keyframes tm-slidein{0%{transform:translate(40px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes tm-fadein{0%{opacity:0}to{opacity:1}}@keyframes tm-toast{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}.hov-lift{transition:transform .15s,box-shadow .15s}.hov-lift:hover{transform:translateY(-1px)}.btn-primary{transition:transform .15s,box-shadow .15s}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 16px 28px #1b4db166!important}.btn-dark{transition:transform .15s,background .15s}.btn-dark:hover{transform:translateY(-1px)}.btn-export{transition:transform .15s,background .15s}.btn-export:hover{background:#15803d!important;transform:translateY(-1px)}.btn-ghost{transition:background .15s}.btn-ghost:hover{background:#f4f6f9!important}.btn-ink:hover{background:#1d2c44!important}.iconbtn{transition:background .15s}.iconbtn:hover{background:#e8edf5!important}.role-card{transition:transform .15s,box-shadow .15s,border-color .15s}.role-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px #0f1b2d1f}.role-card.light:hover{border-color:#b9cdf2!important}.role-card.dark:hover{box-shadow:0 20px 44px #0f1b2d59}.navitem{transition:background .15s,color .15s}.navitem:hover{background:#ffffff0f;color:#fff!important}.navscroll{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}.navscroll::-webkit-scrollbar{width:6px}.navscroll::-webkit-scrollbar-thumb{background:#ffffff2e;border-radius:99px}.navscroll::-webkit-scrollbar-thumb:hover{background:#ffffff52}.navscroll::-webkit-scrollbar-track{background:transparent}.rowhov{transition:background .12s}.rowhov:hover{background:#f8fafc}.psel{transition:background .12s}.psel:hover{background:#f4f6f9}.link-back{transition:color .15s}.link-back:hover{color:#0284c7!important}.btn-export-one{transition:background .15s}.btn-export-one:hover{background:#e2f6e9!important}.shutter{transition:transform .12s}.shutter:hover{transform:scale(1.04)}.admin-topbar,.admin-backdrop{display:none}@media (max-width: 1024px){.admin-topbar{display:flex;align-items:center;gap:10px;height:54px;padding:0 14px;background:#0c4a6e;color:#fff;position:sticky;top:0;z-index:30;flex-shrink:0}.admin-sidebar{position:fixed;top:0;left:0;bottom:0;z-index:50;width:256px!important;transform:translate(-100%);transition:transform .25s ease;box-shadow:0 0 50px #00000073}.admin-sidebar.open{transform:translate(0)}.admin-backdrop.open{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#0f1b2d80;z-index:45;animation:tm-fadein .2s ease-out}.admin-main-pad{padding:18px 16px 50px!important}}