:root {
  --ink: #132f50;
  --ink-2: #1d4d78;
  --gold: #f0a23a;
  --gold-2: #ffc55f;
  --bg: #f4f7fb;
  --card: rgba(255,255,255,.94);
  --line: rgba(20,50,82,.14);
  --danger: #c92a2a;
  --success: #087f5b;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:radial-gradient(circle at 20% 10%,#fff 0,#f7f9fc 40%,#eef3f9 100%);color:#132033}
body{min-height:100vh}
.auth-shell{min-height:100vh;display:grid;place-items:center;padding:28px 16px}
.card{width:min(100%,520px);background:var(--card);border:1px solid var(--line);border-radius:28px;padding:28px;box-shadow:0 24px 70px rgba(20,50,82,.14);backdrop-filter:blur(16px)}
.brand{display:flex;align-items:center;gap:16px;margin-bottom:24px}.brand img{width:76px;height:76px;object-fit:contain}.brand h1{margin:0;font-size:28px;color:var(--ink)}.brand p{margin:5px 0 0;color:#68778a;font-size:14px}
.grid{display:grid;gap:14px}.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:560px){.row{grid-template-columns:1fr}}
label{font-size:12px;font-weight:750;color:#516174;text-transform:uppercase;letter-spacing:.05em}
input,textarea{width:100%;border:1px solid #dbe3ed;border-radius:14px;padding:13px 14px;font:inherit;background:#fff;color:#182538;outline:none}textarea{min-height:160px;resize:vertical}input:focus,textarea:focus{border-color:#4b78a1;box-shadow:0 0 0 3px rgba(29,77,120,.10)}
button,.button{border:0;border-radius:14px;padding:13px 16px;font:inherit;font-weight:800;cursor:pointer;text-decoration:none;text-align:center;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.primary{background:linear-gradient(135deg,var(--ink),var(--ink-2));color:#fff;box-shadow:0 12px 28px rgba(19,47,80,.20)}.gold{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#33220b}.ghost{background:#eef3f8;color:#29445f}.danger{background:#fff0f0;color:#b42318;border:1px solid #ffd0d0}
.tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#edf2f7;border-radius:14px;padding:5px;margin-bottom:18px}.tabs button{padding:10px;background:transparent;color:#5e6f82}.tabs button.active{background:#fff;color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.07)}
.status{display:none;margin-top:14px;border-radius:13px;padding:12px 14px;font-size:13px;line-height:1.45}.status.show{display:block}.status.error{background:#fff0f0;border:1px solid #ffd0d0;color:#a61b1b}.status.ok{background:#e9fbf4;border:1px solid #b7ecd8;color:#087653}.status.info{background:#eef7ff;border:1px solid #c9e2f8;color:#255b82}
.muted{color:#718096;font-size:13px;line-height:1.6}.hidden{display:none!important}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.actions>*{flex:1;min-width:150px}
.codebox{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#0d1a2b;color:#d9e8f7;padding:13px;border-radius:12px;overflow:auto;word-break:break-all}
.section{border:1px solid #e3e9f0;border-radius:18px;padding:18px;margin-top:16px}.section h2{font-size:16px;margin:0 0 12px;color:#203b57}.preview{display:grid;grid-template-columns:130px 1fr;gap:8px 12px;font-size:13px}.preview b{color:#607083}.preview span{word-break:break-word}
.loader{width:36px;height:36px;border:4px solid #dce5ef;border-top-color:var(--ink-2);border-radius:50%;animation:spin .8s linear infinite;margin:auto}@keyframes spin{to{transform:rotate(360deg)}}