:root{--main-bg:#1f2b27;--card-bg:#26332e;--main-txt:#ffffff;--theme-txt:#fbe6ae;--placeholder:#707070;--field-bg:#1a2420;--field-border:rgba(255,255,255,0.15);--field-border-focus:#fbe6ae;--btn-main:linear-gradient(90deg,#350bc8,#8633c3,#b72dbc);--btn-sub:linear-gradient(90deg,#d7437c,#f6b56b);--btn-txt:#131617;--error:#e0250c;--success:#4caf7d;--radius:10px;--shadow:4px 4px 4px rgba(0,0,0,0.5)}*{box-sizing:border-box}body,html{margin:0;padding:0;background:var(--main-bg);color:var(--main-txt);font-family:Segoe UI,Noto Sans Thai,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}.page{min-height:100dvh;padding:24px 16px 48px;background:radial-gradient(1200px 400px at 50% -80px,rgba(134,51,195,.25),transparent),var(--main-bg)}.brand,.page{display:flex;flex-direction:column;align-items:center}.brand{gap:10px;margin:12px 0 20px}.brand img{height:56px;width:auto}.brand .tagline{color:var(--theme-txt);font-size:14px;letter-spacing:.3px}.card{width:100%;max-width:420px;background:var(--card-bg);border:1px solid var(--field-border);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px 20px 26px}.card h1{margin:0 0 4px;font-size:20px;text-align:center}.card .sub{margin:0 0 18px;text-align:center;color:var(--theme-txt);font-size:13px}.field{margin-bottom:14px}.field label{display:block;font-size:13px;margin-bottom:6px;color:var(--main-txt)}.field .control{display:flex;align-items:stretch}.prefix{display:flex;align-items:center;padding:0 12px;border:1px solid var(--field-border);border-right:none;border-radius:var(--radius) 0 0 var(--radius);color:var(--theme-txt);font-weight:600}.prefix,input,select{background:var(--field-bg)}input,select{width:100%;padding:12px 14px;color:var(--main-txt);border:1px solid var(--field-border);border-radius:var(--radius);font-size:15px;outline:none}.control input{border-radius:0 var(--radius) var(--radius) 0}input::placeholder{color:var(--placeholder)}input:focus,select:focus{border-color:var(--field-border-focus)}select{appearance:none}.err{margin-top:6px;font-size:12px;color:var(--error)}.submit{width:100%;margin-top:8px;padding:14px;border:none;border-radius:var(--radius);background:var(--btn-main);color:#fff;font-size:16px;font-weight:700;cursor:pointer;box-shadow:var(--shadow)}.submit:disabled{opacity:.6;cursor:default}.banner{border-radius:var(--radius);padding:12px 14px;margin-bottom:16px;font-size:14px;text-align:center}.banner.ok{background:rgba(76,175,125,.15);border:1px solid var(--success);color:var(--success)}.banner.bad{background:rgba(224,37,12,.12);border:1px solid var(--error);color:#ff8a75}.foot{margin-top:22px;font-size:11px;color:rgba(255,255,255,.5);text-align:center}