/* KAYSTRO website vNext. Shared public design, independent from app functionality. */
:root{--sky:#080d22;--panel:#101b32;--text:#edf4ff;--muted:#b8c7db;--accent:#6bdcff;--line:#344e6c;--button:#b9efff;--button-ink:#081b30;--glow:#413174;--horizon:#141c41;--header:#080d22f5;--content:1440px;--gutter:clamp(20px,4vw,64px)}
:root[data-theme=clear]{--sky:#f5f7fa;--panel:#fff;--text:#18273b;--muted:#43576c;--accent:#075774;--line:#bbcbd6;--button:#153e56;--button-ink:#fff;--glow:#dce8f0;--horizon:#dbe5ed;--header:#f5f7faf5}
:root[data-theme=night]{--sky:#080000;--panel:#140303;--text:#ed8888;--muted:#cc7272;--accent:#ef8a8a;--line:#703333;--button:#852929;--button-ink:#ffb7b7;--glow:#240606;--horizon:#250707;--header:#080000fa}
html{scroll-padding-top:110px}body{background:var(--sky);color:var(--text)}
.clean-preview-note{display:none}:root[data-theme=clear] .clean-preview-note{display:inline}
:root[data-theme] .btn{background:var(--button);color:var(--button-ink);box-shadow:none}
body>header{height:auto;min-height:88px;padding:12px max(var(--gutter),calc((100vw - var(--content))/2));gap:24px;background:var(--header);border-color:var(--line);backdrop-filter:blur(18px)}
.brand>img{width:54px}.brand{gap:10px}.brand b{font-size:18px;color:var(--text)}.brand-tagline{font-size:11px;color:var(--muted);max-width:none}
header nav{gap:clamp(8px,1.1vw,18px);font-size:13px}header nav a{padding-block:10px}header nav a:hover{color:var(--accent)}.header-facebook{width:44px;height:44px;flex-basis:44px;color:var(--accent);border-color:var(--line);background:var(--panel)}
#menu{color:var(--text);min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:8px;font-size:21px}
.language-bar,.display-controls{padding:10px max(var(--gutter),calc((100vw - var(--content))/2));background:var(--sky);border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.language-bar a{padding:8px 4px;min-height:44px;display:inline-flex;align-items:center}.language-bar a[aria-current]{color:var(--accent)}
.display-controls{justify-content:space-between;gap:10px;font-size:12px}.display-label{color:var(--muted);letter-spacing:.12em}.theme-switch{display:flex;flex-wrap:wrap;gap:4px;border:1px solid var(--line);padding:4px;border-radius:10px;background:var(--panel)}
.theme-switch button{font:inherit;font-weight:600;cursor:pointer;min-height:44px;padding:8px 14px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--muted)}.theme-switch button[aria-pressed=true]{background:var(--button);color:var(--button-ink);border-color:var(--accent)}
.skip-link{position:fixed;top:8px;left:8px;z-index:100;transform:translateY(-160%);padding:12px 20px;background:var(--button);color:var(--button-ink)}.skip-link:focus{transform:none}
main>*{min-width:0}section{position:relative}section.hero{isolation:isolate;min-height:700px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,4vw,70px);padding:clamp(56px,7vw,108px) max(var(--gutter),calc((100vw - var(--content))/2));background:radial-gradient(ellipse at 80% 35%,var(--glow),transparent 60%),var(--sky);overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;z-index:-2;opacity:.6;background-image:radial-gradient(circle at 14px 24px,var(--muted) .7px,transparent 1.3px),radial-gradient(circle at 83px 97px,var(--accent) .6px,transparent 1.2px);background-size:173px 157px,251px 231px;mask-image:linear-gradient(#000,transparent 95%)}
.hero:after{content:"";position:absolute;z-index:-1;width:150%;height:220px;bottom:-165px;left:-25%;border-radius:50%;background:var(--horizon);border-top:1px solid var(--accent);box-shadow:0 -8px 60px var(--glow)}
.copy h1{font-size:clamp(45px,5.2vw,78px);font-weight:650;line-height:1.03;letter-spacing:-.055em}.copy h1 span{color:var(--accent)}.copy>p{font-size:17px;color:var(--muted)}.copy .tagline{color:var(--text)!important;font-size:clamp(23px,2.2vw,31px);line-height:1.3;font-weight:450;max-width:20ch}.copy small{font-size:11px}.copy .compatibility{font-size:12px}.compatibility-next{opacity:1;color:var(--muted)}.checks{color:var(--muted);font-size:12px}
.hero-preview{margin:0;align-self:center;min-width:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel);box-shadow:0 28px 80px #0003}.hero-preview>a{display:block}.hero-preview img{display:block;width:100%;height:auto;aspect-ratio:1279/751;object-fit:contain}.preview-bar{padding:12px 16px;display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:11px;color:var(--muted);border-bottom:1px solid var(--line)}.preview-bar strong{font-weight:600;color:var(--text)}.hero-preview figcaption{font-size:12px;padding:12px 16px;color:var(--muted)}
.btn{background:var(--button);color:var(--button-ink);box-shadow:none;border:1px solid var(--button);border-radius:7px;font-size:14px;min-height:46px}.outline,.ghost{border-color:var(--line);border-radius:7px;color:var(--text)}.buttons{margin:26px 0;gap:10px}.buttons a{display:inline-flex;align-items:center;justify-content:center;min-height:46px}
small,.theme-card span{color:var(--accent)}
.why,.dark,.easy,.split,.download,.themes-section{padding:clamp(56px,6vw,90px) max(var(--gutter),calc((100vw - var(--content))/2));max-width:none;margin:0;background:var(--sky)}
.why{border-bottom:1px solid var(--line)}.why h2{max-width:26ch}.why blockquote{font-size:20px;border-color:var(--accent);color:var(--text);margin-top:28px}.why p,.heading p,.split p,.support p,.download p,.vnext-easy .steps p{color:var(--muted)}
.why h2,.heading h2,.easy h2,.split h2,.support h2,.download h2{font-size:clamp(31px,3.4vw,50px);line-height:1.14;letter-spacing:-.035em;font-weight:600}.heading{max-width:800px}.grid{max-width:none;gap:16px}.grid article{background:var(--panel);border-color:var(--line);border-radius:10px;padding:24px;font-size:23px;min-height:0;color:var(--accent)}.grid h3{color:var(--text);font-size:18px}.grid p{color:var(--muted);font-size:15px}.steps{max-width:1100px;gap:24px}.steps b{color:var(--accent);background:var(--panel);border:1px solid var(--line);border-radius:12px}
.vnext-gallery,.theme-grid{max-width:var(--content)}.vnext-shot,.theme-card,.night-card{background:var(--panel);border-color:var(--line);border-radius:10px;box-shadow:none}.vnext-shot p,.theme-card p{color:var(--muted)}.vnext-shot img,.theme-card img{aspect-ratio:auto;object-fit:contain}.vnext-shot:hover img,.theme-card:hover img{transform:none}.theme-card h3{font-size:19px}.split{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:32px}.brand-family{padding:0}.support{max-width:1100px;background:var(--panel);border-color:var(--line);border-radius:12px;padding:clamp(24px,4vw,48px)}
.document,.feedback-page{max-width:1200px;padding-inline:var(--gutter)}.document p,.document li{color:var(--muted)}.community-intro{padding-inline:max(var(--gutter),calc((100vw - var(--content))/2));background:radial-gradient(ellipse at 85% 20%,var(--glow),transparent 70%),var(--sky);grid-template-columns:minmax(0,1.1fr) minmax(0,.7fr);gap:32px}.community-copy h1 span{color:var(--accent)}
footer,.community-invitation{padding-inline:max(var(--gutter),calc((100vw - var(--content))/2));background:var(--panel);color:var(--muted);border-color:var(--line)}footer p,.footer-brand p{color:var(--muted)}.community-invitation{max-width:none;margin:0;border-radius:0}.facebook-link{background:var(--panel);color:var(--text);border-color:var(--line)}.facebook-link svg{color:var(--accent)}
img{max-width:100%}input,select,textarea{max-width:100%;accent-color:var(--accent)}:is(input,select,textarea):not([type=checkbox]):not([type=radio]){background:var(--panel);color:var(--text);border-color:var(--line);color-scheme:inherit}fieldset{min-width:0}p,li,h1,h2,h3,code,a{overflow-wrap:break-word}pre{max-width:100%;overflow:auto}button,summary{touch-action:manipulation}summary{min-height:44px}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
:root[data-theme=night] img:not([data-theme-preview]){filter:grayscale(1) sepia(1) saturate(5) hue-rotate(315deg) brightness(.55)}
@media(min-width:1201px){#menu{display:none}header nav{display:flex}}
@media(max-width:1200px){header nav{display:none}#menu{display:block;margin-left:auto}header.open nav{display:flex;position:absolute;top:100%;left:0;right:0;padding:16px 24px;flex-direction:column;align-items:stretch;background:var(--panel);max-height:calc(100dvh - 88px);overflow:auto;border-bottom:1px solid var(--line)}header.open nav a{min-height:44px}section.hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.brand-tagline{max-width:none}}
@media(max-width:900px){section.hero{grid-template-columns:1fr;min-height:0;padding-top:48px;gap:32px}.copy{max-width:700px}.hero-preview{width:100%;max-width:800px;justify-self:center}.split,.community-intro{grid-template-columns:1fr}.theme-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.brand-family{max-width:420px;justify-self:center}.community-intro{min-height:0}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){body>header{padding:10px 16px;gap:10px;min-height:80px}.brand>img{width:42px}.brand b{font-size:16px}.brand-tagline{font-size:10px;max-width:140px}.header-facebook{flex-basis:40px;width:40px}.language-bar{justify-content:center;gap:10px;padding:4px 12px;font-size:11px}.display-controls{justify-content:center;padding:10px 12px}.display-label{width:100%;text-align:center;font-size:10px}.theme-switch button{padding-inline:15px}.copy h1{font-size:clamp(42px,11.3vw,64px)}.copy>p{font-size:16px}.grid,.steps,.theme-grid{grid-template-columns:1fr}.theme-card{display:block}.vnext-shot-featured figcaption{display:block}.buttons a{width:100%}.preview-bar{font-size:10px}.hero-preview figcaption{font-size:11px}.vnext-shot figcaption{padding:18px}.brand-family{margin-top:0}footer{gap:24px}.community-invitation{padding-block:32px}.theme-switch{max-width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}