@layer theme,legacy,utilities;
@layer legacy{
/* A welcoming front door. All selectors stay within the signed-out shell. */
#auth-screen .auth-wrap{width:100%;max-width:1020px;margin:0 auto;padding:32px max(20px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}
#auth-screen .auth-wrap>.brand{justify-content:flex-start;margin:0 0 26px;gap:12px}
#auth-screen .brand-icon{width:52px;height:52px}
#auth-screen .brand{font-size:1.5rem;text-decoration:none}
#auth-screen .brand small{font-size:0.82rem;margin-top:4px}
.auth-home-layout{display:grid;grid-template-columns:1.1fr 1fr;background:var(--surface);border:1px solid var(--line);border-radius:28px;overflow:hidden}
#auth-screen .auth-wrap .panel{border:0;border-radius:0;padding:48px 40px;margin:0;box-shadow:none;background:var(--surface);min-width:0}
#auth-screen .auth-wrap .panel:before{display:none}
.auth-home-art{background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;min-width:0}
.auth-home-art img{display:block;width:100%;max-width:400px;height:auto}
#auth-screen .auth-wrap .auth-home-art p{color:var(--ink);font-size:1.55rem;font-weight:700;line-height:1.5;margin:0 0 24px;text-align:center}
.auth-welcome-label{display:block;font-size:0.82rem;font-weight:600;color:var(--success);margin-bottom:12px}
#auth-screen .auth-wrap h1{font-size:clamp(1.8rem,3.2vw,2.35rem);letter-spacing:-.035em;margin:0 0 14px;line-height:1.2;color:var(--ink)}
#auth-screen .auth-wrap p{color:var(--muted);margin:0 0 28px;font-size:1rem;line-height:1.65}
#auth-screen .auth-wrap label{color:var(--ink);font-size:0.88rem}
#auth-screen .auth-wrap input{background:var(--surface);color:var(--ink);border:1.5px solid var(--line);border-radius:12px;margin:8px 0 12px;min-height:54px;outline-offset:3px}
#auth-screen .auth-wrap .primary{min-height:54px;margin:0 0 12px;font-size:1rem;border-radius:12px}
#auth-screen .auth-wrap .auth-help{font-size:0.82rem;margin:0 0 20px}
#auth-screen .auth-invite{color:var(--success);background:var(--success-bg);padding:12px;font-size:0.88rem;margin:0 0 20px}
#auth-screen .auth-wrap .auth-demo{display:flex;justify-content:center;font-size:0.88rem;border-top:1px solid var(--line);margin-top:20px;padding-top:14px;text-decoration:none;min-height:48px}
.auth-access-help{font-size:0.88rem;color:var(--muted)}
.auth-access-help summary{min-height:44px;display:list-item;align-content:center;cursor:pointer;color:var(--ink)}
#auth-screen .auth-access-help p{font-size:0.82rem;margin:8px 0 0}
#auth-screen .auth-wrap :is(a,button,input,summary):focus-visible{outline:3px solid var(--accent);outline-offset:3px}
#auth-screen .auth-wrap #auth-feedback:not(:empty){padding:12px;border-radius:12px;margin-bottom:18px;font-size:0.88rem;line-height:1.6}
@media(max-width:680px){
 #auth-screen .auth-wrap{padding:20px max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
 #auth-screen .auth-wrap>.brand{margin-bottom:18px}
 #auth-screen .brand-icon{width:44px;height:44px}
 .auth-home-layout{display:flex;flex-direction:column-reverse;border-radius:22px}
 .auth-home-art{height:140px;padding:0;position:relative;overflow:hidden;flex-shrink:0}
 .auth-home-art img{position:absolute;width:220px;max-width:none;height:183px;inset-inline-end:calc(50% - 110px);top:-25px}
 #auth-screen .auth-wrap .auth-home-art p{display:none}
 #auth-screen .auth-wrap .panel{padding:26px 24px}
 #auth-screen .auth-wrap h1{font-size:1.9rem}
 #auth-screen .auth-wrap p{font-size:0.94rem;margin-bottom:22px}
 .auth-welcome-label{margin-bottom:10px}
}
@media(max-width:360px){#auth-screen .auth-wrap .panel{padding:24px 18px}.auth-home-art{height:112px}.auth-home-art img{width:190px;height:158px;inset-inline-end:calc(50% - 95px);top:-27px}}

}