:root{--demo-orange:#ff854b;--demo-muted:#bbb7ae}
body{font-family:Arial,sans-serif}
button:focus-visible,a:focus-visible{outline:3px solid #ffba78;outline-offset:4px}
.login-page{padding:32px;overflow:auto;background:radial-gradient(ellipse at 85% 20%,#58301f 0,transparent 48%),#101110;align-items:center}
.demo-landing{max-width:1120px;width:100%;margin:auto}
.demo-wordmark{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:64px;font-size:24px;font-weight:800;letter-spacing:-1px}
.demo-pill{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;border:1px solid #5e5346;color:#f4c590;border-radius:30px;padding:9px 13px}
.demo-hero{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;align-items:center}
.demo-eyebrow{font-size:11px;color:#ffac77;letter-spacing:2px;text-transform:uppercase;margin-bottom:18px}
.demo-hero h1{font-family:Arial,sans-serif;font-size:clamp(40px,5.6vw,76px);letter-spacing:-3px;line-height:1.04;font-weight:750;margin:0 0 24px;color:#fff4e7}
.demo-hero h1 em{font-style:normal;color:var(--demo-orange)}
.demo-copy{color:var(--demo-muted);font-size:16px;line-height:1.7;max-width:520px}
.demo-actions{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0 16px}
.demo-actions .btn{padding:15px 20px;font-size:14px}
.demo-note{font-size:12px;color:var(--demo-muted);line-height:1.7}
.demo-preview{background:linear-gradient(145deg,#2a2925,#191a18);border:1px solid #504335;border-radius:24px;padding:28px;box-shadow:0 30px 80px #0005;transform:rotate(2deg)}
.demo-preview h2{font-size:20px;margin:12px 0 24px}
.demo-preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.demo-preview-grid div{background:#ffffff05;border:1px solid #ffffff0d;border-radius:12px;padding:18px 12px}
.demo-preview-grid strong{font-size:28px;display:block;color:#ffe0b4;margin:8px 0}.demo-preview-grid span{font-size:11px;color:var(--demo-muted)}
.demo-bars{display:flex;align-items:end;height:105px;gap:10px;margin:25px 0 18px}.demo-bars i{flex:1;background:linear-gradient(#ffb17a,#b75b35);border-radius:5px 5px 0 0}
.demo-features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:48px 0 22px}
.demo-feature{border-top:1px solid #514438;padding:22px 0}.demo-feature b{display:block;font-size:15px;margin:12px 0}.demo-feature p{font-size:13px;color:var(--demo-muted);line-height:1.6}
.demo-banner{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#30271f;border-bottom:1px solid #66472f;padding:10px 24px;font-size:12px;color:#ffd3a6}
.demo-guide{margin:20px 24px 0;padding:20px 24px;background:linear-gradient(115deg,#39281d,#222320);border:1px solid #6d4c31;border-radius:14px;display:flex;gap:24px;justify-content:space-between;align-items:center}.demo-guide h2{font-size:20px;margin:6px 0 9px}.demo-guide p{font-size:13px;line-height:1.6;color:#e0cdbc;max-width:650px}.demo-guide small{color:#ffb77d}.demo-guide-actions{display:flex;gap:8px;flex-wrap:wrap;flex-shrink:0}
.demo-setting{padding:24px;line-height:1.8}.demo-setting h2{margin-bottom:12px}.demo-setting p{color:var(--demo-muted);margin-bottom:16px}
.demo-review{padding:18px 0;border-bottom:1px solid #393a35}.demo-review p{margin:8px 0;color:var(--demo-muted)}
@media(max-width:768px){.login-page{padding:24px 20px;display:block}.demo-wordmark{margin-bottom:38px;font-size:21px}.demo-hero{grid-template-columns:1fr;gap:30px}.demo-hero h1{letter-spacing:-2px}.demo-preview{transform:none;padding:22px}.demo-features{grid-template-columns:1fr;margin-top:28px;gap:0}.demo-guide{margin:12px 14px 0;padding:16px;display:block}.demo-guide-actions{margin-top:14px}.demo-banner{padding:10px 14px;flex-wrap:wrap}.demo-pill{font-size:9px}.demo-preview-grid strong{font-size:24px}}