/* V5 companion pages: small adjustments over the version-four vocabulary so
   Features, Apple apps, and Reviewable Memory match the version-five home page. */
.navbtn{padding:10px 17px;font-size:.9375rem}
.navl a,.nav-github{font-size:.9375rem}
.arrow-link{font-size:1.125rem}
footer .flogo{font-size:1.2rem}

/* Reviewable Memory: the six questions drawn around one record. The plain list remains for phones. */
:root{--dim:#8fa3bb;--border-strong:#33465f}
:root[data-theme="light"]{--dim:#5f7390;--border-strong:#a9bbd0}
.q-figure{margin:40px 0 0}
.q-svg{width:100%;height:auto;display:block;overflow:visible}
.q-svg .q-mono{font:400 12px/1 'JetBrains Mono',monospace;letter-spacing:.08em}
.q-svg .q-text{font:500 22px/1 'Outfit',sans-serif;letter-spacing:-.01em}
.q-svg .q-body{font:400 15px/1 'Outfit',sans-serif}
.q-svg .q-value{font:400 14px/1 'Outfit',sans-serif}
.q-fallback{display:none}
@media(max-width:760px){.q-figure{display:none}.q-fallback{display:block}}

/* Reviewable Memory: the contract drawn as an animated exchange between Claude and the vault. */
.contract-figure{margin:44px 0 48px}
.contract-svg{width:100%;height:auto;display:block}
.contract-svg .c-mono{font:400 12px/1 'JetBrains Mono',monospace;letter-spacing:.08em}
.contract-svg .c-pill .c-mono{letter-spacing:.02em;font-size:13px}
.contract-svg .c-title{font:500 19px/1 'Outfit',sans-serif;letter-spacing:-.01em}
.contract-svg .c-value{font:400 14px/1 'Outfit',sans-serif}
.contract-cap{display:flex;flex-wrap:wrap;gap:8px 24px;padding:16px 0 0;font:400 .9375rem/1.6 'Outfit',sans-serif;color:var(--muted)}
.contract-cap .o{color:var(--accent)}.contract-cap .b{color:var(--accent2)}
@media(prefers-reduced-motion:reduce){.contract-svg .c-live{display:none}}
@media(max-width:760px){.contract-figure{margin:24px 0 8px}.contract-svg{display:none}.contract-cap{padding:0;border-top:1px solid var(--border);padding-top:14px}}

/* Features: a compact name-and-subtitle list. The description opens in a light box. */
.modes-compact .integration-modes-detailed{border-top:2px solid var(--accent);margin-top:32px}
.modes-compact .integration-modes-detailed .integration-mode{display:grid;grid-template-columns:36px 250px minmax(0,1fr) 28px;gap:0 24px;align-items:center;padding:18px 8px 18px 0;border-bottom:1px solid #334861;cursor:pointer;transition:background .15s}
.modes-compact .integration-modes-detailed .integration-mode:hover,.modes-compact .integration-modes-detailed .integration-mode:focus-visible{background:#ffffff08}
:root[data-theme="light"] .modes-compact .integration-modes-detailed .integration-mode:hover{background:#0000000a}
.modes-compact .integration-modes-detailed .mode-number{font-size:.8125rem;padding:0}
.modes-compact .integration-modes-detailed .mode-name{display:contents}
.modes-compact .integration-modes-detailed .mode-name h3{font-size:1.15rem;line-height:1.35;margin:0}
.modes-compact .integration-modes-detailed .mode-name>p{font-size:1rem;line-height:1.5;color:var(--muted);margin:0}
.modes-compact .integration-modes-detailed .integration-mode::after{content:'+';font-size:1.4rem;line-height:1;color:var(--accent2);text-align:right}
.modes-compact .integration-modes-detailed .integration-mode:hover::after{color:var(--accent)}
.modes-compact .integration-modes-detailed .mode-description[data-modal]{display:none}
.mode-dialog{border:1px solid #334861;background:#0b1320;color:var(--text);padding:0;width:min(92vw,760px);max-height:86vh;margin:auto;display:none;flex-direction:column}
.mode-dialog[open]{display:flex}
.mode-dialog::backdrop{background:#04070dcc;backdrop-filter:blur(6px)}
:root[data-theme="light"] .mode-dialog{background:#f7f9fc;border-color:#a9bbd0}
:root[data-theme="light"] .mode-dialog::backdrop{background:#0f1c2c80}
.mode-dialog-head{display:grid;grid-template-columns:40px minmax(0,1fr) 44px;gap:16px;align-items:start;padding:26px 28px 18px;border-bottom:1px solid #334861}
:root[data-theme="light"] .mode-dialog-head,:root[data-theme="light"] .mode-dialog-foot{border-color:#c9d6e4}
.mode-dialog-num{font:400 .8125rem/1.7 'JetBrains Mono',monospace;color:var(--accent);padding-top:6px}
.mode-dialog-title h3{font-size:1.5rem;line-height:1.3;margin:0 0 4px}
.mode-dialog-title p{font-size:1rem;color:var(--accent2);margin:0}
.mode-dialog-close{width:44px;height:44px;border:1px solid #334861;background:transparent;color:var(--text);font-size:1.5rem;line-height:1}
.mode-dialog-close:hover{color:var(--accent);border-color:var(--accent)}
.mode-dialog-body{padding:22px 28px 8px;overflow:auto}
.mode-dialog-body .mode-description{display:block!important}
.mode-dialog-body .mode-description>p{font-size:1.125rem;line-height:1.7;color:var(--muted);margin-bottom:16px}
.mode-dialog-body .mode-description>p:last-child{margin-bottom:0}
.mode-dialog-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 28px 22px;border-top:1px solid #334861;font:400 .8125rem/1.6 'JetBrains Mono',monospace;color:var(--muted)}
.mode-dialog-foot button{background:transparent;border:0;color:var(--text);font:500 .9375rem/1.5 'Outfit',sans-serif;padding:6px 0;border-bottom:1px solid #334861}
.mode-dialog-foot button:hover{color:var(--accent);border-color:var(--accent)}
@media(max-width:760px){
  .modes-compact .integration-modes-detailed .integration-mode{grid-template-columns:28px minmax(0,1fr) 24px;gap:4px 14px;padding:16px 4px 16px 0}
  .modes-compact .integration-modes-detailed .mode-name>p{grid-column:2}
  .modes-compact .integration-modes-detailed .integration-mode::after{grid-row:1/3}
  .mode-dialog-head,.mode-dialog-body,.mode-dialog-foot{padding-inline:18px}
}

/* Features: the page index sits under the top navigation and stays pinned while you read. */
.page-features .feature-index{position:sticky;top:82px;z-index:90;background:#0c1625f2;backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
:root[data-theme="light"] .page-features .feature-index{background:#edf3f9f2}
.page-features .feature-index>.wrap{display:flex;flex-wrap:wrap;gap:8px 30px;padding-block:14px}
.page-features .feature-index a{padding:4px 0;border-bottom:2px solid transparent;transition:border-color .15s,color .15s}
.page-features .feature-index a span{transition:color .15s}
.page-features .feature-index a.active{border-color:var(--accent)}
.page-features .feature-index a.active span{color:var(--text)}
.page-features section[id],.page-features div[id],.page-features .integration-mode{scroll-margin-top:150px}
@media(max-width:1150px){.page-features .feature-index{top:76px}.page-features section[id],.page-features div[id],.page-features .integration-mode{scroll-margin-top:140px}}
@media(max-width:760px){.page-features .feature-index{top:72px}.page-features .feature-index>.wrap{flex-wrap:nowrap;overflow-x:auto;gap:22px;padding-block:12px;scrollbar-width:none}.page-features .feature-index>.wrap::-webkit-scrollbar{display:none}.page-features .feature-index a{white-space:nowrap}.page-features section[id],.page-features div[id],.page-features .integration-mode{scroll-margin-top:128px}}