.social-page{min-height:100vh;font-size:16px}.social-header,.social-main,.social-footer{width:min(100% - 64px,1120px);margin-inline:auto}.social-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:20px;padding-block:24px;display:flex}.social-brand,.social-header nav{align-items:center;gap:24px;display:flex}.social-brand-label{border-left:1px solid var(--line);color:var(--secondary);padding-left:24px;font-size:14px}.social-header nav>a,.social-brand-label,.social-back{align-items:center;min-height:44px;display:inline-flex}.social-header nav{font-size:14px}.social-header nav>a:hover,.social-brand-label:hover{color:var(--leaf-dark);text-underline-offset:4px;text-decoration:underline}.social-main{padding-block:32px 64px}.social-main>*,.social-mode-grid>*,.social-game-preview-grid>*{min-width:0}.social-page-heading{margin-bottom:28px}.social-page-heading h1{margin-top:12px;font-size:clamp(28px,4vw,40px);line-height:1.3}.social-page .button,.social-auth .button{white-space:normal;text-align:center;min-height:44px;font-size:15px}.social-hero{max-width:780px;padding:38px 0 58px}.social-hero .eyebrow{align-items:center;gap:10px;font-size:12px;display:flex}.social-hero h1{letter-spacing:-2px;text-wrap:balance;margin:22px 0 26px;font-size:clamp(44px,6.5vw,76px);line-height:1.15}.social-hero h1 em{color:var(--leaf)}.social-hero-description{max-width:620px;color:var(--secondary);font-size:18px;line-height:1.85}.social-hero-actions{flex-wrap:wrap;gap:12px;margin:28px 0 18px;display:flex}.social-hero-note{color:var(--secondary);align-items:flex-start;gap:8px;font-size:14px;display:flex}.social-hero-note svg{flex-shrink:0;margin-top:3px}.social-section{margin-top:36px;scroll-margin-top:24px}.social-section+.social-section{margin-top:68px}.social-section-heading{margin-bottom:26px}.social-section-heading h2,.social-create-banner h2,.social-faq h2{text-wrap:balance;margin-top:8px;font-size:clamp(25px,3.2vw,34px);line-height:1.4}.social-section-heading>p:last-child{max-width:730px;color:var(--secondary);margin-top:12px}.social-section-heading-row{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.social-section-heading-row>a{flex-shrink:0;min-height:44px}.social-mode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.social-mode-card{border:1px solid var(--line);background:var(--surface);border-radius:22px;flex-direction:column;padding:32px;display:flex}.social-mode-phone{background:var(--leaf-soft)}.social-mode-top{justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px;display:flex}.social-mode-icon{border:1px solid var(--line);width:56px;height:56px;color:var(--leaf-dark);background:var(--paper);border-radius:18px;justify-content:center;align-items:center;display:inline-flex}.social-mode-tag{color:var(--leaf-dark);font-size:13px;font-weight:600}.social-mode-card h3{font-size:28px;line-height:1.4}.social-mode-card>p{color:var(--secondary);margin-top:14px;line-height:1.85}.social-mode-phone>p{color:var(--ink)}.social-mode-card ul{margin:20px 0 28px;padding-left:20px;font-size:15px;line-height:1.8}.social-mode-card li+li{margin-top:8px}.social-mode-card>.button{align-self:flex-start;margin-top:auto}.social-game-preview-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.social-game-preview{border:1px solid var(--line);background:var(--surface);border-radius:18px;overflow:hidden}.social-game-preview>div:last-child{padding:22px}.social-game-preview h3{margin-bottom:10px;font-size:22px;line-height:1.4}.social-game-preview h3 a,.social-faq a,.social-auth-alternative a{text-underline-offset:4px;text-decoration:underline}.social-game-preview p{color:var(--secondary);font-size:15px}.social-create-banner{border-block:1px solid var(--line);background:var(--inset);align-items:center;gap:26px;margin-top:64px;padding:32px;display:flex}.social-create-banner>svg,.social-create-banner>.button{flex-shrink:0}.social-create-banner h2{font-size:27px}.social-create-banner p:last-child{color:var(--secondary);margin-top:12px}.social-faq{max-width:840px;margin-top:64px}.social-faq h2{margin-bottom:20px}.social-faq details{border-bottom:1px solid var(--line);padding:16px 0}.social-faq summary{cursor:pointer;align-content:center;min-height:44px;font-weight:600}.social-faq summary:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.social-faq details p{color:var(--secondary);margin:12px 0 8px;line-height:1.9}.social-footer{border-top:1px solid var(--line);color:var(--secondary);padding-block:26px;font-size:13px}.social-footer>p{margin-bottom:16px}.social-auth .auth-card>p.muted,.social-auth .auth-story>p:not(.eyebrow),.social-auth .field,.social-auth .auth-switch{font-size:16px}.social-auth .field input{min-height:46px;font-size:16px}.social-auth-alternative{color:var(--secondary);margin-top:20px;font-size:14px}.social-page .legal-links,.social-auth .legal-links,.social-auth .legal-help,.social-auth .legal-check,.social-auth .legal-agreement legend,.social-auth .legal-agreement-note{font-size:14px}@media (prefers-reduced-motion:reduce){.social-page .button,.social-auth .button{transition:none}.social-page .button:hover,.social-auth .button:hover{transform:none}}@media (max-width:980px){.social-brand-label{display:none}.social-create-banner{flex-wrap:wrap}.social-create-banner>div{flex:70%}.social-game-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.social-section-heading-row{flex-wrap:wrap;gap:12px}}@media (max-width:680px){.social-header,.social-main,.social-footer{width:calc(100% - 40px)}.social-header{flex-wrap:wrap;align-items:flex-start;gap:14px;padding-block:20px 12px}.social-header nav{justify-content:space-between;gap:12px;width:100%}.social-header nav>.button{padding-inline:14px;font-size:14px}.social-main{padding-top:20px}.social-hero{padding:24px 0 22px}.social-hero h1{letter-spacing:-1.5px}.social-hero-description{font-size:16px}.social-mode-grid,.social-game-preview-grid{grid-template-columns:minmax(0,1fr)}.social-mode-card{padding:24px}.social-mode-card h3{font-size:25px}.social-mode-card>.button{width:100%}.social-create-banner{gap:18px;padding:24px}.social-create-banner>div{flex-basis:100%}.social-create-banner>.button{width:100%}.social-auth .public-header{flex-wrap:wrap;gap:18px}.social-auth .public-header>.text-button{min-height:44px}}
