:root { --bg:#0b0f14; --panel:#141a21; --border:#2a333d; --text:#e6edf3; --muted:#8b949e; --accent:#e5484d; --accent2:#f0b429; --ok:#2ea043; }
* { box-sizing:border-box; }
body { margin:0; font-family:'Segoe UI',Helvetica,Arial,sans-serif; background:var(--bg); color:var(--text); min-height:100vh; }
.bar { display:flex; align-items:center; gap:16px; padding:14px 24px; background:var(--panel); border-bottom:2px solid var(--accent); }
.bar-title { font-weight:700; font-size:18px; color:var(--accent); }
.bar-sub { color:var(--muted); font-size:13px; flex:1; }
.btn-signout { background:transparent; color:var(--text); border:1px solid var(--border); padding:6px 16px; border-radius:4px; cursor:pointer; }
.btn-signout:hover { border-color:var(--accent); }
.wrap { max-width:720px; margin:40px auto; padding:0 20px; }
.card { background:var(--panel); border:1px solid var(--border); border-radius:8px; padding:28px; margin-bottom:20px; }
.card.subtle { background:#10151b; }
.card h1 { margin-top:0; font-size:24px; }
.card h2 { margin-top:0; font-size:20px; }
.card h3 { font-size:15px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.lead { color:var(--muted); line-height:1.5; }
.warn { color:var(--accent2); font-weight:600; border-left:3px solid var(--accent2); padding-left:12px; }
.field { margin-bottom:16px; }
.field label { display:block; font-size:13px; color:var(--muted); margin-bottom:6px; }
.field input { width:100%; padding:10px 12px; background:#0b0f14; border:1px solid var(--border); border-radius:4px; color:var(--text); font-size:15px; }
.field input:focus { outline:none; border-color:var(--accent); }
.btn-primary { background:var(--text); color:#0b0f14; border:0; padding:10px 22px; border-radius:4px; font-weight:600; cursor:pointer; text-decoration:none; display:inline-block; }
.btn-danger { background:var(--accent); color:#fff; border:0; padding:12px 24px; border-radius:4px; font-weight:700; font-size:15px; cursor:pointer; width:100%; }
.btn-danger:hover { background:#c93a3e; }
.alert { padding:12px 16px; border-radius:4px; margin-bottom:16px; font-size:14px; }
.alert-success { background:rgba(46,160,67,.15); border:1px solid var(--ok); color:#7ee787; }
.alert-danger { background:rgba(229,72,77,.15); border:1px solid var(--accent); color:#ff9b9e; }
code { background:#0b0f14; padding:2px 6px; border-radius:3px; font-size:13px; }
details { margin-top:10px; }
summary { cursor:pointer; color:var(--muted); font-size:13px; }
pre { background:#0b0f14; padding:12px; border-radius:4px; overflow-x:auto; font-size:12px; color:#9ab; }
pre.wrap-text { white-space:pre-wrap; word-break:break-all; }
.foot { text-align:center; color:var(--muted); font-size:12px; padding:24px; }