*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;font-family:var(--font-body);color:var(--text);background:var(--paper)}
:root{--content-max:1100px;--gutter:clamp(26px,5.5vw,72px);--rail:40px}
body{font-size:16px;line-height:1.6}
button,a,textarea{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}button,textarea{font:inherit}button{color:inherit;cursor:pointer}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--text);outline-offset:6px}
#pages{height:100vh;height:var(--viewport-height,100vh);overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scroll-behavior:smooth;overscroll-behavior-y:contain}
.page{position:relative;min-height:100vh;min-height:var(--viewport-height,100vh);scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;padding:64px calc(var(--gutter) + var(--rail)) 64px var(--gutter)}
@supports(height:100svh){#pages{height:100svh}.page{min-height:100svh}}
.content{width:100%;max-width:var(--content-max);margin-inline:auto;min-width:0}
h1,h2,h3,p{margin:0}
h1,h2{font-weight:900;letter-spacing:-.055em;line-height:1.15}
h1{font-size:clamp(36px,10.25vw,44px);margin-top:48px;max-width:100%;line-height:1.2}
.slogan-line{display:block}.slogan-line .phrase{display:block}
h2{font-size:clamp(34px,8.7vw,44px)}
.brand-wordmark{display:block;width:clamp(200px,58vw,260px)}
picture img{display:block;width:100%;height:auto}
.hero-subtitle{margin-top:28px;font-size:15px;letter-spacing:.08em;color:var(--muted)}
.swipe{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;flex-direction:column;gap:14px;font-size:11px;letter-spacing:.18em;color:var(--muted);padding:10px 16px}
.swipe i{width:8px;height:8px;border-top:1px solid currentColor;border-left:1px solid currentColor;transform:rotate(45deg);animation:float-up 2.2s ease-in-out infinite}
@keyframes float-up{0%,100%{transform:translateY(3px) rotate(45deg)}50%{transform:translateY(-3px) rotate(45deg)}}
.page-nav{position:fixed;right:max(1px,env(safe-area-inset-right));top:50%;transform:translateY(-50%);z-index:5;display:flex;flex-direction:column}
.page-nav a{width:40px;height:40px;display:grid;place-items:center}
.page-nav span{width:5px;height:5px;border-radius:50%;border:1px solid var(--muted);transition:transform .2s,background-color .2s}
.page-nav a[aria-current] span{background:var(--text);border-color:var(--text);transform:scale(1.45)}
.account-grid{margin-top:32px;display:grid;gap:22px}
.account{border-top:1px solid var(--line);padding-top:20px;min-width:0}
.account-art{height:110px;display:flex;align-items:center;justify-content:flex-start;margin-bottom:14px}
.account-art picture{width:150px;max-height:110px;display:block}
.account-art img{width:auto;height:auto;max-width:150px;max-height:110px}
h3{font-size:19px;font-weight:800;letter-spacing:.02em;line-height:1.3}
.platform{font-size:11px;color:var(--muted);margin-top:5px;letter-spacing:.06em}
.description{font-size:13px;line-height:1.7;margin-top:10px;max-width:100%}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 20px;background:transparent;border:1px solid var(--text);border-radius:0;font-size:12px;letter-spacing:.06em;transition:background-color .2s,color .2s}
.account .button{margin-top:14px}
.button:hover{background:var(--text);color:var(--paper)}
.intro{font-size:17px;margin-top:26px;color:var(--muted)}
.conditions{padding:0;margin:54px 0 0;list-style:none}
.conditions li{display:grid;grid-template-columns:24px 1fr;gap:12px;padding:24px 0;border-top:1px solid var(--line);font-size:clamp(14px,3.6vw,18px);font-weight:600}
.condition-number{font-size:11px;font-weight:400;letter-spacing:.08em;padding-top:4px;color:var(--muted)}
.note{margin-top:24px;font-size:12px;color:var(--muted);letter-spacing:.06em}
.contact-block{margin-top:40px;min-height:60px}
.contact-pending{font-size:19px;color:var(--muted)}
.contact-social{margin-top:48px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.text-link{font-size:12px;letter-spacing:.025em;display:inline-flex;align-items:center;min-height:44px;text-underline-offset:6px}
.text-link:hover{text-decoration:underline}
footer.content{position:absolute;bottom:max(30px,env(safe-area-inset-bottom));left:var(--gutter);width:calc(100% - var(--gutter)*2 - var(--rail));font-size:10px;letter-spacing:.04em;color:var(--muted)}
.email-button{background:none;border:0;padding:0;text-align:left;word-break:break-all;font-size:clamp(18px,4vw,32px);line-height:1.5;max-width:100%}
.email-actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:12px}
.email-status{font-size:12px;color:var(--muted)}
.modal{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(24,33,42,.6)}
.dialog{background:var(--paper);border:1px solid var(--line);padding:30px 26px;width:100%;max-width:420px}
#dialog-message{font-size:18px;font-weight:600;line-height:1.7}
.copy-status{font-size:12px;color:var(--muted);margin-top:12px;min-height:20px}
.dialog-actions{display:flex;gap:12px;margin-top:20px}.button-plain{border-color:var(--line)}
#copy-fallback{width:100%;margin-top:12px;padding:10px;resize:none;border:1px solid var(--line);border-radius:0;min-height:84px;background:var(--surface);color:var(--text);font-size:14px;word-break:break-all;user-select:text}
.reveal{opacity:1;transform:none}
.motion-ready .reveal{transition:opacity .65s ease,transform .65s ease}
.motion-ready .reveal.entering{opacity:0;transform:translateY(18px)}
@media(min-width:760px){
 :root{--rail:0px}.page{padding-block:90px}.page-nav{right:24px}.page-nav a{width:44px;height:44px}
 h1{font-size:clamp(64px,5.5vw,80px);margin-top:56px;line-height:1.15;letter-spacing:-.055em}.slogan-line .phrase{display:inline}
 h2{font-size:clamp(48px,4.5vw,64px)}.brand-wordmark{width:300px}.hero-subtitle{font-size:18px;margin-top:32px}
 .account-grid{grid-template-columns:1fr 1fr;gap:64px;margin-top:64px}.account{padding-top:30px}
 .account-art{height:190px;margin-bottom:32px}.account-art picture{width:260px;max-height:190px}.account-art img{max-width:260px;max-height:190px}
 h3{font-size:26px}.platform{font-size:12px;margin-top:8px}.description{font-size:16px;margin-top:18px}.account .button{margin-top:24px}.button{font-size:13px;min-height:46px}
 .intro{font-size:23px;margin-top:28px}.conditions{margin-top:60px;max-width:880px}.conditions li{font-size:26px;padding:30px 0;grid-template-columns:48px 1fr;gap:24px}.condition-number{font-size:13px;padding-top:12px}.note{font-size:14px;margin-top:30px}
 .contact-block{margin-top:48px}.contact-pending{font-size:28px}.contact-social{max-width:720px;flex-direction:row;gap:48px;margin-top:64px;padding-top:24px}.text-link{font-size:13px}
 footer.content{left:max(var(--gutter),calc((100% - 1100px)/2));font-size:12px}
}
@media(max-width:380px){:root{--gutter:24px;--rail:24px}.page-nav a{width:32px}h1{font-size:38px}.conditions li{grid-template-columns:20px 1fr;gap:8px;font-size:13px}.description{font-size:12px}}
@media(max-height:760px) and (max-width:759px){.page{padding-block:44px}.page-brand{padding-bottom:110px}.account-grid{margin-top:22px;gap:18px}.account-art{height:80px;margin-bottom:10px}.account-art img{max-height:80px;max-width:120px}.account-art picture{max-height:80px;width:120px}.account{padding-top:14px}.account .button{margin-top:10px}.description{margin-top:7px}.swipe{bottom:16px}.page-contact{padding-bottom:100px}}
@media(prefers-reduced-motion:reduce){#pages{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.motion-ready .reveal.entering{opacity:1;transform:none}}

@media(min-width:760px) and (max-width:1200px){:root{--rail:32px}}
