/* Website hierarchy: a product entrance, a compact directory, and one reading surface. */
.computer-mark{width:56px;height:56px;flex:0 0 56px;stroke:#4566a8;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.software-primary{gap:14px;background:#f6f7f8;color:#243a5c;font-size:15px;letter-spacing:0;padding:12px 16px;min-height:66px}
.software-primary .computer-mark{width:30px;height:30px;flex-basis:30px}
.software-primary .primary-name{margin-right:auto;transform:none}
.software-primary:hover .primary-name{transform:none}
.software-primary:hover{border-color:#aec2eb;background:#fff}
#directory{position:relative;isolation:isolate;background:#245b71}
.coast-continuation{position:sticky;top:0;height:100svh;margin-bottom:-100svh;z-index:-1;overflow:hidden;pointer-events:none;background:linear-gradient(#5197b5,#2cb0b8)}
#content-coast{width:100%;height:100%;display:block}
.harbour-index{position:relative;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr);gap:0 56px;max-width:1120px;margin:0 auto;padding:64px 52px;background:#eaf0e9f5;color:#233d48;border:1px solid #f7f5e899;box-shadow:0 18px 60px #113a4e18}
.harbour-index .directory-section{display:block;padding:0;background:none;border:0;scroll-margin-top:32px}
.harbour-index .download-feature{grid-row:span 2;padding-right:32px;border-right:1px solid #38556829}
.harbour-index .section-label{margin:0 0 26px;padding:0;color:#4a6572;font-size:12px;letter-spacing:.06em;line-height:1.8}
.product-entry{display:flex;flex-direction:column;align-items:flex-start;gap:25px;min-height:280px}
.product-entry .computer-mark{width:68px;height:68px;flex-basis:68px}
.harbour-index .download-feature h2{font-size:clamp(30px,3.5vw,46px);line-height:1.12;letter-spacing:-.045em;color:#243a5c}
.harbour-index .directory-section p{font-size:14px;color:#48616b;line-height:1.85;margin:18px 0}
.product-entry-action{display:flex;align-items:center;gap:22px;min-height:44px;margin-top:auto;color:#4566a8;font-size:14px;border-bottom:1px solid #4566a855}
.product-entry-action .ui-arrow{transition:transform .4s cubic-bezier(.22,.7,.18,1)}
.product-entry:hover .product-entry-action .ui-arrow{transform:translate(var(--arrow-shift-x,3px),var(--arrow-shift-y,0px))}
.harbour-index .directory-secondary h2{font-size:26px;letter-spacing:-.025em}
.harbour-index .directory-secondary p{margin:12px 0;font-size:13px}
.harbour-index .directory-secondary code{font-size:11px;color:#4f6872}
.harbour-index #social{border-top:1px solid #38556829;margin-top:26px;padding-top:26px}
.shore-footer{max-width:1120px;margin:auto;padding:0 52px 30px;background:#eaf0e9f5;color:#233d48}
.shore-footer .about{background:none;display:grid;grid-template-columns:180px minmax(0,1fr);padding:36px 0;gap:36px;border:0}
.shore-footer .about h2{font-size:23px;font-weight:400;letter-spacing:-.02em}.shore-footer .about p{font-size:14px}
.shore-footer footer{margin:0;padding:16px 0;border-color:#38556829}
.leaf-touch,.coast-boat{touch-action:none;cursor:grab}.leaf-touch:active,.coast-boat:active,.is-dragging{cursor:grabbing}
.shore-leaf-touch{top:59%;left:0;width:28%;height:35%;clip-path:polygon(0 0,44% 0,100% 65%,82% 100%,0 100%)}
.town-lights{position:absolute;z-index:3;background:transparent;border:0;min-width:44px;min-height:44px;cursor:pointer;padding:0}
.town-lights:focus-visible{outline:1px solid #ffe6ba;outline-offset:3px}
html[data-night=true] body .harbour-index,html[data-night=true] body .shore-footer{background:#142b37f5;color:#e5edeb;border-color:#e2e9d826}
html[data-night=true] body .harbour-index .download-feature{border-color:#d9e1de26}
html[data-night=true] body .harbour-index .download-feature h2{color:#e6edfa}
html[data-night=true] body .harbour-index .section-label,html[data-night=true] body .harbour-index .directory-section p,html[data-night=true] body .harbour-index .directory-secondary code{color:#b7ced4}
html[data-night=true] body .computer-mark{stroke:#aec2eb}
html[data-night=true] body .software-primary .computer-mark{stroke:#4566a8}
html[data-night=true] body .product-entry-action{color:#aec2eb;border-color:#aec2eb55}
html[data-night=true] body .harbour-index #social,html[data-night=true] body .shore-footer footer{border-color:#d9e1de26}
@media(max-width:760px){
 header nav{margin-left:auto}
 .theme-f header nav>a{display:none}
 .hero-copy{padding-top:20px}
 .hero-copy h1{font-size:clamp(36px,11vw,44px)}
 .hero-copy .statement{margin:14px 0 16px}
 .hero-copy .primary-entry{margin-top:16px}
 .destinations a{min-height:44px;font-size:14px}
 .software-primary{min-height:64px;font-size:15px}
 .harbour-index{display:block;margin:0 12px;padding:36px 24px;max-width:none}
 .harbour-index .download-feature{border-right:0;padding-right:0;padding-bottom:32px;border-bottom:1px solid #38556829}
 .product-entry{min-height:0;gap:20px}
 .product-entry .computer-mark{width:58px;height:58px;flex-basis:58px}
 .product-entry-action{margin-top:6px;gap:18px;font-size:13px}
 .harbour-index .download-feature h2{font-size:34px}
 .harbour-index #links{padding-top:32px}
 .harbour-index #social{margin-top:24px;padding-top:24px}
 .shore-footer{margin:0 12px;padding:0 24px 20px}
 .shore-footer .about{display:block;padding:30px 0}
 .shore-footer .about .section-label{font-size:11px}
 .shore-leaf-touch{top:72%;width:42%;height:28%;clip-path:polygon(0 0,70% 0,100% 50%,100% 100%,0 100%)}
}
@media(prefers-reduced-motion:reduce){.product-entry-action .ui-arrow{transition:none}}

.site-footer,.shore-footer .site-footer{display:block;padding:52px 0 16px;margin:0;border-top:1px solid #38556829}
.footer-top{display:grid;grid-template-columns:180px minmax(0,1fr);gap:36px}
.footer-brand{font-size:24px;letter-spacing:-.05em;line-height:1.4;min-height:44px;align-self:start}
.footer-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.footer-map h2{font-size:12px;font-weight:400;color:#526a70;line-height:1.8;margin:0 0 16px}
.footer-map ul{list-style:none;padding:0;margin:0}
.footer-map a{display:flex;align-items:center;min-height:44px;font-size:13px;line-height:1.6;position:relative}
.footer-map a::after{content:"";height:1px;position:absolute;bottom:6px;left:0;right:0;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.22,.7,.18,1)}
.footer-map a:hover::after,.footer-map a:focus-visible::after{transform:scaleX(1)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:48px;padding-top:18px;border-top:1px solid #38556829;font-size:12px}
.footer-bottom>a{display:flex;align-items:center;min-height:44px;gap:18px}
.product-page .site-footer{max-width:1100px;margin:0 auto;padding:48px var(--pad) 20px}
html[data-night=true] body .footer-map h2{color:#b1c8cd}
html[data-night=true] body .site-footer,html[data-night=true] body .footer-bottom{border-color:#d9e1de26}
@media(max-width:760px){.footer-top{display:block}.footer-brand{display:inline-flex;align-items:center;margin-bottom:32px}.footer-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 22px}.footer-map h2{margin-bottom:10px}.site-footer,.shore-footer .site-footer{padding-top:34px}.footer-bottom{margin-top:30px}.product-page .site-footer{padding:36px 24px 20px}}
@media(prefers-reduced-motion:reduce){.footer-map a::after{transition:none}}

/* Product pages use the application's own neutral surfaces and blue accent. */
.product-page{background:#1b1b1b;color:#ededed}
.product-page .product-back,.product-page .product-eyebrow,.product-page .product-toc p,.product-page .product-layout p,.product-page .footer-map h2{color:#a6a6a6}
.product-page .primary-entry{background:#aec2eb;color:#182846;border-color:#aec2eb}
.product-page .primary-entry:hover{background:#c2d1ed}
html[data-night=false] body.product-page{background:#fff;color:#1a1a1a}
html[data-night=false] body.product-page header{color:#1a1a1a}
html[data-night=false] body.product-page .product-back,html[data-night=false] body.product-page .product-eyebrow,html[data-night=false] body.product-page .product-toc p,html[data-night=false] body.product-page .product-layout p,html[data-night=false] body.product-page .footer-map h2{color:#595959}
html[data-night=false] body.product-page .primary-entry{background:#4566a8;color:#fff;border-color:#4566a8}
html[data-night=false] body.product-page .primary-entry:hover{background:#38558f}
html[data-night=false] body.product-page .platform-list,html[data-night=false] body.product-page .platform-list>div{border-color:#ddd}
.product-page .product-main{line-height:1.75}
.product-page .product-intro>p:not(.product-eyebrow){font-size:17px;line-height:1.75}
.product-page .product-layout p{font-size:17px;line-height:1.75}
.product-page .site-footer{border-color:#ffffff24}
html[data-night=false] body.product-page .site-footer,html[data-night=false] body.product-page .footer-bottom{border-color:#ddd}
.harbour-index,.shore-footer{transition:background-color 1s,color 1s,border-color 1s}
@media(prefers-reduced-motion:reduce){.harbour-index,.shore-footer{transition:none}}

/* Keep one coastal view behind scrolling paper instead of redrawing a second shore. */
body.theme-f{isolation:isolate}
.theme-f>.seascape{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.theme-f>.seascape button{pointer-events:auto}
.theme-f .cover{pointer-events:none;padding-top:var(--site-header-height,78px)}
.theme-f .cover header{position:fixed;top:0;left:0;right:0;z-index:20;pointer-events:auto;transition:background-color .6s,color .6s,border-color .6s;border-bottom:1px solid transparent}
.theme-f .cover header.is-scrolled{background:#f1f5f0f2;color:#243e48;text-shadow:none;border-color:#395a6426;backdrop-filter:blur(12px)}
html[data-night=true] body.theme-f .cover header.is-scrolled{background:#102433f2;color:#edf2e9;border-color:#d1e0df29}
.theme-f .cover header.is-scrolled .appearance-controls{border-color:currentColor;background:#4166740a}
.theme-f .cover header.is-scrolled .appearance-controls::before{background:#45697412;border-color:#45697440}
html[data-night=true] body.theme-f .cover header.is-scrolled .appearance-controls::before{background:#fff1c319;border-color:#e4eff045}
html[data-night=false] body.theme-f .cover header nav{color:#234a5b;text-shadow:none}
html[data-night=false] body.theme-f .cover header .appearance-controls{border-color:#234a5b44;background:#ffffff26}
html[data-night=false] body.theme-f .cover header .appearance-controls::before{border-color:#234a5b33;background:#ffffff29}
.theme-f #directory{background:none;padding-top:48px}
.theme-f #directory::before{content:"";position:absolute;inset:0;z-index:-1;background:#10334512;pointer-events:none}
.theme-f :is(.directory-section,.reading-layout,.reading-chapter,#reading-title,#about){scroll-margin-top:calc(var(--site-header-height,78px) + 24px)}
.theme-f .reading-rail{top:calc(var(--site-header-height,78px) + 24px)}
.theme-f .reading-mobile-toc{top:calc(var(--site-header-height,78px) + 8px)}
@media(max-width:760px){
 .theme-f .cover::before{background:linear-gradient(90deg,#14374cac 0%,#14374c95 38%,#14374c42 62%,#14374c00 87%)}
 html[data-night=true] body.theme-f .cover::before{background:linear-gradient(90deg,#0c1c30df 0%,#0c1c30b0 38%,#0c1c3030 68%,#0c1c3000 88%)}
 .theme-f #directory{padding-top:28px}
 .theme-f :is(.reading-chapter,#reading-title){scroll-margin-top:calc(var(--site-header-height,78px) + 106px)}
}
@media(prefers-reduced-motion:reduce){.theme-f .cover header{transition:none}}
/* The reading wash belongs to the shared view and has no scrolling lower edge. */
.theme-f>.seascape{z-index:-2}
.theme-f .cover::before{display:none}
body.theme-f::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#12364aac 0%,#12364a90 23%,#12364a3d 40%,#12364a00 60%)}
html[data-night=true] body.theme-f::before{background:linear-gradient(90deg,#0c1c30e0 0%,#0c1c30b5 24%,#0c1c3045 41%,#0c1c3000 62%)}
@media(max-width:760px){body.theme-f::before{background:linear-gradient(90deg,#14374cb0 0%,#14374ca0 45%,#14374c99 76%,#14374c30 100%)}html[data-night=true] body.theme-f::before{background:linear-gradient(90deg,#0c1c30df 0%,#0c1c30b0 38%,#0c1c3030 68%,#0c1c3000 88%)}}
/* The name is a typographic landmark; useful links keep a smaller, stable measure. */
@media(min-width:761px){.theme-f .hero-copy{width:44%;max-width:730px}.theme-f .hero-copy h1{font-size:clamp(55px,7vw,112px)}}
/* The header's parent must sit above the later reading stacking context. */
.theme-f .cover{z-index:1}

/* Site-sized type and focus, balanced against the broad illustrated view. */
.theme-f header nav>a{font-size:14px}
.theme-f .hero-copy .statement{font-size:16px;line-height:1.75;color:#f4f6ef}
.theme-f .software-primary{max-width:380px;min-height:66px;font-size:16px}
.theme-f .destinations{max-width:380px}
.theme-f .destinations a{font-size:16px;min-height:58px}
.theme-f .harbour-index .directory-section p{font-size:16px;line-height:1.75}
.theme-f .harbour-index .directory-secondary code{font-size:13px}
.theme-f .product-entry-action{font-size:15px}
.theme-f .footer-map a{font-size:14px}
.theme-f :is(header a,header button,.hero-copy a,.cover-bottom a):focus-visible{outline:2px solid #fff;outline-offset:5px}
.theme-f header.is-scrolled :is(a,button):focus-visible{outline-color:currentColor}
.theme-f #directory{scroll-margin-top:var(--site-header-height,89px)}
.theme-f .reading-layout{--reading-contents-clearance:0px}
.theme-f :is(.reading-chapter,#reading-title){scroll-margin-top:calc(var(--site-header-height,89px) + var(--reading-contents-clearance) + 24px)}
@media(max-width:900px){
 .theme-f .reading-inner{max-width:700px}
 .theme-f .reading-article{max-width:none}
 .theme-f .reading-layout{--reading-contents-clearance:calc(var(--reading-toc-height,82px) + 16px)}
 .theme-f .reading-mobile-toc[open]~.reading-article :is(.reading-chapter,#reading-title){scroll-margin-top:calc(var(--site-header-height,89px) + var(--reading-toc-height,264px) + 24px)}
}
@media(max-width:760px){
 .theme-f .hero-copy .statement{font-size:14px;max-width:26ch;text-wrap:pretty}
 .theme-f .software-primary{max-width:none;font-size:15px}
 .theme-f .destinations{max-width:none;column-gap:20px}
 .theme-f .destinations a{font-size:14px;min-height:48px}
 .theme-f .harbour-index .directory-section p{font-size:15px}
 .theme-f .harbour-index .directory-secondary code{font-size:12px}
}

/* Balance translated headings without excluding them from translation. */
.theme-f .hero-copy h1,.theme-f .harbour-index h2,.theme-f .reading-article h2{ text-wrap:balance }
/* Let the near sea emerge below the phone's compact navigation. */
@media(max-width:760px){body.theme-f::before{mask-image:linear-gradient(to bottom,#000 38%,#0008 55%,transparent 78%)}}

/* Article text stays at a comfortable measure; the footer spans the site. */
.theme-f .reading-inner{max-width:1060px;grid-template-columns:200px minmax(0,760px);column-gap:48px}
.theme-f .reading-article{max-width:760px;padding:44px 46px 52px}
.theme-f .reading-header{padding-bottom:0}
.theme-f .reading-chapter{margin-top:48px}
.theme-f .reading-chapter:nth-of-type(4){margin-top:60px}
.theme-f .shore-footer{width:100%;max-width:none;padding:0 var(--pad) 30px;margin:0;background:#eaf0e9f5}
html[data-night=true] body.theme-f .shore-footer{background:#142b37f5}
.theme-f .shore-footer .about,.theme-f .footer-top{grid-template-columns:minmax(160px,1fr) minmax(0,3fr);gap:48px}
.theme-f .footer-map{gap:48px}
.theme-f .boat-0{width:92px;height:92px}
/* Stored appearance must be legible on the first frame, with no color crossfade. */
body:not([data-appearance-ready=true]),body:not([data-appearance-ready=true]) :is(header,footer,.destinations a,.harbour-index,.shore-footer,.reading-article,.reading-rail,.reading-mobile-toc,.reading-header h2,.reading-chapter h3,.reading-toc a){transition:none}
@media(max-width:900px){
 .theme-f .reading-inner{display:block;max-width:760px}
 .theme-f .reading-article{max-width:none;padding:32px 24px 40px}
}
@media(max-width:760px){
 .theme-f .boat-0{width:78px;height:78px}
 .theme-f .shore-footer{padding:0 24px 20px}
 .theme-f .shore-footer .about,.theme-f .footer-top{display:block}
 .theme-f .footer-map{gap:28px 22px}
 .theme-f .reading-chapter{margin-top:40px}
}

/* The 200 and 404 pages share the same system type family and heading rhythm. */
.theme-f .hero-copy h1{font-weight:600;letter-spacing:-.04em}
.theme-f .reading-header h2{font-weight:500;letter-spacing:-.035em}
.theme-f .reading-chapter h3{font-weight:500}

/* Content can grow without changing the page's navigation or reading measure. */
.theme-f header nav>.site-index{display:none}
.directory-links{list-style:none;margin:20px 0 0;padding:0}
.directory-links li+li{border-top:1px solid #38556829;margin-top:18px;padding-top:12px}
.directory-link{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:48px;font-size:18px;line-height:1.5;overflow-wrap:anywhere}
.directory-link>span:first-child{min-width:0}
a.directory-link .ui-arrow{transition:transform .3s cubic-bezier(.22,.7,.18,1)}
a.directory-link:hover .ui-arrow{transform:translate(var(--arrow-shift-x,3px),var(--arrow-shift-y,0px))}
a.directory-link:hover>span:first-child{text-decoration:underline;text-underline-offset:5px}
.theme-f .harbour-index .directory-links p{margin:5px 0 0;color:#526a70;font-size:14px}
html[data-night=true] body .directory-links li+li{border-color:#d9e1de26}
html[data-night=true] body.theme-f .harbour-index .directory-links p{color:#b7ced4}
.reading-chapter a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;color:#355f74}
html[data-night=true] body .reading-chapter a{color:#c4e0eb}
.reading-chapter :is(ul,ol){padding-left:1.4em;line-height:1.75;margin:24px 0}
.reading-chapter li+li{margin-top:8px}
.reading-chapter blockquote{margin:28px 0;padding-left:24px;border-left:2px solid #66898f;color:var(--reading-muted)}
.reading-chapter :is(img,video){max-width:100%;height:auto;display:block}
.reading-chapter figure{margin:28px 0}.reading-chapter figcaption{font-size:14px;color:var(--reading-muted);line-height:1.6;margin-top:12px}
.reading-chapter pre{max-width:100%;overflow:auto;padding:20px;border:1px solid #66898f55;background:#284e5a08;line-height:1.6;font-size:14px;tab-size:2}
.reading-chapter code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.875em}
.reading-chapter :not(pre)>code{overflow-wrap:anywhere;background:#66898f15;padding:2px 5px}
.reading-chapter table{display:block;max-width:100%;overflow:auto;border-collapse:collapse;font-size:15px;line-height:1.6}
.reading-chapter :is(th,td){padding:12px 16px;text-align:left;border-bottom:1px solid #66898f55;min-width:120px}
.theme-f .shore-footer :is(.about,.footer-top,.footer-bottom){max-width:1200px;margin-inline:auto}
@media(max-width:760px){
 .theme-f header nav>.site-index{display:flex;justify-content:center;min-width:44px;font-size:12px}
 .theme-f header{padding-inline:16px;gap:4px 8px}
 .theme-f header nav{gap:4px 8px}
 .theme-f header .appearance-controls button{padding-inline:4px}
 .reading-chapter blockquote{padding-left:16px}
}
@media(prefers-reduced-motion:reduce){a.directory-link .ui-arrow{transition:none}}

/* Paper and ink change together immediately. Interpolating an inverted pair
   crosses the same luminance and temporarily erases the text. Scene lighting
   and the appearance rail retain their own slower, continuous movement. */
body.theme-f,body.product-page,
.theme-f :is(header,footer,.harbour-index,.shore-footer,.reading-article,.reading-rail,.reading-mobile-toc,.reading-header h2,.reading-chapter h3,.reading-toc a),
.product-page :is(header,footer,.product-main){transition:none}
.theme-f .harbour-index{background:#f2f4eff7;border:0;box-shadow:0 12px 40px #132f4017}
.theme-f .harbour-index .download-feature{border-right-color:#38556820}
.theme-f .shore-footer{background:#f2f4effa}
html[data-night=true] body.theme-f .harbour-index{background:#102a37f7;box-shadow:0 12px 40px #020e1819}
html[data-night=true] body.theme-f .shore-footer{background:#102a37fa}
html[data-night=true] body.theme-f .software-primary{background:#dbe6ee;color:#203b51;border-color:#edf2f680}
html[data-night=true] body.theme-f .software-primary:hover{background:#edf3f7}
/* A short graphic response signals the product entrance without shifting text. */
.theme-f .software-primary .computer-mark{transition:transform .32s cubic-bezier(.22,.7,.18,1)}
.theme-f .software-primary .ui-arrow{transition:transform .32s cubic-bezier(.22,.7,.18,1)}
.theme-f .software-primary:is(:hover,:focus-visible) .computer-mark{transform:translateY(-2px)}
.theme-f .software-primary:is(:hover,:focus-visible) .ui-arrow{transform:translateX(4px)}
.theme-f .software-primary:active .computer-mark{transform:translateY(0)}
.theme-f .software-primary:active .ui-arrow{transform:translateX(2px)}
.theme-f .destinations a .ui-arrow{transition:transform .28s cubic-bezier(.22,.7,.18,1)}
.theme-f .destinations a:is(:hover,:focus-visible) .ui-arrow{transform:translateY(3px)}
.theme-f .appearance-controls button[aria-pressed=false]{opacity:.85}
@media(prefers-reduced-motion:reduce){.theme-f .software-primary :is(.computer-mark,.ui-arrow),.theme-f .destinations a .ui-arrow{transition:none;transform:none!important}}

/* Nested sections share their parent's paper, including the night appearance. */
html[data-night=true] body.theme-f .harbour-index .directory-section,html[data-night=true] body.theme-f .shore-footer .about{background:none}

/* On narrow screens the olive canopy crosses the menu. A restrained local
   surface keeps the controls legible without covering the coastal panorama. */
@media(max-width:760px){
 html[data-night=false] body.theme-f .cover header nav{background:#eff5f1e8;border-radius:4px;box-shadow:0 1px 8px #1634480c}
 html[data-night=true] body.theme-f .cover header nav{background:#102433ed;border-radius:4px}
 .theme-f .cover header nav>.site-index{padding-inline:7px}
}