:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", sans-serif; background: #f1f3f5; color: #15202b; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: linear-gradient(180deg, #101419 0 12rem, #f1f3f5 12rem); }
.shell { width: min(100% - 2rem, 46rem); margin: 0 auto; padding: max(2rem, env(safe-area-inset-top)) 0 calc(3rem + env(safe-area-inset-bottom)); }
.card { background: #fff; border-radius: 20px; padding: 1.35rem; margin-bottom: 1rem; box-shadow: 0 12px 35px rgba(14, 22, 31, .09); }
.login-card { margin-top: 10vh; }
h1, h2 { margin: .2rem 0 .6rem; letter-spacing: -.03em; }
h1 { font-size: 1.75rem; } h2 { font-size: 1.3rem; }
.eyebrow { margin: 0; color: #9b7200; text-transform: uppercase; font-size: .75rem; font-weight: 750; letter-spacing: .08em; }
.muted, .fine-print { color: #64717d; line-height: 1.55; }
.fine-print { font-size: .78rem; margin-bottom: 0; }
form { display: grid; gap: 1rem; }
label, legend { font-size: .88rem; font-weight: 650; color: #384653; }
input, textarea { display: block; width: 100%; margin-top: .42rem; border: 1px solid #cbd2d9; border-radius: 12px; padding: .82rem; font: inherit; font-size: 1rem; background: #fff; color: #15202b; }
input:focus, textarea:focus { outline: 3px solid rgba(192, 145, 10, .2); border-color: #a97c00; }
.primary { border: 0; border-radius: 13px; padding: .9rem 1.1rem; background: #b98700; color: #fff; font: inherit; font-weight: 750; text-align: center; }
.primary:disabled { opacity: .45; }
.button-link { display: block; text-decoration: none; }
.side-switch { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.side-switch legend { grid-column: 1/-1; margin-bottom: .42rem; }
.side-switch label { border: 1px solid #cbd2d9; border-radius: 12px; padding: .8rem; }
.side-switch input, .checkbox input { display: inline; width: auto; margin: 0 .35rem 0 0; }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.checkbox { font-weight: 500; line-height: 1.4; }
.alert { padding: .85rem 1rem; border-radius: 12px; line-height: 1.45; margin: 1rem 0; }
.error { background: #fff0ef; color: #9d241d; }
.warning { background: #fff7df; color: #765600; }
.metrics { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem; }
.metrics div { background: #f5f7f8; border-radius: 12px; padding: .85rem; }
.metrics span { display: block; color: #65717c; font-size: .76rem; margin-bottom: .2rem; }
.metrics strong { font-size: 1rem; }
.estimate { margin-top: 1rem; padding: .8rem; border-radius: 10px; background: #fff8e5; color: #684f09; font-size: .86rem; line-height: 1.5; }
.logout { margin-top: 1.4rem; display: block; text-align: center; }
.link-button { border: 0; background: transparent; color: #63717e; text-decoration: underline; }
.success-card { text-align: center; }
.success-mark { display: grid; place-items: center; width: 3.2rem; height: 3.2rem; margin: 0 auto .8rem; border-radius: 50%; background: #e2f6ea; color: #167c3d; font-size: 1.8rem; font-weight: 800; }
@media (max-width: 520px) { .shell { width: min(100% - 1rem, 46rem); } .card { border-radius: 16px; padding: 1rem; } .grid { grid-template-columns: 1fr; gap: .8rem; } .metrics { gap: .55rem; } }