/* Shared site navigation. Product pages and home inherit the same Choro tokens. */
.analytics-choice { position: fixed; inset: auto 20px 20px; z-index: 110; display: flex; align-items: center; justify-content: space-between; gap: 24px; max-width: 1060px; margin-inline: auto; padding: 24px; border-radius: 12px; background: var(--surface); color: var(--fg); box-shadow: 0 12px 48px var(--shadow); max-height: calc(100dvh - 40px); overflow-y: auto; }
.analytics-choice[hidden] { display: none; }
.analytics-choice h2 { margin: 0 0 6px; font: 600 20px/1.3 var(--display); letter-spacing: -.02em; }
.analytics-choice p { margin: 0; max-width: 65ch; color: var(--fg-muted); font-size: 14px; line-height: 1.6; }
.analytics-choice a, .analytics-settings { text-decoration: underline; text-underline-offset: 3px; }
.analytics-choice-actions { display: flex; flex-shrink: 0; gap: 10px; }
.analytics-choice-actions button { min-height: 44px; padding: 10px 14px; border: 1px solid var(--fg-subtle); border-radius: 8px; background: var(--surface-2); color: var(--fg); font: inherit; font-size: 14px; cursor: pointer; }
.analytics-choice-actions button:hover { background: var(--surface-3); }
.analytics-settings { min-height: 44px; padding: 8px 0; border: 0; background: transparent; color: var(--fg-muted); font: inherit; cursor: pointer; }
.analytics-settings:hover { color: var(--fg); }
@media (max-width: 760px) {
 .analytics-choice { inset: auto 12px 12px; padding: 20px; flex-direction: column; align-items: stretch; gap: 16px; }
 .analytics-choice-actions { flex-wrap: wrap; }
 .analytics-choice-actions button { flex: 1; }
}
html { scroll-padding-top: 100px; scrollbar-color: var(--fg-subtle) var(--bg); }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 5px; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
input { caret-color: var(--primary); }
.site-skip { position: fixed; left: 20px; top: -80px; z-index: 999; padding: 12px 20px; background: var(--primary); color: var(--on-primary); border-radius: 8px; }
.site-skip:focus { top: 12px; }
.nav { z-index: 100; }
.nav .nav-in { min-height: 76px; gap: 20px; }
.nav .brand { flex-shrink: 0; }
.site-navigation { display: flex; align-items: center; flex: 1; gap: 20px; min-width: 0; }
.site-menu-toggle { display: none; }
.site-menus { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.site-menu { position: relative; }
.site-menu > summary, .site-home { display: flex; align-items: center; gap: 7px; padding: 12px 10px; color: var(--fg-muted); cursor: pointer; list-style: none; font-size: 14px; font-weight: 550; }
.site-home:hover, .site-home[aria-current="page"] { color: var(--fg); }
.site-menu > summary::-webkit-details-marker { display: none; }
.site-menu > summary i { font-size: 14px; transition: transform .15s; }
.site-menu[open] > summary { color: var(--fg); }
.site-menu[open] > summary i { transform: rotate(180deg); }
.site-menu-panel { position: absolute; top: calc(100% + 9px); right: 0; width: 580px; padding: 24px; background: var(--surface); border-radius: 12px; box-shadow: 0 18px 50px -12px var(--shadow); display: grid; grid-template-columns: 1fr 1fr; gap: 8px 22px; }
.site-menu-panel a { display: block; padding: 14px 12px; border-radius: 6px; }
.site-menu-panel a:hover, .site-menu-panel a[aria-current="page"] { background: var(--surface-2); }
.site-menu-panel b { display: block; font-family: var(--display); font-size: 17px; font-weight: 550; letter-spacing: -.02em; }
.site-menu-panel small { display: block; color: var(--fg-muted); font-size: 13px; line-height: 1.55; margin-top: 6px; }
.site-menu-panel.resources { width: 300px; grid-template-columns: 1fr; }
.nav .nav-download { min-height: 40px; background: var(--primary); color: var(--on-primary); padding: 11px 16px; }
.nav .appearance-button { width: 36px; height: 36px; background: transparent; color: var(--fg-muted); }
.site-footer .foot-in { grid-template-columns: minmax(0,1fr); gap: 0; padding: 60px 28px 35px; }
.site-footer .foot-top { display: grid; grid-template-columns: minmax(220px,.9fr) minmax(0,2fr); gap: clamp(48px,7vw,100px); }
.site-footer .foot-brand p { max-width: 24ch; color: var(--fg-muted); font-size: 14px; margin: 10px 0 20px; }
.site-footer .footer-credit { flex-wrap: wrap; color: var(--fg-muted); font-size: 12px; }
.site-footer .foot-columns { grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(32px,5vw,72px); }
.site-footer .foot-col h2 { font: 600 13px 'Instrument Sans',sans-serif; letter-spacing: 0; text-transform: none; color: var(--fg); margin-bottom: 14px; }
.site-footer .foot-col a { white-space: normal; line-height: 1.5; padding-block: 5px; }
.site-footer .foot-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; color: var(--fg-muted); font-size: 12px; padding-top: 30px; margin-top: 25px; border-top: 1px solid var(--border); }
.site-footer .future-picnic-logo { display: inline-block; width: 100px; height: auto; }
.home-feature-intro { display: flex; align-items: center; justify-content: space-between; gap: 24px 48px; margin-bottom: 40px; }
.feat .home-feature-intro .sec-lead { margin: 0; }
.home-explore { flex-shrink: 0; min-height: 44px; }
.home-explore.secondary:hover { transform: none; }
@media (max-width: 900px) {
 .home-feature-intro { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 32px; }
}
.home-product-links { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px 40px; padding-block: 38px 72px; }
.home-product-links a { padding-block: 20px; border-top: 1px solid color-mix(in srgb,var(--fg) 16%,transparent); }
.home-product-links strong { font: 600 21px var(--display); }
.home-product-links p { margin: 8px 0 0; color: var(--fg-muted); font-size: 14px; }
.home-product-links a:hover strong { color: var(--primary); }
@media (max-width: 760px) {
 .nav .nav-in { height: 68px; min-height: 68px; gap: 8px; padding: 0 16px; flex-wrap: nowrap; }
 .nav .brand { font-size: 24px; margin-right: auto; order: 0; }
 .nav .brand-logo { height: 26px; width: auto; }
 .nav .appearance-button { order: 1; width: 44px; height: 44px; }
 .nav-ready .site-menu-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 8px; order: 2; min-height: 44px; padding: 0 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--fg); cursor: pointer; font-size: 14px; }
 .site-navigation { position: absolute; inset: 100% 0 auto; display: flex; flex-direction: column; align-items: stretch; gap: 16px; padding: 12px 20px 20px; max-height: calc(100dvh - 68px); overflow-y: auto; overscroll-behavior: contain; background: var(--surface); border-bottom: 1px solid var(--border); box-shadow: 0 16px 30px -20px var(--shadow); }
 .nav-ready .site-navigation { display: none; }
 .nav-ready[data-menu-open="true"] .site-navigation { display: flex; }
 .nav:not(.nav-ready) .nav-in { height: auto; flex-wrap: wrap; }
 .nav:not(.nav-ready) .site-navigation { position: static; flex-basis: 100%; order: 3; }
 .site-menus { display: flex; flex-direction: column; align-items: stretch; gap: 0; margin: 0; }
 .site-menu > summary, .site-home { min-height: 48px; font-size: 15px; padding: 12px 4px; gap: 8px; }
 .site-menu > summary { justify-content: space-between; }
 .site-menu { position: static; }
 .site-menu-panel { position: static; width: auto; max-height: none; overflow: visible; padding: 4px 0 12px; gap: 4px; box-shadow: none; }
 .site-menu-panel.resources { width: auto; }
 .site-menu-panel a { padding: 12px; min-width: 0; }
 .site-menu-panel b { font-size: 16px; }
 .nav .nav-download { display: inline-flex; align-self: flex-start; font-size: 14px; padding: 12px 16px; min-height: 44px; }
 .site-footer .foot-top { grid-template-columns: 1fr; gap: 32px; }
 .site-footer .foot-in { padding-inline: 24px; }
 .home-product-links { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 430px) {
 .site-menu-panel { grid-template-columns: 1fr; }
 .site-footer .foot-columns { grid-template-columns: 1fr 1fr; }
 .home-product-links { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
/* Legal copy keeps its reading layout while using the same site theme and chrome. */
html.legal-page {
 --color-paper: var(--bg);
 --color-paper-raised: var(--surface);
 --color-surface: var(--surface);
 --color-surface-strong: var(--surface-2);
 --color-ink: var(--fg);
 --color-ink-muted: var(--fg-muted);
 --color-ink-subtle: var(--fg-muted);
 --color-rule: var(--border);
 --color-rule-soft: var(--border-soft);
 --color-accent: var(--primary);
 --color-accent-ink: var(--on-primary);
 --color-focus: var(--primary);
}
.site-footer .p-text-link { font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }
.legal-page .nav a, .legal-page .site-footer a { text-decoration: none; }
.nav .brand { font-size: 24px; }
/* Filled controls keep the original lavender; text links need the deeper light-theme accent. */
.choro-landing[data-theme="light"] :is(.home-product-links a:hover strong, .site-footer .foot-col a:hover, .site-menu-panel a > i) { color: #685581; }

/* Original website-backgrounds WebP artwork, unchanged, fading into the page. */
.choro-landing:not(.legal-page) body {
 --header-art: url('assets/header-backgrounds/start-background.webp?v=19b72ceef649bdb3');
 --header-art-small: url('assets/header-backgrounds/small/start-background.webp?v=14fc70df9606afe5');
 position: relative;
 isolation: isolate;
}
.choro-landing body.agents-page {
 --header-art: url('assets/header-backgrounds/agents-background.webp?v=6f6a3272ca08a666');
 --header-art-small: url('assets/header-backgrounds/small/agents-background.webp?v=2aeb47c0848cfb62');
}
.choro-landing body.context-page {
 --header-art: url('assets/header-backgrounds/context-background.webp?v=0565253e52d0a7e5');
 --header-art-small: url('assets/header-backgrounds/small/context-background.webp?v=9a23785bf60bd8cc');
}
.choro-landing body.workspace-page {
 --header-art: url('assets/header-backgrounds/preview-background.webp?v=88f8df5d2838ecd5');
 --header-art-small: url('assets/header-backgrounds/small/preview-background.webp?v=20e039bb586ee237');
}
.choro-landing body.design-page {
 --header-art: url('assets/header-backgrounds/band-background.webp?v=6c330b94ac6a8d30');
 --header-art-small: url('assets/header-backgrounds/small/band-background.webp?v=ae9ecc39213d2159');
}
.choro-landing body.orbit-page {
 --header-art: url('assets/header-backgrounds/orbit-background.webp?v=d2737a5cad780650');
 --header-art-small: url('assets/header-backgrounds/small/orbit-background.webp?v=ef22662ccf7dcfdc');
}
.choro-landing body.mobile-page {
 --header-art: url('assets/header-backgrounds/mobile-background.webp?v=90e1e281072cd3dd');
 --header-art-small: url('assets/header-backgrounds/small/mobile-background.webp?v=d94a75cd23b6e62e');
}
.choro-landing:not(.legal-page) body::before {
 content: '';
 position: absolute;
 inset: 0 0 auto;
 height: 780px;
 z-index: -1;
 pointer-events: none;
 background-image: var(--header-art);
 background-size: cover;
 background-position: center top;
 background-repeat: no-repeat;
 -webkit-mask-image: linear-gradient(#000 0%, #000 35%, transparent 100%);
 mask-image: linear-gradient(#000 0%, #000 35%, transparent 100%);
}
.choro-landing .hero::before { background-image: none; }
/* Light exports already match the page's #F6F1EF canvas; keep their full color. */
.choro-landing[data-theme="light"]:not(.legal-page) body {
 --header-art: url('assets/header-backgrounds/light/start-background.webp?v=fecf902aee3c3d15');
 --header-art-small: url('assets/header-backgrounds/light/small/start-background.webp?v=2a221d88fe48e6d6');
}
.choro-landing[data-theme="light"] body.agents-page {
 --header-art: url('assets/header-backgrounds/light/agents-background.webp?v=97851b8af7b046b4');
 --header-art-small: url('assets/header-backgrounds/light/small/agents-background.webp?v=9011bd25ad0584ab');
}
.choro-landing[data-theme="light"] body.context-page {
 --header-art: url('assets/header-backgrounds/light/context-background.webp?v=02d0cf4c3bd7511c');
 --header-art-small: url('assets/header-backgrounds/light/small/context-background.webp?v=04678e2ee5f4eab2');
}
.choro-landing[data-theme="light"] body.workspace-page {
 --header-art: url('assets/header-backgrounds/light/preview-background.webp?v=a2c9e314dbe2ec02');
 --header-art-small: url('assets/header-backgrounds/light/small/preview-background.webp?v=136e9637053703f0');
}
.choro-landing[data-theme="light"] body.design-page {
 --header-art: url('assets/header-backgrounds/light/band-background.webp?v=86ed29cdf482ac49');
 --header-art-small: url('assets/header-backgrounds/light/small/band-background.webp?v=c41f070369e1dea6');
}
.choro-landing[data-theme="light"] body.orbit-page {
 --header-art: url('assets/header-backgrounds/light/orbit-background.webp?v=fe8f998a0da2d529');
 --header-art-small: url('assets/header-backgrounds/light/small/orbit-background.webp?v=9fb021fad21f8b98');
}
.choro-landing[data-theme="light"] body.mobile-page {
 --header-art: url('assets/header-backgrounds/light/mobile-background.webp?v=65edb3afabe28f20');
 --header-art-small: url('assets/header-backgrounds/light/small/mobile-background.webp?v=cf1bc46cf493a4c1');
}
@media (max-width: 760px) {
 .choro-landing:not(.legal-page) body::before {
  height: 650px;
  background-image: var(--header-art-small);
  background-position: 70% top;
 }
}