/* Shared readable typography and themes for every public page. */
:root{color-scheme:light;--ink:#251c32;--muted:#63566f;--purple:#623ac5;--line:#ddd2e9;--pale:#f5f0fc;--page:#fff;--surface:#fff;--surface-alt:#f7f3fc;--accent:#6035b9;--shadow:#3b205716;--social-bg:#f2f7ff;--social-ink:#254b77;--social-muted:#506884}
:root[data-theme=dark]{color-scheme:dark;--ink:#f4eefb;--muted:#c0b3cd;--purple:#c1a0ff;--line:#4a395e;--pale:#251c32;--page:#17121f;--surface:#21192c;--surface-alt:#2b203a;--accent:#ccb1ff;--shadow:#08050d60;--social-bg:#192a42;--social-ink:#c5dcff;--social-muted:#acbfda}
body{background:var(--page);color:var(--ink);font-size:16px;line-height:1.7}
button,input,textarea,select{font-family:Manrope,system-ui,sans-serif}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--purple);outline-offset:4px}
.brand small{font-size:12px;line-height:1.45;letter-spacing:0;color:var(--muted)}
.preview-strip{font-size:12px;color:var(--muted);background:var(--pale)}
header{background:var(--surface);border-color:var(--line)}
.header-inner{gap:20px;min-height:98px;height:auto;padding-top:12px;padding-bottom:12px}
.header-inner nav{font-size:14px;color:var(--muted);gap:23px}
.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;position:relative}
.header-actions .theme-control{position:static}
.header-actions .theme-options{right:0}
.button{font-size:14px;min-height:48px;color:var(--ink);background:var(--surface);border-color:var(--line)}
.button.primary{color:#fff;background:linear-gradient(110deg,#7040d5,#6032c1);border-color:transparent}
.button.secondary{background:var(--surface)}
.button.white{background:#fff;color:#5732a6;border-color:#fff}
.button.small{min-height:44px;font-size:14px}
.hero{background:linear-gradient(160deg,var(--page) 15%,var(--surface-alt) 100%)}
h1{white-space:normal}h1 em{background:linear-gradient(95deg,#6236c7,#8253dd);background-clip:text;color:transparent}
.status-label{font-size:13px;color:var(--accent);background:var(--surface);border-color:var(--line)}
.lead strong{font-size:19px;color:var(--ink);line-height:1.65}
.lead>span{font-size:16px;color:var(--muted);line-height:1.75}
.hero-examples>p{font-size:14px;color:var(--muted)}
.hero-examples li{font-size:13px;color:var(--accent);background:var(--pale);border-color:var(--line)}
.hero-examples small{font-size:13px;color:var(--muted);line-height:1.75}
.release-line,.hero-note,.hero-bottom,.hero-bottom>a{font-size:13px;color:var(--muted)}
.hero-note br{display:none}.hero-bottom{border-color:var(--line);flex-wrap:wrap;gap:20px}
.hero-community{font-size:14px;color:var(--social-ink);min-height:44px}
.hero-community:hover{background:var(--social-bg);color:var(--social-ink)}
.platform-note{display:flex;align-items:center;gap:9px;margin:12px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
.platform-note svg{width:19px;height:19px}.platform-note b{color:var(--ink);font-weight:650}
.eyebrow{font-size:12px;color:var(--accent);letter-spacing:.13em}
.section-heading>p,.category-card p,.feature-card p,.faq-layout>div>p:not(.eyebrow),.faq-list details p{font-size:16px;color:var(--muted);line-height:1.8}
.section-note{font-size:14px;color:var(--muted);max-width:900px}
.category-card,.feature-card{background:var(--surface-alt);border-color:var(--line)}
.category-card h3,.feature-card h3{font-size:21px;line-height:1.4}
.feature-support{background:var(--surface-alt)}.feature-support a{font-size:15px;color:var(--accent)}
.feature-symbol{color:var(--accent)}
.how-section .section-heading>p,.steps p{font-size:16px;color:#e3d7f2}
.how-section .eyebrow{color:#e4cffd}.steps h3{font-size:20px}.step-number{color:#cdb0eb;font-size:30px}
.steps article{padding-right:34px}.steps p{max-width:none}.steps svg{color:#d7bafd}
.launch-card{background:linear-gradient(110deg,#56309e,#653ab5 65%,#7548c4)}
.launch-card .eyebrow,.launch-card p:not(.eyebrow),.launch-mail{color:#fff;font-size:16px}
.launch-card .eyebrow{font-size:12px}.launch-card .launch-version{font-size:13px;color:#f2eaff}
.launch-card .platform-note{color:#f2eaff;font-size:14px}.launch-card .platform-note b{color:#fff}
.faq-list summary{font-size:16px;padding-top:22px;padding-bottom:22px}.faq-list summary:after{color:var(--accent)}
.faq-list details p a{text-decoration:underline;text-underline-offset:3px;color:var(--accent)}
.contact-link{font-size:15px;color:var(--accent)}
footer{background:var(--surface-alt);border-color:var(--line)}
.footer-links{font-size:14px;color:var(--muted);gap:12px}.footer-links b{font-size:15px;color:var(--ink)}
.footer-top>div>p,.footer-bottom{font-size:13px;color:var(--muted)}.footer-bottom{border-color:var(--line)}
.community-card,.social-link,.dialog-vk{background:var(--social-bg);border-color:var(--line);color:var(--social-ink)}
.community-card b,.social-link b,.dialog-vk b{font-size:14px;color:var(--social-ink)}
.community-card small,.social-link small,.dialog-vk small{font-size:13px;color:var(--social-muted)}
.community-card:hover,.social-link:hover,.dialog-vk:hover{background:var(--social-bg);border-color:var(--social-muted)}
.footer-contact .email-link{font-size:14px;color:var(--muted)}
.footer-contact .footer-social,.footer-contact .email-link{display:flex;align-items:center;gap:10px;width:fit-content;max-width:100%;min-height:28px;font-size:14px;line-height:1.7;font-weight:400;color:var(--muted)}
.footer-contact .footer-social:hover,.footer-contact .email-link:hover{color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.footer-contact .email-link svg{width:20px;height:20px;flex:0 0 20px}
.vk-monogram{display:block;width:20px;height:20px;flex:0 0 20px;background:currentColor;-webkit-mask:url('/assets/brand/vk-monogram.svg') center/contain no-repeat;mask:url('/assets/brand/vk-monogram.svg') center/contain no-repeat}
:root[data-theme=dark] .brand img{content:url('/assets/brand/lockup-symbol-white.svg')}
dialog{background:var(--surface);border-color:var(--line);width:min(540px,calc(100% - 32px));color:var(--ink)}
dialog>p:not(.eyebrow){font-size:16px;color:var(--muted);line-height:1.8}
.dialog-close{background:var(--pale);color:var(--accent);border-color:var(--line)}
.dialog-close:hover,.dialog-close:active{background:var(--surface-alt);color:var(--ink)}
.dialog-icon{background:var(--pale);border-color:var(--line);color:var(--accent)}
.gate-page article{background:var(--surface-alt);border-color:var(--line)}
.gate-page article>p:not(.eyebrow){font-size:16px;color:var(--muted)}
.testing-card{background:var(--surface-alt);border-color:var(--line)}
.testing-intro,.testing-card form>label:not(.testing-consent){font-size:16px;color:var(--muted)}
.testing-card form>label:not(.testing-consent){color:var(--ink)}
.testing-card input:not([type=checkbox]),.testing-card textarea{font-size:16px;background:var(--surface);border-color:var(--line);color:var(--ink)}
.testing-card input::placeholder,.testing-card textarea::placeholder{color:var(--muted);opacity:1}
.field-help,.testing-consent,.testing-notice{font-size:14px;color:var(--muted)}
.testing-local{font-size:13px;color:#755014}.testing-footer{font-size:14px;color:var(--muted)}
#testing-status{font-size:15px;color:#a02350}#testing-success p{font-size:16px;color:var(--muted)}#testing-number{font-size:14px!important}
.testing-consent input{width:20px;height:20px;flex-basis:20px;accent-color:var(--purple)}
.testing-notice summary{padding:7px 0;min-height:40px}
.standalone-header{display:flex;align-items:center;justify-content:space-between;gap:18px}
/* The miniature is illustrative, but its labels still need to be legible. */
.float-tag{font-size:13px;color:var(--ink);background:var(--surface);border-color:var(--line)}
.concept-window,.concept-top,.concept-row{background:var(--surface);border-color:var(--line)}
.concept-search,.concept-progress{background:var(--surface-alt);border-color:var(--line);color:var(--muted)}
.concept-pill,.concept-avatar{background:var(--pale);color:var(--accent);border-color:var(--line)}
.concept-heading small{font-size:11px;color:var(--accent)}.concept-heading h3{font-size:18px;line-height:1.4}
.concept-pill,.concept-search,.concept-row small,.concept-progress>div,.device-label{font-size:11px;color:var(--muted)}
.concept-row b{font-size:13px;line-height:1.5}.concept-row small{line-height:1.6}.concept-row>span{color:var(--accent)}
.concept-row{min-width:0}.concept-row>div{min-width:0}.concept-row>span{flex-shrink:0}
.concept-caption{font-size:12px;color:var(--muted);line-height:1.7}
.concept-device{background:var(--pale);justify-content:center}.phone-wallpaper>span{display:none}
.window-controls{color:var(--muted)}.progress-track{background:var(--line)}
/* Theme picker: a compact control with three explicit choices. */
.theme-control{position:relative;flex-shrink:0;z-index:30}
.theme-trigger{display:flex;align-items:center;justify-content:center;gap:8px;min-width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--muted);padding:0 12px;font-size:14px;font-weight:650;box-shadow:0 3px 12px var(--shadow)}
.theme-trigger svg{width:19px;height:19px}.theme-trigger .theme-chevron{width:14px;height:14px}
.theme-trigger:hover,.theme-trigger[aria-expanded=true]{background:var(--pale);color:var(--accent);border-color:var(--purple)}
.theme-options{position:absolute;right:0;top:calc(100% + 10px);width:236px;padding:9px;background:var(--surface);border:1px solid var(--line);border-radius:19px;box-shadow:0 16px 50px var(--shadow)}
.theme-options>p{margin:7px 10px 10px;font-size:12px;font-weight:700;color:var(--muted)}
.theme-options>button{display:flex;width:100%;min-height:46px;align-items:center;gap:11px;padding:10px;border:0;border-radius:11px;color:var(--ink);background:transparent;text-align:left;font-size:14px}
.theme-options>button svg{width:20px;height:20px}.theme-options>button:hover{background:var(--surface-alt)}
.theme-options>button[aria-pressed=true]{background:var(--pale);color:var(--accent);font-weight:750}
.theme-check{margin-left:auto;visibility:hidden}.theme-options>button[aria-pressed=true] .theme-check{visibility:visible}
:root[data-theme=dark] h1 em{background-image:linear-gradient(95deg,#b28afc,#deceff)}
:root[data-theme=dark] .hero-glow{opacity:.35}
:root[data-theme=dark] .skip,:root[data-theme=dark] #menu-toggle{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme=dark] #menu-toggle span{background:var(--muted)}
:root[data-theme=dark] .header-inner nav{background:var(--surface)}
:root[data-theme=dark] .testing-local{background:#382b18;color:#efce92}
:root[data-theme=dark] #testing-status{color:#ffb2ca}
:root[data-theme=dark] .purple,:root[data-theme=dark] .art-bank{background:#352449;color:#c9a6ff}
:root[data-theme=dark] .mint,:root[data-theme=dark] .art-chat{background:#193c36;color:#a2d5c3}
:root[data-theme=dark] .peach,:root[data-theme=dark] .art-map{background:#423023;color:#e6be9c}
:root[data-theme=dark] .mini-collection span{background:var(--pale);border-color:var(--line);color:var(--accent)}
@media(max-width:1100px){.header-inner{gap:14px}.header-inner nav{gap:16px}.theme-trigger>span,.theme-chevron{display:none!important}.theme-trigger{width:44px;padding:0}.brand small{font-size:12px}.hero-actions .button{font-size:14px}.concept-row b{font-size:12px}.concept-heading h3{font-size:16px}}
@media(max-width:850px){.header-inner nav{top:100%;font-size:16px;background:var(--surface)}.header-actions{margin-left:auto}.login-link{margin-left:0}.hero-bottom{font-size:13px;gap:15px}.platform-note{justify-content:center}.launch-card .platform-note{justify-content:flex-start}.section-heading>p{font-size:16px}.lead strong{font-size:19px}.lead>span{font-size:16px}.hero-art{width:min(570px,95%)}.float-tag{font-size:13px}.footer-top{gap:28px}}
@media(max-width:540px){.header-inner{gap:8px;min-height:94px;padding:10px 0}.header-inner .brand{max-width:155px;gap:7px}.header-inner .brand>span{min-width:0}.header-inner .brand img{width:28px;height:43px}.header-inner .brand b{font-size:25px;letter-spacing:-1px}.header-inner .brand small{font-size:12px;line-height:1.35}.header-actions{gap:6px}#menu-toggle{width:44px;height:44px}.login-link{font-size:14px;padding:8px 10px!important;min-height:44px!important}.button,.hero-actions .button{font-size:15px}.brand small{font-size:12px}.lead strong{font-size:18px}.lead>span{font-size:16px}.hero-examples>p{font-size:14px}.hero-examples li{font-size:13px}.hero-examples small,.release-line,.hero-note{font-size:13px}.hero-community{font-size:13px}.eyebrow{font-size:12px}.section-note{font-size:14px}.category-card{padding:25px}.category-art{position:relative;left:auto;top:auto;margin-bottom:23px}.category-card h3{font-size:21px}.category-card p,.feature-card p,.steps p{font-size:16px}.steps article{padding-left:42px;padding-right:30px}.steps h3{font-size:20px}.steps .step-number{font-size:25px}.launch-card p:not(.eyebrow),.launch-mail{font-size:16px}.launch-card .launch-version{font-size:13px}.footer-top{grid-template-columns:1fr}.footer-top>div:first-child,.footer-contact{grid-column:auto}.footer-links{font-size:14px}.footer-top>div>p,.footer-bottom{font-size:13px}.community-card small,.social-link small,.dialog-vk small{font-size:13px}.dialog-vk b{font-size:14px}.dialog-actions{flex-direction:column}.dialog-actions .button{width:100%}.dialog-vk{gap:8px}.dialog-vk .social-arrow{display:none}.concept-heading h3{font-size:16px}.concept-heading small{font-size:11px}.concept-search{font-size:11px}.concept-row b{font-size:12px}.concept-row small{font-size:11px}.concept-row>span{display:none}.concept-progress>div,.device-label{font-size:11px}.concept-caption{font-size:12px}.concept-window{transform:none}.float-tag{font-size:12px}.concept-layout{grid-template-columns:minmax(0,1fr) 78px}.concept-row{gap:7px}.concept-row .tile-icon{width:23px;height:23px}.platform-note{font-size:13px}.standalone-header{flex-wrap:wrap}.standalone-header .theme-control{margin-left:auto}.testing-card .button{font-size:15px}.testing-intro{font-size:16px}}
@media(max-width:359px){.header-inner{flex-wrap:wrap}.header-inner>.brand{max-width:none}.header-inner .brand small{font-size:12px}.header-actions{margin-left:auto}.header-inner>.brand{flex-basis:100%}.theme-options{right:-124px}.standalone-header .theme-options{right:0}.hero-actions .button{max-width:none}.concept-layout{grid-template-columns:1fr}.concept-device{display:none}.concept-search{font-size:12px}.concept-row b{font-size:13px}.concept-row small{font-size:12px}.concept-pill{display:none}.concept-caption{text-align:left}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
@media(min-width:360px) and (max-width:379px){.header-inner .brand{max-width:135px}.header-inner .brand b{font-size:23px}}
/* Illustrative installation: three apps, one coordinated timeline. */
.progress-track i{animation:none;transform:scaleX(1)}
.concept-row{transition:border-color .3s,box-shadow .3s,background .3s}
.concept-row.is-current{border-color:var(--purple);background:var(--pale);box-shadow:0 0 0 1px var(--purple)}
.concept-row.is-installed>span{color:#247454}
:root[data-theme=dark] .concept-row.is-installed>span{color:#92dbb8}
.phone-apps{gap:4px;margin-top:14px}
.phone-apps i{display:grid;place-items:center;width:18px;height:18px;border-radius:5px;background:#ffffff85;color:#7352b1}
:root .phone-apps i:not(.is-installed){background:#ffffff85;color:#7352b1}
.phone-apps i svg{width:12px;height:12px;opacity:0;transform:scale(.7);transition:opacity .25s,transform .3s}
.phone-apps .is-installing svg{opacity:.4;transform:scale(.85)}
.phone-apps .is-installed svg{opacity:1;transform:scale(1)}
.phone-apps .is-installed.purple{background:#7853cf;color:white}.phone-apps .is-installed.mint{background:#287b69;color:white}.phone-apps .is-installed.peach{background:#a45b28;color:white}
.phone-apps .just-installed{animation:app-arrive .55s ease-out both}
.concept-window[data-install-phase=done] .phone-drawing{box-shadow:0 0 0 3px #5fc69755,0 7px 18px #5c388d23;transition:box-shadow .4s}
.concept-window[data-install-phase=done] .device-label{color:#247454}:root[data-theme=dark] .concept-window[data-install-phase=done] .device-label{color:#92dbb8}
.concept-progress>div{min-height:2.8em}.concept-progress svg{flex-shrink:0}.concept-progress [data-concept-status]{line-height:1.4}
.concept-caption{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}.concept-caption p{margin:0;flex:1;min-width:180px}
.hero-art .tag-map{top:8px;bottom:auto;left:36%}
@media(max-width:1100px){.hero-art .tag-map{display:none}}
.concept-animation-toggle{display:flex;align-items:center;justify-content:center;gap:5px;min-width:76px;min-height:36px;padding:5px 8px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--muted);font-size:12px;cursor:pointer}
.concept-animation-toggle[hidden]{display:none}.concept-animation-toggle svg{width:14px;height:14px}.concept-animation-toggle:hover{color:var(--accent);border-color:var(--purple)}
@keyframes app-arrive{0%{transform:scale(.65);opacity:.4}65%{transform:scale(1.15);opacity:1}100%{transform:scale(1);opacity:1}}
@media(max-width:540px){.phone-drawing{max-width:100%}.concept-device{padding-left:2px;padding-right:2px}.phone-apps i{width:16px;height:16px}.phone-apps{gap:3px}}
@media(max-width:359px){.concept-device{display:flex;flex-direction:row;gap:16px;padding:14px}.concept-caption{text-align:left}.concept-caption p{min-width:150px}}
@media(prefers-reduced-motion:reduce){.phone-apps .just-installed{animation:none}.concept-row{transition:none}}