/* Shared Curio navigation, scene and glass declarations, with app adapters below. */
.nav{position:fixed;z-index:20;top:24px;left:50%;transform:translateX(-50%);width:min(1100px,92%);display:flex;align-items:center;gap:24px;padding:10px 18px;border-radius:18px;background-image:repeating-linear-gradient(115deg,transparent 0 4px,#ffffff04 4px 5px)}.wordmark{background:#6f54a2;padding:8px 13px;border-radius:10px;line-height:0;display:block;flex:none}.wordmark img{display:block;width:100px;height:auto}.nav>nav{display:flex;gap:24px;align-items:center;margin-left:auto}.nav nav a{font-size:14px;text-decoration:none;display:flex;align-items:center;min-height:44px}.nav nav a:hover{text-decoration:underline}.menu-toggle{display:flex;align-items:center;justify-content:center;gap:7px;margin-left:auto;background:none;border:0;color:var(--ink);padding:10px;min-width:44px;min-height:44px;font-size:13px;border-radius:8px}.menu-toggle[aria-expanded=true]{background:var(--surface-2)}.menu-panel{position:absolute;right:0;top:calc(100% + 12px);width:300px;max-width:92vw;max-height:calc(100dvh - 140px);overflow:auto;padding:20px;border:1px solid var(--edge);border-radius:14px;background:var(--glass);backdrop-filter:blur(3.5px);-webkit-backdrop-filter:blur(3.5px);box-shadow:0 12px 40px #0003}.menu-panel[hidden]{display:none}.menu-panel nav{display:flex;flex-direction:column;gap:0}.menu-panel nav a{padding:5px 8px}.utility{display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid var(--edge);padding-top:15px;margin-top:12px}.utility button{background:none;border:1px solid var(--edge);color:var(--ink);padding:8px 12px;font-size:12px;min-height:44px;border-radius:6px}.utility button:hover{background:rgba(var(--surface),.65)}
.nav{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}.nav::before{content:'';position:absolute;inset:0;border-radius:inherit;z-index:-1;background:var(--glass);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);pointer-events:none}.menu-panel{background:var(--glass-solid);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}#theme{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:10px}.footer-motion{background:rgba(var(--surface),.35);color:var(--ink);border:1px solid var(--edge);border-radius:8px;min-height:44px;padding:10px 15px;font-size:12px;flex:none}
.nav{column-gap:0}.nav>nav:not(.nav-measure){justify-content:space-evenly;column-gap:0}
.scene{position:fixed;inset:0 0 auto;height:100vh;height:100lvh;z-index:-1;pointer-events:none;overflow:hidden;background:var(--bg)}
.scene::before{content:'';position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='180' viewBox='0 0 160 180'%3E%3Cpath fill='none' stroke='%239475ab' stroke-opacity='.17' d='M20 150V45h85v55H65v25h20M140 20H90v20h25v20M130 150H110v-25H85'/%3E%3C/svg%3E");opacity:1}
.scene.scene-ready::before{opacity:0}
.scene canvas{display:block;width:100%;height:100%;opacity:0;transition:none}
.scene canvas.ready{opacity:1}
.glass{position:relative;isolation:isolate;background:var(--glass);backdrop-filter:blur(2.5px);-webkit-backdrop-filter:blur(2.5px);border:1px solid var(--edge);box-shadow:0 12px 40px #00000014,inset 0 1px 0 #ffffff24;border-radius:6px}
.glint{position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from var(--angle,0deg),transparent 0deg 270deg,#ffffff78 302deg,transparent 328deg);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;z-index:3}
.scroll-glass{background:var(--glass);backdrop-filter:blur(var(--glass-blur,2.5px));-webkit-backdrop-filter:blur(var(--glass-blur,2.5px));box-shadow:0 16px 32px rgba(0,0,0,var(--glass-shadow,.08)),inset 0 1px 0 #ffffff18;scale:var(--glass-scale,1);transform-origin:center;transition:scale .22s ease-out}
.surface-sheen{position:absolute;inset:0;pointer-events:none;border-radius:inherit;z-index:-1;opacity:.3;background:linear-gradient(110deg,transparent 35%,#ffffff38 50%,transparent 65%);background-size:250% 100%;background-position:var(--sheen-x,50%) center;mask-image:repeating-linear-gradient(0deg,transparent 0 35px,#000 36px 37px,transparent 38px 50px)}
.scroll-glass:not(.glass-near){backdrop-filter:none;-webkit-backdrop-filter:none;scale:1;box-shadow:none}
.glass:not(.glass-near)>.glint,.glass:not(.glass-near)>.surface-sheen{visibility:hidden}



.menu-icon path{transform-origin:12px 12px;transition:transform .24s ease,opacity .16s ease}
.menu-top{transform:translateY(-5px)}
.menu-bottom{transform:translateY(5px)}
.menu-toggle[aria-expanded=true] .menu-top{transform:rotate(45deg)}
.menu-toggle[aria-expanded=true] .menu-bottom{transform:rotate(-45deg)}
.menu-toggle[aria-expanded=true] .menu-middle{opacity:0}
.nav>nav:not(.nav-measure){flex:1;min-width:0;margin-left:0;gap:clamp(9px,1vw,20px);justify-content:flex-end}
.nav .theme-icon{width:36px!important;min-width:36px;height:44px!important;border:0;background:transparent;color:var(--ink);flex:none;cursor:pointer}
.nav>nav.nav-measure{position:absolute;top:-10000px;left:0;visibility:hidden;pointer-events:none;width:max-content;max-width:none;display:flex;gap:clamp(9px,1vw,20px);margin:0}
.nav-measure a{display:flex!important}
.nav-measure a::after{display:none}
.nav>nav:not(.nav-measure){justify-content:space-evenly;column-gap:0}
/* App shell adapters: same fixed navigation, original workspace below it. */
body { background-image: none; }
.nav { border-radius: 18px; }
.nav svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.menu-icon path { transform-origin: 12px 12px; transition: transform 280ms ease, opacity 280ms ease; }
.nav nav a { position: relative; }
.nav nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 6px; height: 1px; background: currentColor; scale: 0 1; transform-origin: left; transition: scale 220ms ease; }
.nav nav a:is(:hover,:focus-visible)::after { scale: 1 1; }
.nav nav a:hover { text-decoration: none; }
:root[data-theme=light] .nav { --ink: #fff; --accent: #fff; --edge: #ffffff60; color: var(--ink); }
:root[data-theme=light] .nav::before { background: rgba(111,84,162,.90); }
:root[data-theme=light] .menu-panel { background: rgba(111,84,162,.96); }
:root[data-theme=light] .nav .wordmark { background: transparent; }
:root[data-theme=dark] .menu-panel { background: rgba(40,31,51,.96); }
.layout { margin-top: 120px; }
.pane.glass { background: var(--glass); }
/* Input planes do not scale: keep pointer coordinates and reading geometry stable. */
.pane.scroll-glass { scale: 1; }
.site-footer.glass { background: #281f33; color: #c8bdd5; }
.footer-motion { background: #ffffff10; color: inherit; margin-top: 12px; }
@keyframes curio-route-arrival { from { opacity: 0; } to { opacity: 1; } }
@keyframes curio-nav-arrival { from { opacity: 0; translate: 0 -6px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: no-preference) {
  body > main, body > footer { animation: curio-route-arrival 700ms cubic-bezier(.22,.61,.36,1) backwards; }
  body > .nav { animation: curio-nav-arrival 500ms cubic-bezier(.22,.61,.36,1) backwards; }
  .curio-pending [data-curio-arrival]:not([data-arrived]) { opacity: 0; }
  .curio-media-pending { opacity: 0; }
  .button, .footer-motion { transition: translate 220ms ease, box-shadow 220ms ease, background-color 220ms ease; }
}
@media (hover: hover) and (pointer: fine) {
  .button:not(:disabled):hover, .footer-motion:hover { translate: 0 -2px; box-shadow: 0 8px 20px #00000018; }
}
.button:active, .footer-motion:active { translate: 0 0; }
body.motion-paused :is(main, footer, .nav) { animation: none !important; }
body.motion-paused :is(.button, .footer-motion) { translate: none !important; transition: none !important; }
body.motion-paused .curio-media-pending, body.motion-paused [data-curio-arrival] { opacity: 1; }
@property --ink { syntax: '<color>'; inherits: true; initial-value: #313131; }
@property --muted { syntax: '<color>'; inherits: true; initial-value: #55545a; }
@property --bg { syntax: '<color>'; inherits: true; initial-value: #e5e5e7; }
@property --edge { syntax: '<color>'; inherits: true; initial-value: rgba(255,255,255,.82); }
@property --control { syntax: '<color>'; inherits: true; initial-value: #6f54a2; }
@property --accent { syntax: '<color>'; inherits: true; initial-value: #6f54a2; }
:root.theme-changing { transition: --ink 500ms ease-in-out, --muted 500ms ease-in-out, --bg 500ms ease-in-out, --edge 500ms ease-in-out, --control 500ms ease-in-out, --accent 500ms ease-in-out; }
.theme-changing .nav::before, .theme-changing .pane, .theme-changing .menu-panel { transition: background-color 500ms ease-in-out, box-shadow 500ms ease-in-out; }
@media (max-width: 900px) {
  .tabs { margin-top: 120px; }
  .layout { margin-top: 0; }
  .chat { height: calc(100dvh - 150px); }
}
@media (max-width: 600px) {
  .nav { top: 16px; padding: 8px 12px; }
  .wordmark img { width: 76px; }
  .tabs { margin-top: 104px; }
}
@media (prefers-reduced-motion: reduce) {
  .curio-media-pending, [data-curio-arrival] { opacity: 1; }
  :root.theme-changing, .theme-changing * { transition: none !important; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .pane.glass { background: var(--glass-solid); }
}
@media (forced-colors: active) {
  .scene, .glint, .surface-sheen { display: none; }
  .pane.glass, .nav.glass, .menu-panel { background: Canvas; color: CanvasText; border-color: CanvasText; }
  .nav::before { background: Canvas !important; }
  .nav .wordmark { background: #6f54a2 !important; }
}
/* Preserve positioning against the shared .glass material declaration. */
.nav.glass { position: fixed; }
.chat.glass { position: sticky; }
@media (max-width: 900px) { .chat.glass { position: static; } }
/* Width measurements must match the real menu/link boxes, including hidden state. */
.nav .menu-toggle[hidden] { display: none !important; }
.nav .menu-toggle span { display: none; }
.nav > nav a { flex: none; white-space: nowrap; }
:root[data-theme=light] .nav { --focus: #fff; }

.nav{gap:clamp(5px,1vw,16px)}.nav>nav:not(.nav-measure){flex:1;min-width:0;margin-left:0;gap:clamp(9px,1vw,20px);justify-content:flex-end}.nav>nav a{flex:none;white-space:nowrap}.nav>nav a:not(.nav-primary){display:flex}.nav .theme-icon{width:36px!important;min-width:36px;height:44px!important;border:0;background:transparent;color:var(--ink);flex:none;cursor:pointer}.nav .menu-toggle{margin-left:0;flex:none;min-width:44px}.nav .menu-toggle span{display:none}.nav .menu-toggle[hidden]{display:none!important}.nav>nav.nav-measure{position:absolute;top:-10000px;left:0;visibility:hidden;pointer-events:none;width:max-content;max-width:none;display:flex;gap:clamp(9px,1vw,20px);margin:0}.nav-measure a{display:flex!important}.nav-measure a::after{display:none}
.nav nav a{font-size:clamp(11px,1.1vw,14px)}.nav .wordmark img{width:clamp(57px,8vw,100px)}.nav .wordmark{padding:clamp(7px,.8vw,13px)}
.nav{column-gap:0}.nav>nav:not(.nav-measure){justify-content:space-evenly;column-gap:0}
.nav .menu-toggle[aria-expanded=true] { background: #ffffff20; }
/* Rendered-pass fixes (November 1, 2026): keep app panels clear of the fixed navigation. */
.nav > nav.nav-measure { left: -10000px; contain: layout; }
html { overflow-x: clip; }
:root[data-theme=dark] .nav::before { background: rgba(40,31,51,.90); }
.chat { top: 150px; height: calc(100dvh - 174px); }
@media (max-width: 900px) {
  .tabs { position: sticky; top: 112px; z-index: 15; }
  .chat { top: auto; height: calc(100dvh - 210px); }
  .chat .chips { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: 4px; }
  .chat .chip { flex: 0 0 auto; max-width: 78%; }
}
@media (max-width: 600px) {
  .tabs { top: 84px; border-top: 12px solid var(--bg); background-clip: padding-box; }
  .chat { height: calc(100dvh - 190px); }
}
