/* Vrymdor maison v2 "Midnight and Pearl" for the customer guides. The tokens are vrymdor-luxury.css (a byte for
   byte copy of vrymnox-founders-landing brand/luxury/vrymdor-luxury.css in docs/vrymdor, linked first): Midnight by
   default, Pearl when the OS asks for light. Cormorant Garamond headings, Inter body, JetBrains Mono labels, rounded
   glass, azure links and focus, gold only for the eyebrow rules. Fonts are self hosted under fonts/ (SIL Open Font
   License, texts beside them). */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:300;font-display:swap;src:url(fonts/cormorant-garamond-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/cormorant-garamond-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:100 800;font-display:swap;src:url(fonts/jetbrains-mono-latin-wght-normal.woff2) format("woff2")}
:root{--accent:var(--vx-cta);--brand-primary:var(--vx-cta)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:24px;background:var(--vx-ground)}
body{margin:0;background:var(--vx-aurora) no-repeat,var(--vx-ground);background-size:100% 46rem;color:var(--vx-muted);
font:400 var(--vx-body)/1.7 var(--vx-font-text);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
::selection{background:var(--vx-azure);color:var(--vx-on-azure)}
a{color:var(--vx-azure);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--vx-line);
transition:color var(--vx-hover) var(--vx-ease),text-decoration-color var(--vx-hover) var(--vx-ease)}
a:hover{color:var(--vx-azure-hi);text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--vx-azure);outline-offset:2px;border-radius:var(--vx-radius-xs)}
/* Header: the mark and wordmark (a link to the guides home), a mono label, and vrymdor.com at the right, over a
   hairline that fades at both ends. */
