:root{--color-brand-800: #124c3b;--color-brand-700: #175b47;--color-brand-600: #1d7057;--color-brand-500: #2b8066;--color-brand-100: #dceee6;--color-brand-50: #eef7f3;--color-accent-600: #b87511;--color-accent-100: #fff0c9;--color-provider-google: #285ec2;--color-text: #182723;--color-text-secondary: #52645f;--color-text-muted: #667771;--color-surface: #ffffff;--color-surface-soft: #f6faf8;--color-input-surface: #fbfdfc;--color-canvas: #eff4f1;--color-border: #d2ddd8;--color-border-strong: #bdcec7;--color-success: #176247;--color-success-bg: #e4f3eb;--color-success-border: #c3e2d2;--color-warning: #765714;--color-warning-bg: #fff1c7;--color-warning-surface: #fff8e4;--color-warning-border: #ead7a1;--color-danger: #873b35;--color-danger-bg: #fbedeb;--color-danger-surface: #fffafa;--color-danger-border: #e4c9c5;--color-neutral-status: #405f56;--color-neutral-status-bg: #e3ece8;--color-focus: #087a5c;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--radius-control: 10px;--radius-card: 16px;--radius-shell: 24px;--shadow-card: 0 12px 36px rgb(26 59 49 / 9%);--shadow-shell: 0 24px 64px rgb(26 59 49 / 12%);color:var(--color-text);background:var(--color-canvas);font-family:Inter,Noto Sans JP,Hiragino Sans,Hiragino Kaku Gothic ProN,Yu Gothic,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{color-scheme:light}body{min-width:320px;min-height:100vh;margin:0;line-height:1.6}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.52}:where(button,input,a):focus-visible{outline:2px solid var(--color-focus);outline-offset:3px}[hidden]{display:none!important}.page-shell,.center-screen{min-height:100vh;min-height:100dvh;padding:var(--space-6);background:radial-gradient(circle at 12% 5%,rgb(255 225 158 / 35%),transparent 28rem),radial-gradient(circle at 92% 88%,rgb(63 135 109 / 18%),transparent 32rem),var(--color-canvas)}.center-screen{display:flex;flex-direction:column;gap:var(--space-5);align-items:center;justify-content:center}.center-screen>p{max-width:34rem;margin:0;color:var(--color-text-secondary);text-align:center}.account-screen{justify-content:flex-start}.auth-layout{display:grid;width:min(100%,1040px);min-height:calc(100vh - 48px);min-height:calc(100dvh - 48px);grid-template-columns:1.05fr .95fr;margin:auto;overflow:hidden;border:1px solid rgb(24 39 35 / 10%);border-radius:var(--radius-shell);background:#fffffff0;box-shadow:var(--shadow-shell)}.story-panel{display:flex;flex-direction:column;justify-content:space-between;padding:var(--space-12);color:var(--color-surface);background:linear-gradient(145deg,var(--color-brand-800),var(--color-brand-600))}.brand{display:inline-flex;gap:10px;align-items:center;color:var(--color-text);font-size:18px;font-weight:650;line-height:1.25}.brand-mark{display:grid;width:36px;height:36px;flex:0 0 auto;place-items:center;border-radius:10px;color:var(--color-surface);background:var(--color-accent-600);font:italic 24px/1 Georgia,serif}.story-panel .brand{color:var(--color-surface)}.story-panel .brand-mark{color:var(--color-brand-800);background:var(--color-accent-100)}.eyebrow,.step-label,.section-label{margin:0 0 var(--space-3);color:var(--color-accent-600);font-size:12px;font-weight:650;letter-spacing:.06em;line-height:1.4;text-transform:uppercase}.story-panel h1{max-width:470px;margin:0;font-size:clamp(38px,5.2vw,60px);font-weight:700;letter-spacing:0;line-height:1.2}.lead{max-width:450px;margin:var(--space-6) 0 0;color:#ffffffc7;line-height:1.9}.security-note{margin:0;color:#ffffffb3;font-size:12px}.form-panel{display:flex;flex-direction:column;justify-content:center;padding:var(--space-10) var(--space-12)}.mobile-brand{display:none}.form-heading{margin-bottom:var(--space-6)}.form-heading h2{margin:0;font-size:30px;font-weight:700;letter-spacing:0;line-height:1.35}.step-label{color:var(--color-brand-600)}.primary-methods{display:grid;gap:10px}.passkey-sign-in{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:var(--space-2);align-items:center}.passkey-help{position:relative}.passkey-help__popover{position:absolute;z-index:10;top:calc(100% + 10px);right:0;width:min(310px,calc(100vw - 48px));padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-card);color:var(--color-text);background:var(--color-surface);box-shadow:var(--shadow-card)}.passkey-help__popover strong{font-size:14px;font-weight:650}.passkey-help__popover ul{display:grid;gap:var(--space-2);margin:var(--space-3) 0 0;padding-left:var(--space-5)}.passkey-help__popover li{color:var(--color-text-secondary);font-size:13px;line-height:1.6}.google-mark{color:var(--color-provider-google);font-family:Arial,sans-serif;font-weight:700}.method-hint{margin:0;color:var(--color-text-secondary);font-size:12px;line-height:1.6;text-align:center}.divider{display:flex;gap:var(--space-3);align-items:center;margin:var(--space-1) 0;color:var(--color-text-muted);font-size:12px}.divider:before,.divider:after{height:1px;flex:1;background:var(--color-border);content:""}form{display:grid;gap:var(--space-4)}.ui-field{display:grid;gap:var(--space-2);color:var(--color-text-secondary);font-size:14px}.ui-field>span{font-weight:600}input{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--color-border-strong);border-radius:var(--radius-control);outline:2px solid transparent;color:var(--color-text);background:var(--color-input-surface);transition:border-color .14s ease,box-shadow .14s ease,background .14s ease}input::placeholder{color:var(--color-text-muted);opacity:1}input:focus{border-color:var(--color-brand-600);background:var(--color-surface);box-shadow:0 0 0 4px #087a5c1f}.ui-button{display:inline-flex;gap:10px;align-items:center;justify-content:center;border:1px solid transparent;border-radius:var(--radius-control);cursor:pointer;font-weight:600;line-height:1.35;text-align:center;text-decoration:none;transition:transform .14s ease,border-color .14s ease,background .14s ease,box-shadow .14s ease}.ui-button--medium{min-height:48px;padding:10px 16px;font-size:14px}.ui-button--small{min-height:44px;padding:8px 12px;font-size:13px}.ui-button--block{width:100%}.ui-button--primary{color:var(--color-surface);background:var(--color-brand-600)}.ui-button--secondary{border-color:var(--color-border-strong);color:var(--color-brand-800);background:var(--color-surface)}.ui-button--danger{border-color:var(--color-danger-border);color:var(--color-danger);background:var(--color-danger-surface)}.ui-button--auth,.ui-button--passkey{border-color:var(--color-border);color:var(--color-text);background:var(--color-surface)}.ui-button--passkey{border-color:var(--color-success-border);color:var(--color-brand-700);background:var(--color-brand-50)}.ui-button--icon{width:44px;min-height:44px;padding:0;border-color:var(--color-border-strong);border-radius:50%;color:var(--color-brand-700);background:var(--color-surface);font-size:15px}.ui-button--text{min-height:44px;padding:8px 6px;border:0;color:var(--color-brand-700);background:transparent;font-size:13px;font-weight:550;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}@media(hover:hover){.ui-button--primary:hover:not(:disabled){background:var(--color-brand-700);box-shadow:0 8px 20px #175b4729;transform:translateY(-1px)}.ui-button--secondary:hover:not(:disabled),.ui-button--auth:hover:not(:disabled),.ui-button--passkey:hover:not(:disabled),.ui-button--icon:hover:not(:disabled){border-color:var(--color-brand-500);background:var(--color-brand-50)}.ui-button--text:hover:not(:disabled){color:var(--color-brand-800);text-decoration-thickness:2px}}.feedback{margin:0;padding:var(--space-3) var(--space-4);border:1px solid transparent;border-radius:var(--radius-control);font-size:13px;line-height:1.65}.feedback--success{border-color:var(--color-success-border);color:var(--color-success);background:var(--color-success-bg)}.feedback--error{border-color:var(--color-danger-border);color:var(--color-danger);background:var(--color-danger-bg)}.feedback--notice{border-color:var(--color-warning-border);color:var(--color-warning);background:var(--color-warning-surface)}.form-nav{display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-3);justify-content:center;margin-top:var(--space-4)}.ui-card{border:1px solid rgb(24 39 35 / 10%);background:#fffffff5}.ui-card--compact,.ui-card--account{width:min(100%,580px);padding:var(--space-10);border-radius:var(--radius-shell);box-shadow:var(--shadow-shell)}.ui-card--account{width:min(100%,760px)}.ui-card--compact h1{margin:var(--space-10) 0 var(--space-6);font-size:30px;font-weight:700;letter-spacing:0;line-height:1.35}.consent-card{width:min(100%,640px)}.consent-heading{margin:var(--space-8) 0 var(--space-6)}.consent-heading h1{margin:0;font-size:28px;font-weight:700;letter-spacing:0;line-height:1.45;overflow-wrap:anywhere}.consent-heading>p:last-child{margin:var(--space-3) 0 0;color:var(--color-text-secondary);font-size:14px;line-height:1.7;overflow-wrap:anywhere}.scope-list{overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface-soft)}.scope-row{display:flex;gap:var(--space-3);padding:var(--space-4)}.scope-row+.scope-row{border-top:1px solid var(--color-border)}.scope-row strong{font-size:14px;font-weight:650}.scope-row p{margin:var(--space-1) 0 0;color:var(--color-text-secondary);font-size:13px;line-height:1.65}.scope-check{display:grid;width:24px;height:24px;flex:0 0 auto;place-items:center;border-radius:50%;color:var(--color-surface);background:var(--color-brand-600);font-size:12px;font-weight:700}.consent-note{margin:var(--space-4) 0;color:var(--color-text-secondary);font-size:12px;line-height:1.7}.consent-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:var(--space-3);margin-top:var(--space-5)}.account-heading{margin:var(--space-8) 0 var(--space-6)}.account-heading h1{margin:0;font-size:clamp(32px,6vw,40px);font-weight:700;letter-spacing:0;line-height:1.3;overflow-wrap:anywhere}.account-heading>p:last-child{margin:var(--space-2) 0 0;color:var(--color-text-secondary);overflow-wrap:anywhere}.account-sections{display:grid;gap:var(--space-4)}.ui-card--section{display:grid;gap:var(--space-4);padding:var(--space-5);border-color:var(--color-border);border-radius:var(--radius-card);background:var(--color-surface-soft)}.section-heading{display:flex;gap:var(--space-4);align-items:flex-start;justify-content:space-between}.section-heading>div{min-width:0}.section-label{margin:0 0 var(--space-1);color:var(--color-brand-600);font-size:11px}.ui-card--section h2{margin:0;font-size:18px;font-weight:650;line-height:1.4;overflow-wrap:anywhere}.ui-card--section p{margin:var(--space-2) 0 0;color:var(--color-text-secondary);font-size:13px;line-height:1.7}.status-pill{width:fit-content;flex:0 0 auto;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:650;line-height:1.4;white-space:nowrap}.status-pill--success{color:var(--color-success);background:var(--color-success-bg)}.status-pill--warning{color:var(--color-warning);background:var(--color-warning-bg)}.status-pill--neutral{color:var(--color-neutral-status);background:var(--color-neutral-status-bg)}.method-row,.passkey-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-4);align-items:center;padding-top:var(--space-3);border-top:1px solid var(--color-border)}.method-row>div,.passkey-row>div{min-width:0}.method-row>span{color:var(--color-brand-700);font-size:12px;font-weight:600;white-space:nowrap}.method-row strong,.passkey-row strong{font-size:14px;font-weight:650;overflow-wrap:anywhere}.method-row p,.passkey-row p{margin-top:var(--space-1);font-size:12px}.passkey-list{display:grid;gap:var(--space-3)}.ui-card--account>.feedback{margin-top:var(--space-4)}.account-footer{display:flex;gap:var(--space-4);align-items:center;justify-content:space-between;margin-top:var(--space-5)}.account-footer p{margin:0;color:var(--color-text-muted);font-size:12px;line-height:1.6}@media(max-width:820px){.page-shell{padding:var(--space-3)}.auth-layout{min-height:calc(100vh - 24px);min-height:calc(100dvh - 24px);grid-template-columns:1fr}.story-panel{display:none}.form-panel{padding:var(--space-8)}.mobile-brand{display:block;margin-bottom:var(--space-10)}}@media(max-width:600px){.page-shell,.center-screen{padding:0}.auth-layout,.ui-card--compact,.ui-card--account{min-height:100vh;min-height:100dvh;border:0;border-radius:0;box-shadow:none}.form-panel,.ui-card--compact,.ui-card--account{padding:var(--space-6) var(--space-5)}.form-heading h2{font-size:26px}.ui-card--compact h1{margin-top:var(--space-8);font-size:27px}.consent-heading h1{font-size:24px}.account-heading{margin-top:var(--space-6)}.account-heading h1{font-size:32px}.ui-card--section{padding:var(--space-4)}.section-heading{flex-wrap:wrap}.method-row,.passkey-row{gap:var(--space-3);align-items:start}.account-footer{flex-direction:column;align-items:flex-start}}@media(max-width:380px){.form-panel,.ui-card--compact,.ui-card--account{padding-right:var(--space-4);padding-left:var(--space-4)}.consent-actions,.method-row{grid-template-columns:1fr}.method-row>span{white-space:normal}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}