/* The supplied three-theme reference is the visual source of truth. */
:root{--accent:#65dfff;--line:#397bab;--button:#0876c9;--button-ink:#fff;--button-top:#0876c9;--button-bottom:#1549a1;--glow:#138fda;--sky:#07091b;--panel:#100e29;--text:#f7f3ff;--muted:#d5cce8;--frame:#4c99e7;--scene:url('/images/kaystro-landscape-night.png');--scene-shade:linear-gradient(90deg,#05071b77,#05071b00);--surface:linear-gradient(150deg,#171331ed,#08091def);--header:#06091ce6}
:root[data-theme=clear]{--accent:#0758d4;--line:#94b5e5;--button:#0754cc;--button-ink:#fff;--button-top:#0870ec;--button-bottom:#0342b2;--glow:#4e9eff;--sky:#edf3fb;--panel:#f8fbff;--text:#0e203e;--muted:#344c6d;--frame:#b9d5fb;--scene:url('/images/kaystro-landscape-clear.png');--scene-shade:linear-gradient(90deg,#f7fbff55,#f7fbff00);--surface:linear-gradient(150deg,#ffffffed,#eaf2ffed);--header:#f4f9ffe8}
:root[data-theme=night]{--accent:#ff7777;--line:#a9232b;--button:#ba090f;--button-ink:#fff0f0;--button-top:#c50d1a;--button-bottom:#780006;--glow:#c81024;--sky:#090000;--panel:#170202;--text:#ff9999;--muted:#e58b8b;--frame:#ad1927;--scene:url('/images/kaystro-landscape-night.png');--scene-shade:linear-gradient(90deg,#09000077,#09000011);--surface:linear-gradient(150deg,#230405ee,#0b0000f5);--header:#0b0000ed}
body{background:var(--sky)}body:before{content:"";position:fixed;inset:0;z-index:-1;background:var(--scene) center / cover no-repeat;opacity:.95;pointer-events:none}
:root[data-theme=night] body:before,:root[data-theme=night] .reference-shell:before{filter:grayscale(1) sepia(1) saturate(7) hue-rotate(315deg) brightness(.5)}
.reference-shell{position:relative;isolation:isolate;width:min(1560px,calc(100% - 56px));margin:20px auto 40px;border:2px solid var(--frame);border-radius:24px;box-shadow:0 0 34px color-mix(in srgb,var(--glow) 28%,transparent),inset 0 0 1px #fff9;background:var(--sky);overflow:clip}
.reference-shell:before{content:"";position:absolute;inset:0 0 auto;z-index:-1;height:720px;background:var(--scene-shade),var(--scene) center bottom / cover no-repeat;pointer-events:none}
.reference-shell[data-home=false]:before{height:850px;opacity:.5}
.reference-header{position:relative;top:0;display:grid;grid-template-columns:220px minmax(0,1fr) auto;gap:18px;align-items:center;min-height:100px;height:auto;padding:14px 24px;background:linear-gradient(var(--header),transparent);border:0;backdrop-filter:none;z-index:30}
.reference-header .brand{white-space:normal;gap:7px}.reference-header .brand>img{width:40px;border-radius:6px}.reference-header .brand b{font-size:27px;font-style:italic;letter-spacing:-.04em;line-height:1.1}.reference-header .brand-tagline{font-size:11px;font-style:italic;white-space:nowrap;max-width:none;color:var(--text)}
.reference-header nav{display:flex;justify-content:center;align-items:stretch;gap:3px;font-size:11px}.reference-header nav>a,.nav-more>summary{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:65px;min-height:66px;padding:7px 10px;border:0;border-radius:7px;color:var(--text);cursor:pointer;background:transparent;position:relative;white-space:nowrap;font-weight:600;line-height:1.2}.reference-header nav>a svg,.nav-more>summary svg{width:21px;height:21px;flex:none}
.reference-header nav>a[aria-current=page]{background:linear-gradient(transparent,color-mix(in srgb,var(--glow) 45%,transparent));color:var(--text);text-shadow:0 0 10px var(--glow)}.reference-header nav>a[aria-current=page]:after{content:"";position:absolute;bottom:0;height:2px;left:9px;right:9px;background:var(--accent);box-shadow:0 0 10px 3px var(--glow)}
.reference-header nav>a:hover,.nav-more>summary:hover{background:color-mix(in srgb,var(--glow) 22%,transparent)}.nav-more{position:relative}.nav-more>summary{list-style:none}.nav-more>summary::-webkit-details-marker{display:none}.nav-more-links{display:flex;flex-direction:column;position:absolute;right:0;top:calc(100% + 8px);min-width:200px;padding:8px;border:1px solid var(--frame);border-radius:12px;background:var(--panel);box-shadow:0 12px 35px #0006}.nav-more-links>a{padding:10px 14px;min-height:44px;color:var(--text)}.nav-more-links>a:hover{background:color-mix(in srgb,var(--glow) 20%,transparent);border-radius:6px}
.header-tools{display:flex;flex-direction:column;gap:5px;align-items:flex-end}.header-tools .display-controls{border:0;background:transparent;padding:0;display:block}.theme-switch{border-radius:999px;padding:2px;gap:0;display:flex;flex-wrap:nowrap;background:color-mix(in srgb,var(--sky) 82%,transparent);border:1px solid var(--line);box-shadow:inset 0 1px 8px #0002}
.theme-switch button{display:flex;justify-content:center;align-items:center;gap:5px;min-height:38px;border-radius:999px;padding:7px 13px;font-size:11px;color:var(--text);line-height:1.1;font-weight:500;white-space:nowrap;transition:box-shadow .18s,background .18s}.theme-switch button svg{width:17px;height:17px;flex:none}.theme-switch button[aria-pressed=true]{border:1px solid var(--accent);background:linear-gradient(160deg,var(--button-top),var(--button-bottom));box-shadow:inset 0 0 10px #ffffff3b,0 0 14px color-mix(in srgb,var(--glow) 65%,transparent);color:var(--button-ink)}
.language-picker{position:relative;font-size:10px}.language-picker summary{min-height:28px;list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:var(--text);background:var(--header)}.language-picker summary svg{width:15px;height:15px}.language-picker summary::-webkit-details-marker{display:none}.language-picker .language-bar{position:absolute;right:0;top:calc(100% + 6px);width:170px;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:7px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px #0004;z-index:40}.language-picker .language-bar a{padding:9px 12px;font-size:12px;border-radius:6px;min-height:40px;color:var(--text)}.language-picker .language-bar a:hover{background:color-mix(in srgb,var(--glow) 20%,transparent)}
section.hero.reference-hero{padding:26px 5% 28px;min-height:440px;gap:28px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);background:transparent;overflow:visible;align-items:center}.reference-hero:before,.reference-hero:after{display:none}.reference-hero .copy{min-width:0;text-shadow:0 2px 16px #0005}.hero-eyebrow{display:block;color:var(--accent);font-size:clamp(22px,2.5vw,34px)!important;font-style:italic;letter-spacing:.025em;font-weight:400;line-height:1.2}.reference-hero .copy h1{font-size:clamp(45px,5.3vw,77px);font-style:italic;font-weight:750;letter-spacing:-.055em;line-height:1.06;white-space:nowrap;margin:0 0 2px;color:var(--text)}
.reference-hero .copy .tagline{font-size:clamp(23px,2.3vw,33px);font-style:italic;font-weight:450;margin:0 0 29px;max-width:none;position:relative;display:inline-block;color:var(--text)!important;line-height:1.3}.reference-hero .tagline:after{content:"";height:4px;position:absolute;right:-7px;bottom:-10px;width:50%;background:linear-gradient(90deg,transparent,var(--glow));transform:rotate(-7deg);border-radius:100%}
.reference-hero .copy .hero-intro{font-size:clamp(17px,1.6vw,23px);line-height:1.4;margin:0 0 5px;color:var(--text);font-weight:500}.reference-hero .copy .session-words{font-size:clamp(13px,1.2vw,17px);letter-spacing:.035em;color:var(--text);margin:0 0 20px;line-height:1.5}.reference-hero .copy .compatibility{font-size:10px;margin:14px 0 4px;line-height:1.5;color:var(--muted);max-width:490px}.reference-hero .compatibility-next{font-size:10px;line-height:1.5}.hero-detail{font-size:11px;color:var(--muted);max-width:490px}.hero-detail summary{min-height:24px;cursor:pointer}.hero-detail p{font-size:12px!important;color:var(--muted)}
:root[data-theme] .btn,:root[data-theme] .hero-download{background:linear-gradient(160deg,var(--button-top),var(--button-bottom));border:1px solid var(--accent);border-radius:11px;color:var(--button-ink);box-shadow:inset 0 1px 1px #fff7,0 0 20px color-mix(in srgb,var(--glow) 42%,transparent);font-weight:650;transition:box-shadow .18s,transform .18s}
:root[data-theme] .btn:hover{box-shadow:inset 0 1px 1px #fff7,0 0 28px color-mix(in srgb,var(--glow) 70%,transparent);transform:translateY(-1px)}.reference-hero .buttons{gap:14px;margin:19px 0 0;align-items:stretch;flex-wrap:wrap}.reference-hero .hero-download{gap:13px;padding:10px 17px;min-height:54px;font-size:14px}.hero-download>svg{width:27px;height:27px;flex:none}.hero-download>span{text-align:center}.hero-download small{display:block;color:var(--button-ink);font-size:10px;font-weight:400;letter-spacing:0;line-height:1.3}
.reference-hero .ghost{display:flex;gap:16px;align-items:center;justify-content:center;background:color-mix(in srgb,var(--sky) 55%,transparent);border:1px solid var(--text);border-radius:10px;color:var(--text);box-shadow:inset 0 1px 0 #fff3;padding:10px 18px;font-size:13px;min-height:54px}.ghost svg{width:22px;height:22px}.reference-hero .ghost:hover{background:color-mix(in srgb,var(--glow) 30%,var(--sky))}
.reference-hero .hero-preview{background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;margin:0;position:relative;min-width:0;align-self:center;transform:perspective(1200px) rotateY(-7deg) rotateZ(-1.5deg);transform-origin:center}.monitor-screen{background:#080b15;border:10px solid #080b15;border-radius:16px;outline:1px solid var(--accent);box-shadow:0 0 0 3px #131a36,0 0 24px color-mix(in srgb,var(--glow) 40%,transparent),0 20px 35px #0007;overflow:hidden}.monitor-screen>a{display:block}.reference-hero .hero-preview img{width:100%;height:auto;aspect-ratio:1279/751;display:block;object-fit:contain;border-radius:5px}.monitor-neck{display:block;width:90px;height:40px;margin:0 auto;background:linear-gradient(100deg,#111729,#343c58,#101423);clip-path:polygon(22% 0,78% 0,84% 100%,16% 100%)}.monitor-foot{display:block;width:205px;height:15px;margin:-1px auto 0;background:linear-gradient(#596080,#13182d);clip-path:polygon(20% 0,80% 0,100% 75%,96% 100%,4% 100%,0 75%);border-bottom:1px solid var(--accent)}.reference-hero .hero-preview figcaption{font-size:9px;line-height:1.4;color:var(--muted);text-align:center;padding:8px 0 0}
.session-strip{padding:0 4% 22px;background:transparent}.session-strip>div{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:inset 0 1px 14px color-mix(in srgb,var(--glow) 22%,transparent),0 -5px 24px color-mix(in srgb,var(--glow) 12%,transparent);padding:16px 10px;backdrop-filter:blur(12px)}.session-strip a{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 14px;border-right:1px solid color-mix(in srgb,var(--line) 50%,transparent);min-height:90px;color:var(--text)}.session-strip a:last-child{border-right:0}.session-strip svg{width:29px;height:29px;color:var(--accent);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--glow) 70%,transparent))}.session-strip h2{font-size:15px;font-weight:600;line-height:1.2;margin:6px 0 4px;letter-spacing:0}.session-strip p{font-size:11px;line-height:1.4;margin:0;max-width:23ch;color:var(--text)}.session-strip a:hover h2{color:var(--accent)}
.reference-shell .updater-banner{margin:12px 4% 30px;padding:12px 18px;font-size:12px;background:var(--panel);border-color:var(--line);color:var(--muted);border-radius:10px}.reference-shell .why,.reference-shell .dark,.reference-shell .easy,.reference-shell .split,.reference-shell .download,.reference-shell .themes-section{padding-left:5%;padding-right:5%}.reference-shell .grid article,.reference-shell .theme-card,.reference-shell .vnext-shot,.reference-shell .support{background:var(--surface);border-color:var(--line);box-shadow:inset 0 1px 0 #fff1}.reference-shell footer,.reference-shell .community-invitation{padding-left:5%;padding-right:5%}.reference-shell .feedback-panel,.reference-shell .feedback-card{border-color:var(--line)}
:root[data-theme=clear] .copy{text-shadow:none}:root[data-theme=clear] .reference-shell:before{background-position:center bottom}:root[data-theme=clear] .reference-hero .ghost{background:#f5f9ffbd;border-color:#8baedc;box-shadow:0 2px 8px #6689bc22}
@media(min-width:1201px){.reference-header #menu{display:none}}
@media(max-width:1200px){.reference-header{grid-template-columns:minmax(0,1fr) auto auto;gap:16px}.reference-header nav{display:none}.reference-header #menu{display:block;grid-column:2;grid-row:1;min-height:44px;min-width:44px;margin:0}.header-tools{grid-column:3;grid-row:1}.reference-header.open nav{display:flex;position:absolute;top:100%;left:16px;right:16px;flex-direction:column;align-items:stretch;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px;max-height:calc(100dvh - 130px);overflow:auto}.reference-header.open nav>a,.reference-header.open .nav-more>summary{flex-direction:row;justify-content:flex-start;gap:14px;min-height:44px}.reference-header.open .nav-more-links{position:static;box-shadow:none}.reference-hero .copy h1{font-size:clamp(43px,5.7vw,68px)}}
@media(max-width:900px){.reference-shell{width:calc(100% - 28px);margin:14px auto 28px;border-radius:20px}.reference-header{padding:12px 18px}.reference-header .brand b{font-size:24px}.reference-header .brand>img{width:35px}.reference-header .brand-tagline{font-size:10px}section.hero.reference-hero{grid-template-columns:1fr;gap:24px;padding:28px 6% 22px}.reference-hero .copy{max-width:680px}.reference-hero .copy h1{font-size:clamp(48px,9vw,76px)}.reference-hero .copy .tagline{font-size:clamp(25px,4vw,34px)}.reference-hero .hero-preview{width:min(660px,96%);transform:perspective(1200px) rotateY(-4deg) rotateZ(-1deg)}.reference-shell:before{height:1050px;background-size:auto 1050px}.session-strip>div{grid-template-columns:repeat(5,minmax(0,1fr))}.session-strip a{padding-inline:8px}.session-strip p{font-size:10px}.session-strip h2{font-size:13px}}
@media(max-width:600px){.reference-shell{width:calc(100% - 16px);margin:8px auto 20px;border-radius:16px}.reference-header{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px 14px;min-height:0}.reference-header .brand>img{width:32px}.reference-header .brand b{font-size:23px}.reference-header .brand-tagline{font-size:9px}.reference-header #menu{grid-column:2;grid-row:1;justify-self:end}.header-tools{grid-column:1/-1;grid-row:2;display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;gap:8px}.language-picker{order:2}.language-picker summary{min-height:40px;padding:6px 8px;font-size:10px}.header-tools .theme-switch button{min-height:42px;font-size:10px;padding:6px 8px;gap:4px}.theme-switch button svg{width:14px;height:14px}.reference-header.open nav{top:100%;max-height:calc(100dvh - 150px)}section.hero.reference-hero{padding:26px 6% 22px;gap:30px;min-height:0}.reference-hero .copy h1{font-size:clamp(44px,11.8vw,64px)}.hero-eyebrow{font-size:25px!important}.reference-hero .copy .tagline{font-size:clamp(21px,5.6vw,30px);margin-bottom:26px}.reference-hero .copy .hero-intro{font-size:17px}.reference-hero .copy .session-words{font-size:11px;letter-spacing:0}.reference-hero .buttons{gap:10px}.reference-hero .buttons a{width:100%}.reference-hero .copy .compatibility{margin-top:15px}.reference-hero .hero-preview{width:100%;transform:none}.monitor-screen{border-width:6px;border-radius:10px}.monitor-neck{height:24px;width:64px}.monitor-foot{width:145px;height:11px}.session-strip{padding:0 5% 22px}.session-strip>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-radius:16px;padding:8px}.session-strip a{padding:14px 8px;border-right:0;border-bottom:1px solid color-mix(in srgb,var(--line) 50%,transparent);min-height:120px}.session-strip a:nth-child(odd){border-right:1px solid color-mix(in srgb,var(--line) 50%,transparent)}.session-strip a:last-child{grid-column:1/-1;min-height:105px;border:0}.session-strip h2{font-size:14px}.session-strip p{font-size:11px}.reference-shell:before{height:920px;background-size:auto 920px}.reference-shell .updater-banner{font-size:11px;margin:0 5% 22px}.reference-shell .community-intro{padding-inline:6%}.reference-shell .document,.reference-shell .feedback-page{padding-inline:6%}.reference-shell .why h2{font-size:30px}.reference-shell .grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.reference-hero .hero-preview{transform:none}.btn:hover{transform:none!important}}
.nav-more-links .header-facebook{width:auto;min-height:44px;flex-basis:auto;justify-content:flex-start;padding:10px 14px;background:transparent;border:0;font-size:12px;color:var(--text)}
:root[data-theme=night]{--button-top:#940812;--button-bottom:#640006;--button-ink:#ffaaaa}
:root[data-theme=night] .monitor-screen{background:#090000;border-color:#130203;box-shadow:0 0 0 3px #2b080c,0 0 24px #ad192766,0 20px 35px #0007}
:root[data-theme=night] .monitor-neck{background:linear-gradient(100deg,#160202,#4a1518,#180202)}
:root[data-theme=night] .monitor-foot{background:linear-gradient(#702a30,#230509)}

/* Continue the night sky through the homepage's lower content sections. */
:root{--section-star:#d8c5ff70;--section-star-faint:#a8baff38;--section-nebula:#6940a82b;--section-glow:#394a9020}
:root[data-theme=clear]{--section-star:#1e5fab45;--section-star-faint:#477bb52b;--section-nebula:#7faee520;--section-glow:#9cbaeb25}
:root[data-theme=night]{--section-star:#e86a6a55;--section-star-faint:#b936362b;--section-nebula:#640e1429;--section-glow:#48070b20}
.reference-shell[data-home=true] main> :is(.why,.dark,.easy,.split,.download,.themes-section){
 isolation:isolate;
 background-color:var(--sky);
 background-image:radial-gradient(ellipse at 87% 32%,var(--section-nebula),transparent 58%),radial-gradient(ellipse at 12% 84%,var(--section-glow),transparent 55%);
}
.reference-shell[data-home=true] main> :is(.why,.dark,.easy,.split,.download,.themes-section):before{
 content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background-image:radial-gradient(circle at 31px 47px,var(--section-star) .8px,transparent 1.5px),radial-gradient(circle at 157px 113px,var(--section-star-faint) .7px,transparent 1.4px),radial-gradient(circle at 259px 73px,var(--section-star) 1px,transparent 1.8px),radial-gradient(circle at 83px 181px,var(--section-star-faint) .6px,transparent 1.2px),radial-gradient(circle at 407px 219px,var(--section-star) .7px,transparent 1.6px);
 background-size:293px 263px,419px 347px,587px 431px,227px 311px,661px 397px;
 mask-image:linear-gradient(100deg,#0005,#000b 45%,#000 85%);
}
.reference-shell[data-home=true] main> :is(.dark,.split):before{background-position:97px 31px,-41px 79px,133px -27px,61px 43px,-113px 17px}
.reference-shell[data-home=true] main> :is(.easy,.themes-section):before{background-position:-67px 83px,113px -37px,-53px 63px,107px 19px,37px -41px}
.reference-shell[data-home=true] .why blockquote{background:linear-gradient(90deg,color-mix(in srgb,var(--panel) 65%,transparent),transparent);border-radius:0 10px 10px 0}