/* The console shell: the sidebar sits on the canvas, the page is a bordered card beside it (design record 2026-10-11,
   section 5). Rows are 40px / 14px with a soft pill for the current one; the Recent sessions are a group of titles. */
.shell { --sidebar:264px; --inset:10px; position:relative; height:100dvh; display:grid; grid-template-columns:var(--sidebar) minmax(0,1fr); overflow:hidden; background:var(--canvas); transition:grid-template-columns .2s ease; }
.sidebar { position:relative; display:flex; flex-direction:column; min-height:0; padding:12px 10px 10px; }
/* The head: the project switcher — logo, project name, product name — where the brand used to be. */
.sidebar-head { flex:none; }
.sidebar-head .project-menu summary { display:flex; align-items:center; gap:10px; height:46px; max-width:none; padding:0 8px; border:0; border-radius:11px; box-shadow:none; }
.sidebar-head .project-menu[open]>summary { background:var(--row-hover); border-color:transparent; box-shadow:none; }
.switcher-logo { flex:none; width:30px; height:30px; padding:2px; border-radius:9px; background:#fff; object-fit:contain; }
.switcher-text { display:flex; flex-direction:column; flex:1; min-width:0; line-height:1.3; }
.switcher-text>.project-name { font-size:14px; font-weight:650; letter-spacing:-.2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.switcher-text>small { color:var(--muted); font-size:11px; font-weight:400; }
.sidebar-head .project-menu summary>.nav-icon { width:14px; height:14px; }
.sidebar-head .menu-list { left:0; right:0; width:auto; }
/* The navigation is the sidebar's scroll container; the list fades out under the account card instead of ending on a line. */
.sidebar-nav { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; margin:10px -4px 0; padding:0 4px 18px; scrollbar-width:thin; scrollbar-color:transparent transparent; mask-image:linear-gradient(to bottom,#000 calc(100% - 22px),transparent); -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 22px),transparent); }
.sidebar-nav:hover { scrollbar-color:var(--scroll-thumb) transparent; }
/* Console scrollbars — navigation, the project menu and select listboxes: thin, rounded, no track, from the theme's muted
   tone; darker while the pointer is over the list. Standard properties serve Chrome 121+ and Firefox; the WebKit
   pseudo-elements serve Safari, which ignores the former. */
.sidebar-nav,.configuration-links,.menu-options,[role=listbox],.agent-thread,.agent-panel-body { scrollbar-width:thin; --scroll-thumb:color-mix(in srgb,var(--muted) 38%,transparent); scrollbar-color:var(--scroll-thumb) transparent; }
.sidebar-nav:hover,.configuration-links:hover,.menu-options:hover,[role=listbox]:hover,.agent-thread:hover,.agent-panel-body:hover { --scroll-thumb:color-mix(in srgb,var(--muted) 62%,transparent); }
.sidebar-nav::-webkit-scrollbar,.configuration-links::-webkit-scrollbar,.menu-options::-webkit-scrollbar,[role=listbox]::-webkit-scrollbar,.agent-thread::-webkit-scrollbar,.agent-panel-body::-webkit-scrollbar { width:6px; }
.sidebar-nav::-webkit-scrollbar-track,.configuration-links::-webkit-scrollbar-track,.menu-options::-webkit-scrollbar-track,[role=listbox]::-webkit-scrollbar-track,.agent-thread::-webkit-scrollbar-track,.agent-panel-body::-webkit-scrollbar-track { background:transparent; }
.sidebar-nav::-webkit-scrollbar-thumb,.configuration-links::-webkit-scrollbar-thumb,.menu-options::-webkit-scrollbar-thumb,[role=listbox]::-webkit-scrollbar-thumb,.agent-thread::-webkit-scrollbar-thumb,.agent-panel-body::-webkit-scrollbar-thumb { background:var(--scroll-thumb); border-radius:999px; }
/* The navigation's thumb only while the pointer is over the list (the shared rule above paints it always). */
.sidebar-nav:not(:hover) { scrollbar-color:transparent transparent; }
.sidebar-nav:not(:hover)::-webkit-scrollbar-thumb { background:transparent; }
.primary-nav,.nav-group,.nav-recent { display:flex; flex-direction:column; gap:1px; }
.nav-item { position:relative; display:flex; align-items:center; gap:11px; min-height:40px; width:100%; padding:0 11px; border:0; border-radius:11px; background:transparent; color:var(--ink); font-size:14px; line-height:1.4; text-align:left; }
.nav-item>.nav-icon { color:var(--muted); }
.nav-item:hover { background:var(--row-hover); }
.nav-item.active { background:var(--row-active); font-weight:550; }
.nav-item.active>.nav-icon { color:var(--ink); }
.nav-item.nav-new { color:var(--brand); font-weight:550; }
.nav-item.nav-new>.nav-icon { color:var(--brand); }
.nav-item.nav-new:hover { background:var(--brand-soft); }
.nav-item.nav-new.active { background:var(--brand-soft); }
.nav-item.nav-new.active>.nav-icon { color:var(--brand); }
.nav-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-mobile-label { display:none; }
.nav-icon { display:block; width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }
.nav-label { padding:20px 11px 7px; color:var(--muted); font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
/* Desktop has no More control: the groups are always on screen. */
.configuration-toggle { display:none; }
/* Recent: titles only, slightly quieter than the navigation rows; the live dot sits in the row's left edge. */
.nav-recent-row { position:relative; display:flex; align-items:center; min-height:36px; border-radius:11px; }
.nav-recent-row:hover,.nav-recent-row:focus-within { background:var(--row-hover); }
.nav-recent-row.active { background:var(--row-active); }
.nav-recent-item { display:flex; flex:1; align-items:center; gap:8px; min-width:0; min-height:36px; padding:0 6px 0 12px; border-radius:11px; color:color-mix(in srgb,var(--ink) 82%,var(--muted)); font-size:13.5px; line-height:1.4; }
.nav-recent-row.active .nav-recent-item { color:var(--ink); font-weight:550; }
.nav-recent-item>span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-live { position:absolute; left:2px; top:50%; width:6px; height:6px; margin-top:-3px; border-radius:50%; background:var(--success); box-shadow:0 0 0 2px var(--success-bg); }
.nav-recent-menu { position:relative; flex:none; }
.nav-recent-menu>summary { display:flex; align-items:center; justify-content:center; width:26px; height:26px; margin-right:5px; border-radius:7px; color:var(--muted); cursor:pointer; list-style:none; opacity:0; }
.nav-recent-menu>summary::-webkit-details-marker { display:none; }
.nav-recent-row:hover .nav-recent-menu>summary,.nav-recent-row:focus-within .nav-recent-menu>summary,.nav-recent-menu[open]>summary { opacity:1; }
.nav-recent-menu>summary:hover,.nav-recent-menu[open]>summary { background:var(--row-active); color:var(--ink); }
.nav-recent-menu>summary>.nav-icon { width:16px; height:16px; }
.nav-recent-menu>.menu-list { left:auto; right:0; top:calc(100% - 4px); width:200px; }
.nav-recent-menu .menu-list button { gap:8px; justify-content:flex-start; }
.nav-recent-menu .menu-list .nav-icon { width:15px; height:15px; flex:none; }
.nav-recent-menu .menu-danger:not(:disabled):hover { color:var(--danger); }
.nav-recent-menu .menu-list button:disabled { color:var(--muted); cursor:not-allowed; }
/* "All sessions" is a quiet link closing the group, not a navigation row. */
.nav-item.nav-recent-all { min-height:30px; margin-top:2px; color:var(--muted); font-size:12.5px; }
.nav-item.nav-recent-all>.nav-icon { width:15px; height:15px; }
.nav-item.nav-recent-all:hover { background:transparent; color:var(--ink); }
.nav-item.nav-recent-all:hover>.nav-icon { color:var(--ink); }
.nav-item.nav-recent-all.active { background:transparent; color:var(--ink); }
.nav-item.nav-recent-all.active>.nav-icon { color:var(--ink); }
/* The account card: a card on the canvas, like the page beside it. */
.sidebar-bottom { flex:none; margin-top:4px; }
.account-trigger { display:flex; align-items:center; gap:10px; width:100%; height:56px; padding:0 10px; border:1px solid var(--line); border-radius:13px; background:var(--surface); color:var(--ink); text-align:left; box-shadow:0 1px 2px #0000000a,0 8px 24px -12px #00000014; }
.account-trigger:hover,.account-trigger[aria-expanded=true] { border-color:color-mix(in srgb,var(--muted) 45%,var(--line)); }
.avatar { display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:10px; background:var(--primary); color:var(--primary-fg); font-size:13px; font-weight:650; }
.account-identity { display:flex; flex-direction:column; gap:1px; min-width:0; flex:1; line-height:1.3; }
.account-identity strong { font-size:13.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-identity small { color:var(--muted); font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-caret { display:flex; flex:none; color:var(--muted); transform:rotate(-90deg); transition:transform .15s ease; }
.account-caret>.nav-icon { width:15px; height:15px; }
.account-trigger:hover .account-caret { color:var(--ink); }
.account-trigger[aria-expanded=true] .account-caret { transform:rotate(180deg); }
.account-mobile { display:none; }
/* The collapse control rides the boundary between the sidebar and the page: a pill with a chevron, quiet until the
   pointer is over the sidebar. */
.sidebar-handle { position:absolute; left:calc(var(--sidebar) - 11px); top:50%; z-index:20; display:flex; align-items:center; justify-content:center; width:22px; height:44px; margin-top:-22px; padding:0; border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--muted); box-shadow:0 1px 2px #0000000a,0 8px 24px -12px #00000014; opacity:.6; transition:opacity .15s ease,left .2s ease,color .15s ease; }
.sidebar-handle>.nav-icon { width:14px; height:14px; transform:rotate(90deg); transition:transform .2s ease; }
.sidebar:hover~.sidebar-handle,.sidebar-handle:hover,.sidebar-handle:focus-visible { opacity:1; color:var(--ink); }
.sidebar-handle:hover { border-color:color-mix(in srgb,var(--muted) 45%,var(--line)); }
.shell[data-sidebar=collapsed] .sidebar-handle>.nav-icon { transform:rotate(-90deg); }
/* The page: a card inset on the canvas. */
.shell-main { display:flex; flex-direction:column; min-width:0; min-height:0; margin:var(--inset) var(--inset) var(--inset) 0; border:1px solid var(--line); border-radius:16px; background:var(--surface); box-shadow:0 1px 2px #0000000a,0 8px 24px -12px #00000014; overflow:hidden; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:14px; flex:none; height:56px; padding:0 18px 0 22px; border-bottom:1px solid var(--line); background:var(--surface); }
.project-context,.topbar-actions { display:flex; align-items:center; gap:14px; min-width:0; }
.topbar-actions { flex:none; }
.breadcrumb { color:var(--ink); font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.topbar .btn { min-height:34px; padding:5px 8px; font-size:12px; }
/* The topbar's right side: the project's balance (a link to billing) and the API key. */
.topbar-credits { display:inline-flex; align-items:center; gap:5px; height:34px; padding:0 8px; color:var(--muted); font-size:13px; font-weight:500; text-decoration:none; white-space:nowrap; border-radius:8px; }
.topbar-credits>strong { color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums; }
.topbar-credits:hover { background:var(--soft); color:var(--ink); }
.topbar .topbar-key { height:34px; min-height:34px; padding:0 12px; border-radius:8px; gap:7px; font-size:13px; font-weight:500; }
.topbar .topbar-key>.nav-icon { width:15px; height:15px; }
@media (max-width:850px) { .topbar-credits>span { display:none; } .topbar .topbar-key { padding:0 8px; } .topbar .topbar-key>span { display:none; } }
/* Project switcher: the prototype's project-variant select — quiet trigger that gains the brand ring when open,
   a captioned menu with 36px rows, the selected row in brand-soft with a check, and the keyboard-hint footer. */
.project-menu { position:relative; min-width:0; }
.project-menu summary { display:flex; align-items:center; gap:6px; height:34px; max-width:min(28vw,240px); padding:0 6px 0 8px; border:1px solid transparent; border-radius:8px; color:var(--ink); font-size:13px; font-weight:500; line-height:1.4; cursor:pointer; list-style:none; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.project-menu summary::-webkit-details-marker { display:none; }
.project-menu summary:hover { background:var(--soft); }
.project-menu[open]>summary { border-color:var(--brand); background:var(--surface); box-shadow:0 0 0 2px var(--brand-soft); }
.project-menu summary>.project-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.project-menu summary>.nav-icon { width:14px; height:14px; color:var(--muted); transition:transform .15s ease; }
.project-menu[open]>summary>.nav-icon { transform:rotate(180deg); }
.menu-list { position:absolute; top:calc(100% + 6px); left:0; z-index:20; display:flex; flex-direction:column; width:240px; max-width:calc(100vw - 100px); max-height:65dvh; padding:6px; border:1px solid var(--line); border-radius:11px; background:var(--surface); color:var(--ink); font-size:12px; line-height:1.5; box-shadow:0 12px 32px #00000018,0 3px 8px #0000000d; }
.menu-caption { flex:none; padding:7px 9px 9px; color:var(--muted); font-size:10px; font-weight:500; letter-spacing:.2px; }
.menu-options { min-height:0; overflow:auto; overscroll-behavior:contain; scroll-padding:4px; }
.menu-list button,.menu-list a { display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; min-height:36px; margin:1px 0; padding:8px 9px; border:1px solid transparent; border-radius:6px; background:transparent; color:var(--ink); font:inherit; font-weight:450; text-align:left; overflow-wrap:anywhere; }
.menu-list button:hover,.menu-list a:hover { background:var(--soft); }
.menu-list button:focus-visible,.menu-list a:focus-visible { outline:2px solid var(--brand); outline-offset:-2px; background:var(--soft); }
.menu-list button[aria-current=true] { background:var(--brand-soft); color:var(--brand); }
.menu-check { display:flex; flex:none; width:16px; height:16px; }
.menu-check>.nav-icon { width:16px; height:16px; }
.menu-list .menu-create { width:100%; justify-content:flex-start; gap:8px; margin-top:5px; padding-top:9px; border-top:1px solid var(--line); border-radius:0 0 6px 6px; color:var(--muted); }
.menu-list .menu-create:hover { color:var(--ink); }
.menu-create>.nav-icon { width:14px; height:14px; }
.menu-footer { display:flex; justify-content:space-between; gap:10px; flex:none; margin-top:5px; padding:8px 9px 3px; border-top:1px solid var(--line); color:var(--muted); font-size:9px; line-height:1.5; }
.content { flex:1; min-height:0; min-width:0; overflow:auto; overscroll-behavior:contain; scrollbar-gutter:stable; padding:32px 36px; }
/* While the next page loads the current one stays put; only a slow load (past 250ms) dims it and stops taking clicks. */
/* No progress cursor (owner direction, 2026-09-24): one round trip to the VPS is 0.25–0.33 s, so almost every click crossed the 0.25 s wait and
   flashed a spinning pointer — 0.6 s of it after Run agent. The dimming alone says the page is on its way. */
.content[aria-busy=true]>.content-inner { opacity:.55; pointer-events:none; transition:opacity .2s ease .25s; }
.content-inner { max-width:1250px; margin:auto; }
.account-popover { position:fixed; inset:auto; z-index:40; margin:0; width:288px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); overflow-y:auto; overscroll-behavior:contain; padding:5px; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink); box-shadow:0 8px 30px #0002,0 2px 6px #0001; font-size:12px; }
.account-menu-header { display:flex; align-items:center; gap:10px; padding:12px 10px 14px; }
.account-menu-header>.avatar { width:38px; height:38px; border-radius:11px; font-size:14px; }
.account-menu-header>div { display:flex; flex-direction:column; gap:3px; min-width:0; overflow-wrap:anywhere; }
.account-menu-header strong { font-size:13px; font-weight:600; }
.account-menu-header small { font-size:11px; }
.account-menu-section { padding:5px 0; border-top:1px solid var(--line); }
.account-menu-section:last-child { padding-bottom:0; }
.account-menu-section>a,.account-menu-section>button { display:flex; align-items:center; gap:10px; width:100%; min-height:36px; padding:8px 10px; border:0; border-radius:7px; background:transparent; color:var(--ink); text-align:left; font-size:12px; line-height:1.5; }
.account-menu-section>a:hover,.account-menu-section>button:hover { background:var(--soft); }
.account-menu-section>a:focus-visible,.account-menu-section>button:focus-visible { outline:2px solid var(--brand); outline-offset:-2px; background:var(--soft); }
.account-menu-section .nav-icon { width:16px; height:16px; color:var(--muted); }
.account-menu-section>a>span,.account-menu-section>button>span { min-width:0; overflow-wrap:anywhere; }
.account-menu-label { padding:4px 10px 6px; color:var(--muted); font-size:10px; }
.project-avatar { display:grid; place-items:center; flex:none; width:22px; height:22px; border:1px solid var(--line); border-radius:6px; color:var(--muted); font-size:10px; }
.account-menu-section>[aria-checked=true] { color:var(--brand); }
.project-check { display:flex; margin-left:auto; }
.account-menu-section>.account-logout:hover { color:var(--danger); }
/* Collapsed: a 68px icon rail; the switcher keeps its logo, the rows their glyphs, Recent folds away. */
@media (min-width:541px) {
  .shell[data-sidebar=collapsed] { --sidebar:68px; }
  .shell[data-sidebar=collapsed] .sidebar { padding-inline:10px; align-items:center; }
  .shell[data-sidebar=collapsed] .sidebar-head .project-menu summary { width:48px; justify-content:center; padding:0; }
  .shell[data-sidebar=collapsed] .sidebar :is(.switcher-text,.nav-name,.nav-label,.account-identity,.account-caret,.nav-recent,.nav-external .nav-icon:last-child) { display:none; }
  .shell[data-sidebar=collapsed] .sidebar-head .project-menu summary>.nav-icon { display:none; }
  .shell[data-sidebar=collapsed] .sidebar-head .menu-list { left:0; right:auto; width:240px; }
  .shell[data-sidebar=collapsed] .sidebar-nav { overflow:visible; mask-image:none; -webkit-mask-image:none; }
  .shell[data-sidebar=collapsed] .nav-item { width:48px; justify-content:center; padding:0; }
  .shell[data-sidebar=collapsed] .nav-group+.nav-group { margin-top:12px; }
  .shell[data-sidebar=collapsed] .nav-group { padding-top:10px; }
  .shell[data-sidebar=collapsed] .account-trigger { width:48px; height:48px; justify-content:center; padding:0; border-radius:12px; }
  /* Tooltips stand in for the hidden labels. */
  .shell[data-sidebar=collapsed] .nav-item::after { content:attr(title); position:absolute; left:calc(100% + 10px); top:50%; z-index:5; transform:translateY(-50%); padding:5px 9px; border-radius:7px; background:var(--ink); color:var(--bg); font-size:12px; font-weight:500; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .12s ease .25s; }
  .shell[data-sidebar=collapsed] .nav-item:hover::after,.shell[data-sidebar=collapsed] .nav-item:focus-visible::after { opacity:1; }
}
@media (max-width:1150px) { .shell { --sidebar:228px; } }
@media (max-width:850px) { .topbar { padding-inline:18px; } .content { padding:28px 22px; } }
@media (max-width:540px) {
  /* The sidebar becomes a reserved bottom row: four destinations and More, which opens the groups as a sheet above it.
     The page fills the viewport; the card inset is for desktops. */
  .shell { grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; background:var(--surface); }
  .shell-main { grid-column:1; grid-row:1; margin:0; border:0; border-radius:0; box-shadow:none; }
  .sidebar { grid-column:1; grid-row:2; position:relative; z-index:25; display:block; overflow:visible; border-top:1px solid var(--line); background:var(--surface); padding:6px max(6px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px)); }
  .sidebar-head,.sidebar-bottom,.sidebar-handle { display:none; }
  .sidebar-nav { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:2px; overflow:visible; padding:0; margin:0; mask-image:none; -webkit-mask-image:none; }
  .primary-nav { display:contents; }
  .nav-recent { display:none; }
  .configuration-toggle { display:flex; }
  .sidebar-nav>.configuration-toggle,.primary-nav>.nav-item { flex-direction:column; justify-content:center; gap:3px; min-height:54px; padding:6px 2px; border-radius:9px; color:var(--muted); }
  .primary-nav>.nav-item .nav-name,.nav-mobile-label { display:block; max-width:100%; font-size:10px; line-height:1.6; }
  .primary-nav>.nav-item>.nav-icon,.configuration-toggle>.nav-icon { width:20px; height:20px; }
  .primary-nav>.nav-item.active { background:transparent; color:var(--ink); }
  .primary-nav>.nav-item.nav-new { color:var(--brand); }
  .configuration-toggle.active,.configuration-toggle[aria-expanded=true] { color:var(--ink); }
  .configuration-links { position:absolute; bottom:calc(100% + 8px); left:12px; right:12px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; max-height:min(65dvh,calc(100dvh - 160px - env(safe-area-inset-bottom,0px) - env(safe-area-inset-top,0px))); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; margin:0; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:0 -8px 30px #0002; }
  .configuration-links .nav-item { min-height:36px; padding:0 8px; font-size:13px; }
  .nav-group { min-width:0; }
  .nav-label { padding:6px 8px 4px; }
  .topbar { height:calc(60px + env(safe-area-inset-top,0px)); padding:env(safe-area-inset-top,0px) 15px 0; gap:8px; }
  .project-context,.topbar-actions { gap:7px; }
  .topbar .theme-label { display:none; }
  .account-mobile { display:flex; justify-content:center; width:34px; height:34px; min-height:34px; padding:0; border:0; background:transparent; box-shadow:none; }
  .account-mobile>.avatar { width:30px; height:30px; border-radius:9px; }
  .content { padding:24px 16px; }
  #notifications { bottom:calc(80px + env(safe-area-inset-bottom,0px)); right:12px; max-width:calc(100vw - 24px); }
}
@media (prefers-reduced-motion:reduce) { .shell,.sidebar-handle,.sidebar-handle>.nav-icon,.account-caret,.project-menu summary,.project-menu summary>.nav-icon { transition:none; } .content[aria-busy=true]>.content-inner { opacity:1; transition:none; } }

/* The one-time notice after sign-in: bottom-left, above the page, gone once acknowledged. */
.cookie-notice { position:fixed; left:20px; bottom:20px; z-index:60; display:flex; align-items:center; gap:16px; max-width:min(560px, calc(100vw - 40px)); padding:14px 16px 14px 18px; border:1px solid var(--line); border-radius:14px; background:var(--surface); color:var(--muted); font-size:13px; line-height:1.5; box-shadow:0 18px 50px #0003; }
.cookie-notice>p { margin:0; }
.cookie-notice a { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
.cookie-notice>.btn { flex:none; min-height:36px; padding:6px 16px; border-radius:999px; }
@media (max-width:600px) { .cookie-notice { flex-direction:column; align-items:stretch; left:12px; right:12px; bottom:12px; max-width:none; } }
/* The Docs item opens the documentation site: an external link, with the arrow to say so. */
.nav-item.nav-external .nav-icon:last-child { width:12px; height:12px; margin-left:auto; color:var(--muted); }