/* Palette applies to desktop and mobile; geometry below is desktop only. */
:root { --paper:#f8f6f2!important; --ink:#23221f!important; --green:#292722!important; --sage:#eee8dd!important; --gold:#a17c48!important; --line:#e6e1d8!important; --muted:#77736b!important; }
body { background:var(--paper)!important; }
.test-home-link { text-decoration:none; }
.test-home-link:focus-visible { outline:2px solid var(--gold); outline-offset:5px; border-radius:4px; }
.test-desktop-nav { display:none; }
.test-header-language { display:block; min-height:36px; padding:4px 6px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); font-size:12px; }
@media(min-width:701px) {
  body #appShell.layout, body.sidebar-expanded #appShell.layout, body:has(.sidebar.expanded) #appShell.layout { width:100%; max-width:none; padding:0 clamp(26px,5vw,88px) 64px!important; }
  #appShell>.sidebar { display:none!important; }
  body #appShell>.top { position:sticky; top:0; z-index:80; height:88px; min-height:88px; margin:0 calc(-1 * clamp(26px,5vw,88px)) 32px!important; padding:0 clamp(26px,5vw,88px)!important; gap:28px; border-bottom:1px solid var(--line); background:#f8f6f2!important; backdrop-filter:none; }
  #appShell>.top>.brand { display:inline-flex!important; flex:none; font-size:31px; color:#25231f; letter-spacing:-1.3px; }
  #appShell>.top>.brand span { width:36px; height:36px; margin-right:10px; background:transparent; color:#25231f; border:1px solid #25231f; border-radius:50%; box-shadow:none; font-size:28px; }
  .test-desktop-nav { display:flex; flex:1; align-self:stretch; align-items:stretch; justify-content:center; gap:clamp(4px,1.3vw,24px); }
  .test-desktop-nav button { font:500 13px 'DM Sans',sans-serif; color:var(--ink); cursor:pointer; }
  .test-desktop-nav>.test-route,.test-nav-trigger { position:relative; display:flex; align-items:center; justify-content:center; gap:8px; height:100%; padding:0 8px; border:0; background:transparent; white-space:nowrap; }
  .test-nav-group { display:flex; align-items:stretch; }
  .test-nav-trigger::after,.test-desktop-nav>.test-route::after { content:''; position:absolute; bottom:19px; left:8px; right:8px; height:1px; background:currentColor; transform:scaleX(0); transition:transform .18s; }
  .test-nav-trigger:hover::after,.test-nav-trigger[aria-expanded=true]::after,.test-desktop-nav>.test-route:hover::after,.test-desktop-nav .is-current::after { transform:scaleX(1); }
  .test-nav-trigger[aria-expanded=true] svg { transform:rotate(180deg); }
  .test-mega-panel { position:absolute; top:100%; left:0; right:0; display:grid; grid-template-columns:.85fr 1.25fr 1fr; gap:clamp(24px,4vw,64px); padding:38px clamp(26px,5vw,88px) 42px; max-height:calc(100dvh - 110px); overflow:auto; background:#f8f6f2; border-top:1px solid var(--line); border-bottom:1px solid var(--line); box-shadow:0 24px 38px #25231f12; }
  .test-mega-panel[hidden] { display:none; }
  .test-menu-intro { display:grid; align-content:start; gap:20px; padding:14px 0; }
  .test-menu-intro small { font-size:10px; letter-spacing:1.8px; text-transform:uppercase; color:var(--muted); }
  .test-menu-intro strong { max-width:330px; font:500 clamp(27px,2.5vw,38px)/1.18 'Playfair Display',serif; letter-spacing:-.025em; }
  .test-menu-links { display:grid; grid-template-columns:1fr; gap:0; align-content:start; }
  .test-menu-links .test-route { display:grid; grid-template-columns:22px minmax(0,1fr) 18px; gap:14px; align-items:center; padding:20px 0; text-align:left; background:transparent; border:0; border-bottom:1px solid var(--line); font-size:15px; transition:color .15s; }
  .test-menu-links .test-route::after { content:'↗'; color:var(--gold); font-size:19px; transition:transform .18s; }
  .test-menu-links .test-route:hover::after { transform:translate(2px,-2px); }
  .test-menu-number { font-size:10px; letter-spacing:1px; color:var(--gold); align-self:start; padding-top:4px; }
  .test-menu-copy { display:grid; gap:7px; }
  .test-menu-title { font-size:16px; font-weight:500; }
  .test-menu-description { color:var(--muted); font-size:11px; font-weight:400; line-height:1.5; }
  .test-menu-feature { position:relative; margin:0; min-height:245px; border-radius:5px; overflow:hidden; background:#e7dfd3; }
  .test-menu-feature img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:60% 45%; filter:saturate(.65); }
  .test-menu-feature::after { content:''; position:absolute; inset:0; background:linear-gradient(transparent 38%,#211d18a8); }
  .test-menu-feature figcaption { position:absolute; z-index:1; bottom:22px; left:22px; right:18px; color:#fffaf0; font:500 23px/1.25 'Playfair Display',serif; }
  .test-menu-links .test-route.is-previewed { color:var(--gold); border-bottom-color:var(--gold); }
  .test-menu-feature.is-tool-preview { padding:24px; min-height:300px; background:#eee7dc; border:1px solid #e6dccd; }
  .test-menu-feature.is-tool-preview::after { display:none; }
  .test-preview-icon { display:grid; place-items:center; width:46px; height:46px; margin-bottom:22px; border:1px solid #cdbda5; border-radius:50%; color:#896a40; font-size:24px; }
  .is-tool-preview>small { display:block; font-size:9px; color:#777065; letter-spacing:1.1px; text-transform:uppercase; }
  .is-tool-preview h3 { margin:10px 0; font:500 25px/1.2 'Playfair Display',serif; color:var(--ink); }
  .is-tool-preview p { font-size:11px; line-height:1.6; margin:0 0 17px; color:#6d665b; }
  .is-tool-preview ul { margin:0; padding:14px 0 0; list-style:none; border-top:1px solid #d9cebd; display:grid; gap:9px; }
  .is-tool-preview li { font-size:10px; line-height:1.5; color:#524c42; padding-left:12px; position:relative; }
  .is-tool-preview li::before { content:'·'; position:absolute; left:0; color:var(--gold); }
  .test-menu-links .test-route:hover,.test-menu-links .test-route.is-current { color:var(--gold); border-bottom-color:var(--gold); }
  .test-desktop-nav button:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
  .test-menu-links a.test-route { color:var(--ink); text-decoration:none; font:500 15px 'DM Sans',sans-serif; cursor:pointer; }
  .test-menu-links .test-route:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
  #appShell>.top .workspace-user { flex:none; margin-left:auto; }
  .test-header-language { width:auto; min-width:104px; }
  .profile-trigger { background:transparent; border:0; padding:6px; }
  .profile-avatar { background:transparent; color:var(--ink); }
  #appShell #workspaceSaveStatus { margin-left:0; }
  .demo-banner { background:#f0ebe2!important; border-color:var(--line)!important; }
  .dashboard-welcome { background:#eae0d0!important; color:var(--ink)!important; box-shadow:none!important; border-color:transparent!important; }
  .dashboard-welcome h1,.dashboard-welcome p,.dashboard-welcome .eyebrow { color:var(--ink)!important; }
}
@media(min-width:701px) and (max-width:1100px) { .test-desktop-nav { gap:0; } body #appShell>.top { gap:12px; padding-inline:26px!important; } .test-desktop-nav button { font-size:12px; } }
@media(min-width:701px) and (max-width:800px) {
  body #appShell>.top { flex-wrap:wrap; height:auto; padding-block:12px!important; gap:8px; }
  .test-desktop-nav { order:4; flex-basis:100%; min-height:40px; }
  .test-nav-trigger::after,.test-desktop-nav>.test-route::after { bottom:0; }
  .test-header-language { margin-left:auto; }
  #appShell>.top .workspace-user { margin-left:0; }
  .test-mega-panel { gap:20px; grid-template-columns:.8fr 1.2fr; }
  .test-menu-links { grid-column:2; grid-row:1 / span 2; }
  .test-menu-feature { grid-column:1; min-height:130px; }
  .test-menu-feature figcaption { font-size:18px; bottom:14px; left:14px; }
}
@media(prefers-reduced-motion:reduce) { .test-desktop-nav * { transition:none!important; } }
@media print { .test-desktop-nav { display:none!important; } }
