:root{color:#172522;background:#edf3ef;font-family:Inter,Noto Sans JP,Hiragino Kaku Gothic ProN,Yu Gothic,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}.page-shell,.center-screen{min-height:100vh;padding:28px;background:radial-gradient(circle at 12% 5%,rgba(250,197,93,.24),transparent 27%),radial-gradient(circle at 92% 88%,rgba(45,115,99,.2),transparent 34%),#edf3ef}.center-screen{display:grid;place-items:center}.center-screen>p{color:#64736f}.account-screen{place-items:start center}.auth-layout{display:grid;width:min(100%,1040px);min-height:calc(100vh - 56px);grid-template-columns:1.05fr .95fr;margin:auto;overflow:hidden;border:1px solid rgba(23,37,34,.1);border-radius:30px;background:#ffffffeb;box-shadow:0 28px 80px #233a3424}.story-panel{display:flex;flex-direction:column;justify-content:space-between;padding:48px;color:#f8fbf9;background:linear-gradient(145deg,#164f43,#287966)}.brand{display:inline-flex;align-items:center;gap:10px;font-size:18px;font-weight:760}.brand-mark{display:grid;width:34px;height:34px;place-items:center;border-radius:11px;color:#fff;background:#e3a62f;font:italic 24px Georgia,serif}.story-panel .brand-mark{color:#164f43;background:#fff2cf}.eyebrow,.step-label{margin:0 0 12px;color:#d6b35d;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.story-panel h1{max-width:470px;margin:0;font-size:clamp(38px,5.4vw,62px);font-weight:760;letter-spacing:-.055em;line-height:1.12}.lead{max-width:450px;margin:24px 0 0;color:#ffffffbf;line-height:1.9}.security-note{margin:0;color:#ffffff9e;font-size:12px}.form-panel{display:flex;flex-direction:column;justify-content:center;padding:44px 48px}.mobile-brand{display:none}.form-heading{margin-bottom:26px}.form-heading h2{margin:0;font-size:30px;letter-spacing:-.035em}.step-label{color:#287966}.primary-methods{display:grid;gap:10px}.auth-button,.submit-button{width:100%;min-height:50px;border-radius:13px;font-weight:720;transition:transform .14s ease,box-shadow .14s ease}.auth-button:hover:not(:disabled),.submit-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 18px #1c41381f}.auth-button{display:flex;align-items:center;justify-content:center;gap:11px;border:1px solid #d9e2de;color:#24332f;background:#fff}.auth-button--passkey{border-color:#cfe0da;color:#1f6655;background:#f3faf7}.google-mark{font-family:Arial,sans-serif;font-weight:800;color:#4285f4}.method-hint{margin:0;color:#899490;font-size:11px;text-align:center}.divider{display:flex;align-items:center;gap:12px;margin:7px 0;color:#98a29f;font-size:11px}.divider:before,.divider:after{height:1px;flex:1;content:"";background:#e2e8e5}form{display:grid;gap:16px}label{display:grid;gap:7px;color:#394945;font-size:13px;font-weight:700}input{width:100%;min-height:48px;padding:0 14px;border:1px solid #d8e1dd;border-radius:11px;outline:none;color:#172522;background:#fbfdfc}input:focus{border-color:#2b7f6b;box-shadow:0 0 0 4px #2b7f6b1a}.submit-button{border:0;color:#fff;background:#236b5a}.feedback{margin:0;padding:10px 12px;border-radius:9px;font-size:12px;line-height:1.6}.feedback--success{color:#175b46;background:#e7f6ef}.feedback--error{color:#8a3329;background:#fbecea}.feedback--notice{color:#755812;background:#fff7df}.form-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:7px 16px;margin-top:20px}.form-nav button,.text-button{padding:0;border:0;color:#397565;background:transparent;font-size:12px;text-decoration:underline;text-underline-offset:3px}.compact-card,.account-card{width:min(100%,560px);padding:38px;border:1px solid rgba(23,37,34,.1);border-radius:24px;background:#fffffff0;box-shadow:0 24px 70px #233a3421}.account-card{width:min(100%,720px)}.compact-card h1{margin:38px 0 24px;font-size:30px;letter-spacing:-.04em}.account-heading{margin:36px 0 26px}.account-heading h1{margin:0;font-size:38px;letter-spacing:-.045em}.account-heading>p:last-child{margin:8px 0 0;color:#6a7774}.account-sections{display:grid;gap:14px}.security-card{display:grid;gap:16px;padding:22px;border:1px solid #d8e6e1;border-radius:17px;background:#f4faf7}.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.section-label{margin:0 0 5px!important;color:#438273!important;font-size:10px!important;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.security-card h2{margin:0;font-size:17px}.security-card p{margin:7px 0 0;color:#64736f;font-size:13px;line-height:1.7}.status-pill{flex:0 0 auto;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:800}.status-pill--ready{color:#176247;background:#dff3e9}.status-pill--warning{color:#795915;background:#fff0c5}.status-pill--neutral{color:#47635c;background:#e2ece8}.method-row,.passkey-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:13px;border-top:1px solid #dfeae6}.method-row>span{flex:0 0 auto;color:#357361;font-size:11px;font-weight:800}.method-row strong,.passkey-row strong{font-size:13px}.method-row p,.passkey-row p{margin-top:3px;font-size:11px}.passkey-list{display:grid;gap:13px}.small-button,.secondary-button{min-height:38px;padding:0 13px;border:1px solid #ccdcd6;border-radius:10px;color:#285f51;background:#fff;font-size:11px;font-weight:750}.small-button--danger{border-color:#ead5d1;color:#8a4036;background:snow}.secondary-button{width:100%}.account-card>.feedback{margin-top:14px}.account-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:22px}.account-footer p{margin:0;color:#84908d;font-size:10px}@media(max-width:820px){.page-shell{padding:14px}.auth-layout{min-height:calc(100vh - 28px);grid-template-columns:1fr}.story-panel{display:none}.form-panel{padding:34px 28px}.mobile-brand{display:block;margin-bottom:54px}}@media(max-width:520px){.page-shell,.center-screen{padding:0}.auth-layout,.compact-card,.account-card{min-height:100vh;border:0;border-radius:0;box-shadow:none}.form-panel,.compact-card,.account-card{padding:28px 22px}.form-heading h2{font-size:26px}.account-heading h1{font-size:32px}.method-row,.passkey-row,.account-footer{align-items:flex-start}.account-footer{flex-direction:column}}
