@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap');
:root{--blue:#1e3a8a;--red:#dc2626;--bg:#f3f4f6}
*{box-sizing:border-box}body{font-family:Inter,system-ui;margin:0;background:var(--bg);color:#111}
.topbar{background:var(--blue);color:#fff;padding:12px 20px;display:flex;align-items:center;justify-content:space-between}
.topbar-left,.topbar-center,.topbar-right{display:flex;align-items:center}
.topbar-left{flex:1;justify-content:flex-start}.topbar-center{flex:1;justify-content:center}.topbar-right{flex:1;justify-content:flex-end}
.logo{height:48px}.container{max-width:1100px;margin:22px auto;padding:22px}.narrow{max-width:760px;margin:0 auto}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{padding:18px;border-radius:10px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,0.04);display:block;text-decoration:none;color:inherit}
.btn{padding:8px 14px;border-radius:6px;font-weight:600;text-decoration:none;display:inline-block}
.btn-logout{background:var(--red);color:#fff}.btn-webmail{background:#fff;color:var(--blue)}.btn-change{background:#123;color:#fff}
.form-card{background:#fff;padding:18px;border-radius:10px;box-shadow:0 6px 22px rgba(0,0,0,0.06)}
.table{width:100%;border-collapse:collapse;background:#fff;border-radius:8px}.table th,.table td{padding:10px;border-bottom:1px solid #eef2f7;text-align:left}
.success{background:#ecfdf5;color:#065f46;padding:10px;border-radius:8px}.error{background:#fee2e2;color:#991b1b;padding:10px;border-radius:8px}
@media(max-width:720px){.grid{grid-template-columns:1fr}.logo{height:40px}}