:root{--login-bg:#050505;--login-surface:#0b0b0c;--login-raised:#121214;--login-text:#f5f2ea;--login-muted:#9f9d98;--login-line:rgba(255,255,255,.12);--login-gold:#c9a54b;--login-gold-pale:#e8cf8a}
html,body{background:var(--login-bg)}
body{color:var(--login-text);letter-spacing:.01em}
.login{width:min(100%,520px);grid-template-rows:minmax(238px,34dvh) 1fr;background:var(--login-bg);overflow:hidden}
.photo{background-position:center 38%;filter:saturate(.72) contrast(1.07)}
.photo::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.32) 48%,#050505 100%),linear-gradient(90deg,rgba(0,0,0,.36),transparent 45%,rgba(0,0,0,.3))}
.photo::after{background:radial-gradient(circle at 50% 64%,rgba(201,165,75,.1),transparent 31%)}
.panel{margin-top:-48px;min-height:calc(66dvh + 48px);padding:0 28px calc(20px + env(safe-area-inset-bottom,0px));border-top:1px solid rgba(232,207,138,.15);border-radius:30px 30px 0 0;background:linear-gradient(180deg,rgba(10,10,11,.97),#050505 190px);box-shadow:0 -24px 70px rgba(0,0,0,.52);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.logo{width:56px;height:56px;margin-top:-28px;border:1px solid rgba(232,207,138,.2);border-radius:16px;box-shadow:0 14px 42px rgba(0,0,0,.68)}
.wordmark{margin-top:17px;color:var(--login-text);font-size:25px;font-weight:760;letter-spacing:.14em}
.audience{margin-top:7px;padding:0;border:0;color:var(--login-gold-pale);font-size:10px;font-weight:700;letter-spacing:.16em}
.step{max-width:420px}
.tagline{margin:14px 0 20px;color:#d8d6d0;font-size:15px;font-weight:580;letter-spacing:.045em}
.login-button{min-height:54px;border-radius:15px;font-size:15px;font-weight:720;transition:transform .16s ease,border-color .16s ease,background .16s ease}
.login-button:active,.provider:active,.link:active{transform:scale(.985)}
.primary{border:1px solid rgba(255,255,255,.7);background:linear-gradient(180deg,#fbfaf7,#dfdbd1);color:#0a0a0b;box-shadow:0 12px 30px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.95)}
.outline{margin-top:10px;border:1px solid var(--login-line);background:var(--login-raised);color:#e8e5de}
.note{margin:9px 0 15px;color:var(--login-muted);font-size:11px;line-height:1.55}
.providers{position:relative;margin-top:27px;padding-top:17px;grid-template-columns:1fr 1fr;gap:9px}
.providers::before{content:"または";position:absolute;top:0;left:50%;z-index:1;padding:0 12px;background:#080809;color:#77756f;font-size:10px;transform:translate(-50%,-50%)}
.providers::after{content:"";position:absolute;top:0;right:0;left:0;border-top:1px solid rgba(255,255,255,.08)}
.provider{min-height:49px;border:1px solid var(--login-line);border-radius:14px;background:#0d0d0f;color:#eceae4;font-size:13px;font-weight:660}
.link{min-height:42px;margin-top:4px;color:#b9b6ae;font-size:12px;font-weight:620;text-decoration:underline;text-decoration-color:rgba(255,255,255,.2);text-underline-offset:4px}
.terms{padding-top:16px;color:#77736a;font-size:9px;line-height:1.65}.terms a{color:#99958b}
.auth{padding-top:23px}.back{margin:0 0 17px;padding:0;color:#aaa79f;font-size:13px;font-weight:650}
.auth h1{margin-bottom:9px;font-size:24px;font-weight:740;letter-spacing:.02em}.auth p{margin-bottom:24px;color:var(--login-muted);font-size:13px;line-height:1.7}
label{gap:7px;margin-bottom:13px;color:#bdbab2;font-size:12px;font-weight:650}
.input{height:54px;border-color:rgba(255,255,255,.14);border-radius:14px;background:#101012;color:var(--login-text);font-size:16px;box-shadow:inset 0 1px rgba(255,255,255,.025)}
.input:focus{border-color:rgba(232,207,138,.58);box-shadow:0 0 0 3px rgba(201,165,75,.1)}
.role-button{min-height:72px;border-color:var(--login-line);border-radius:16px;background:var(--login-raised)}.role-button span:last-child{color:var(--login-gold-pale)}
.login-display{top:calc(11px + env(safe-area-inset-top,0px));right:11px;min-height:35px;padding:0 10px;border-color:rgba(255,255,255,.14);border-radius:999px;background:rgba(8,8,9,.7);color:#aaa79f;font-size:10px;font-weight:650;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.login-size-panel{top:calc(54px + env(safe-area-inset-top,0px));border-color:var(--login-line);background:#101012}
@media(max-width:420px){.login{grid-template-rows:minmax(224px,32dvh) 1fr}.panel{min-height:calc(68dvh + 48px);margin-top:-48px;padding-right:21px;padding-left:21px}.providers{grid-template-columns:1fr 1fr}}
@media(max-width:340px){.providers{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.login-button,.provider,.link{transition:none}}