.top{position:relative;display:flex;align-items:center;gap:16px;max-width:1240px;margin:0 auto;padding:18px var(--vx-gutter)}
.top::after{content:"";position:absolute;left:var(--vx-gutter);right:var(--vx-gutter);bottom:0;height:1px;
background:linear-gradient(90deg,transparent,var(--vx-line) 15%,var(--vx-line) 85%,transparent)}
.brand{display:inline-flex;align-items:center;gap:12px;min-height:44px;font:400 1.55rem/1 var(--vx-font-display);letter-spacing:.01em;
color:var(--vx-ink);text-decoration:none}
.brand:hover{color:var(--vx-ink)}
.brand img{width:32px;height:32px;border-radius:var(--vx-radius-xs)}
.label{font:500 var(--vx-label)/1.2 var(--vx-font-mono);letter-spacing:var(--vx-tracking-eyebrow);text-transform:uppercase;color:var(--vx-gold)}
.top .label{padding:6px 12px;border:1px solid var(--vx-line-soft);border-radius:var(--vx-radius-pill);color:var(--vx-muted)}
.top .site{margin-left:auto;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--vx-line-strong);
border-radius:var(--vx-radius-sm);color:var(--vx-ink);text-decoration:none;font:500 var(--vx-small)/1 var(--vx-font-text);
transition:border-color var(--vx-hover) var(--vx-ease),color var(--vx-hover) var(--vx-ease)}
.top .site:hover{border-color:var(--vx-azure);color:var(--vx-azure)}
/* Layout: the index in a glass panel on the left, the reading column at about 68 characters. */
.page{display:grid;grid-template-columns:260px minmax(0,1fr);gap:clamp(32px,5vw,80px);max-width:1240px;margin:0 auto;
padding:clamp(32px,5vw,64px) var(--vx-gutter) 80px}
.side{position:sticky;top:24px;align-self:start;padding:20px 12px 14px;background:var(--vx-panel);border:1px solid var(--vx-line-soft);
border-radius:var(--vx-radius);box-shadow:var(--vx-shadow);-webkit-backdrop-filter:blur(var(--vx-blur));backdrop-filter:blur(var(--vx-blur))}
.side .label{display:flex;align-items:center;gap:12px;margin:0 8px 14px}
.side .label::before{content:"";width:24px;height:1px;background:currentColor;opacity:.8}
.side a{position:relative;display:flex;align-items:center;min-height:40px;padding:8px 12px;border-radius:var(--vx-radius-sm);color:var(--vx-muted);
text-decoration:none;font-size:var(--vx-small);line-height:1.4}
.side a:hover{color:var(--vx-ink);background:var(--vx-azure-wash)}
.side a[aria-current=page]{color:var(--vx-ink);background:var(--vx-azure-wash)}
.side a[aria-current=page]::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:2px;background:var(--vx-azure)}
main{min-width:0;max-width:68ch}
main>:first-child{margin-top:0}
h1,h2,h3,h4{font-family:var(--vx-font-display);font-weight:400;color:var(--vx-ink);letter-spacing:-.012em;text-wrap:balance;overflow-wrap:anywhere}
h1{font-weight:300;font-size:clamp(2.3rem,4.6vw,3.5rem);line-height:1.04;margin:0 0 1.6rem}
h1::before{content:"";display:block;width:36px;height:1px;margin:0 0 26px;background:linear-gradient(90deg,var(--vx-gold),transparent)}
h2{font-size:clamp(1.65rem,2.6vw,2.15rem);line-height:1.12;margin:3.4rem 0 1rem;padding-top:2.2rem;border-top:1px solid var(--vx-line-soft)}
h3{font-size:clamp(1.3rem,1.9vw,1.5rem);line-height:1.2;margin:2.4rem 0 .7rem}
h4{font-size:1.15rem;margin:1.8rem 0 .5rem}
p,ul,ol,dl,blockquote,table,pre{margin:0 0 1.15rem}
ul,ol{padding-left:1.35rem}
li{margin:.35rem 0}
li::marker{color:var(--vx-azure)}
ol>li::marker{font:500 .8em var(--vx-font-mono)}
strong,b{color:var(--vx-ink);font-weight:500}
em{font-style:italic}
hr{height:1px;border:0;margin:3rem 0;background:linear-gradient(90deg,var(--vx-line),transparent)}
hr+h2{margin-top:0;padding-top:0;border-top:0}
blockquote{margin-left:0;padding:16px 20px;border:1px solid var(--vx-line-soft);border-left:2px solid var(--vx-azure);border-radius:var(--vx-radius-sm);
background:var(--vx-azure-wash)}
blockquote>:last-child{margin-bottom:0}
code{font:400 .86em/1.5 var(--vx-font-mono);color:var(--vx-ink);background:var(--vx-ground-3);border:1px solid var(--vx-line-soft);
border-radius:var(--vx-radius-xs);padding:.08em .38em;overflow-wrap:anywhere}
pre{position:relative;background:var(--vx-panel-solid);border:1px solid var(--vx-line-soft);border-radius:var(--vx-radius-sm);
box-shadow:var(--vx-shadow-sm);padding:18px 20px;overflow:auto;font-size:15px}
pre code{background:none;border:0;border-radius:0;padding:0;font-size:.86rem;line-height:1.65;overflow-wrap:normal;white-space:pre}
table{border-collapse:collapse;width:100%;display:block;overflow-x:auto;font-size:.92rem;line-height:1.55;font-variant-numeric:tabular-nums}
th,td{padding:13px 14px 13px 0;border-bottom:1px solid var(--vx-line-soft);text-align:left;vertical-align:top}
thead th{font:500 var(--vx-label)/1.35 var(--vx-font-mono);letter-spacing:var(--vx-tracking-label);text-transform:uppercase;color:var(--vx-faint);
border-bottom-color:var(--vx-line);white-space:nowrap}
tbody tr:hover{background:var(--vx-azure-wash)}
tbody td:first-child{color:var(--vx-ink)}
img{max-width:100%;height:auto}
footer{max-width:1240px;margin:0 auto;padding:28px var(--vx-gutter) 48px;color:var(--vx-faint);font:500 var(--vx-label)/1.8 var(--vx-font-mono);
letter-spacing:.18em;text-transform:uppercase;border-top:1px solid var(--vx-line-soft)}
@media (max-width:900px){
.page{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:24px}
.side{position:static;padding:14px 12px 10px}
.side nav{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.side a{flex:none;min-height:44px;padding:8px 14px;border:1px solid var(--vx-line-soft);border-radius:var(--vx-radius-pill);white-space:nowrap}
.side a[aria-current=page]{border-color:var(--vx-azure)}
.side a[aria-current=page]::before{content:none}
main{max-width:none}
body{font-size:16.5px}
}
@media (max-width:520px){.top{flex-wrap:wrap;gap:10px 12px}.top .label{display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{body{background:#fff;color:#111}.side,.top .label,.top .site,footer{display:none}a{color:#111}}