:root{--primary-color:#0ea5e9;--primary-hover:#0284c7;--secondary-color:#2b2d42;--bg-color:#f4f6f8;--panel-bg:#fff;--border-color:#e2e8f0;--text-main:#1a202c;--text-muted:#718096;--text-light:#fff;--success:#38a169;--danger:#e53e3e;--warning:#dd6b20;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--shadow-sm:0 1px 3px #0000001a;--shadow-md:0 4px 6px -1px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a}*{box-sizing:border-box;font-family:Noto Sans Thai,Segoe UI,sans-serif}body{color:var(--text-main);background-color:var(--bg-color);margin:0;font-size:.875rem}button{cursor:pointer;border-radius:var(--radius-sm);border:none;font-weight:600;transition:all .2s}button:active{transform:scale(.97)}.btn-primary{background:var(--primary-color);color:#fff;padding:.75rem 1.5rem}.btn-primary:hover{background:var(--primary-hover)}input,select,textarea{border:1px solid var(--border-color);border-radius:var(--radius-sm);outline:none;padding:.75rem;font-size:.875rem;transition:border-color .2s}input:focus,select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px #0ea5e933}.flex{display:flex}.flex-col{flex-direction:column;display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-4{gap:1rem}.w-full{width:100%}.h-full{height:100%}.text-center{text-align:center}.text-danger{color:var(--danger)}.text-muted{color:var(--text-muted)}html,body{background-color:var(--bg-color);width:100vw;height:100vh;color:var(--text-color);margin:0;padding:0}#app{height:100%}