:root{--font-display:Georgia,"Times New Roman",serif;--font-sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-sans)}
p,h1,h2{margin:0}h1,h2{text-wrap:balance}a{color:inherit}button{font:inherit;border-radius:var(--radius-none)}
[hidden]{display:none!important}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:var(--border-focus) solid var(--focus);outline-offset:var(--focus-offset)}
.skip{position:absolute;top:-80px;left:16px;padding:12px 24px;background:var(--surface);z-index:2}
.skip:focus{top:8px}
.header{height:80px;max-width:var(--container);margin:auto;padding:0 var(--space-6);display:flex;align-items:center;gap:40px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;min-height:var(--control-md)}.brand img{width:auto;height:20px}
.header-label{border-left:1px solid var(--line-strong);padding-left:32px;color:var(--ink-muted)}
.header-note{margin-left:auto;color:var(--ink-muted)}
.layout{max-width:var(--container);margin:auto;display:grid;grid-template-columns:1.08fr 1fr;min-height:calc(100svh - 145px)}
.story{position:relative;display:flex;flex-direction:column;padding:var(--space-7) var(--space-7) var(--space-6);background:var(--backstage);color:var(--on-backstage)}
.eyebrow{display:flex;align-items:center;gap:var(--space-4);color:var(--on-backstage)}
.eyebrow span{width:6px;height:6px;background:var(--backstage-marker)}
.story h1{font-family:var(--font-display);font-size:48px;font-weight:400;line-height:52px;letter-spacing:-.02em;margin-top:var(--space-6)}
.story-copy{margin-top:var(--space-5);color:var(--on-backstage);max-width:400px}
.illustration-wrap{display:flex;justify-content:center;align-items:center;flex:1;min-height:272px;padding:var(--space-5) 0}
.brand-illustration{width:224px;aspect-ratio:533/606;background:var(--on-backstage);mask:url('maos-e-fio.png') center/contain no-repeat;-webkit-mask:url('maos-e-fio.png') center/contain no-repeat}
.story-footer{margin-top:auto;display:flex;justify-content:space-between;gap:var(--space-4);color:var(--on-backstage)}
.story-footer .t-label{font-size:11px}
.access{padding:var(--space-7);display:flex;align-items:center;justify-content:center;min-width:0}
.access-inner{width:100%;max-width:380px}
.section-label{display:flex;align-items:center;gap:12px;color:var(--ink-muted);margin-bottom:24px}
.entry-symbol{height:13px;width:17px;border-left:2px solid var(--accent);border-right:5px solid var(--line-strong);position:relative}
.entry-symbol:after{content:"";position:absolute;top:0;bottom:0;left:5px;width:2px;background:var(--accent)}
.access h2{font-size:34px;line-height:40px;letter-spacing:-.015em}
.intro{color:var(--ink-muted);margin-top:16px}
.signin{margin-top:var(--space-6)}.account-label{color:var(--ink-muted);margin-bottom:var(--space-3)}
.primary{min-height:var(--control-lg);width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:12px 20px;color:var(--on-action);background:var(--action);border:1px solid var(--action);cursor:pointer;transition:background var(--duration-fast),border-color var(--duration-fast)}
.primary:not(:disabled):hover{background:var(--action-hover);border-color:var(--action-hover)}
.primary:disabled{background:var(--sunken);border-color:var(--line-strong);color:var(--ink-muted);cursor:not-allowed}
.primary svg,.text-button svg,.help svg{height:16px;width:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.primary[aria-busy=true] svg{animation:pulse 1s ease-in-out infinite}
.notice{margin-top:16px;padding:16px;background:var(--warning-soft);display:flex;gap:12px;border-left:2px solid var(--warning)}
.notice-mark{width:5px;height:5px;background:var(--warning);flex:none;margin-top:8px}
.notice-title{font-weight:500}.notice #auth-detail{color:var(--ink-muted);margin-top:var(--space-1)}
.notice[data-state=ready]{background:var(--accent-soft);border-left-color:var(--accent)}
.notice[data-state=ready] .notice-mark{background:var(--accent)}
.text-button{display:flex;align-items:center;gap:12px;min-height:44px;margin-top:4px;padding:8px 0;background:none;border:0;text-decoration:underline;text-underline-offset:3px;cursor:pointer;color:var(--ink-muted)}
.text-button:disabled{cursor:wait}
.help{margin-top:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.help summary{list-style:none;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;font-weight:500}
.help summary::-webkit-details-marker{display:none}
.help[open] summary svg{transform:rotate(45deg)}
.help p{padding:0 24px 20px 0;color:var(--ink-muted)}
.footnote{margin-top:20px;color:var(--ink-muted);font-weight:400;max-width:360px}
.footer{min-height:65px;max-width:var(--container);margin:auto;padding:var(--space-5) var(--space-6);display:flex;justify-content:space-between;gap:var(--space-4);color:var(--ink-muted);border-top:1px solid var(--line)}
@keyframes pulse{50%{opacity:.4}}
@media(min-width:1600px){.layout{min-height:720px}}
@media(max-width:1050px){.story{padding:var(--space-7) var(--space-6) var(--space-6)}.access{padding:var(--space-7) var(--space-6)}.story-footer{flex-direction:column;gap:var(--space-2)}}
@media(max-width:760px){.header{height:80px;padding:0 var(--space-4);gap:var(--space-5)}.header-note{display:none}.header-label{margin-left:auto;padding-left:0;border:0}.layout{grid-template-columns:1fr;min-height:auto}.story{padding:var(--space-6) var(--space-4);display:grid;grid-template-columns:minmax(0,1fr) 96px;column-gap:var(--space-4)}.eyebrow{grid-column:1/-1;gap:var(--space-3)}.story h1{font-size:34px;line-height:40px;margin-top:var(--space-5);grid-column:1/-1}.story-copy{font-size:14px;line-height:21px;margin-top:var(--space-4);align-self:center}.illustration-wrap{grid-column:2;grid-row:3;min-height:0;padding:var(--space-4) 0 0}.brand-illustration{width:96px}.story-footer{display:none}.access{padding:var(--space-7) var(--space-4)}.access-inner{max-width:440px}.section-label{margin-bottom:var(--space-4)}.access h2{font-size:34px;line-height:40px}.intro{font-size:16px;line-height:26px}.signin{margin-top:var(--space-5)}.footer{padding:var(--space-5) var(--space-4);flex-direction:column;gap:var(--space-2)}}
@media(max-width:360px){.intro br,.story-copy br{display:none}.header-label{max-width:100px}.story{grid-template-columns:minmax(0,1fr) 80px}.brand-illustration{width:80px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
