:root {
  --bg: #10141d;
  --panel: #171e2b;
  --panel2: #202a3a;
  --text: #f3ead7;
  --muted: #b8ad98;
  --gold: #d6aa55;
  --gold2: #f0d38a;
  --line: #344054;
  --danger: #e07373;
  --ok: #7cc48b;
}
* { box-sizing: border-box; }
body { margin:0; font-family: Georgia, 'Times New Roman', serif; background: radial-gradient(circle at top, #263144, var(--bg)); color: var(--text); }
a { color: var(--gold2); text-decoration: none; }
a:hover { text-decoration: underline; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:14px 22px; background:#0b0f16; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5; }
.brand a { font-size:22px; font-weight:bold; color:var(--gold2); }
nav a { margin-left:18px; color:#e7d8b2; font-size:15px; }
.container { max-width:1180px; margin:0 auto; padding:28px 18px 60px; }
.hero { padding:48px 30px; border:1px solid rgba(214,170,85,.4); background:linear-gradient(135deg, rgba(214,170,85,.14), rgba(32,42,58,.65)); border-radius:18px; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.hero h1 { margin:0 0 12px; font-size:46px; color:var(--gold2); }
.hero p { font-size:21px; color:#eadfc7; max-width:760px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:16px; margin-top:20px; }
.card { background:rgba(23,30,43,.92); border:1px solid var(--line); border-radius:14px; padding:18px; box-shadow:0 12px 35px rgba(0,0,0,.18); }
.card h2, .card h3 { margin-top:0; color:var(--gold2); }
.btn, button, input[type=submit] { display:inline-block; padding:10px 14px; border-radius:10px; border:1px solid #a77a2e; background:linear-gradient(#f1d58b,#b8842f); color:#15100a; font-weight:bold; cursor:pointer; }
.btn.secondary { background:#202a3a; color:var(--gold2); border-color:var(--line); }
.table { width:100%; border-collapse:collapse; background:rgba(23,30,43,.75); border-radius:12px; overflow:hidden; }
.table th, .table td { border-bottom:1px solid var(--line); padding:10px 12px; text-align:left; vertical-align:top; }
.table th { color:var(--gold2); background:#111824; }
label { display:block; margin:12px 0 5px; color:#e9d7aa; }
input[type=text], input[type=password], textarea, select { width:100%; padding:10px; border-radius:9px; border:1px solid #4a5568; background:#0e1420; color:var(--text); }
textarea { min-height:150px; }
.row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.status { display:inline-block; padding:4px 8px; border-radius:999px; background:#263144; border:1px solid var(--line); font-size:13px; }
.status.complete { color:var(--ok); }
.status.failed { color:var(--danger); }
.footer { padding:20px; color:var(--muted); border-top:1px solid var(--line); display:flex; gap:20px; justify-content:center; background:#0b0f16; }
.notice { padding:12px 14px; border-radius:10px; background:#202a3a; border:1px solid var(--line); margin:10px 0 20px; }
small { color: var(--muted); }
@media (max-width:720px){ .topbar{display:block}.topbar nav{margin-top:10px}.topbar nav a{display:inline-block;margin:0 12px 8px 0}.row{grid-template-columns:1fr}.hero h1{font-size:34px} }

.progress { width:100%; height:18px; border-radius:999px; overflow:hidden; background:#0e1420; border:1px solid var(--line); }
.progress-fill { height:100%; background:linear-gradient(90deg,#b8842f,#f1d58b); transition:width .3s ease; }