/* Landscape Buddy — approved login layout and interactive background. */
body.lb-login-page { background: #060d0b; }
.lb-login { position: relative; isolation: isolate; min-height: 100svh; overflow: hidden; background: #060d0b; }
.lb-login::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(ellipse at 16% 25%,#155d4a60,transparent 66%),radial-gradient(ellipse at 81% 43%,#377fba3a,transparent 64%),radial-gradient(ellipse at 92% 13%,#eba80b22,transparent 56%),linear-gradient(#a5d9c310 1px,transparent 1px),linear-gradient(90deg,#a5d9c310 1px,transparent 1px); background-size:auto,auto,auto,46px 46px,46px 46px; pointer-events:none; }
.lb-login.has-background::before { background-image:radial-gradient(ellipse at 16% 25%,#155d4a60,transparent 66%),radial-gradient(ellipse at 81% 43%,#377fba3a,transparent 64%),radial-gradient(ellipse at 92% 13%,#eba80b22,transparent 56%); }
.lb-canvas { position: absolute; inset: 0; width:100%; height:100%; z-index:-1; pointer-events:none; transition:opacity .45s ease; }
.lb-login:has(.lb-auth:focus-within) .lb-canvas { opacity:.55; }
.lb-art { position:absolute; top:0; left:50%; width:min(100%,1440px); height:960px; transform:translateX(-50%); pointer-events:none; z-index:0; }
.lb-words { width:100%; height:100%; display:block; }
.lb-stage { position:relative; z-index:1; max-width:1440px; min-height:max(960px,100svh); margin:0 auto; padding:47px min(6.944vw,100px) 34px min(5vw,72px); display:grid; grid-template-columns:minmax(0,1fr) 440px; column-gap:50px; grid-template-rows:40px 1fr 47px; }
.lb-brand { grid-column:1/-1; display:flex; align-items:flex-start; gap:17px; width:fit-content; }
.lb-logo { width:31px; height:40px; object-fit:contain; }
.lb-wordmark { position:relative; display:block; width:250px; height:44px; overflow:hidden; }
.lb-wordmark img { position:absolute; left:0; top:50%; transform:translateY(-50%); width:100%; height:auto; }
.lb-intro { grid-column:1; grid-row:2; align-self:center; }
.lb-eyebrow { margin:0 0 29px 2px; font-size:17px; line-height:1.55; color:#65c8a5; }
.lb-intro h1 { font-size:50px; line-height:1.56; font-weight:400; letter-spacing:.005em; }
.lb-intro h1 span { color:#b2e7d3; }
.lb-description { margin:28px 0 0 2px; color:#a2b5a9; font-size:18px; line-height:1.6; }
.lb-auth { grid-column:2; grid-row:2; align-self:center; transform:translateY(46px); width:440px; min-height:568px; padding:32px 31px; border:1px solid #c7f9e43b; border-top-color:#d8ffef5a; border-radius:22px; background:linear-gradient(145deg,#e6fff414,#c6ead107 55%,#c4f1df0d); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 22px 54px #00000040,inset 0 1px 0 #eafff512; }
.lb-auth h2 { font-size:28px; font-weight:500; line-height:1.55; }
.lb-sub { margin-top:5px; font-size:14px; line-height:1.55; color:#a2b5a9; }
.lb-field { margin-top:24px; }
.lb-field + .lb-field { margin-top:20px; }
.lb-field label { display:block; margin-bottom:10px; font-size:14px; line-height:1.55; }
.lb-field input { display:block; width:100%; height:52px; padding:0 16px; border:1px solid #b8e7d12b; border-radius:10px; background:#02120c66; color:#e8f0ea; font:inherit; font-size:16px; transition:border-color .25s,box-shadow .25s; }
.lb-field input::placeholder { color:#91ac9c; }
.lb-field input:focus { outline:none; border-color:#72d5ae88; box-shadow:0 0 0 3px #71d8af25; }
.lb-password { position:relative; }
.lb-password input { padding-right:50px; }
.lb-reveal { position:absolute; right:5px; top:4px; width:44px; height:44px; display:grid; place-items:center; border:0; color:#a2b5a9; background:none; }
.lb-reveal svg { width:22px; height:22px; }
.lb-help { margin-top:12px; font-size:12px; color:#a2b5a9; line-height:1.55; text-align:right; }
.lb-error { color:#ffb7a8; font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.lb-error:not(:empty) { margin-top:12px; }
.lb-primary,.lb-guest { display:block; width:100%; height:46px; border-radius:8px; font-size:16px; font-weight:500; }
.lb-primary { margin-top:20px; border:0; color:#042017; background:linear-gradient(100deg,#7cdbad,#3fb98f); box-shadow:0 10px 28px -12px #52cda560; }
.lb-guest { margin-top:18px; border:1px solid #bcf5d82c; color:#e8f0ea; background:#d8f9e409; }
.lb-primary:hover { filter:brightness(1.06); }
.lb-primary:disabled { opacity:.6; cursor:wait; }
.lb-guest:hover { background:#d8f9e413; }
.lb-note { margin-top:30px; font-size:12px; line-height:1.55; color:#a2b5a9; }
.lb-footer { grid-column:1/-1; display:flex; justify-content:space-between; align-items:start; gap:20px; border-top:1px solid #92c7ad26; padding-top:24px; font-size:12px; line-height:1.55; color:#8ca799; }
.lb-footer-right { display:flex; align-items:center; gap:24px; }
.lb-motion { border:0; padding:2px 0; background:none; color:#a2b5a9; font-size:12px; }
.lb-motion:hover { color:#b2e7d3; }
.lb-login button:focus-visible,.lb-brand:focus-visible { outline:2px solid #89ddbd; outline-offset:4px; }
.tb-brand-logo { width:21px; height:27px; object-fit:contain; }
.tb-brand-name { display:block; position:relative; width:166px; height:31px; overflow:hidden; }
.tb-brand-name img { position:absolute; left:0; top:50%; transform:translateY(-50%); width:100%; height:auto; }
@media (max-width:1200px) and (min-width:1051px) { .lb-stage { column-gap:32px; grid-template-columns:minmax(0,1fr) 400px; } .lb-auth { width:400px; } .lb-intro h1 { font-size:42px; } .lb-description { font-size:16px; } }
@media (max-width:1050px) { .lb-stage { padding:30px 26px; grid-template-columns:1fr; grid-template-rows:auto auto auto auto; row-gap:38px; min-height:100svh; } .lb-brand { grid-row:1; } .lb-intro { grid-row:2; margin-top:150px; } .lb-intro h1 { font-size:42px; } .lb-auth { grid-row:3; grid-column:1; justify-self:center; width:min(100%,440px); transform:none; } .lb-footer { grid-row:4; flex-wrap:wrap; padding-top:20px; } .lb-art { width:1100px; left:48%; height:100%; opacity:.75; } }
@media (max-width:600px) { .lb-stage { padding:24px 20px; row-gap:32px; } .lb-brand { gap:12px; } .lb-wordmark { width:235px; } .lb-intro { margin-top:112px; } .lb-eyebrow { font-size:14px; margin-bottom:20px; } .lb-intro h1 { font-size:clamp(27px,7.5vw,36px); line-height:1.55; } .lb-description { margin-top:22px; font-size:14px; } .lb-auth { padding:28px 22px; border-radius:18px; min-height:0; } .lb-auth h2 { font-size:24px; } .lb-sub { font-size:13px; } .lb-note { font-size:11px; } .lb-footer { font-size:10px; } .lb-footer-right { flex-wrap:wrap; gap:14px; } .lb-art { left:46%; opacity:.55; } .topbar .tb-left { gap:8px; } .tb-brand-name { width:145px; } }
@media (prefers-reduced-motion:reduce),(hover:none),(pointer:coarse) { .lb-motion { display:none; } .lb-login * { transition:none!important; } }