html {
  color-scheme: light dark;
  accent-color: var(--accent);
  background: var(--wall), var(--bg);  
  background-attachment: fixed;
  -webkit-text-size-adjust: 100%;  
  text-size-adjust: 100%;
}
:root[data-scheme="light"] { color-scheme: light; }
:root[data-scheme="dark"] { color-scheme: dark; }
:root[data-scheme="deep"] { color-scheme: dark; }

:root { --page-scale: 1; }  
:root[data-text="large"] { --page-scale: var(--text-scale-large); font-size: calc(100% * var(--text-scale-large)); }
:root[data-text="larger"] { --page-scale: var(--text-scale-larger); font-size: calc(100% * var(--text-scale-larger)); }

:root[data-frame="drawn"] {
  --chrome-bar: 28px; padding-top: var(--chrome-bar); scroll-padding-top: var(--chrome-bar);
}


body {
  margin: 0;
  background: none;  
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--text-base);
  line-height: var(--lh-body);
  font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased;
}
* { scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }


h1, h2, h3 {
  font-family: var(--font-heading);
  font-weight: var(--weight-display);
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-tight);
  text-wrap: balance;
  margin: 0;
}
h1 { font-family: var(--font-hero); font-size: var(--text-hero); }
h2 { font-size: var(--text-xl); }
h3 { font-size: var(--text-lg); }

.brand { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-ui);
  font-weight: var(--weight-strong); font-size: var(--text-base); letter-spacing: normal; margin: 0; }
.brand i { display: inline-block; flex: none; width: 14px; height: 14px; background: var(--accent);
  border-radius: var(--radius-xs); }

.brand a { display: inline-flex; align-items: center; gap: inherit; color: inherit; text-decoration: none; }

.counter { font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--muted);
  font-variant-numeric: tabular-nums; }

.setup-frame { display: flex; gap: calc(var(--gap) * 2); align-items: flex-start; }

.screens { flex: 1; min-width: 0; padding-top: var(--pad); }
.screens > * + * { margin-top: var(--gap); }
.rail { flex: none; width: 170px; position: sticky; top: var(--pad); padding-top: var(--pad); }
.rail ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px;
  font-size: var(--text-sm); }
.rail li { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: var(--radius-sm); }
.rail li::before { content: ""; flex: none; width: 10px; height: 10px; border: var(--rule) solid var(--line-strong);
  border-radius: var(--radius-round); }
.rail li.done { color: var(--ink); }
.rail li.done::before { background: var(--done-fill); border-color: var(--done-ring); }
.rail li.here { background: var(--here); color: var(--ink); box-shadow: var(--shadow-rest);
  font-weight: var(--weight-strong); }
.rail li.here::before { background: var(--accent); border-color: var(--accent); }
.rail li.todo { color: var(--muted); cursor: default; }

.rail li form { display: contents; }
.rail .step {
  font: inherit; color: inherit; background: none; border: none; padding: 0; cursor: pointer; text-align: left;
  text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px;
}
.rail .step:hover { text-decoration-color: currentColor; }
.rail li.todo::before { border-color: var(--line-strong); }
@media (min-width: 760px) { .page:has(.rail) .counter { display: none; } }
@media (max-width: 759px) { .rail { display: none; } }


.nav ul { list-style: none; margin: 0; padding: 0; }
.nav a, .nav-more > button, .nav-foot button, .nav-fold {
  display: flex; align-items: center; gap: 10px; padding: 7px 10px; border: 0; border-radius: var(--radius-sm);
  background: none; box-shadow: none; color: var(--ink); font-size: var(--text-sm);
  font-weight: var(--weight-medium); text-decoration: none; cursor: pointer;
}
body .nav a, body .nav a:hover { color: var(--ink); }  
.nav a:hover, .nav-more > button:hover, .nav-foot button:hover, .nav-fold:hover { background: var(--hover); color: var(--ink); }
body .nav a[aria-current="page"] { background: var(--here); color: var(--accent-text); box-shadow: var(--shadow-rest);
  font-weight: var(--weight-strong); }

.nav i, .head-menu i { flex: none; width: 20px; height: 20px; background: currentColor; mask: var(--icon) center / contain no-repeat; }
.nav a[aria-current="page"] i { background: var(--accent-text); }
.nav [data-icon="home"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 11 12 4l8 7M6 9.5V20h12V9.5'/%3E%3C/svg%3E"); }
.nav [data-icon="chat"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H10l-6 4z'/%3E%3C/svg%3E"); }
.nav [data-icon="projects"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6.5h6.5l2 2H21V19H3z'/%3E%3C/svg%3E"); }
.nav [data-icon="memory"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5h12v17H6zM9.5 8h5M9.5 12h5M9.5 16h3'/%3E%3C/svg%3E"); }
.nav [data-icon="capabilities"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8h8v8H8zM10 3v3M14 3v3M10 18v3M14 18v3M3 10h3M3 14h3M18 10h3M18 14h3'/%3E%3C/svg%3E"); }
.nav [data-icon="schedule"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 1 0 0-17M12 7.5V12l3 3'/%3E%3C/svg%3E"); }
.nav [data-icon="models"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5l8 4.25v8.5L12 20.5l-8-4.25v-8.5zM4 7.75 12 12l8-4.25M12 12v8.5'/%3E%3C/svg%3E"); }
.nav [data-icon="devices"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h8v18H8zM11 17.5h2'/%3E%3C/svg%3E"); }
.nav [data-icon="computer"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5h18v12H3zM8.5 20h7M12 16.5V20'/%3E%3C/svg%3E"); }  
.nav [data-icon="updates"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M7.5 10.5 12 15l4.5-4.5M5 20h14'/%3E%3C/svg%3E"); }
.nav [data-icon="whatsnew"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4l1.8 5.2L19 11l-5.2 1.8L12 18l-1.8-5.2L5 11l5.2-1.8z'/%3E%3C/svg%3E"); }
.nav [data-icon="help"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M9.6 9.5a2.5 2.5 0 0 1 4.8 1c0 1.7-2.4 2.1-2.4 3.5M12 17h.01'/%3E%3C/svg%3E"); }
.nav [data-icon="setup"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h9M17 7h3M4 17h3M11 17h9M15 5v4M9 15v4'/%3E%3C/svg%3E"); }
.nav [data-icon="needs"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13h4l2 3h4l2-3h4M4 13V6h16v7M4 13v6h16v-6'/%3E%3C/svg%3E"); }
.nav [data-icon="calendar"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16v14H4zM4 10h16M8 3v4M16 3v4'/%3E%3C/svg%3E"); }
.nav [data-icon="notes"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l4 4v14H6zM15 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E"); }
.nav [data-icon="contacts"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4a4 4 0 1 0 0 8 4 4 0 0 0 0-8zM4 20a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.nav [data-icon="skill"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.5 5.5L20 9l-4 4 1 6-5-3-5 3 1-6-4-4 5.5-.5z'/%3E%3C/svg%3E"); }
.nav [data-icon="research"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h7a2 2 0 0 1 2 2v13a2 2 0 0 0-2-2H4zM20 5h-7a2 2 0 0 0-2 2v13a2 2 0 0 1 2-2h7z'/%3E%3C/svg%3E"); }
.nav [data-icon="settings"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 8.5a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7zM4.5 12a7.5 7.5 0 0 1 .2-1.7l-1.6-1.2 1.5-2.6 1.9.7a7.6 7.6 0 0 1 2.9-1.7L9.7 3.5h4.6l.3 2a7.6 7.6 0 0 1 2.9 1.7l1.9-.7 1.5 2.6-1.6 1.2a7.5 7.5 0 0 1 0 3.4l1.6 1.2-1.5 2.6-1.9-.7a7.6 7.6 0 0 1-2.9 1.7l-.3 2H9.7l-.3-2a7.6 7.6 0 0 1-2.9-1.7l-1.9.7-1.5-2.6 1.6-1.2A7.5 7.5 0 0 1 4.5 12z'/%3E%3C/svg%3E"); }
.nav [data-icon="more"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12h.01M12 12h.01M18.5 12h.01'/%3E%3C/svg%3E"); }
.head-menu [data-icon="fold"], .nav [data-icon="fold"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v14H4zM9.5 5v14'/%3E%3C/svg%3E"); }
.nav [data-icon="new"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }

.nav-count { margin-left: auto; min-width: 20px; height: 20px; box-sizing: border-box; padding: 0 6px;
  border-radius: var(--radius-pill); background: var(--accent); color: var(--accent-ink); font-size: var(--text-xs);
  font-weight: var(--weight-strong); display: inline-flex; align-items: center; justify-content: center;
  font-variant-numeric: tabular-nums; }

.nav a.nav-new { margin: 4px 0 8px; border: var(--rule) solid var(--line-strong); color: var(--ink);
  background: var(--surface); box-shadow: var(--shadow-rest); font-weight: var(--weight-strong); }
.nav-new i { background: var(--accent); }
.nav-chats { margin-top: 12px; padding-top: 12px; border-top: var(--rule) solid var(--line); }
.nav-chats h3 { margin: 8px 0 2px; padding: 0 10px; font-size: var(--text-xs); color: var(--muted);
  font-weight: var(--weight-strong); letter-spacing: .06em; text-transform: uppercase; }
.nav-chats ul { display: flex; flex-direction: column; gap: 2px; }
.nav-chats a { display: block; padding: 6px 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.nav-chats small { display: block; font-size: var(--text-xs); color: var(--muted); font-weight: normal; }
.nav-chats a[aria-current="page"] small { color: var(--accent-text); }

.chats-list > h3 { margin: 12px 0 4px; font-size: var(--text-xs); color: var(--muted); font-weight: var(--weight-strong);
  letter-spacing: .06em; text-transform: uppercase; }
.chats-list ul:not(.rows) { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.chats-list a:not(.row-link) { display: block; padding: 10px 12px; border-radius: var(--radius-sm); color: var(--ink);
  text-decoration: none; overflow-wrap: anywhere; }
.chats-list a:not(.row-link):hover { background: var(--hover); }
.chats-list a:not(.row-link) small { display: block; font-size: var(--text-xs); color: var(--muted); }

.chats-list:has(> .section) { display: flex; flex-direction: column; gap: var(--gap); }
.topic-rename { display: flex; flex: 1 1 min(100%, 44ch); flex-wrap: wrap; align-items: center; gap: calc(var(--gap) / 2) var(--gap); }
.topic-rename > input { flex: 1 1 min(100%, 44ch); min-width: var(--touch); }

@media (min-width: 760px) { .back.chats-back { display: none; } }
@media (forced-colors: active) {
  .nav a[aria-current="page"] { outline: var(--rule) solid CanvasText; }
  .nav i, .head-menu i, .nav a[aria-current="page"] i { forced-color-adjust: none; background: CanvasText; }
}

.back {
  display: inline-flex; align-items: center; font-size: var(--text-sm); font-weight: var(--weight-medium);
  background: none; border: none; border-radius: var(--radius-sm); padding: 4px 8px; margin: 0 0 0 -8px;
  color: var(--ink); text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color var(--tick) var(--ease);
}
.back:hover { background: var(--hover); }

.back.back-room { visibility: hidden; }
.back:active { background: var(--press); }


p, ul, ol { margin: 0 0 var(--gap); }
code, kbd, pre { font-family: var(--font-mono); font-size: 0.86em; }
pre { max-width: 100%; overflow-x: auto; }

pre.log { white-space: pre-wrap; overflow-wrap: anywhere; }

pre.log.console {
  height: calc(10 * var(--lh-body) * 1em); overflow-y: auto; overscroll-behavior: contain;
  margin: 0; padding: calc(var(--pad) / 2) calc(var(--pad) * .75); border: var(--rule) solid var(--line); border-radius: var(--radius-sm);
  background: var(--pane); color: var(--ink);
}


p, ul, ol, .update > :last-child, footer.meta { max-width: var(--measure); }


.qr { display: block; width: min(100%, 16rem); height: auto; color: var(--ink-light); background: var(--surface-light); }


a:not(.btn, .card) {
  color: var(--accent-text);
  text-decoration: underline var(--rule);
  text-decoration-color: var(--accent);
  text-underline-offset: 3px;
}
a:not(.btn, .card):hover {
  color: var(--accent-text);
  text-decoration-color: var(--accent);
  text-decoration-thickness: calc(var(--rule) * 2);
}


.box, .btn, .card, .bar, .skeleton {
  background: var(--surface);
  color: var(--ink);
  border: var(--rule) solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-rest);
}


.btn, a.card {
  transition: background-color var(--tick) var(--ease), border-color var(--tick) var(--ease),
    box-shadow var(--tick) var(--ease), transform var(--tick) var(--ease);
}

a.card { transition: background-color var(--base) var(--ease), border-color var(--base) var(--ease),
    box-shadow var(--base) var(--ease), transform var(--tick) var(--ease); }
a.card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-hover); }


.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 16px;
  border-color: var(--line-strong);
  border-radius: var(--radius-btn);
  font: inherit;
  font-weight: var(--weight-strong);
  text-decoration: none;
  cursor: pointer;
}
.btn:hover { background: color-mix(in srgb, var(--surface), var(--ink) 4%); }
.btn:active { transform: translateY(1px); box-shadow: var(--shadow-press); }


.btn.primary { background: var(--accent); color: var(--accent-ink); border-color: var(--accent);
  box-shadow: var(--shadow-btn); padding: 7px 18px; }
.btn.primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.btn.primary:active { background: var(--accent-press); border-color: var(--accent-press); box-shadow: var(--shadow-press); }


.actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.stack > .btn, .stack > .actions { align-self: flex-start; }

.stack > .badge { align-self: flex-start; }

#turns .bubble { align-self: flex-end; max-width: min(var(--measure), 85%);
  border-radius: var(--radius); padding: calc(var(--pad) / 2) var(--pad); }
#turns .bubble > :last-child { margin-bottom: 0; }

.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.skip:not(:focus) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip:focus { position: fixed; z-index: 20; top: calc(8px + env(safe-area-inset-top) + var(--chrome-bar, 0px));
  left: calc(8px + env(safe-area-inset-left)); display: inline-flex; align-items: center; min-height: var(--touch);
  padding: 0 14px; border-radius: var(--radius-btn); background: var(--accent); color: var(--accent-ink);
  font-weight: var(--weight-medium); text-decoration: none; box-shadow: var(--shadow-btn); }
form.composer { display: flex; flex-direction: column; gap: 6px; }
.composer .box {
  display: flex; flex-direction: column; background: var(--surface); border: var(--rule) solid var(--field);
  border-radius: var(--radius); box-shadow: var(--shadow-rest); margin: 0 var(--lift) var(--lift) 0;
}

.composer .box:focus-within {
  border-color: var(--accent); outline: calc(var(--ring) - var(--rule)) solid var(--accent); outline-offset: 0;
}

.composer[data-dropping] .box {
  border-color: var(--accent); outline: calc(var(--ring) - var(--rule)) solid var(--accent); outline-offset: 0;
}
.composer textarea { border: 0; background: none; resize: vertical; width: 100%; box-sizing: border-box; }
.composer textarea:focus-visible { outline: none; }
.composer .foot { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; padding: 4px 8px 8px; }
.composer .pick {
  border: 0; background: none; color: var(--muted); font-size: var(--text-sm); padding: 4px 8px;
  border-radius: var(--radius-btn); max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.composer select.pick {
  color: var(--ink); font-weight: var(--weight-medium); appearance: none; -webkit-appearance: none; padding-right: 0;
}
.composer select.pick:hover { background: var(--hover); }

.incognito-bar { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
#new-chat > .incognito-bar { position: absolute; top: 0; right: 0; z-index: 2; max-width: 100%; }
#chat > #turn > .incognito-bar { align-self: flex-end; }
.incognito-line { display: inline-flex; align-items: center; gap: 8px; font-size: var(--text-sm); color: var(--muted); }
.incognito-line:has(> .toggle[aria-checked="true"]) .incognito-name { color: var(--ink); font-weight: var(--weight-medium); }
.incognito-bar .why-note {
  max-width: 20rem; padding: 8px 12px; text-align: left; color: var(--ink); background: var(--surface);
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); box-shadow: var(--shadow-pop);
}
.incognito-bar .toggle[aria-busy="true"] { cursor: progress; }
.composer .send {
  margin-left: auto; display: inline-grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0;
  border-radius: var(--radius-btn); background: var(--accent); color: var(--accent-ink); box-shadow: var(--shadow-btn);
}
.composer .send:hover { background: var(--accent-hover); }
.composer .send:disabled { background: var(--pane); color: var(--muted); box-shadow: none; cursor: default; }
.composer .send svg, .composer .where svg, .composer .chip svg {
  width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round;
  stroke-linejoin: round; flex: none;
}
.composer .send .up { display: none; }

.composer .send { transition: background-color var(--quick) var(--ease-out), color var(--quick) var(--ease-out); }
.composer .stop {
  transition: background-color var(--quick) var(--ease-out), color var(--quick) var(--ease-out), border-color var(--quick) var(--ease-out);
}
#stop { transition: opacity var(--quick) var(--ease-out); }
@starting-style { #stop:not([hidden]) { opacity: 0; } }

@media (max-width: 759px) { .composer .foot > .send { order: 2; } }
@media (max-width: 759px) { .composer .foot:has(> #stop[hidden])::after { content: ""; order: 1; flex: none; width: var(--touch); height: var(--touch); } }

@media (max-width: 759px) { #leash-slot { display: none; } }
.composer .where { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: var(--text-sm); min-width: 0; }
.composer .where b {
  font-weight: var(--weight-medium); color: var(--ink); min-width: 0; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap;
}
.composer .where .btn { margin-left: auto; flex: none; }
.composer .chips { display: flex; flex-wrap: wrap; gap: 8px; }
.composer .chip {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 6px 12px; background: var(--surface);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius-pill); font-size: var(--text-sm);
}
.composer .chip b { font-weight: var(--weight-medium); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.composer .chip:hover { background: var(--hover); }
.composer .keys { align-self: center; text-align: center; }

main:has(> #new-chat) { display: flex; flex-direction: column; }
#new-chat { flex: 1 0 auto; position: relative; } 
#new-chat::before { content: ""; flex: 1 0 0; order: -1; }
#new-chat > .back { order: -2; }
#new-chat > h2 { text-align: center; }
#new-chat > form.composer { flex: 1 0 auto; justify-content: flex-end; } 
#new-chat #folder-ask { margin-bottom: auto; text-align: center; }
#new-chat #folder-ask p { margin-inline: auto; } 
#new-chat .chips { justify-content: center; }

#suggest .chip[data-off] { display: none; }
@media (max-width: 759px) { #suggest .chip[data-rank="5"] { display: none; } }

main:has(> #chat) { display: flex; flex-direction: column; }
#chat { flex: 1 0 auto; }
#chat > #turn { flex: 1 0 auto; }
#chat > #turn > form.composer { margin-top: auto; }

#ctx { display: contents; } 
.composer .ctx {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 6px; border: 0; background: none;
  border-radius: var(--radius-btn); color: var(--muted); font-size: var(--text-xs);
}
.composer .ctx[hidden] { display: none; }
.composer .ctx:hover { background: var(--hover); }
#ctx[hidden] { display: none; }  
.composer .ctx svg { width: 20px; height: 20px; transform: rotate(-90deg); fill: none; stroke-width: 3; }
.composer .ctx .track { stroke: var(--line-strong); }
.composer .ctx .arc { stroke: var(--accent); }
.composer .ctx[data-level="high"] .arc { stroke: var(--ink); }
.composer .ctx[data-level="full"] .arc { stroke: var(--warn, var(--ink)); }
#ctx-card { border: 0; padding: 0; background: none; color: var(--ink); width: min(300px, calc(100% - 2 * var(--side))); }
#ctx-card meter { width: 100%; }
#ctx-card meter::-webkit-meter-optimum-value, #ctx-card meter::-webkit-meter-suboptimum-value { background: var(--accent); }
#ctx-card meter::-moz-meter-bar { background: var(--accent); }
#ctx-card dl { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; margin: 0; font-size: var(--text-sm); }
#ctx-card dt { color: var(--muted); }
#ctx-card dd { margin: 0; }

#title > button { font: inherit; color: inherit; background: none; border: 0; padding: 0 4px; border-radius: var(--radius-xs); text-align: start; }
#title > button:hover { background: var(--hover); }
#title > button:disabled:hover { background: none; cursor: default; }  


.page:has(#chat[data-panel="open"]) { --page-max: calc(2 * (var(--measure) + 2 * var(--pad) + 2 * var(--rule)) + var(--gap)); }

@media (prefers-reduced-motion: no-preference) {
  :root:not([data-rm="on"]) :is(#turns, #brief) details { interpolate-size: allow-keywords; }
  :root:not([data-rm="on"]) :is(#turns, #brief) details::details-content { block-size: 0; overflow-y: clip;
    transition: block-size var(--spring-settle-duration) var(--spring-settle), content-visibility var(--spring-settle-duration) var(--ease-linear) allow-discrete; }
  :root:not([data-rm="on"]) :is(#turns, #brief) details[open]::details-content { block-size: auto; }
}
#panel-edge { display: none; } 

@media (scripting: enabled) { #chat:not([data-panel="open"]) > #panel { display: none; } }
@media (min-width: 760px) {
  #chat[data-panel="open"] { display: grid; grid-template-columns: minmax(0, 1fr) var(--panel-w, minmax(0, 1fr)); }
  #chat[data-panel="open"] > #panel { align-self: start; }
  
  #chat[data-spring] { overflow-x: clip; }
  #panel-edge { display: block; position: absolute; inset-block: 0; inset-inline-start: calc(-1 * var(--gap)); width: calc(2 * var(--gap)); z-index: 1;
    touch-action: none; cursor: ew-resize; }
  
  #panel-edge::after { content: ""; position: absolute; inset-inline-start: 50%; inset-block: 0; width: var(--rule); translate: -50% 0;
    background: var(--line); transition: scale var(--tick) var(--ease), background-color var(--tick) var(--ease); }
  #panel-edge:focus-visible::after, #chat[data-spring="on"] #panel-edge::after { scale: 3 1; background: var(--accent); }
  @media (hover: hover) { #panel-edge:hover::after { scale: 3 1; background: var(--accent); } }  
  #chat[data-wide="on"] #panel-edge { display: none; }
  #chat[data-panel="open"][data-wide="on"] { grid-template-columns: minmax(0, 1fr); }
  #chat[data-panel="open"][data-wide="on"] > #turn { display: none; }
}
@media (max-width: 759px) {
  #chat[data-panel="open"] > #turn { display: none; }
  #chat[data-panel="open"] > #panel > #work { min-height: calc(100dvh - var(--chrome-bar, 0px)); }
  #panel-buttons > #panel-expand { display: none; }
}

@media (max-width: 759px) {
  .composer .send { border-radius: var(--radius-round); }
  .composer .send .enter { display: none; }
  .composer .send .up { display: block; }
  .composer .keys { display: none; }
}

@media (pointer: coarse) {
  .composer .keys { display: none; }
}

#panel iframe.preview { display: block; width: 100%; height: 70dvh; box-sizing: border-box; background: var(--surface-light);
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); }
#panel-head [role="tab"][aria-selected="true"], #panel-more [aria-current="true"] {
  background: var(--here); color: var(--ink); border-color: var(--accent);
}

#panel-bar { flex-wrap: nowrap; align-items: flex-start; }
#panel-tabs { flex: 1 1 auto; min-width: 0; }
#panel-buttons { margin-left: auto; flex: none; white-space: nowrap; }
#panel-buttons > button {
  width: 28px; height: 28px; padding: 0; border: 0; background: none; color: var(--surface);
  display: inline-grid; place-items: center; vertical-align: top;
}
#panel-buttons > button:focus-visible { outline-offset: calc(-1 * var(--focus-offset)); border-radius: var(--radius-round); }
#panel-buttons span {
  box-sizing: border-box; width: 12px; height: 12px; border-radius: var(--radius-round); background: var(--muted);
  border: var(--rule) solid var(--muted); display: grid; place-items: center;
}
#panel-buttons svg { width: 8px; height: 8px; fill: none; stroke: currentColor; stroke-width: 1.5; visibility: hidden; }
#panel-buttons:hover svg, #panel-buttons > button:focus-visible svg, #panel-expand[aria-pressed="true"] svg { visibility: visible; }
@media (hover: none), (forced-colors: active) {
  #panel-buttons svg { visibility: visible; }
}

#panel, .panel-menu { --row: 32px; }
@media (pointer: coarse) { #panel, .panel-menu { --row: 44px; } }
#panel-tabs > .stack { min-width: 0; }  
#panel-head [role="tablist"] { max-width: 100%; flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
#panel-head [role="tab"] { flex: 0 1 auto; min-width: 5.5rem; max-width: 14rem; min-height: var(--row); display: inline-flex;
  align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; }
#panel-head [data-tab][hidden] { display: none; }  
#panel-head [role="tab"] > code { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.tab-x { position: relative; flex: none; display: inline-grid; place-items: center; inline-size: 18px; block-size: 18px;
  margin-inline-start: auto; border-radius: var(--radius-round); }
.tab-x:hover { background: var(--hover); }
#panel-head [role="tab"][data-dirty] .tab-x svg { visibility: hidden; }
#panel-head [role="tab"][data-dirty] .tab-x::before { content: ""; position: absolute; inline-size: 8px; block-size: 8px;
  border-radius: var(--radius-round); background: var(--accent); }
#panel-head [role="tab"][data-dirty]:focus-visible .tab-x::before { display: none; }
#panel-head [role="tab"][data-dirty]:focus-visible .tab-x svg { visibility: visible; }
@media (hover: hover) {  
  #panel-head [role="tab"][data-dirty]:hover .tab-x::before { display: none; }
  #panel-head [role="tab"][data-dirty]:hover .tab-x svg { visibility: visible; }
}
.panel-adds { display: inline-flex; flex: none; gap: 2px; margin-inline-start: 4px; }
.panel-icon { display: inline-grid; place-items: center; inline-size: var(--row, 32px); block-size: var(--row, 32px); padding: 0; border: 0;
  border-radius: var(--radius-sm); background: none; color: var(--ink); }
.panel-icon:hover, .panel-icon[aria-expanded="true"] { background: var(--hover); }
:is(.tab-x, .panel-icon, .panel-menu, .panel-empty) svg.icon { inline-size: 16px; block-size: 16px; fill: none; stroke: currentColor; stroke-width: 1.75;
  stroke-linecap: round; stroke-linejoin: round; }
.panel-menu { position: fixed; z-index: 30; min-inline-size: 15rem; display: flex; flex-direction: column; padding: 6px;
  background-color: var(--surface); border: var(--rule) solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-pop); }
.panel-menu[hidden] { display: none; }
.panel-menu [role="menuitem"] { display: flex; align-items: center; gap: 10px; min-block-size: var(--row); padding: 0 10px; border: 0;
  border-radius: var(--radius-sm); background: none; color: var(--ink); font: inherit; text-align: start; white-space: nowrap; }
.panel-menu [role="menuitem"]:is(:hover, :focus-visible), .panel-menu [aria-current="true"] { background: var(--hover); }
.panel-menu [role="menuitem"] > span { flex: 1 1 auto; }
.panel-menu kbd { font-size: var(--text-sm); color: var(--muted); border: var(--rule) solid var(--line); border-radius: var(--radius-sm); padding: 1px 6px; }
.panel-menu [role="separator"] { block-size: var(--rule); margin: 4px 2px; background: var(--line); }
#panel-unsaved { max-inline-size: min(28rem, calc(100vw - 32px)); padding: var(--pad); color: var(--ink); background-color: var(--surface);
  border: var(--rule) solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-pop); }
#panel-unsaved::backdrop { background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
#panel-unsaved h3 { margin: 0 0 6px; }
@media (prefers-reduced-motion: no-preference) {  
  .panel-menu, #panel-unsaved[open] { transition: translate var(--spring-settle-duration) var(--spring-settle), scale var(--spring-settle-duration) var(--spring-settle); }
  @starting-style { .panel-menu:not([hidden]), #panel-unsaved[open] { translate: 0 -4px; scale: .98; } }
}
#panel .crumbs ol { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; font-size: var(--text-sm); color: var(--muted); }
#panel .crumbs li + li::before { content: "/"; margin-inline-end: 4px; }
#panel .crumbs [aria-current] { color: var(--ink); font-weight: var(--weight-medium); }
#panel .crumbs + h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }  
#panel :is(.panel-preview, .viewer, .panel-status)[hidden] { display: none; }  
#panel .panel-status { justify-content: space-between; align-items: center; min-block-size: var(--row); }
#panel .panel-status .seg [aria-pressed="true"] { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-rest); }
#panel .viewer textarea, #panel .panel-preview, #panel-head [role="tab"] { background-color: var(--surface); }
#panel-open { margin-inline-start: auto; }
.panel-icon[hidden] { display: none; }  


.btn:disabled, button:disabled,
.btn:disabled:hover, button:disabled:hover {
  background: var(--pane);
  color: var(--muted);
  border-color: var(--line);
  box-shadow: var(--shadow-press);
  transform: none;
  cursor: not-allowed;
}


.page[data-stale] main, [data-pending] { cursor: progress; }
.btn[data-pending], button[data-pending] { color: var(--muted); }

[data-settling] { color: var(--muted); outline: var(--rule) dashed var(--line-strong); outline-offset: 2px; }

[data-live-follows] { display: contents; }
[data-live-lost] > * { color: var(--muted); }


.composer .attach:disabled, .composer .attach:disabled:hover { cursor: not-allowed; background: var(--pane); color: var(--muted); }


.card {
  display: block;
  padding: var(--pad);
  text-decoration: none;
}


.refusal { border-left: calc(var(--rule) * 3) solid var(--ink); }


.badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
  background: var(--tint);
  color: var(--tint-ink);
  border: 0;
  border-radius: var(--radius-pill);
  box-shadow: none;
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  line-height: 1;
  white-space: nowrap;
}
.badge::before { content: ""; width: 6px; height: 6px; border-radius: var(--radius-round); background: var(--accent); }
.badge[data-state="live"] { background: var(--tint); color: var(--tint-ink); }
.badge[data-state="building"] { background: var(--pane); color: var(--muted); }
.badge[data-state="building"]::before { background: var(--line-strong); }


.flip { animation: flip var(--tick) steps(3, jump-none); }
@keyframes flip { from { transform: scaleY(-1); } }


.update {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: var(--gap);
  padding: calc(var(--pad) / 2) 0;
  border-top: var(--rule) solid var(--line);
}
.update:last-child { border-bottom: var(--rule) solid var(--line); }
.update > :first-child {
  color: var(--muted);
  font-size: var(--text-sm);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.update.bare { grid-template-columns: 1fr; } 
.update.bare > :first-child { color: inherit; font-size: inherit; white-space: normal; }


.bar {
  padding: 0;
  line-height: 0;
  overflow: hidden;
  background: var(--pane);
  border-radius: var(--radius-pill);
  box-shadow: none;
}
.bar > i {
  display: block;
  height: 6px;
  width: 100%;
  background: var(--accent);
  transform: scaleX(var(--at, 0));
  transform-origin: left;
  transition: transform var(--quick) var(--ease);
  animation: fill var(--quick) var(--ease);
}
@keyframes fill { from { transform: scaleX(0); } }


.status { display: flex; flex-direction: column; gap: 8px; }
.status > * { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.status > .row { flex-wrap: nowrap; }

@media (max-width: 759px) { .status > .row { display: block; white-space: normal; min-block-size: 2lh; } }
@media (max-width: 759px) { .status > .row > .ring { vertical-align: middle; margin-inline-end: var(--gap); } }
@media (max-width: 759px) { .status > .row > .meta { white-space: nowrap; } }
.bar-slot { block-size: 6px; }
.status .line { margin: 0; min-block-size: 1lh; }

.status > #setup-notes { white-space: normal; overflow: visible; display: flex; flex-direction: column; gap: 4px; }
.status > #setup-notes > p { margin: 0; }
.ring {
  display: inline-block;
  flex: none;
  width: 1em;
  height: 1em;
  border: 2px solid var(--line-strong);
  border-top-color: var(--muted);
  border-radius: var(--radius-round);
  animation: ring var(--blink) linear infinite;
}
@keyframes ring { to { transform: rotate(1turn); } }


.caret {
  display: inline-block;
  width: calc(var(--text-base) / 2);
  height: var(--text-base);
  vertical-align: text-bottom;
  background: var(--ink);
}

[data-status] > .caret-spent { display: inline-block; width: calc(var(--text-base) / 2); }


.skeleton {
  min-height: calc(var(--touch) * 2);
  animation: skeleton-pulse var(--blink) steps(1) infinite;
}
@keyframes skeleton-pulse { 50% { border-color: var(--line-strong); } }
@media (scripting: none) { .skeleton, .skel-lead, .skel-map + .sr, .recs + .sr { display: none; } }  

.skel-lead .skel-line { display: inline-block; vertical-align: middle; margin-block: 0; }
.skel-lead .lead > p { flex: 1 1 100%; }
.skel-lead .row, .skel-lead .fold { min-block-size: var(--touch); }
.skel-lead .btn { inline-size: 6em; }
.skel-lead .skel-chip { display: inline-block; inline-size: 7em; padding: 5px 12px; border: var(--rule) solid var(--line);
  border-radius: var(--radius-pill); font-size: var(--text-sm); }

.recs > .skel-rec { display: block; box-sizing: border-box; min-block-size: 243px; }
.bw > .skel-map { grid-area: canvas; box-sizing: border-box; block-size: 36rem; margin: 0; padding: 14px; border-radius: 0; }
.bw > .skel-map::before { content: ""; display: block; block-size: 100%; border-radius: var(--radius-xs); background: var(--line); }
@media (max-width: 759px) {
  .recs > .skel-rec { min-block-size: 224px; }
  .bw > .skel-map { block-size: 23rem; }
}


.settle {
  animation: settle var(--quick) var(--ease) backwards;
  animation-delay: calc(var(--i, 0) * var(--stagger));
}
@keyframes settle { from { transform: translateY(4px); } }


#live .stack > details.did, #live .stack > .update, #turns > .queued {
  --rise: 4px;
  transition: opacity var(--base) var(--ease-out), translate var(--base) var(--ease-out);
}
@starting-style {
  #live .stack > details.did, #live .stack > .update, #turns > .queued { opacity: 0; translate: 0 var(--rise); }
}
@media (prefers-reduced-motion: reduce) { #live .stack > details.did, #live .stack > .update, #turns > .queued {
  --rise: 0; transition-duration: var(--quick); } }


.badge, .badge::before, .step-mark, .callout, .words, .part, .tv-node, .update[data-state] {
  transition: background-color var(--quick) var(--ease), color var(--quick) var(--ease),
    border-color var(--quick) var(--ease);
}


.mono { font-family: var(--font-mono); font-size: 0.86em; overflow-wrap: anywhere; }
.meta { color: var(--muted); font-size: var(--text-sm); }
.num { font-variant-numeric: tabular-nums; }


button, input, select, textarea { font: inherit; color: var(--ink); }
input, select, textarea {
  background: var(--surface);
  border: var(--rule) solid var(--field);
  border-radius: var(--radius-sm);
  box-shadow: none;
  padding: 7px 10px;
}

::placeholder { color: var(--muted); opacity: 1; }


button, .btn, [role="button"], input, select, textarea, a.card, summary {
  min-height: var(--touch);
  min-width: var(--touch);
}


:focus-visible {
  outline: var(--ring) solid var(--accent);
  outline-offset: var(--focus-offset);
}


h2[data-focus-by="pointer"]:focus-visible { outline: none; }


::selection { background: var(--tint); color: var(--ink); }


fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { padding: 0; font-weight: var(--weight-strong); }


input[type="radio"], input[type="checkbox"] { border: 0; box-shadow: none; margin: 0; padding: 0; }
.choice {
  display: flex;
  align-items: center;
  gap: calc(var(--gap) / 2);
  cursor: pointer;
}


ol.ledger {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: max-content 1fr;
}
ol.ledger > .update { grid-column: 1 / -1; grid-template-columns: subgrid; }

ol.ledger > li:not(.update) { grid-column: 1 / -1; min-width: 0; }


summary { cursor: pointer; font-size: var(--text-sm); font-weight: var(--weight-medium); }
summary:hover { color: var(--accent-text); }
details[open] > summary { margin-bottom: var(--gap); }
details > :last-child { margin-bottom: 0; }


main { overflow-wrap: anywhere; }


.page {
  
  --page-max: var(--column);
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-block-size: calc(100dvh - var(--chrome-bar, 0px));
  box-sizing: border-box;
}

.page > main { flex: 1 0 auto; }

body > .page { container: page / inline-size; }
.page > main, .page > #foot { box-sizing: border-box; inline-size: min(100% - 2 * var(--side), var(--page-max) - 2 * var(--side)); margin-inline: auto; }
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--card-min), 1fr));
  gap: var(--gap);
}
.stack {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}
.row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--gap);
}

#settings > form[role="search"] { flex-wrap: nowrap; }
#settings > form[role="search"] > input { flex: 1; min-width: var(--touch); }

main > * + * { margin-top: var(--gap); }


.bar-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap);
  padding: 14px 0;
  border-bottom: var(--rule) solid var(--line);
}


.term {
  font-style: normal; text-decoration: underline dotted var(--muted); text-decoration-thickness: 1.5px;
  text-underline-offset: 3px; cursor: help; position: relative;
}

@media (hover: hover) { .term:hover::after { content: attr(data-def); position: absolute; left: 0; top: 1.7em; z-index: 5;
  width: min(30ch, 80vw); background: var(--surface); color: var(--ink);
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); box-shadow: var(--shadow-pop);
  padding: 8px 10px;
  font: 400 var(--text-sm) / var(--lh-body) var(--font-ui); letter-spacing: normal;
  text-transform: none; white-space: normal; text-decoration: none; } }
.term:focus::after {
  content: attr(data-def); position: absolute; left: 0; top: 1.7em; z-index: 5;
  width: min(30ch, 80vw); background: var(--surface); color: var(--ink);
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); box-shadow: var(--shadow-pop);
  padding: 8px 10px;
  font: 400 var(--text-sm) / var(--lh-body) var(--font-ui); letter-spacing: normal;
  text-transform: none; white-space: normal; text-decoration: none;
}


.offer {
  display: flex; gap: var(--gap); align-items: flex-start; cursor: pointer;
}
.offer .stack { gap: calc(var(--gap) / 2); }
div.offer { cursor: default; }  
.offer .title {
  font-weight: var(--weight-strong); display: flex; gap: calc(var(--gap) / 2); flex-wrap: wrap;
  align-items: center;
}


.kv {
  display: grid; grid-template-columns: max-content 1fr; gap: calc(var(--gap) / 2) var(--gap);
}
.kv dt { font-size: var(--text-sm); color: var(--muted); }
.kv dd { margin: 0; }


.verdict { font-weight: var(--weight-medium); }
.facts {
  margin: 0; background: var(--surface); border: var(--rule) solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-rest);
}
.fact { display: grid; grid-template-columns: 148px 1fr; gap: var(--gap); padding: 13px 18px; align-items: baseline; }
.fact + .fact { border-top: var(--rule) solid var(--line); }
.fact dt { font-size: var(--text-sm); color: var(--muted); }
.fact dd { margin: 0; }
.fact dd > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.fact dd > div + div { margin-top: 8px; }
.fact dd > .badge { margin-left: 10px; }

.fact dd > details.stack { gap: 0; }
@media (max-width: 759px) { .fact { grid-template-columns: 1fr; gap: 4px; padding: 12px 14px; } }

.fact dd form { display: inline; }
.change {
  font: inherit; font-size: var(--text-sm); color: var(--ink); background: none; border: none; padding: 0;
  cursor: pointer; text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px;
}
.change:hover { text-decoration-color: currentColor; }

.screen-foot {
  position: sticky; bottom: 0; display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 14px 0; border-top: var(--rule) solid var(--line); background: var(--bg);
}

.screen-foot > :last-child { margin-inline-start: auto; }

.screen-foot .actions { flex-wrap: nowrap; }
.screen-foot .btn { overflow-wrap: normal; text-align: center; }
@media (max-width: 759px) { .screen-foot, .screen-foot .actions { gap: 8px; } .screen-foot .btn { padding-inline: 10px; } }


input[type="color"] {
  width: 4rem;
  padding: 3px;
  cursor: pointer;
}

.schemes { display: flex; flex-wrap: wrap; gap: var(--gap); }
.wallchip {
  display: flex;
  align-items: flex-end;
  width: calc(var(--touch) * 5);
  height: calc(var(--touch) * 3);
  padding: 8px 10px;
  border: var(--rule) solid var(--line-strong);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-rest);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  flex: none;
  background: var(--wall), var(--bg);
  color: var(--ink);
}

.wallchip > i { display: block; padding: 2px 8px; border-radius: var(--radius-xs); font-style: normal; }
.row > .wallchip { width: calc(var(--touch) * 3); height: calc(var(--touch) * 1.5); padding: 4px 6px; }  
.wallchip[data-size] > i { font-size: calc(var(--text-base) / var(--page-scale)); }  
.wallchip[data-size="large"] > i { font-size: calc(var(--text-base) * var(--text-scale-large) / var(--page-scale)); }
.wallchip[data-size="larger"] > i { font-size: calc(var(--text-base) * var(--text-scale-larger) / var(--page-scale)); }
.wallbox { display: block; padding: var(--gap); border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); background: var(--wall), var(--bg); }

.lg-slide { display: flex; align-items: center; gap: var(--gap); }
.lg-slide > span { flex: none; }
.lg-slide input[type="range"] { flex: 1 1 auto; width: auto; height: var(--touch); margin: 0; padding: 0; border: 0; background: none; accent-color: var(--accent); }
.lg-tprev .card { max-width: 100%; }
.lg-tprev .row { flex-wrap: wrap; }

.lg-tprev .field { flex: 1 1 8em; display: block; box-sizing: border-box; min-height: var(--touch); padding: 7px 10px; border: var(--rule) solid var(--field); border-radius: var(--radius-sm);
  background: var(--surface); color: var(--muted); }

.glass-seg { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; box-sizing: border-box; width: fit-content; max-width: 100%; border-radius: var(--radius); }
.glass-pill { position: relative; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; max-width: 100%; min-height: 44px; padding: 0 16px; border-radius: var(--radius-sm); color: var(--ink); font-weight: var(--weight-medium); text-align: center; cursor: pointer; }
.glass-pill input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; appearance: none; background: none; border: 0; outline: 0; cursor: pointer; }
.glass-pill:hover { background: var(--hover); }
.glass-pill:has(input:checked) { background: var(--accent); color: var(--accent-ink); }
.glass-pill:has(input:focus-visible) { outline: var(--ring) solid var(--accent); outline-offset: var(--focus-offset); }

.sample.card {
  --pad: var(--comfortable-pad); --gap: var(--comfortable-gap);
  display: flex; flex-direction: column; align-items: flex-start; 
}
.sample.card.compact { --pad: var(--compact-pad); --gap: var(--compact-gap); }
.sample.card > * + * { margin-top: calc(var(--gap) / 2); }


dialog.tour {
  position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
  margin: 0; padding: 0; border: 0; background: none; overflow: hidden;
}
dialog.tour::backdrop { background: none; }

.dlcard li > p { grid-column: 1 / -1; }

dialog.pop.palette { position: fixed; inset: 12dvh 0 auto; max-width: calc(100% - 2 * var(--side)); max-height: 76dvh;
  margin: 0 auto; padding: 0; overflow: auto; }
dialog.pop.palette::backdrop { background: none; }
.tour-ring {
  position: absolute; top: var(--tour-top); left: var(--tour-left); width: var(--tour-width); height: var(--tour-height);
  box-sizing: border-box; border: 2px solid var(--accent); border-radius: var(--radius);
  outline: 200vmax solid color-mix(in srgb, var(--ink-light) 45%, transparent); pointer-events: none;
}
.tour-card {
  position: absolute; left: var(--tour-x); top: var(--tour-y); width: min(300px, calc(100% - 2 * var(--side)));
  box-sizing: border-box; padding: var(--pad); display: flex; flex-direction: column; gap: 8px;
  background: var(--surface); color: var(--ink); border-radius: var(--radius); box-shadow: var(--shadow-pop);
}
.tour-card p { margin: 0; }


body > .nav { view-transition-name: metis-nav; }
#metis-chrome { view-transition-name: metis-bar; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: var(--page); animation-timing-function: var(--ease); }
::view-transition-group(metis-nav), ::view-transition-group(metis-bar), ::view-transition-new(metis-nav), ::view-transition-new(metis-bar) { animation: none; }
::view-transition-old(metis-nav), ::view-transition-old(metis-bar) { display: none; }

@media (prefers-reduced-motion: reduce) { ::view-transition-old(root), ::view-transition-new(root) { animation-duration: var(--quick); } }


#turns .bubble .rewind { position: absolute; left: calc(-1 * (var(--gap) + 24px)); top: 50%; translate: 0 -50%;
  width: 24px; height: 24px; display: grid; place-items: center; padding: 0; border: 0; border-radius: var(--radius-round);
  background: none; box-shadow: none; color: transparent; }
#turns .rewind svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round; }
#turns .bubble:hover .rewind, #turns .bubble:focus-within .rewind { color: var(--muted); }
@media (hover: none) { #turns .bubble .rewind { color: var(--muted); } }



ul.rows > li.trow.sw > form:has(> .opt-count) { display: flex; align-items: center; gap: 8px; }
ul.rows > li.trow.sw > form > .opt-count { flex: 0 0 auto; min-inline-size: 12rem; }
@media (max-width: 759px) {
  ul.rows > li.trow.sw > form:has(> select, > .opt-count) { grid-column: 1; grid-row: 2; justify-self: start; }
  ul.rows > li.trow.sw > form:has(> .toggle) { grid-column: 2; grid-row: 1; }
}


@media (min-width: 760px) { .split.three.alone { grid-template-columns: 160px minmax(0, 1fr); } }
.mail-list .pager { display: flex; gap: 12px; align-items: baseline; padding: 10px 14px; }
.mail-list .pager .num { margin-right: auto; }
ul.mail-list .pager a { display: inline; padding: 0; }
ul.mail-list .pager a:hover { background: none; }


.report-window [hidden] { display: none; }
#report-pick[hidden] { display: none; }  
#report-filepick[hidden] { display: none; }  

@media (max-width: 759px) { #report-form .screen-foot { position: static; } }
.report-window #report-form .screen-foot { position: sticky; }
#report-pick ul.rows { padding: 0; list-style: none; }
#report-pick button[data-chat] { display: block; width: 100%; padding: 10px var(--pad); border: 0; background: none;
  color: var(--ink); font: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
#report-pick button[data-chat]:hover { background: var(--hover); }

#turns { --copy-w: 32px; --copy-h: 32px; }
@media (max-width: 759px) { #turns { --copy-w: 30px; --copy-h: var(--touch); } }
#turns .forward { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: var(--copy-h);
  min-width: var(--copy-w); margin: calc(var(--gap) * -0.75) 0 0 -8px; padding: 0 8px; border: 0; border-radius: var(--radius-sm);
  background: none; box-shadow: none; color: var(--muted); font: 400 var(--text-xs)/1 var(--font-ui); cursor: pointer; }
#turns .copy[data-for="reply"] + .forward { margin: calc(-1 * (var(--copy-h) + var(--gap))) 0 0 calc(var(--copy-w) - 8px); }
#turns .forward:hover, #turns .forward:focus-visible { background: var(--hover); color: var(--ink); }
#turns .forward svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round;
  stroke-linejoin: round; flex: none; }

#forward-pick { padding: 0; list-style: none; max-height: 50dvh; overflow-y: auto; }
.confirm-window [data-forward-note] { color: var(--muted); font-size: var(--text-sm); } 


.card > .cat-h, .cat .fam { grid-template-columns: minmax(0, 2.1fr) 150px minmax(0, 1.5fr) 88px 96px; }

.card.no-speed > .cat-h, .no-speed .cat .fam { grid-template-columns: minmax(0, 2.1fr) 150px minmax(0, 1.5fr) 96px; }
.cat .get { padding: 0 var(--pad) 10px calc(var(--pad) + 24px); }
.cat .fam .ft small, .cat .fam .nm { overflow-wrap: anywhere; }
@media (max-width: 759px) {
  .cat .fam { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cat .fam .q { grid-column: 1 / 3; }
  .cat .fam .ft { grid-column: 3 / 4; }
  .cat .get { padding: 0 12px 10px; }
}


.filters-at > summary { list-style: none; }
.filters-at > summary::-webkit-details-marker { display: none; }
details.filters-at[open] > summary { margin-bottom: 0; }
.filters-at > summary .meta:empty { display: none; }
details.filters-at .filters-menu .fgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cat .get > details.fold, .approval > details.fold, .recs details.fold, ul.rows .what > details.fold { margin: 4px 0 0; }
.cat .get details.fold code, .approval details.fold code, ul.rows .what details.fold code { overflow-wrap: anywhere; }
.recs > .card .download-ask { margin-top: 4px; }
@media (max-width: 759px) {
  details.filters-at .filters-menu .fgrid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}


details.filters-at .filters-menu .fgrid .choice small { white-space: nowrap; }
@media (min-width: 760px) {
  details.filters-at .filters-menu { width: min(40rem, calc(100vw - 32px)); }
}


[data-sheet] details.filters-at .filters-menu { transform: translateY(-4px) scale(0.98); transform-origin: top right;
  transition: transform var(--base) var(--ease-in); }
[data-sheet] details.filters-at[data-shown] .filters-menu { transform: none; transition-timing-function: var(--ease-out); }

.chips a.chip:active, .chips button.chip:active { transform: scale(0.97); background: var(--press); }
@media (max-width: 759px) {
  [data-sheet] details.filters-at .filters-menu { transform: translateY(100%); transform-origin: bottom center; transition-duration: var(--slow); }
  [data-sheet] details.filters-at[data-shown] .filters-menu { transform: none; }
  .filters-menu > .actions { position: sticky; bottom: -12px; margin-bottom: -12px; padding-block: 10px 12px; background: var(--surface);
    border-top: var(--rule) solid var(--line); }
}
@media screen and (prefers-reduced-motion: reduce) {
  [data-sheet] details.filters-at .filters-menu { transform: none; }
  .chips a.chip:active, .chips button.chip:active { transform: none; }
}


.filters-scrim, .filters-head { display: none; }
.filters-scrim { --scrim: color-mix(in srgb, var(--ink-light) 45%, transparent); }
@media (prefers-color-scheme: dark) {
  :root:not([data-scheme="light"]) .filters-scrim { --scrim: color-mix(in srgb, var(--ink-light) 72%, transparent); }
}
:root[data-scheme="dark"] .filters-scrim, :root[data-scheme="deep"] .filters-scrim {
  --scrim: color-mix(in srgb, var(--ink-light) 72%, transparent); }
@media (max-width: 759px) {
  .filters-head { display: block; margin: 0 0 8px; font-size: var(--text-base); font-weight: var(--weight-strong); }
  [data-sheet] details.filters-at .filters-menu { overscroll-behavior: contain; }
  [data-sheet] details.filters-at[open] .filters-scrim { display: block; position: fixed; inset: 0; z-index: 14; background: transparent;
    touch-action: none; transition: background var(--slow) var(--ease-in); }
  [data-sheet] details.filters-at[data-shown] .filters-scrim { background: var(--scrim); transition-timing-function: var(--ease-out); }
  [data-sheet] details.filters-at[data-closing] .filters-scrim { pointer-events: none; }
}



ul.rows .accent-dot { display: inline-block; inline-size: 0.7em; block-size: 0.7em; margin-inline-end: 0.5em; border-radius: var(--radius-round); background: var(--accent); }
ul.rows > li.has-why { position: relative; }
ul.rows > li.has-why > a.row-link { padding-inline-end: calc(var(--pad) + var(--touch)); }
ul.rows > li.has-why > button.why { position: absolute; inset-inline-end: var(--pad); inset-block-start: 50%; transform: translateY(-50%); }

ul.rows > li[data-drop] { position: relative; }
ul.rows > li[data-drop]::after { content: ""; position: absolute; inset-inline: 0; inset-block-start: 0; block-size: var(--rule); background: var(--accent); }
ul.rows > li[data-drop="after"]::after { inset-block-start: auto; inset-block-end: 0; }
ul.rows > li[draggable="true"] { cursor: grab; }


#turns .meta[data-pending], #turns .meta[data-arrived] { align-self: flex-end; display: flex; align-items: center; gap: 8px; }

#turns details.fold[data-state] > summary { border-inline-start: var(--rule) solid var(--bad); padding-inline-start: 10px; }
#turns details.fold:is([data-state="failed"], [data-state="refused"]) > summary { color: var(--bad-text, var(--ink)); }

#turns details.sources { margin: 0; font-size: var(--text-sm); }
#turns details.sources > summary { color: var(--muted); list-style: none; width: fit-content; min-height: var(--touch);
  display: flex; align-items: center; }
#turns details.sources > summary::-webkit-details-marker { display: none; }
#turns details.sources > summary::after { content: "\203A"; display: inline-block; margin-left: 6px; }
#turns details.sources[open] > summary::after { rotate: 90deg; }
#turns details.sources[open] > summary { margin-bottom: 4px; }
#turns details.sources > ul.rows { grid-template-columns: max-content minmax(0, 1fr) max-content;
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
#turns details.sources > ul.rows > li { padding: calc(var(--gap) / 2) calc(var(--pad) * .75); gap: 4px 10px; align-items: baseline; }
#turns details.sources > ul.rows > li > .when { grid-column: auto; }
#turns details.sources .what { min-width: 0; overflow-wrap: break-word; }
#turns details.sources .what strong { font-weight: var(--weight-medium); }
#turns details.sources .what small .mono { font-size: var(--text-xs); overflow-wrap: anywhere; }
#turns details.sources .what small .num { white-space: nowrap; }
@media (max-width: 759px) { #turns details.sources { --touch: 44px; } }

#turns details.figures { margin: 0; font-size: var(--text-sm); }
#turns details.figures > summary { color: var(--muted); list-style: none; width: fit-content; min-height: var(--touch);
  display: flex; align-items: center; }
#turns details.figures > summary::-webkit-details-marker { display: none; }
#turns details.figures > summary::after { content: "\203A"; display: inline-block; margin-left: calc(var(--gap) / 2); }
#turns details.figures[open] > summary::after { rotate: 90deg; }
#turns details.figures > ul.rows { grid-template-columns: minmax(0, 1fr) max-content; border: var(--rule) solid var(--line);
  border-radius: var(--radius-sm); overflow: hidden; }
#turns details.figures > ul.rows > li { padding: calc(var(--gap) / 2) calc(var(--pad) * .75); align-items: baseline; }
#turns details.figures .what { min-width: 0; overflow-wrap: anywhere; }
#turns details.figures .end { display: flex; flex-wrap: wrap; gap: calc(var(--gap) / 2); }
@media (max-width: 759px) { #turns details.figures { --touch: 44px; } }

:root { --pic-dim: 1; }
@media (prefers-color-scheme: dark) {
  :root:not([data-scheme="light"]) { --pic-dim: .88; }
}
:root[data-scheme="dark"], :root[data-scheme="deep"] { --pic-dim: .88; }
#turns .answer .pic-open img, .pic-window > .pic-body img { filter: brightness(var(--pic-dim)); }


.settings-sheet:not([hidden]), #ctx-card:not([hidden]) {
  --rise: 8px;
  transition: opacity var(--base) var(--ease-out), translate var(--base) var(--ease-out), display var(--base) var(--ease-out) allow-discrete;
}
.sheet-shade { transition: opacity var(--base) var(--ease-out); }
@starting-style {
  .settings-sheet:not([hidden]), #ctx-card:not([hidden]) { opacity: 0; translate: 0 var(--rise); }
}
@starting-style { .sheet-shade { opacity: 0; } }
@media screen and (prefers-reduced-motion: reduce) {
  .settings-sheet:not([hidden]), #ctx-card:not([hidden]), .sheet-shade { transition: none; }
}


.sheet-grab { display: none; }
@media (max-width: 759px) {
  .sheet-grab { display: block; align-self: stretch; flex: none; min-height: var(--touch); padding: 0; border: 0; background: none;
    touch-action: none; cursor: grab; }
  .sheet-grab::after { content: ""; display: block; width: 40px; height: 5px; margin: 0 auto; border-radius: var(--radius-round);
    background: var(--line-strong); }
}
[data-snap][data-snap][data-snap] { transition: opacity var(--quick) linear; }


@media (min-width: 760px) and (prefers-reduced-motion: no-preference) {
  #chat[data-panel="open"] { overflow-x: clip; }
  #chat[data-panel="open"] > #panel:not([hidden]) {
    transition: transform var(--tick) var(--ease-out), display var(--tick) var(--ease-out) allow-discrete; }
  @starting-style { #chat[data-panel="open"] > #panel:not([hidden]) { transform: translateX(100%); } }
}

@media (max-width: 759px) {
  ul.rows .what { min-width: 0; }
  ul.rows a.row-link:has(> .what > small.path) > .what { grid-column: 1 / -1; }
  ul.rows .what small.path { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  ul.rows a.row-link:has(> .what > small.path) > .end { grid-column: 1 / -1; justify-self: start; }
  
  ul.rows a.row-link:has(> .what > small.path) { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 0; }
  ul.rows a.row-link:has(> .what > small.path) > .what { flex: 1 0 100%; }
  ul.rows a.row-link:has(> .what > small.path) > .end { order: 1; }
  ul.rows a.row-link:has(> .what > small.path) > .when { order: 2; color: var(--muted); font-size: var(--text-sm); }
  ul.rows a.row-link:has(> .what > small.path) > .when:not(:empty)::before { content: "\00a0·\00a0"; }
}
ul.rows .what small.path:has(> .tail) { display: flex; }
ul.rows .what small.path > .head { flex: 0 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
ul.rows .what small.path > .tail { flex: none; white-space: nowrap; }

#live[data-loading] > [data-status] { display: none; }
#stop[data-loader] { display: none; }

#setup-next[data-unmarked] .loader { visibility: hidden; }


ul.rows.models .peek-host > .peek { white-space: normal; }

.nav-chats small.peek-host { display: grid; }


#memory-export { margin-block-end: var(--gap); }

.fam .nm .built { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }

button.toggle::after, .switch input[type]::after { left: 3px; transition: transform var(--quick) var(--ease); }
button.toggle[aria-checked="true"]::after, .switch input[type]:checked::after { left: 3px; transform: translateX(16px); }

ul.rows a.row-link { transition: background-color var(--base) var(--ease); }

.pslot .tuned { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 6px 0 0; font-size: var(--text-sm); }
.pslot .tuned small { flex-basis: 100%; }
.tune-layout { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; }
.tune-layout small { flex-basis: 100%; }
.tune-layout[hidden] { display: none; }
.pslot .tuning { display: grid; gap: 6px; margin-top: 6px; padding: 8px 10px; border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.pslot .tuning p { margin: 0; font-size: var(--text-sm); }
.pslot .tuning progress { width: 100%; }
[data-tune-said]:empty { display: none; }


.check-rows { list-style: none; margin: 6px 0 14px; padding: 0; display: grid; gap: 10px; }
.check-rows > li { display: grid; gap: 3px; padding: 10px 12px; border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.check-rows > li > .row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.check-rows > li > .row > .chip { flex: none; font-size: var(--text-xs); padding: 1px 8px; min-height: 0; border: var(--rule) solid var(--line); border-radius: var(--radius-pill); background: var(--hover); color: var(--muted); }
.check-rows > li > p.meta { margin: 0; }

.tv-sendings { position: absolute; z-index: 2; inset-inline: 0; inset-block-start: calc(100% + 6px); margin: 0; padding: 8px 10px; list-style: none; background: var(--surface); border: var(--rule) solid var(--line); border-radius: var(--radius); font-size: var(--text-xs); }
.tv-sendings[hidden] { display: none; }
.tv-sendings li + li { margin-top: 6px; }
.tv-sendings small { display: block; color: var(--muted); }

#trust-ask .trust { gap: 6px; }
#trust-ask .trust-path { display: block; padding: 6px 8px; border-radius: var(--radius-xs); background: var(--pane); overflow-wrap: anywhere; white-space: normal; }
#trust-ask .actions { display: flex; flex-wrap: wrap; gap: 8px; }

[data-folder-api] .trust { gap: 6px; }
[data-folder-api] .trust-path, .folder-answered .trust-path { display: block; padding: 6px 8px; border-radius: var(--radius-xs); background: var(--pane); overflow-wrap: anywhere; white-space: normal; }
[data-folder-api] .actions { display: flex; flex-wrap: wrap; gap: 8px; }


.chips.counted { align-items: center; }
.chips.counted .chip .n { color: var(--muted); font-weight: normal; font-variant-numeric: tabular-nums; }
.chips.counted .chip[aria-current="true"] .n { color: var(--ink); }
.chips.counted span.chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border: var(--rule) solid var(--line);
  border-radius: var(--radius-pill); font-size: var(--text-sm); }
.chips.counted .chip[aria-disabled="true"] { background: none; border-color: var(--line); color: var(--muted); cursor: default; }
[data-live] > .chips.counted:first-child { margin-block: 4px 8px; }
@media (max-width: 759px) { .chips.counted a.chip, .chips.counted span.chip { min-height: 44px; padding-block: 0; } }

#turns .bubble > .files { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
#turns .bubble > .files > li { display: inline-flex; min-width: 0; font-size: var(--text-sm);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); }
#turns .bubble > .files > li > a { display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; min-width: 0; color: inherit;
  text-decoration: none; border-radius: var(--radius-sm); }
#turns .bubble > .files > li > a[href]:hover { background: var(--hover); }
#turns .bubble > .files > li > a > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#turns .bubble > .files > li > a > small { color: var(--muted); flex: none; }
#turns .bubble > .files svg { flex: none; width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }



.nav [data-icon="mail"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18v12H3zM3 7l9 6 9-6'/%3E%3C/svg%3E"); }


a:not(.btn, .card) { text-decoration: none; }
p a:not(.btn, .card, .chip), dd a:not(.btn, .card, .chip), .meta a:not(.btn, .card, .chip), td a:not(.btn, .card, .chip),
blockquote a:not(.btn, .card, .chip), figcaption a:not(.btn, .card, .chip), .prose a { text-decoration: underline var(--rule) var(--accent); text-underline-offset: 3px; }





[data-tip]:not(.toggle) { position: relative; }  
[data-tip]:not(.toggle)::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 6px); translate: -50% 0; padding: 4px 8px; border-radius: var(--radius-sm); background: var(--ink); color: var(--bg); font: 400 var(--text-xs)/1.3 var(--font-ui); white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity 120ms 300ms; z-index: 20; display: none; }
[data-tip]:not(.toggle):hover::after, [data-tip]:not(.toggle):focus-visible::after { display: block; opacity: 1; }


.where [data-tip]::after, #where-path::after { left: 0; translate: none; max-width: calc(100vw - 32px); white-space: normal; }
[data-thumbs] [data-tip]::after { left: 0; translate: none; width: max-content; max-width: 280px; white-space: normal; }
.nav [data-tip]::after, .bar-phone [data-tip]::after, .frame [data-tip]::after, .bar-top [data-tip]::after { bottom: auto; top: calc(100% + 6px); }


@media (hover: none) { [data-tip]:not(.toggle):hover::after { display: none; opacity: 0; } }

[data-tip]:not(.toggle):is(:active, [aria-expanded="true"], [data-menu-open])::after { display: none; }
:is(.duo-top, .dock-row) [data-tip]::after, .chatbubble[data-tip]::after { left: auto; right: calc(100% + 8px); top: 50%; bottom: auto; translate: 0 -50%; }
.composer .attach[data-tip]::after { left: 0; translate: none; }
.composer :is(.send, .stop)[data-tip]::after { left: auto; right: 0; translate: none; }


.bar-top.head { justify-content: flex-start; flex-wrap: nowrap; gap: 12px; }
.bar-top.head .here { font-weight: var(--weight-strong); padding-left: 12px; border-left: var(--rule) solid var(--line); }

.bar-top.head h1.here { font-family: inherit; font-size: inherit; line-height: inherit; letter-spacing: inherit; }
.bar-top.head .grow { flex: 1; }
.bar-top.head .meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.search kbd { font-size: var(--text-xs); color: var(--muted); border: var(--rule) solid var(--line); border-radius: var(--radius-xs); padding: 0 4px; }
@media (max-width: 759px) {
  .desk { display: none; }
  .bar-top.head .brand a { font-size: 0; gap: 0; }
}
@media (min-width: 760px) { .phone-only { display: none; } }


.btn.small { padding: 4px 10px; font-size: var(--text-sm); min-height: 32px; }
.btn.quiet { background: none; border-color: transparent; box-shadow: none; color: var(--muted); }
.btn.quiet:hover { background: var(--hover); color: var(--ink); }
.btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }




.badge:not([data-state]), .badge[data-state="paper"] { background: var(--pane); color: var(--ink); }
.badge:not([data-state])::before, .badge[data-state="paper"]::before { background: var(--muted); }
.badge[data-state="warn"] { background: color-mix(in srgb, var(--warn) 14%, var(--surface)); color: var(--ink); }
.badge[data-state="warn"]::before { background: var(--warn); }
.badge[data-state="bad"] { background: color-mix(in srgb, var(--bad) 14%, var(--surface)); color: var(--ink); }
.badge[data-state="bad"]::before { background: var(--bad); }
.badge[data-state="ok"] { background: color-mix(in srgb, var(--ok) 14%, var(--surface)); color: var(--ink); }
.badge[data-state="ok"]::before { background: var(--ok); }


.section { display: flex; flex-direction: column; gap: calc(var(--gap) / 2); }
.lead { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }


.card-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.card-head > :first-child { margin-right: auto; min-width: 0; }
.card-head h3 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); line-height: var(--lh-tight); }
.card-head .meta { font-size: var(--text-sm); }
.card-head .sub { flex: 1 0 100%; color: var(--muted); font-size: var(--text-sm); }
.card-head .badge { align-self: center; }
.lead h2, .lead h3 { margin-right: auto; }
.grid2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap); }
@media (max-width: 759px) { .grid2 { grid-template-columns: minmax(0, 1fr); } }




.stack > :is(p, ul, ol, dl, pre, blockquote, figure) { margin-block: 0; }
.card > :last-child, .approval > :last-child, .confirm > :last-child, .callout > :last-child { margin-bottom: 0; }
ol.stack:not(.card), ul.stack:not(.card) { list-style: none; padding: 0; }
ul.rows { list-style: none; margin: 0; padding: 0; max-width: none; }
ul.rows > li { border-top: var(--rule) solid var(--line); }
ul.rows > li:first-child { border-top: 0; }


ul.rows { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content; }
ul.rows > li, ul.rows > li > a.row-link { display: grid; grid-template-columns: subgrid; grid-column: 1 / -1;
  gap: 12px; align-items: center; padding: 10px var(--pad); }
ul.rows > li:has(> a.row-link) { display: grid; grid-template-columns: subgrid; padding: 0; }
ul.rows a.row-link { color: inherit; text-decoration: none; }
ul.rows a.row-link:hover { background: var(--hover); color: inherit; }
ul.rows .what small, ul.rows .what .meta { display: block; }
ul.rows small { color: var(--muted); font-size: var(--text-sm); }
ul.rows .when { color: var(--muted); font-size: var(--text-sm); font-variant-numeric: tabular-nums; white-space: nowrap; }
ul.rows .end { display: inline-flex; gap: 8px; align-items: center; justify-self: end; }
.card:has(> ul.rows), ul.rows.card { padding: 0; overflow: hidden; }


.card:has(> ul.rows) > :not(ul.rows) { padding-inline: var(--pad); }
.card:has(> ul.rows) > :first-child:not(ul.rows) { padding-top: var(--pad); }
.card:has(> ul.rows) > :last-child:not(ul.rows) { padding-bottom: var(--pad); }


input[inputmode="numeric"], input[type="number"] { width: 6em; }
@media (max-width: 759px) {
  ul.rows { grid-template-columns: minmax(0, 1fr) max-content; }
  ul.rows > li > :first-child:not(.what), ul.rows a.row-link > :first-child:not(.what) { grid-column: 1 / -1; justify-self: start; }
}


.chips { display: flex; flex-wrap: wrap; gap: 8px; }
a.chip, button.chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-pill); background: var(--surface); color: var(--ink); font-size: var(--text-sm); text-decoration: none; cursor: pointer; }
.chip[aria-current="true"], .chip[aria-pressed="true"] { background: var(--here); border-color: var(--accent); font-weight: var(--weight-strong); }
.seg { display: inline-flex; padding: 3px; gap: 2px; background: var(--pane); border-radius: var(--radius-btn); }
.seg button, .seg a { border: 0; background: none; padding: 5px 12px; border-radius: var(--radius-sm); color: var(--muted); font-size: var(--text-sm); font-weight: var(--weight-medium); text-decoration: none; cursor: pointer; }
.seg [aria-selected="true"], .seg [aria-current="true"] { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-rest); }
@media (max-width: 759px) {
  .seg { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  .seg button, .seg a { padding: 4px calc(var(--pad) / 2); }
}


.pop { background: var(--surface); color: var(--ink); border: var(--rule) solid var(--line-strong); border-radius: var(--radius);
  box-shadow: var(--shadow-pop); padding: 8px; }
.pop [role="option"], .pop [role="menuitem"] { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: var(--radius-sm); }
.pop [aria-selected="true"], .pop [role="option"]:hover, .pop [role="menuitem"]:hover { background: var(--hover); }
.pop [aria-disabled="true"] { color: var(--muted); }


.bar-top .brand a, .bar-top .brand a:hover { text-decoration: none; }
@media (max-width: 759px) { .seg button, .seg a { font-size: var(--text-xs); overflow: hidden; text-overflow: ellipsis; } }


nav[aria-label="Trail"] ol { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--space-2, .5rem); list-style: none; margin: 0;
  padding: 0; font-size: var(--text-sm); }
nav[aria-label="Trail"] li + li::before { content: "\203A"; color: var(--muted, currentColor);
  margin-inline-end: var(--space-2, .5rem); }


.card .btn, .card .btn.primary { padding: 4px 12px; font-size: var(--text-sm); min-height: 32px; }
.lead > h2, main h2 { font-size: var(--text-lg); }
.card .actions { flex-direction: row; flex-wrap: wrap; }


.steps a, nav.steps a, ol.steps a { text-decoration: none; }
details.change > summary { text-decoration: none; }




.page > .bar-top + main { padding-top: var(--gap); }


.card.debrief > .card-head { padding: calc(var(--gap) * .75) var(--pad) 0; }


ul.rows > li.switch-row > a.row-link { grid-column: 1; }


.options { display: grid; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); overflow: hidden;
  background: var(--surface); margin: 0; padding: 0; list-style: none; max-width: none; }
.options > .option { display: flex; align-items: center; gap: 10px; width: 100%; box-sizing: border-box; margin: 0;
  padding: 8px 12px; min-height: 40px; border: 0; border-top: var(--rule) solid var(--line); border-radius: 0;
  background: none; color: var(--ink); font: inherit; font-weight: var(--weight-medium); text-align: left; cursor: pointer; }
.options > .option:first-child { border-top: 0; }
.options > .option:hover, .options > .option:focus-visible, .options > .option:has(input:focus-visible) { background: var(--hover); }
.options > .option > kbd { flex: none; min-width: 1.6em; text-align: center; color: var(--muted); font-size: var(--text-xs); }
.options > .option > .badge, .options > .option > .meta { margin-left: auto; flex: none; }
.options > .option > input { position: absolute; opacity: 0; pointer-events: none; }
.options > .option:has(input:checked) { background: var(--here); box-shadow: inset 3px 0 0 var(--accent); }


.filepick { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: var(--pad); border: var(--rule) dashed var(--line-strong);
  border-radius: var(--radius); }
.filepick > .meta { margin: 0; }
#research-new > .row { flex-wrap: wrap; gap: 10px; align-items: center; }
#research-new > .row > .btn { margin-left: auto; }


ul.rows > li.switch-row:has(> .toggle):not(:has(> a.row-link)) { padding: 10px var(--pad); }


.rows .end:has(> .btn) { flex: none; display: inline-flex; gap: var(--s2, 8px); }
.rows .end > .btn { white-space: nowrap; }





.rail ol { counter-reset: setup-step; }
.rail li { counter-increment: setup-step; }
.rail li::before { content: counter(setup-step); width: 20px; height: 20px; box-sizing: border-box; display: grid; place-items: center;
  font-size: var(--text-xs); font-weight: var(--weight-strong); font-variant-numeric: tabular-nums; color: var(--muted); }
.rail li.done::before { content: "\2713"; color: var(--accent-text); }
.rail li.here::before { color: var(--accent-ink); }


.rail-foot { margin: var(--gap) 0 0; padding: 0 10px; font-size: var(--text-xs); }


.setup-frame .screen-foot { justify-content: flex-start; }
.setup-frame .screen-foot > :last-child { margin-inline-start: 0; }
@media (max-width: 759px) {
  .setup-frame .screen-foot .actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; }
  .setup-frame .screen-foot .actions > .primary, .setup-frame .screen-foot .actions > :only-child { grid-column: 1 / -1; }
}


.step-track { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; margin-top: 10px; }
@media (max-width: 759px) { .step-track { display: grid; } } 
.step-track i { height: 4px; border-radius: var(--radius-xs); background: var(--line); }
.step-track i.done { background: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.step-track i.here { background: var(--accent); }


.verdict svg { width: 20px; height: 20px; vertical-align: -4px; margin-right: 6px; fill: none; stroke: var(--accent-text);
  stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }


.card.dashed { background: none; border-style: dashed; border-color: var(--line-strong); box-shadow: none; }


.helper-steps { padding-top: var(--gap); border-top: var(--rule) solid var(--line); gap: calc(var(--gap) / 2); }
.helper-steps ol { margin: 0; padding-left: 1.3em; display: grid; gap: 4px; }


.start-layout .mini { display: flex; flex-wrap: wrap; gap: 10px 36px; align-items: flex-end; }
.start-layout .mm-row { display: flex; flex-direction: column; gap: 4px; }
.start-layout .mm-lab { font-size: var(--text-xs); color: var(--muted); }
.start-layout .cols { display: flex; gap: 3px; align-items: flex-end; }
.start-layout .col { width: 22px; height: 60px; box-sizing: border-box; border: var(--rule) solid var(--line-strong);
  border-radius: var(--radius-xs); background: var(--pane); display: flex; flex-direction: column-reverse; overflow: hidden; }
.start-layout .col.ram { width: 48px; margin-left: 4px; }
.start-layout .col i { display: block; flex: none; background: var(--part); }
.start-layout .col i.other { background: repeating-linear-gradient(135deg, var(--line-strong) 0 2px, transparent 2px 5px); }
.start-layout .mm-key { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: var(--text-xs); color: var(--muted); }
.start-layout .mm-key span { display: inline-flex; gap: 4px; align-items: center; }
.start-layout .ltr { min-width: 20px; height: 18px; padding: 0 4px; box-sizing: border-box; justify-content: center; border-radius: var(--radius-xs);
  background: var(--part); color: var(--accent-ink); font-weight: var(--weight-strong); }
.start-layout .p1 { --part: var(--accent); }
.start-layout .p2 { --part: color-mix(in srgb, var(--accent) 55%, var(--ink)); }
.start-layout .p3 { --part: color-mix(in srgb, var(--accent) 28%, var(--ink)); }
.start-layout .p4 { --part: color-mix(in srgb, var(--accent) 45%, var(--surface)); }
.start-layout .ltr.p4 { color: var(--ink); }
@media (max-width: 759px) {
  .start-layout .mini { flex-direction: column; align-items: stretch; gap: 6px; }
  .start-layout .col { width: 15px; height: 42px; }
  .start-layout .col.ram { width: 34px; }
}


dialog.tour .tour-shade { position: absolute; inset: 0; background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
dialog.tour .tour-card.welcome { position: absolute; inset: 0; margin: auto; left: 0; top: 0; height: fit-content; width: min(380px, calc(100% - 2 * var(--side))); gap: 12px; }
.tour-choices { display: grid; gap: 8px; }
.tour-choices .btn { display: grid; justify-items: start; justify-content: stretch; text-align: left; gap: 2px; width: 100%; }
.tour-choices .btn small { font-weight: var(--weight-regular, 400); font-size: var(--text-sm); opacity: .85; }

.tour-choices .btn.primary small { opacity: 1; }


.offer:has(> input:disabled) { cursor: default; color: var(--muted); }


dialog.tour .tour-ring { outline-width: 200vmax; }


.composer .foot > .picks { display: inline-flex; align-items: center; gap: inherit; min-width: 0; }



.page:has(.split), .page:has(.with-dock) { --page-max: calc(var(--column) * 1.6); }


ul.rows.plain > li, ul.rows.plain > li > a.row-link { grid-template-columns: minmax(0, 1fr) max-content; }
ul.rows > li.switch-row:has(> .toggle) { display: grid; grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center; gap: 12px; padding: 0 var(--pad) 0 0; }
ul.rows.plain > li.switch-row > a.row-link { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 759px) { ul.rows > li.switch-row > a.row-link:first-child { grid-column: auto; } }


button.toggle { position: relative; flex: none; width: 40px; min-width: 40px; height: 24px; padding: 0; border: 0; border-radius: var(--radius-pill); background: var(--field); cursor: pointer; }
.toggle::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px;
  border-radius: var(--radius-round); background: var(--surface); box-shadow: var(--shadow-btn); }
.toggle[aria-checked="true"] { background: var(--accent); }
.toggle[aria-checked="true"]::after { left: 19px; }


ul.events { list-style: none; margin: 0; padding: 0; max-width: none; }
ul.events > li { display: grid; grid-template-columns: 84px 4px minmax(0, 1fr); gap: 12px; padding: 10px var(--pad);
  align-items: start; border-top: var(--rule) solid var(--line); }
ul.events > li:first-child { border-top: 0; }
ul.events i, .pane a i { display: block; flex: none; background: var(--accent); }
ul.events i { width: 4px; height: 100%; min-height: 24px; border-radius: var(--radius-xs); }
ul.events i[data-cal="b"], .pane a i[data-cal="b"] { background: var(--ok); }
ul.events i[data-cal="c"], .pane a i[data-cal="c"] { background: var(--warn); }
ul.events .t { color: var(--muted); font-size: var(--text-sm); white-space: nowrap; font-variant-numeric: tabular-nums; }
ul.events small { display: block; color: var(--muted); font-size: var(--text-sm); }
.card:has(> ul.events), ul.events.card { padding: 0; overflow: hidden; }
@media (max-width: 759px) { ul.events > li { grid-template-columns: 64px 4px minmax(0, 1fr); } }


.split { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: var(--gap); align-items: start; }
.split.three { grid-template-columns: 160px 280px minmax(0, 1fr); }
.pane { display: flex; flex-direction: column; gap: 2px; padding: 8px; background: var(--pane);
  border: var(--rule) solid var(--line); border-radius: var(--radius); }
.pane h3, .kicker, .palette h3 { font-family: var(--font-ui); font-size: var(--text-xs); color: var(--muted);
  font-weight: var(--weight-strong); letter-spacing: .06em; text-transform: uppercase; }
.pane h3 { padding: 6px 10px 2px; }
.pane a { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: var(--radius-sm);
  color: var(--ink); font-size: var(--text-sm); text-decoration: none; overflow: hidden; }
.pane a:hover { background: var(--hover); color: var(--ink); }
.pane a[aria-current="page"] { background: var(--surface); box-shadow: var(--shadow-rest); font-weight: var(--weight-strong); }
.pane a .num { margin-left: auto; color: var(--muted); font-size: var(--text-xs); }
.pane a i { width: 10px; height: 10px; border-radius: var(--radius-xs); }
.pane a.meta { color: var(--muted); white-space: nowrap; text-overflow: ellipsis; }
@media (max-width: 759px) {
  .split, .split.three { grid-template-columns: minmax(0, 1fr); }
  .split > .pane { display: none; }
}


.card.staged { border-color: var(--done-ring); background: var(--tint); }


ul.mail-list { list-style: none; margin: 0; padding: 0; max-width: none; }
ul.mail-list > li + li { border-top: var(--rule) solid var(--line); }
ul.mail-list a { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; color: inherit; text-decoration: none; }
ul.mail-list a:hover { background: var(--hover); color: inherit; }
ul.mail-list a[aria-current="true"] { background: var(--here); box-shadow: inset 3px 0 0 var(--accent); }
.mail-list .from { display: flex; gap: 8px; align-items: baseline; font-weight: var(--weight-strong); font-size: var(--text-sm); }
.mail-list .from .meta { margin-left: auto; font-weight: normal; white-space: nowrap; }
.mail-list .subj { font-size: var(--text-sm); }
.mail-list .snip { color: var(--muted); font-size: var(--text-xs); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
ul.mail-list.card { padding: 0; overflow: hidden; }
.msg .from { display: flex; gap: 10px; align-items: center; }
.avatar { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px;
  border-radius: var(--radius-round); background: var(--tint); color: var(--tint-ink); font-size: var(--text-sm);
  font-weight: var(--weight-strong); }


.with-dock { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--gap); align-items: start; }
.dock { display: flex; flex-direction: column; gap: 12px; padding-left: var(--gap);
  border-left: var(--rule) solid var(--line); position: sticky; top: var(--pad); }
.dock .lead { align-items: center; }
@media (max-width: 759px) {
  .with-dock { grid-template-columns: minmax(0, 1fr); }
  .dock { display: none; }
}


.facts-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0; max-width: none;
  font-size: var(--text-sm); color: var(--muted); }
.facts-line b { color: var(--ink); font-weight: var(--weight-medium); }


.card.debrief { padding: 0; overflow: hidden; }
.kicker { margin: 0; padding: 12px var(--pad) 0; }
.steady { margin: 0; padding: 10px var(--pad) 14px; max-width: none; color: var(--muted); }


.nav-dot { margin-left: auto; width: 7px; height: 7px; border-radius: var(--radius-round); background: var(--accent); }



.palette { box-sizing: border-box; width: min(560px, 100%); margin: 0 auto; padding: 0; overflow: hidden; }
.palette > form { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: var(--rule) solid var(--line); }
.palette > form svg { flex: none; width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round; }
.palette input[type="search"] { flex: 1; border: 0; background: none; }
.palette h3 { padding: 10px 14px 2px; }
.palette [role="listbox"] { display: flex; flex-direction: column; gap: 2px; padding: 4px 8px 8px; }
.palette [role="option"] small { margin-left: auto; color: var(--muted); font-size: var(--text-xs); white-space: nowrap; }
.palette .keys { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; max-width: none; padding: 8px 14px;
  border-top: var(--rule) solid var(--line); color: var(--muted); font-size: var(--text-xs); }
.palette kbd { border: var(--rule) solid var(--line); border-radius: var(--radius-xs); padding: 0 4px; color: var(--muted); }

ul.rows .keys { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 4px; }
ul.rows .keys kbd { border: var(--rule) solid var(--line); border-radius: var(--radius-xs); padding: 0 6px; color: var(--muted); }
@media (max-width: 520px) { 
  ul.rows.plain > li:has(> .keys) { grid-template-columns: minmax(0, 1fr); row-gap: 6px; }
  ul.rows.plain > li > .keys { justify-content: flex-start; justify-self: start; }
}


.nav [data-icon="documents"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h9l4 4v14H6zM15 3v4h4'/%3E%3C/svg%3E"); }


.lead > .chips { margin-right: auto; }


ul.rows > li:has(> div.row-link) { display: grid; grid-template-columns: subgrid; grid-column: 1 / -1; padding: 0; }
ul.rows > li > div.row-link { display: grid; grid-template-columns: subgrid; grid-column: 1 / -1; gap: 12px;
  align-items: center; padding: 10px var(--pad); }
ul.rows a.what { display: block; color: inherit; text-decoration: none; min-height: 44px; }
ul.rows a.what:hover strong { color: var(--accent-text); }
ul.rows a.what .mono { font-size: var(--text-xs); }
.runmap { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; max-width: none; }
.runmap ol { list-style: none; margin: 0; padding: 0; max-width: none; }
.runmap .runmap-q { border-left: calc(var(--rule) * 3) solid var(--accent); }
.runmap .runmap-q p { margin: 0; }

.runmap details > summary { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content max-content;
  align-items: center; gap: 4px 10px; min-height: 44px; list-style: none; }
.runmap details > summary::-webkit-details-marker { display: none; }
.runmap details > summary::after { content: "\203A"; color: var(--muted); font-size: var(--text-base); line-height: 1; }
.runmap details[open] > summary::after { rotate: 90deg; }
.runmap details > summary .meta { font-weight: normal; }
.runmap details > summary .badge { justify-self: end; }
.runmap-search { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 6px 20px; padding: 12px 0;
  border-top: var(--rule) solid var(--line); }
.runmap-search:first-child { border-top: 0; padding-top: 0; }
.runmap-words { display: flex; gap: 8px; align-items: flex-start; margin: 0; }
.runmap-words svg { flex: none; width: 16px; height: 16px; margin-top: 3px; fill: none; stroke: var(--muted);
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.runmap-words small, .runmap-pages small { display: block; color: var(--muted); font-size: var(--text-sm); }
.runmap-pages { display: grid; gap: 8px; }
.runmap-pages > li { display: flex; gap: 10px; align-items: baseline; padding-left: 12px;
  border-left: calc(var(--rule) * 2) solid var(--line-strong); }
.runmap-pages > li > span:first-child { flex: 1 1 auto; min-width: 0; }
.runmap-pages > li > .badge { flex: none; }
.runmap-pages > li[aria-current="step"] { border-left-color: var(--accent); }
.runmap-pages > li.runmap-not { color: var(--muted); font-size: var(--text-sm); border-left-style: dashed; }
.runmap-search[data-state="waiting"] { color: var(--muted); }

#research-run { --map-quiet: var(--line); }
@media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) #research-run { --map-quiet: var(--line-strong); } }
:root[data-scheme="dark"] #research-run, :root[data-scheme="deep"] #research-run { --map-quiet: var(--line-strong); }
#research-run .badge[data-state="paper"] { box-shadow: inset 0 0 0 var(--rule) var(--map-quiet); }
#research-run .step-track i:not(.done):not(.here) { background: var(--map-quiet); }

#research-run .step-track i { height: 8px; }
#research-run .step-track i.done { background: var(--accent); }
#research-run .step-track i:not(.done):not(.here) { background: var(--field); }
#research-run .badge[data-state="paper"] { box-shadow: inset 0 0 0 var(--rule) var(--field); }
#research-run .runmap-pages > li { border-left-width: calc(var(--rule) * 3); border-left-color: var(--field); }
#research-run .runmap-pages > li[aria-current="step"] { border-left-color: var(--accent); }
#research-run .mono { font-size: var(--text-xs); }
#research-run details { padding: 0 calc(var(--pad) * .75); border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); }
#research-run .runmap details { border: 0; }
#research-run details[open] > summary { margin-bottom: 8px; }
@media (max-width: 759px) {
  .runmap-search { grid-template-columns: minmax(0, 1fr); }
  .runmap-pages { padding-left: 8px; }
  .runmap details > summary { grid-template-columns: minmax(0, 1fr) max-content max-content; }
  .runmap details > summary .meta { grid-column: 1 / -1; grid-row: 2; }
  ul.rows > li > div.row-link > :first-child:not(.what) { grid-column: 1 / -1; justify-self: start; }
  #research-run .btn, #research-run .section > .meta a, ul.rows .end > form > .btn { min-height: 44px; }
  #research-run .section > .meta a { display: inline-flex; align-items: center; }
  #research-run ul.rows { grid-template-columns: max-content minmax(0, 1fr) max-content; }
  #research-run ul.rows > li > :first-child:not(.what) { grid-column: auto; }
  #research-run ul.rows .what { min-width: 0; overflow-wrap: anywhere; }
  #research-run .btn, #research-run a.btn { min-height: 44px; }
  #research-run details:not(.runmap *) > summary { padding-block: 10px; }
  #research-run nav a { display: inline-flex; align-items: center; min-height: 44px; }
}



.anchor { position: relative; display: inline-flex; align-items: center; }
.anchor > .pop, .anchor > #ctx-card { position: absolute; z-index: 5; bottom: calc(100% + 6px); left: 0; margin: 0; }
.anchor > .pop { width: max-content; min-width: 240px; max-width: min(340px, calc(100vw - 2 * var(--side))); }
.anchor.end > .pop, .anchor.end > #ctx-card { left: auto; right: 0; }
.anchor > #ctx-card { width: 300px; }
.anchor > #ctx-card > .card { box-shadow: var(--shadow-pop); border-color: var(--line-strong); }
.composer .where > .anchor { margin-left: auto; flex: none; }
@media (max-width: 759px) {
  .composer .box, .composer .where { position: relative; }
  .composer .anchor { position: static; }
  .composer .anchor > .pop, .composer .anchor > #ctx-card { left: 8px; right: 8px; width: auto; min-width: 0; max-width: none; }
}


.composer .foot > .anchor.end { margin-left: auto; }
.composer .foot > .anchor.end ~ .send { margin-left: 0; }


.composer .ctx .tick { stroke: var(--ink); stroke-width: 2; stroke-linecap: butt; }
.composer .ctx { cursor: pointer; }


.composer .stop { display: inline-grid; place-items: center; width: 32px; height: 32px; padding: 0; flex: none; cursor: pointer;
  background: var(--surface); color: var(--ink); border: var(--rule) solid var(--line-strong); border-radius: var(--radius-btn);
  box-shadow: var(--shadow-rest); }
.composer .stop:hover { background: var(--hover); }
.composer .stop svg { width: 14px; height: 14px; fill: currentColor; stroke: none; }
@media (max-width: 759px) { .composer .stop { border-radius: var(--radius-round); } }


.composer button.pick { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.composer button.pick:hover { background: var(--hover); color: var(--ink); }
.composer button.pick b { font-weight: var(--weight-medium); color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.composer button.pick svg { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pop.list { display: flex; flex-direction: column; gap: 2px; font-size: var(--text-sm); }
.pop.list [role="option"], .pop.list [role="menuitem"] { align-items: flex-start; cursor: pointer; }
.pop.list [aria-selected="true"] { background: var(--here); box-shadow: var(--shadow-rest); font-weight: var(--weight-strong); }
.pop.list [aria-disabled="true"] { cursor: default; }
.pop.list [aria-disabled="true"]:hover { background: none; }
.pop.list small { display: block; color: var(--muted); font-size: var(--text-xs); font-weight: normal; }

.pop.list { transition: opacity var(--quick) var(--ease-out), translate var(--spring-settle-duration) var(--spring-settle); }
@starting-style { .pop.list { opacity: 0; translate: 0 4px; } }
.pop.list .badge { margin-left: auto; flex: none; }
.pop.list > p { margin: 0; padding: 6px 10px 4px; max-width: none; }
.pop.list svg { flex: none; width: 16px; height: 16px; margin-top: 2px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }


.dot { display: inline-block; flex: none; width: 7px; height: 7px; margin-top: 6px; border-radius: var(--radius-round);
  background: var(--ok); animation: breathe calc(var(--blink) * 2) var(--ease) infinite; }
.pick .dot { margin-top: 0; }
.dot.silent { background: none; border: var(--rule) solid var(--muted); animation: none; }
@keyframes breathe { 50% { background: color-mix(in srgb, var(--ok) 45%, transparent); } }


.ctx-bar { position: relative; padding: 4px 0; }
.ctx-bar > em { position: absolute; top: 0; bottom: 0; left: var(--mark, 80%); width: 2px; background: var(--ink); }
#ctx-card p { margin: 0; }


.thought > :not(summary) { color: var(--muted); font-size: var(--text-sm); border-left: var(--rule) solid var(--line-strong);
  padding-left: 12px; margin-left: 4px; }
.fold > ul { padding-left: 1.2em; font-size: var(--text-sm); }


.queued { align-self: flex-end; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; max-width: min(var(--measure), 85%); }
#turns .queued .bubble { max-width: none; background: none; border: var(--rule) dashed var(--line-strong); }
.queued .actions { gap: 8px; }


.question-card { display: flex; flex-direction: column; gap: var(--gap); padding: var(--pad); background: var(--surface);
  border: var(--rule) solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-rest); }
.question-card > button { align-self: flex-start; }
.question-options { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; max-width: none; }
.question-option { padding: 8px 10px; border-radius: var(--radius-sm); }
.question-option.question-recommended { background: var(--here); box-shadow: var(--shadow-rest); }
.question-option label { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: var(--weight-medium); }
.question-option p { margin: 2px 0 0 28px; color: var(--muted); font-size: var(--text-sm); }
.question-option textarea { display: block; width: 100%; box-sizing: border-box; margin-top: 6px; }
.question-evidence { margin-top: 8px; }
.question-answered { margin: 0; }
.question-asks { color: var(--muted); }


table.words { border-collapse: collapse; width: 100%; font-size: var(--text-sm); }
table.words th, table.words td { text-align: left; vertical-align: top; padding: calc(var(--pad) / 2) calc(var(--pad) * .75); border-top: var(--rule) solid var(--line); }
table.words thead th { border-top: 0; font-size: var(--text-xs); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: var(--weight-medium); }
table.words td:first-child { color: var(--muted); }
table.words td:last-child { font-weight: var(--weight-medium); }
.card:has(> table.words) { padding: 0; overflow-x: auto; }


table.words.place th, table.words.place td { white-space: nowrap; }
table.words.place td:last-child { font-weight: normal; }
table.words.place small { color: var(--muted); font-size: var(--text-xs); }
table.words.place s { color: var(--muted); }


pre.diff { font-family: var(--font-mono); font-size: var(--text-xs); line-height: 1.5; margin: 0; padding: calc(var(--gap) / 2) 0; background: none;
  border: var(--border-thin) solid var(--line); border-radius: var(--radius-sm); overflow-x: auto; white-space: normal; }
pre.diff > span { display: block; padding: 0 calc(var(--gap) / 2); white-space: pre; }
pre.diff .hunk { color: var(--muted); background: var(--pane); }
pre.diff .del { background: color-mix(in oklab, var(--bad) 14%, transparent); color: var(--ink); }
pre.diff .ins { background: color-mix(in oklab, var(--ok) 14%, transparent); color: var(--ink); }
p.call { margin: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }


#turns .bubble { position: relative; }
#rewound { border-top: var(--rule) solid var(--line); padding-top: var(--gap); }




.composer .box .asking { display: grid; gap: var(--gap); padding: var(--pad);
  border-bottom: var(--rule) solid var(--line);
  max-height: 50dvh; overflow: auto; }
.composer .box .asking .actions { margin: 0; }
.composer .box > [data-decline-confirm], .composer .box > [data-typed-decline] { padding: var(--pad) var(--pad) 0; margin: 0; } 
.composer .box .asking > .stack { padding: 0; border: 0; background: none; box-shadow: none; }
.composer .box form.asking { margin: 0; }
.composer .box .asking.question-card { border: 0; border-radius: 0; background: none; box-shadow: none; }


.notice[data-failure] { padding: calc(var(--gap) / 2) 0 calc(var(--gap) / 2) var(--gap); border-left: calc(var(--rule) * 2) solid var(--bad); }


@media (min-width: 760px) {
  #chat[data-panel="open"] > #panel { align-self: stretch; position: sticky; top: var(--chrome-bar, 0px);
    height: calc(100dvh - var(--chrome-bar, 0px)); display: flex; flex-direction: column; min-height: 0; }
  #chat[data-panel="open"] > #panel > #work { flex: 1 1 auto; min-height: 0; overflow: auto; }
}
#viewer-bar { align-items: center; gap: var(--gap); }
#viewer-bar p { flex: 1 1 24ch; min-width: 0; margin: 0; }




#turns .bubble > p:last-of-type, #turns .answer > :last-child { margin-bottom: 0; }


#failures:empty { display: none; }


.notice[data-failure] p { margin: 0 0 6px; }
.notice[data-failure] p:last-child { margin-bottom: 0; }


.composer .box .asking { grid-template-columns: minmax(0, 1fr); }
.composer .box .asking > :where(p, ol, ul, dl) { margin: 0; }
.composer .box .asking > .row { flex-wrap: nowrap; align-items: baseline; gap: 8px; }
.composer .box .asking > .row > .badge { flex: none; }
.composer .box .asking > .row > :not(.badge) { min-width: 0; }

.composer .box .asking[data-approvals] > .row { flex-wrap: wrap; }
.composer .box .asking[data-approvals] > .row > span:not(.badge) { flex: 1 1 16ch; }
.composer .box .asking details > summary { margin-bottom: 0; min-block-size: 0; }    
.composer .box .asking details > pre { margin-block: 0; }
.composer .box .asking > .stack:has(> table.words) { overflow-x: auto; }
.composer .box .asking > .btn, .composer .box .asking > button { justify-self: start; }
.composer .box .asking .kv { grid-template-columns: minmax(0, 1fr); gap: 2px 0; }
.composer .box .asking .kv dd { margin: 0 0 8px; }
.composer .box .asking .kv dd > ol { margin: 0; padding-left: 1.2em; }
@media (min-width: 760px) {
  .composer .box .asking .kv { grid-template-columns: max-content minmax(0, 1fr);
  gap: 8px var(--gap); }
  .composer .box .asking .kv dd { margin: 0; }
}


.question-option p { margin: 2px 0 0 calc(var(--touch) + 8px); }


.question-option.question-recommended { background: var(--pane); box-shadow: none; }
.composer .question-option textarea { border: var(--rule) solid var(--field); border-radius: var(--radius-sm);
  background: var(--surface); }


#panel-buttons [data-tip]::after { left: auto; right: 0; translate: none; bottom: auto; top: calc(100% + 6px); }


pre.diff { display: grid; grid-template-columns: minmax(max-content, 1fr); margin: 0 0 var(--gap); }




#folder-browse svg.icon, #recent svg.icon, .chip svg.icon { width: 18px; height: 18px; fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
#folder-browse .chip, #recent .chip { white-space: nowrap; max-width: 100%; }
#folder-browse .chip b, #recent .chip b { overflow: hidden; text-overflow: ellipsis; }
#folder-browse .where { display: flex; align-items: center; gap: 8px; min-width: 0; }
#folder-browse .where b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#folder-browse .where > input { flex: 1 1 auto; }
.greeting { font-size: var(--text-lg); }


.fold details.more { margin: 0; }
.fold details.more > summary { font-size: var(--text-xs); color: var(--muted); cursor: pointer; list-style: none; }
.fold details.more > summary::before { content: "\2026 "; }
.fold details.more[open] > summary::before { content: ""; }
.fold details.more > p { margin: 2px 0 0; font-size: var(--text-xs); }


#new-chat > .lead { justify-content: center; }
#new-chat > .lead > h2 { margin-right: 0; text-align: center; }
#new-chat:has(#folder-browse:not([hidden]))::before { flex: 0 0 0; }


.composer .box .asking { gap: 6px; padding: 10px 12px; font-size: var(--text-sm); max-height: 40dvh; }
.composer .box .asking > .row > strong, .composer .box .asking .question > legend { font-size: var(--text-base); }
.composer .box .asking .question > legend { margin: 0; }
.composer .box .asking .question-options { margin: 2px 0 0; gap: 0; }
.composer .box .asking .question-option { padding: 4px 8px; }
.composer .box .asking .question-option label { gap: 6px; }
.composer .box .asking .question-option p { margin-top: 0; }
.composer .box .asking .kv dd { margin-bottom: 4px; }


#folder-browse.sheet { background: var(--pane); border: var(--rule) solid var(--line); border-radius: var(--radius);
  padding: var(--pad); }
#folder-browse .crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap;
  align-items: center; gap: 2px; font-size: var(--text-sm); }
#folder-browse .crumbs li + li::before { content: "\203A"; color: var(--muted); margin: 0 4px; }
#folder-browse .crumbs button { background: none; border: 0; padding: 4px 2px; color: var(--muted); font: inherit; cursor: pointer; }
#folder-browse .crumbs button:hover { color: var(--ink); text-decoration: underline; }
#folder-browse .crumbs b { font-weight: var(--weight-strong); }
#folder-browse .tools { display: flex; gap: 8px; align-items: center; }
#folder-browse .tools > input { flex: 1 1 auto; }
#folder-browse .tools .choice { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-sm); }
#folder-browse ul.files { background: var(--surface); border: var(--rule) solid var(--line);
  border-radius: var(--radius-sm); max-height: 50dvh; overflow: auto; }


#folder-browse ul.files { grid-template-columns: max-content minmax(0, 1fr) max-content; }
#folder-browse ul.files > li { padding: 0; }
#folder-browse ul.files > li > button.row-link { display: grid; grid-template-columns: subgrid; grid-column: 1 / -1; gap: 12px; align-items: center; width: 100%; padding: 10px 12px; background: none; border: 0; color: inherit; font: inherit; text-align: left; cursor: pointer; }
#folder-browse ul.files > li > button.row-link:hover { background: var(--hover); }
#folder-browse ul.files .what { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#folder-browse ul.files .chev { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round; }
#folder-browse .actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
#folder-browse .actions > .meta { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }


.composer .box .asking .btn { padding: 4px 12px; font-size: var(--text-sm); min-height: 32px; }
.composer .box .asking.question-card { max-height: 60dvh; }
#folder-browse .tools { flex-wrap: nowrap; }




#turns .did { margin: 0; font-size: var(--text-sm); }
#turns .did > a { color: var(--muted); text-decoration: none; }
#turns .did > a::after { content: "\203A"; margin-left: 6px; }
#turns .did > a:hover, #turns .did > a:focus-visible { color: var(--ink); }
#turns .did[data-state="failed"] > a { color: var(--bad-text, var(--ink)); }

#turns .did[data-state] { border-inline-start: var(--rule) solid var(--bad); padding-inline-start: 10px; }
#turns .bubble[data-pending="unsent"] { background: none; border: var(--rule) solid var(--bad); }
#turns .did code { font-size: inherit; }


.thought[data-live] { color: var(--muted); font-size: var(--text-sm); }


#turns details.did { margin: 0; font-size: var(--text-sm); }
#turns details.did > summary { color: var(--muted); cursor: pointer; list-style: none; width: fit-content; }
#turns details.did > summary::-webkit-details-marker { display: none; }
#turns details.did > summary::after { content: "\203A"; display: inline-block; margin-left: 6px; }
#turns details.did[open] > summary::after { rotate: 90deg; }
#turns details.did > summary:hover { color: var(--ink); }
summary > [data-why] { display: block; font-weight: normal; margin-top: 2px; } 
#turns details.did code { font-size: inherit; }

#turns details.did.par > details.did { margin-inline-start: 4px; padding-inline-start: 10px; border-inline-start: var(--rule) solid var(--line); }
#turns details.did > .edit { margin-top: 8px; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm);
  overflow: hidden; background: var(--surface); }
#turns details.did > .edit > .file { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: calc(var(--gap) * .375) calc(var(--pad) * .625);
  max-width: none; background: var(--pane); border-bottom: var(--rule) solid var(--line); }
#turns details.did > .edit > .file b { font-weight: var(--weight-medium); }
#turns details.did > .edit > .file b.ins { color: var(--ok-text, var(--ok)); }
#turns details.did > .edit > .file b.del { color: var(--bad-text, var(--bad)); }
#turns details.did > .edit > pre.diff { margin: 0; overflow-x: auto; }

a.diffline { display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; min-height: 28px; min-width: 0; color: var(--muted);
  font-size: var(--text-sm); text-decoration: none; overflow-wrap: anywhere; }
a.diffline:hover { color: var(--ink); text-decoration: underline; }
a.diffline b { font-weight: var(--weight-medium); }
a.diffline b.ins, .review-changes .file b.ins { color: var(--ok-text, var(--ok)); }
a.diffline b.del, .review-changes .file b.del { color: var(--bad-text, var(--bad)); }
@media (max-width: 759px) { a.diffline { min-height: 44px; } }
.review-changes .edit { border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); overflow: hidden; background: var(--surface); }
.review-changes .edit > .file { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: calc(var(--gap) * .375) calc(var(--pad) * .625);
  max-width: none; background: var(--pane); border-bottom: var(--rule) solid var(--line); font-size: var(--text-sm); }
.review-changes .edit > .file code { min-width: 0; overflow-wrap: anywhere; }
.review-changes .edit > .file b { font-weight: var(--weight-medium); }
.review-changes .edit > pre.diff { margin: 0; overflow-x: auto; border: 0; border-radius: 0; box-shadow: none; }
.review-changes .edit > p.meta { margin: 0; padding: 8px 10px; }

#turns .edit > .check-line { margin: 0; padding: 8px 10px; border-top: var(--rule) solid var(--line); }
#turns details.did > p.meta { margin: 8px 0 0; }
.thought[data-live] > p { margin: 0 0 4px; max-width: none; }


#panel .record > h3 { margin: 0; font-size: var(--text-base); }
#panel .record > .call, #panel .record > details > summary { font-size: var(--text-sm); }
#panel .record > p { margin: 0; }


.composer .box .asking .question-text { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); }

.composer .box .asking .options > .option.primary { background: var(--accent); color: var(--accent-ink); font-weight: var(--weight-strong); }
.composer .box .asking .options > .option.primary > kbd { color: color-mix(in srgb, var(--accent-ink) 80%, transparent); }  
.composer .box .asking .options > .option.primary > .badge { display: none; }


.composer .attach { display: inline-grid; place-items: center; width: 32px; height: 32px; padding: 0; flex: none; cursor: pointer;
  background: none; color: var(--muted); border: 0; border-radius: var(--radius-btn); }
.composer .attach:hover, .composer .attach[aria-expanded="true"] { background: var(--hover); color: var(--ink); }
.composer .attach svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

.composer .files:not(.rows) { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 8px 10px 0; list-style: none; }
.composer .files:not(.rows) > li { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 8px; font-size: var(--text-sm);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); min-width: 0; }
.composer .files:not(.rows) > li > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.composer .files:not(.rows) > li > small { color: var(--muted); flex: none; }
.composer .files:not(.rows) svg { flex: none; width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.composer .files:not(.rows) button { display: inline-grid; place-items: center; width: var(--touch); height: var(--touch); padding: 0; border: 0; background: none; color: var(--muted); border-radius: var(--radius-sm); cursor: pointer; }
.composer .files:not(.rows) button:hover { background: var(--hover); color: var(--ink); }

.composer .files:not(.rows)[data-quote] > li > small { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.composer .files:not(.rows) > li.pic { flex-wrap: wrap; padding-left: 4px; }
.composer .files:not(.rows) > li.pic > img { flex: none; width: 28px; height: 28px; object-fit: cover; border-radius: var(--radius-xs); }
.composer .files:not(.rows) > li[data-state="refused"] { border-color: var(--bad); }
.composer .files:not(.rows) > li[data-state="refused"] > img { opacity: .45; }
.composer .files:not(.rows) > li > .why { flex-basis: 100%; margin: 0 0 2px 34px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
  color: var(--ink); font-size: var(--text-sm); white-space: normal; }
.composer .files:not(.rows) > li > .why .btn { width: auto; height: auto; padding: 2px 8px; color: var(--accent-text); }


#panel .plan-view > h3 { margin: 0; font-size: var(--text-base); }
#panel .plan-view > p { margin: 0; }
#panel .plan-view table { font-size: var(--text-sm); }
.composer .box .asking .actions > .meta { align-self: center; }
#panel .plan-view > * { min-width: 0; }
#panel .plan-view table { width: 100%; }
#panel .plan-view :is(th, td) { padding: calc(var(--pad) * .375) calc(var(--pad) / 2); }
#panel .plan-view :has(> table) { overflow-x: auto; }


.thought[data-live] { border-left: var(--rule) solid var(--line-strong); padding-left: 12px; }
.thought[data-live] > :not(summary) { border-left: 0; padding-left: 0; }
#turns details.did > .edit > pre.diff { border: 0; border-radius: 0; box-shadow: none; }



#turns .card.handoff, #project .card.handoff { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px var(--gap); padding: calc(var(--gap) * .75) var(--pad); }
#turns .card.handoff .what small, #project .card.handoff .what small { display: block; color: var(--muted); font-size: var(--text-sm); overflow-wrap: anywhere; }
#turns .card.handoff .actions, #project .card.handoff .actions { margin: 0; }

#turns .model { margin: 0 0 calc(var(--gap) * -0.5); font-size: var(--text-xs); color: var(--muted); }
#turns .copy { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: 32px; min-width: 32px;
  margin: calc(var(--gap) * -0.75) 0 0 -8px; padding: 0 8px; border: 0; border-radius: var(--radius-sm); background: none;
  box-shadow: none; color: var(--muted); font: 400 var(--text-xs)/1 var(--font-ui); cursor: pointer; }
#turns .bubble + .copy { align-self: flex-end; margin-left: 0; }
#turns .copy:hover, #turns .copy:focus-visible { background: var(--hover); color: var(--ink); }
#turns .copy svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round;
  stroke-linejoin: round; flex: none; }
#turns .copy[data-copied] { color: var(--ok-text, var(--ok)); }
#turns .copy-said { margin: calc(var(--gap) * -0.5) 0 0; font-size: var(--text-sm); }
@media (max-width: 759px) { #turns .copy { min-height: var(--touch); min-width: var(--touch); } }

#turns .msg-time { --msg-h: 32px; align-self: flex-end; display: flex; align-items: center; height: var(--msg-h);
  margin: calc(-1 * (var(--gap) + var(--msg-h))) 40px 0 0; font: 400 var(--text-xs)/1 var(--font-ui);
  font-variant-numeric: tabular-nums; white-space: nowrap; color: transparent; }
#turns .msg-time.shown, #turns .bubble:hover ~ .msg-time, #turns .bubble:focus-within ~ .msg-time,
#turns .copy:hover ~ .msg-time, #turns .copy:focus-visible ~ .msg-time, #turns .msg-time:hover { color: var(--muted); }
#turns .copy[data-copied] ~ .msg-time { color: transparent; } 
@media (max-width: 759px) { #turns .msg-time { --msg-h: var(--touch); margin-right: 32px; } }
#turns .day-line { align-self: center; margin: 0; font-size: var(--text-xs); color: var(--muted); }


#turns .answer h3, #turns .answer h4, #turns .answer h5, #turns .answer h6 { margin: calc(var(--gap) * 0.5) 0 calc(var(--gap) * 0.5); line-height: var(--lh-tight); }
#turns .answer > blockquote:not(:last-child), #turns .answer > .table:not(:last-child), #turns .answer > figure:not(:last-child),
  #turns .answer > .maths:not(:last-child) { margin-bottom: var(--gap); }
#turns .answer h3 { font-size: var(--text-lg); }
#turns .answer h4 { font-size: var(--text-base); }
#turns .answer h5, #turns .answer h6 { font-size: var(--text-sm); color: var(--muted); }
#turns .answer del { color: var(--muted); }
#turns .answer blockquote { margin-inline: 0; margin-top: 0; padding: 2px 0 2px 14px; border-left: 3px solid var(--line-strong); color: var(--muted); }
#turns .answer blockquote > p { margin: 0; }
#turns .answer hr { border: 0; border-top: var(--rule) solid var(--line-strong); margin: calc(var(--gap) * 0.5) 0; }
#turns .answer li > ol, #turns .answer li > ul { margin: 4px 0 0; }
#turns .answer ul.tasks { list-style: none; padding-left: 0; }
#turns .answer ul.tasks > li { display: flex; align-items: center; gap: 8px; }
#turns .answer ul.tasks .task { display: grid; place-items: center; flex: none; width: 16px; height: 16px; box-sizing: border-box;
  border: var(--rule) solid var(--field); border-radius: var(--radius-xs); background: var(--surface); }
#turns .answer ul.tasks .task[data-done] { border-color: var(--accent); background: var(--accent); color: var(--accent-ink); }
#turns .answer ul.tasks .task svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
#turns .answer :not(pre) > code { padding: 2px 6px; border: var(--rule) solid var(--line); border-radius: var(--radius-xs); background: var(--hover); }
#turns .answer .table { max-width: 100%; overflow-x: auto; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); }
#turns .answer table { border-collapse: collapse; width: 100%; min-width: 30rem; font-size: var(--text-sm); }
#turns .answer th, #turns .answer td { padding: calc(var(--pad) / 2) calc(var(--pad) * .75); text-align: left; vertical-align: top; border-top: var(--rule) solid var(--line); }
#turns .answer th + th, #turns .answer td + td { border-left: var(--rule) solid var(--line); }
#turns .answer thead th { border-top: 0; border-bottom: var(--rule) solid var(--line-strong); background: var(--hover); font-weight: var(--weight-strong); white-space: nowrap; }
#turns .answer th.num, #turns .answer td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
#turns .answer figure.code { margin-inline: 0; margin-top: 0; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); overflow: hidden; background: var(--surface); }
#turns .answer figure.code > figcaption { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 0 calc(var(--pad) / 2) 0 calc(var(--pad) * .75); min-height: 36px; background: var(--hover); border-bottom: var(--rule) solid var(--line-strong); font-size: var(--text-xs); color: var(--muted); }
#turns .answer figure.code .lang { font-weight: var(--weight-medium); }
#turns .answer .code-copy { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; min-width: 32px; margin-left: auto;
  padding: 0 8px; border: 0; border-radius: var(--radius-sm); background: none; color: var(--muted); font: 400 var(--text-xs)/1 var(--font-ui); cursor: pointer; }
#turns .answer .code-copy:hover, #turns .answer .code-copy:focus-visible { background: var(--press); color: var(--ink); }
#turns .answer .code-copy[data-copied] { color: var(--ok-text, var(--ok)); }
#turns .answer .code-copy svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
#turns .answer figure.code > pre { margin: 0; padding: calc(var(--gap) * .75) calc(var(--pad) * .875); overflow-x: auto; line-height: 1.6; font-size: var(--text-sm); color: var(--ink); tab-size: 4; }
#turns .answer figure.code > pre:focus-visible { outline-offset: calc(var(--ring) * -1); }
#turns .answer figure.code > pre > code { font-size: inherit; }
#turns .answer .hl-kw { color: var(--code-kw); }
#turns .answer .hl-fn { color: var(--code-fn); }
#turns .answer .hl-type { color: var(--code-type); }
#turns .answer .hl-str { color: var(--code-str); }
#turns .answer .hl-num { color: var(--code-num); }
#turns .answer .hl-punct { color: var(--code-punct); }
#turns .answer .hl-com { color: var(--code-com); font-style: italic; }
#turns .answer .maths { max-width: 100%; overflow-x: auto; padding: 4px 0; }
#turns .answer math { font-size: 1.1em; }
#turns .answer .maths[data-state="unread"] > code { display: block; white-space: pre-wrap; overflow-wrap: anywhere; }
#turns .answer .maths[data-state="unread"] > p { margin: 4px 0 0; font-size: var(--text-sm); }

#turns .answer figure.pic { container-type: inline-size; margin-inline: 0; margin-top: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; max-width: 100%; }
#turns .answer figure.pic > figcaption { font-size: var(--text-sm); color: var(--muted); }
#turns .answer .pic-open { position: relative; display: block; padding: calc(var(--gap) / 2); border: var(--rule) solid var(--line); border-radius: var(--radius-sm);
  background: var(--surface); overflow: hidden; cursor: zoom-in; max-width: 100%; }
#turns .answer .pic-open img { display: block; max-width: calc(100cqw - 2 * var(--rule) - var(--gap)); max-height: 360px; width: auto; height: auto; }
#turns .answer .pic-full { position: absolute; right: 6px; bottom: 6px; display: grid; place-items: center; width: 28px; height: 28px;
  border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); box-shadow: var(--shadow-btn); }
#turns .answer .pic-full svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#turns .answer .pic-wait { display: grid; place-items: center; width: min(640px, 100%); aspect-ratio: 640 / 300; border: var(--rule) dashed var(--line-strong);
  border-radius: var(--radius-sm); background: var(--pane); }
#turns .answer figure.pic[data-state="refused"], #turns .answer figure.pic[data-state="ask"] { padding-left: 12px; border-left: 3px solid var(--line-strong); gap: 2px; }
#turns .answer figure.pic[data-state="ask"] > .row { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 0; }
.pic-over { position: fixed; inset: 0; z-index: 30; margin: 0; display: flex; align-items: center; justify-content: center;
  padding: 4dvh var(--side); background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
.pic-window { display: flex; flex-direction: column; max-width: 100%; max-height: 92dvh; box-sizing: border-box;
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow-pop); background: var(--bg); color: var(--ink); overflow: hidden; }
.pic-window > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: none;
  padding: 8px 8px 8px 20px; border-bottom: var(--rule) solid var(--line); }
.pic-window > header h2 { margin: 0; font-size: var(--text-lg); }
.pic-window > .pic-body { flex: 1 1 auto; min-height: 0; overflow: auto; background: var(--pane); }
.pic-window > .pic-body img { display: block; max-width: none; }
.pic-window > footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; flex: none;
  padding: 10px 12px 10px 20px; border-top: var(--rule) solid var(--line); }
.pic-window > footer code { overflow-wrap: anywhere; font-size: var(--text-xs); }
@media (max-width: 759px) {
  #turns .answer .code-copy { min-height: 44px; min-width: 44px; }
  #turns .answer figure.code > figcaption { min-height: 44px; }
  .pic-over { padding: 0; }
  .pic-window { width: 100%; height: 100%; max-height: none; border: 0; border-radius: 0; box-shadow: none; }
  .pic-window > header { padding-top: calc(8px + env(safe-area-inset-top)); }
  .pic-window > header .btn { min-width: 44px; min-height: 44px; }
  .pic-window > footer { padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); }
  .pic-window > footer .btn { min-height: 44px; }
  
  .pic-window > .pic-body { display: grid; place-items: center; }
  .pic-window > .pic-body img { max-width: 100%; height: auto; }
  .pic-window > footer > span { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; }
  #turns .answer figure.pic > a { display: inline-flex; align-items: center; min-height: 44px; }
  #turns .answer figure.pic[data-state="ask"] > .row .btn { min-height: 44px; }
}


.row-menu { position: fixed; z-index: 20; position-anchor: --row-menu; top: calc(anchor(bottom) - 8px);
  left: calc(anchor(left) + 48px); position-try-fallbacks: flip-block; width: max-content; min-width: 220px;
  max-width: min(340px, calc(100vw - 2 * var(--side))); white-space: normal; }

.nav-chats .row-menu { left: calc(anchor(right) + 6px); top: anchor(top); }
.row-menu.pop { border-color: var(--field); }
#chats .notice[data-failure] { gap: 6px; }.row-menu [role="menuitem"] { width: 100%; box-sizing: border-box; border: 0; background: none; color: inherit;
  font: inherit; text-align: left; }
.row-menu [role="menuitem"]:focus-visible { background: var(--hover); }
.row-menu [role="menuitem"][data-danger]:not([aria-disabled="true"]) { color: var(--bad-text, var(--bad)); }
.row-menu [role="menuitem"][aria-disabled="true"] { color: var(--muted); }
.row-menu [role="separator"] { height: 0; margin: 4px 0; border-top: var(--rule) solid var(--line); }
.row-menu .row-menu-head, .row-menu .row-menu-close, .row-menu-shade { display: none; }
.nav-chats a[data-menu-open], ul.rows a.row-link[data-menu-open], .chats-list a[data-menu-open] { background: var(--press);
  anchor-name: --row-menu; }
.confirm-over, .row-menu-shade { --scrim: color-mix(in srgb, var(--ink-light) 45%, transparent); }
@media (prefers-color-scheme: dark) {
  :root:not([data-scheme="light"]) .confirm-over, :root:not([data-scheme="light"]) .row-menu-shade {
    --scrim: color-mix(in srgb, var(--ink-light) 72%, transparent); }
}
:root[data-scheme="dark"] .confirm-over, :root[data-scheme="dark"] .row-menu-shade, :root[data-scheme="deep"] .confirm-over,
:root[data-scheme="deep"] .row-menu-shade { --scrim: color-mix(in srgb, var(--ink-light) 72%, transparent); }
.chat-done { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; max-width: none; padding: 10px var(--pad);
  border-radius: var(--radius-sm); background: var(--tint); border: var(--rule) solid var(--line);
  font-size: var(--text-sm); }
.chat-done .actions { margin-left: auto; gap: 8px; }
.confirm-over { position: fixed; inset: 0; z-index: 30; margin: 0; display: flex; align-items: center; justify-content: center;
  padding: var(--side); background: var(--scrim); }
.confirm-window { display: flex; flex-direction: column; gap: 12px; width: min(440px, 100%); box-sizing: border-box;
  padding: 20px; border: var(--rule) solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow-pop);
  background: var(--surface); color: var(--ink); }
.confirm-window h2 { margin: 0; font-size: var(--text-lg); overflow-wrap: anywhere; }
.confirm-window p { margin: 0; }
.confirm-window ul { margin: 0; padding-left: 1.2em; }
.confirm-window .actions { margin-top: 4px; }
.confirm-window .btn[data-danger] { color: var(--bad-text, var(--bad)); border-color: var(--bad); }
.confirm-window .btn[data-danger]:disabled { color: var(--muted); border-color: var(--line-strong); cursor: default; }
@media (max-width: 759px) {
  .row-menu, .confirm-window, .chat-done { --touch: 44px; }
  .row-menu-shade { display: block; position: fixed; inset: 0; z-index: 19; background: var(--scrim); }
  .row-menu { position: fixed; inset: auto 0 0 0; z-index: 20; position-try-fallbacks: none; width: auto; min-width: 0;
    max-width: none; max-height: 80dvh; overflow-y: auto; border-bottom: 0; border-radius: var(--radius) var(--radius) 0 0;
    font-size: var(--text-base); padding: 8px var(--side) calc(16px + env(safe-area-inset-bottom)); }
  .row-menu .row-menu-head { display: block; margin: 0 0 4px; padding: 8px 10px; font-weight: var(--weight-strong);
    overflow-wrap: anywhere; border-bottom: var(--rule) solid var(--line); }
  .row-menu [role="menuitem"] { align-items: center; padding-block: 10px; }
  .row-menu [role="menuitem"] svg { margin-top: 0; }
  .row-menu .row-menu-close { display: flex; width: 100%; margin-top: 6px; }
  .confirm-over { align-items: flex-end; padding: 0; }
  .confirm-window { width: 100%; border-radius: var(--radius) var(--radius) 0 0; border-bottom: 0;
    padding: 20px var(--side) calc(16px + env(safe-area-inset-bottom)); }
  .confirm-window .actions { flex-direction: column; align-items: stretch; }
  .chat-done .actions { margin-left: 0; width: 100%; }
  .chat-done .actions .btn { flex: 1 1 0; min-height: var(--touch); }
  #chats .notice[data-failure] .btn { min-height: 44px; }
}


#panel .sent .role { margin: 0; font-weight: var(--weight-medium); color: var(--ink); }
#panel .sent pre.log { margin: 4px 0 var(--gap); padding: 8px 12px; border: var(--rule) solid var(--line-strong);
  border-radius: var(--radius-sm); background: var(--pane); font-size: var(--text-xs); }
#panel .sent .cut { padding: 2px 6px; border: var(--rule) dashed var(--line-strong); border-radius: var(--radius-sm);
  color: var(--muted); font-style: italic; }
#panel .sent details > summary { cursor: pointer; }
#panel .sent details details { margin-left: 12px; }
#panel .sent .kv { margin: 0; font-size: var(--text-sm); align-items: baseline; }
#panel .sent details > p { margin: 0; } 

#panel .sent .steps { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
#panel .sent .steps > span { margin-right: 4px; color: var(--muted); font-size: var(--text-sm); }
#panel .sent .steps > button { min-width: 2.25rem; min-height: 2rem; padding: 4px 8px; border: var(--rule) solid var(--line-strong);
  border-radius: var(--radius-sm); background: var(--surface); color: var(--muted); font: inherit; font-size: var(--text-sm);
  font-variant-numeric: tabular-nums; cursor: pointer; }
#panel .sent .steps > button:hover { background: var(--hover); color: var(--ink); }
#panel .sent .steps > [aria-checked="true"], #panel .sent .steps > [aria-checked="true"]:hover { background: var(--here);
  border-color: var(--accent); color: var(--ink); font-weight: var(--weight-strong); }

#panel .sent .steps > button { border-color: var(--field); color: var(--ink); }
#panel .sent code { font-size: var(--text-xs); }
#panel .sent .badge { white-space: nowrap; box-shadow: inset 0 0 0 var(--rule) var(--field); }

@media (max-width: 759px) {
  #panel .sent .steps > span { flex-basis: 100%; }
  #panel .sent .steps > button { min-width: 2.75rem; min-height: 2.75rem; }
  #panel .sent details > summary { min-height: var(--touch); padding: calc(var(--gap) * .625) 0; }
  #panel:has(.sent) [role="tab"], #panel .sent .btn { min-height: 44px; box-sizing: border-box; }
  #panel .sent > details { margin-block: calc(var(--gap) * -0.5); }
  #turns details.did > .meta a { display: inline-flex; align-items: center; min-height: var(--touch); }
}


#capabilities :is(p, ul, ol) { margin: 0; }
#capabilities :is(ul, ol) { max-width: none; }


.models-cols, .layout-cols { display: grid; gap: var(--gap); align-items: start; }
.models-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 430px); }
.layout-cols { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); }
@media (max-width: 759px) { .models-cols, .layout-cols { grid-template-columns: minmax(0, 1fr); } }


ul.rows.models > li { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) max-content; gap: 6px 14px; padding-block: 12px; }
ul.rows.models > li > p, ul.rows.models > li > .confirm { grid-column: 1 / -1; }
ul.rows.models > li[aria-current="true"] { box-shadow: inset 3px 0 0 var(--accent); background: var(--here); }
ul.rows.models .badge { margin-left: 4px; }

ul.rows.models > li[aria-busy="true"] { cursor: progress; }
.press { display: inline-flex; align-items: center; gap: 8px; min-block-size: var(--touch); }
.press .ring { inline-size: 14px; block-size: 14px; border-top-color: var(--accent); }
@media (max-width: 759px) {
  ul.rows.models > li { grid-template-columns: minmax(0, 1fr); }
  ul.rows.models .end { justify-self: start; flex-wrap: wrap; }
}


.confirm { display: flex; flex-direction: column; gap: 8px; padding: calc(var(--pad) * .75) calc(var(--pad) * .875); border-radius: var(--radius-sm);
  background: var(--tint); border: var(--rule) solid var(--done-ring); font-size: var(--text-sm); }
.confirm > strong { font-size: var(--text-base); }
.confirm ul { padding-left: 1.2em; }
.confirm select { align-self: flex-start; max-width: 100%; }


.jobs > .card { display: flex; flex-direction: column; gap: 2px; padding: calc(var(--gap) * .75) calc(var(--pad) * .875); font-size: var(--text-sm); }
.jobs > .card b { font-size: var(--text-base); font-weight: var(--weight-strong); }


.prov { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-radius: var(--radius-sm);
  background: var(--surface); border: var(--border-thin) solid var(--line-strong); }
.prov > header { display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; }
.prov h3 { font-family: var(--font-ui); font-size: var(--text-sm); font-weight: var(--weight-strong);
  letter-spacing: var(--tracking-wide); text-transform: uppercase; }
.prov h3::before { content: "\25A0\00a0\00a0"; color: var(--muted); }
.prov > header .meta { font-size: var(--text-xs); }
.prov[data-tier="measured"] { background: color-mix(in srgb, var(--ok) 7%, var(--surface));
  border-color: color-mix(in srgb, var(--ok) 55%, var(--line)); }
.prov[data-tier="measured"] h3::before { content: "\25CF\00a0\00a0"; color: var(--ok); }
.prov[data-tier="elsewhere"] { background: var(--pane); border-style: dashed; }
.prov[data-tier="elsewhere"] h3::before { content: "\25CB\00a0\00a0"; }
.prov .kv { font-size: var(--text-sm); gap: 6px var(--gap); grid-template-columns: minmax(110px, max-content) minmax(0, 1fr); }
.prov dd small { display: block; color: var(--muted); font-size: var(--text-xs); }
@media (max-width: 759px) {
  .prov .kv { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .prov .kv dd { margin-bottom: 8px; }
}


[data-part="a1"] { --part: var(--accent); --part-ink: var(--accent-ink); }
[data-part="a2"] { --part: color-mix(in srgb, var(--accent) 55%, var(--ink)); --part-ink: var(--surface); }
[data-part="t"] { --part: color-mix(in srgb, var(--accent) 28%, var(--ink)); --part-ink: var(--surface); }
[data-part="c"] { --part: color-mix(in srgb, var(--accent) 45%, var(--surface)); --part-ink: var(--ink); }
.ltr { display: inline-flex; align-items: center; justify-content: center; flex: none; box-sizing: border-box;
  min-width: 28px; height: 28px; padding: 0 4px; border-radius: var(--radius-sm); background: var(--part);
  color: var(--part-ink); font-size: var(--text-xs); font-weight: var(--weight-strong); }
.slot-parts .meta .ltr, .mini-key .ltr, .together .ltr { min-width: 22px; height: 20px; }


.saved { gap: 10px var(--gap); }
.fit-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; max-width: none; }
.saved > .fit-line { margin-left: auto; }
.fit-line .badge { white-space: normal; line-height: var(--lh-tight); }
@media (max-width: 759px) {
  .saved > .fit-line { margin-left: 0; }
  .saved .seg { width: 100%; }
}


.bar-key { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; font-size: var(--text-xs); color: var(--muted); }
.bar-key span { display: inline-flex; align-items: center; gap: 5px; }
.bar-key i { display: inline-block; width: 18px; height: 10px; border-radius: var(--radius-xs); border: var(--rule) solid var(--line-strong); }
.bar-key [data-kind="model"] { background: var(--accent); }
.bar-key [data-kind="context"] { background: color-mix(in srgb, var(--accent) 32%, var(--surface)); }
.bar-key [data-kind="other"], .membar .o, .mini .col i.o { background: repeating-linear-gradient(135deg, var(--line-strong) 0 2px, transparent 2px 5px); }
.bar-key [data-kind="room"] { background: var(--pane); }
.bar-key [data-kind="keep"], .membar .keep { border-left: var(--border-thin) solid var(--warn); background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--warn) 30%, transparent) 0 2px, transparent 2px 5px); }


.card.machine { padding: 0; }
.machine > header { display: flex; flex-direction: column; gap: 1px; padding: 12px 14px 10px; border-bottom: var(--rule) solid var(--line); }
.slots { list-style: none; padding: 4px 0 8px; }
.slot { position: relative; display: flex; flex-direction: column; gap: 5px; min-width: 0; padding: 8px 14px 8px 30px; }
.brk { position: absolute; left: calc(10px + var(--k, 0) * 7px); top: 0; bottom: 0; width: 4px; background: var(--part); }
.brk[data-end="top"], .brk[data-end="both"] { top: 12px; border-radius: var(--radius-xs) var(--radius-xs) 0 0; }
.brk[data-end="end"], .brk[data-end="both"] { bottom: 12px; border-radius: 0 0 var(--radius-xs) var(--radius-xs); }
.brk[data-end="both"] { border-radius: var(--radius-xs); }
.slot-head { display: flex; flex-wrap: wrap; gap: 0 8px; align-items: baseline; justify-content: space-between; font-size: var(--text-sm); }
.slot-head b { font-weight: var(--weight-strong); }
.slot-fig { font-size: var(--text-xs); color: var(--muted); white-space: nowrap; }
.slot-fig[data-over] { color: var(--warn); font-weight: var(--weight-strong); }
.slot-parts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; }
.slot-parts .meta { font-size: var(--text-xs); display: inline-flex; gap: 6px; align-items: center; }
.slot-parts .meta.free { display: inline; }
.slot-parts .meta.other { flex-basis: 100%; }


.membar { position: relative; display: flex; height: 16px; overflow: hidden; background: var(--pane);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius-xs); }
.membar > span { flex: none; display: flex; height: 100%; width: var(--w); }
.membar .w { background: var(--part); }
.membar .c { background: color-mix(in srgb, var(--part) 32%, var(--surface)); }
.membar .c i { flex: 1 1 0; min-width: 0; border-right: 1.5px solid var(--surface); }
.membar .c i:last-child { border-right: 0; }
.membar .keep { position: absolute; top: 0; bottom: 0; right: 0; box-sizing: border-box; }
.membar[data-over] { border-color: var(--warn); box-shadow: 0 0 0 var(--ring) color-mix(in srgb, var(--warn) 45%, transparent); }


.part { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; min-height: 44px; box-sizing: border-box;
  padding: 5px 10px 5px 5px; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-btn);
  background: var(--surface); box-shadow: var(--shadow-rest); cursor: pointer; text-align: left;
  font-size: var(--text-sm); font-weight: var(--weight-strong); }
.part > span:not(.ltr, .badge) { min-width: 0; }
.part small { display: block; font-weight: normal; color: var(--muted); font-size: var(--text-xs); }
.part:hover { border-color: var(--accent); }
.part[aria-pressed="true"] { border-color: var(--accent); background: var(--here); box-shadow: 0 0 0 var(--ring) var(--done-ring); }


.card.together { padding: 0; }
.together > .lead { padding: 12px var(--pad) 4px; }
.together ul.rows > li { grid-template-columns: minmax(118px, max-content) minmax(0, 1fr); align-items: start; font-size: var(--text-sm); }
.together .who { display: flex; flex-wrap: wrap; gap: 3px; align-items: center; }
.together .who em { font-style: normal; font-size: var(--text-xs); color: var(--muted); padding: 0 2px; }
@media (max-width: 759px) { .together ul.rows > li { grid-template-columns: minmax(0, 1fr); } }


.part-panel { position: sticky; top: var(--pad); display: flex; flex-direction: column; gap: 12px; }
.panel-head { display: flex; gap: 10px; align-items: flex-start; }
.panel-head .ltr { min-width: 36px; height: 36px; font-size: var(--text-sm); }
.panel-head > div { flex: 1; min-width: 0; }
.part-panel > section { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding-top: 12px; border-top: var(--rule) solid var(--line); }
.part-panel h4 { margin: 0; font-size: var(--text-xs); font-weight: var(--weight-strong); letter-spacing: var(--tracking-wide);
  text-transform: uppercase; color: var(--muted); }
.part-panel section > p { font-size: var(--text-sm); }
.part-panel .pair { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 8px; }
.part-panel .pair label { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: var(--text-xs); color: var(--muted); }
.part-panel .pair select { width: 100%; min-height: 40px; font-size: var(--text-sm); }
.part-panel .row { gap: 6px 12px; font-size: var(--text-sm); }
.part-panel .row > .meta { flex: 1 1 140px; }
.part-panel .switch-line { flex-wrap: nowrap; align-items: flex-start; font-weight: var(--weight-strong); }
.part-panel input[type="range"] { width: 100%; height: 32px; margin: 0; padding: 0; border: 0; background: none; }
.ticks { display: flex; justify-content: space-between; margin-top: -4px; font-size: var(--text-xs); color: var(--muted); }
.lane-tiles { display: flex; flex-wrap: wrap; gap: 4px; }
.lane-tiles i { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: var(--w); height: 26px;
  font-style: normal; font-size: var(--text-xs); font-weight: var(--weight-strong); color: var(--ink);
  border: var(--rule) solid var(--part); border-radius: var(--radius-xs); background: color-mix(in srgb, var(--part) 30%, var(--surface)); }
.slot-mem { display: flex; flex-direction: column; gap: 4px; }
.slot-mem > .meta { font-size: var(--text-xs); }
.speed { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.speed > div { display: flex; flex-direction: column; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--pane);
  font-size: var(--text-xs); color: var(--muted); }
.speed b { font-size: var(--text-lg); font-weight: var(--weight-strong); color: var(--ink); }
@media (max-width: 759px) {
  .part-panel { display: none; }
  .part-panel[data-sheet="open"] { display: flex; position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 6; max-height: 74dvh; overflow-y: auto; border-radius: var(--radius) var(--radius) 0 0; box-shadow: var(--shadow-pop); }
}
@media (max-width: 759px) { .part-panel .btn.small, .part-panel select { min-height: 40px; } }


.stepper { display: inline-flex; align-items: center; flex: none; overflow: hidden; background: var(--surface);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius-btn); }
.stepper button { width: 44px; height: 40px; padding: 0; border: 0; border-radius: 0; background: none; cursor: pointer; font-size: var(--text-lg); line-height: 1; }
.stepper button:hover { background: var(--hover); }
.stepper output { min-width: 44px; text-align: center; line-height: 40px; font-weight: var(--weight-strong);
  border-inline: var(--rule) solid var(--line); }


.callout { display: flex; flex-direction: column; gap: 6px; padding: calc(var(--pad) / 2) calc(var(--pad) * .75); font-size: var(--text-sm); border-left: 3px solid var(--accent); background: var(--tint); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.callout[data-state="warn"] { border-left-color: var(--warn); background: color-mix(in srgb, var(--warn) 8%, var(--surface)); }
.callout[data-state="warn"] > strong::before { content: "\26A0\00a0"; color: var(--warn); }
.callout .actions { gap: 6px; }


.moves { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 6px; max-height: 300px; overflow-y: auto; }
.moves button { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; align-items: center; padding: 8px 10px; min-height: 44px; text-align: left; font-size: var(--text-sm); cursor: pointer; border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.moves button:hover { border-color: var(--accent); }
.moves button[aria-current="true"] { border-color: var(--accent); background: var(--tint); }
.moves small { grid-column: 1 / -1; color: var(--muted); font-size: var(--text-xs); }


.previews { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.preview { display: flex; flex-direction: column; gap: 8px; padding: calc(var(--gap) * .75) calc(var(--pad) * .875); font-size: var(--text-sm); }
.preview > .row { gap: 6px 8px; }
.preview > .btn { align-self: flex-start; }
.rank { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px;
  border-radius: var(--radius-round); background: var(--ink); color: var(--surface); font-size: var(--text-xs); font-weight: var(--weight-strong); }
.mini { display: flex; flex-direction: column; gap: 6px; }
.mini-row { display: flex; gap: 8px; align-items: flex-end; }
.mini-row > .meta { flex: none; width: 64px; font-size: var(--text-xs); line-height: var(--lh-tight); }
.mini .cols { display: flex; flex-wrap: wrap; gap: 3px; align-items: flex-end; min-width: 0; }
.mini .col { display: flex; flex-direction: column-reverse; overflow: hidden; width: 15px; height: 42px; background: var(--pane);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius-xs); }
.mini .col[data-pool="ram"] { width: 34px; margin-left: 4px; }
.mini .col[data-over] { border-color: var(--warn); }
.mini .col i { display: block; flex: none; height: var(--h); background: var(--part); }
.mini-key { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: var(--text-xs); color: var(--muted); }
.mini-key span { display: inline-flex; gap: 4px; align-items: center; }
@media (max-width: 759px) { .previews { grid-template-columns: minmax(0, 1fr); } }


.try-steps ol.ledger { gap: 0 var(--gap); }
.try-steps .update { border: 0; padding: 5px 0; font-size: var(--text-sm); }
.try-steps .update[data-state="wait"] { color: var(--muted); }
.step-mark { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 20px; height: 20px;
  border: var(--border-thin) solid var(--line-strong); border-radius: var(--radius-round); font-style: normal;
  font-size: var(--text-xs); font-weight: var(--weight-strong); color: var(--surface); }
.step-mark[data-state="done"] { border-color: var(--ok); background: var(--ok); }
.step-mark[data-state="done"]::before { content: "\2713"; }
.step-mark[data-state="fail"] { border-color: var(--warn); background: var(--warn); }
.step-mark[data-state="fail"]::before { content: "\2715"; }
.try-steps .ring { width: 16px; height: 16px; border-top-color: var(--accent); }






[data-part="ex"] { --part: color-mix(in srgb, var(--ink) 72%, var(--surface)); --part-ink: var(--surface); }
[data-part="ti"] { --part: color-mix(in srgb, var(--ink) 50%, var(--surface)); --part-ink: var(--surface); }
[data-part="j"] { --part: color-mix(in srgb, var(--ink) 22%, var(--surface)); --part-ink: var(--ink); }


.slot-none { padding: 3px 8px; border: var(--rule) dashed var(--line-strong); border-radius: var(--radius-xs);
  font-size: var(--text-xs); color: var(--muted); }


.part[data-state="off"] { border-style: dashed; box-shadow: none; background: var(--pane); color: var(--muted); }
.part[data-state="off"] .ltr { background: var(--line-strong); color: var(--ink); }


.slot > .actions { gap: 8px; }


button.part[data-dragging] { cursor: grabbing; outline: var(--ring) solid var(--accent); }
.slot[data-drop] { outline: var(--ring) dashed var(--muted); outline-offset: -2px; border-radius: var(--radius); }
.slot[data-drop="move"] { outline-color: var(--accent); }
.slot .drop-says { font-size: var(--text-xs); }
.machine > header .badge { vertical-align: middle; }


.found > .lead { padding: 12px var(--pad) 4px; }
ul.rows.found > li { grid-template-columns: minmax(0, 1fr) max-content; font-size: var(--text-sm); }
ul.rows.found .end input { width: 170px; }
@media (max-width: 759px) {
  ul.rows.found > li { grid-template-columns: minmax(0, 1fr); }
  ul.rows.found .end { justify-self: start; flex-wrap: wrap; }
}




.bar-tip { position: relative; display: block; border-radius: var(--radius-xs); }
.bar-tip[data-tip]::after { left: 0; translate: none; }



.card:has(> .card-head.lined), .card:has(> .card-foot), .card:has(> .cat) { padding: 0; overflow: hidden; }
.card-head.lined { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: calc(var(--gap) * .75) var(--pad);
  border-bottom: var(--rule) solid var(--line); }
.card-head.lined small, .what small { display: block; color: var(--muted); font-size: var(--text-sm); font-weight: normal; }
.card-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px;
  padding: calc(var(--gap) * .75) var(--pad); border-top: var(--rule) solid var(--line); font-size: var(--text-sm); }
.card-foot p { margin: 0; }

.card:has(> .card-head.lined) > :is(p, form):not(.card-foot) { padding-inline: var(--pad); }
.card:has(> .card-head.lined) > :is(p, form):last-child { padding-bottom: var(--pad); }
.grid2 > .full { grid-column: 1 / -1; }


.badge.fit::before { width: auto; height: auto; background: none; border-radius: 0; line-height: 1; }
.badge.fit[data-state="ok"]::before { content: "\2713"; color: var(--ok); }
.badge.fit[data-state="warn"]::before { content: "\25D0"; color: var(--warn); }
.badge.fit[data-state="paper"] { background: var(--surface); color: var(--muted); box-shadow: inset 0 0 0 var(--rule) var(--line-strong); }
.badge.fit[data-state="paper"]::before { content: "\2715"; color: var(--muted); }


.hw { font-size: var(--text-sm); gap: 8px 14px; padding: 10px 14px; }
.hw svg { flex: none; width: 20px; height: 20px; fill: none; stroke: var(--accent); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.hw > .btn { margin-left: auto; }
.hw > span { flex: 1 1 0; min-width: 0; }  
.seg small { display: block; font-size: var(--text-xs); font-weight: normal; color: var(--muted); }
.countline { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.countline b { font-size: var(--text-lg); font-weight: var(--weight-strong); }
.srcline { max-width: none; }
.srcline strong { color: var(--ink); font-weight: var(--weight-strong); }


.recs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.recs > .card { padding: calc(var(--gap) * .75) calc(var(--pad) * .875); gap: 6px; font-size: var(--text-sm); }
.recs > .card > strong { font-size: var(--text-base); }
.recs .figs { display: flex; flex-wrap: wrap; gap: 4px 12px; color: var(--muted); font-size: var(--text-xs); }
.recs .figs b { font-size: var(--text-sm); color: var(--ink); font-weight: var(--weight-strong); }
.recs .why { margin-top: auto; }
@media (max-width: 759px) {
  .recs { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 80%; overflow-x: auto;
    scroll-snap-type: x mandatory; padding-bottom: 6px; }
  .recs > .card { scroll-snap-align: start; }
}


.listbar { gap: 8px 12px; }
.listbar input[type="search"] { flex: 1 1 280px; }
.listbar label { display: flex; align-items: center; gap: 8px; font-size: var(--text-sm); color: var(--muted); }
.filters { background: var(--pane); border: var(--rule) solid var(--line); border-radius: var(--radius); padding: 4px 14px 12px; }
.filters > summary { font-weight: var(--weight-strong); }
.filters[open] > summary { margin-bottom: 4px; }
.filters > summary .meta { font-weight: normal; }
.fgrid { display: grid; grid-template-columns: 1fr 1.5fr 1fr 1fr; gap: 12px 20px; }
.fgrid legend { font-size: var(--text-xs); color: var(--muted); letter-spacing: .06em; text-transform: uppercase; padding-bottom: 2px; }
.fgrid .choice { font-size: var(--text-sm); min-height: 32px; }
.fgrid .said { margin: 4px 0 0; padding: 8px 10px; background: var(--surface); border: var(--rule) solid var(--line);
  border-radius: var(--radius-sm); font-size: var(--text-xs); }
@media (max-width: 759px) {
  .fgrid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .fgrid .wide { grid-column: 1 / -1; }
}


.pager { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.pager .pages { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.pager .pages a, .pager .pages [aria-current="page"] { display: inline-flex; align-items: center; justify-content: center;
  min-width: 32px; min-height: 32px; padding: 0 6px; border-radius: var(--radius-sm); font-size: var(--text-sm); }
.pager .pages a { color: var(--ink); text-decoration: none; border: var(--rule) solid var(--line); }
.pager .pages a:hover { background: var(--pane); }
.pager .pages [aria-current="page"] { background: var(--accent); color: var(--accent-ink); font-weight: var(--weight-strong); }
.pager > .meta { margin-left: auto; }
@media (max-width: 759px) { .pager > .meta { margin-left: 0; flex-basis: 100%; } }


.cat, .kids { list-style: none; margin: 0; padding: 0; max-width: none; }
.cat > li + li, .kids > li + li { border-top: var(--rule) solid var(--line); }
.cat-h, .fam { display: grid; grid-template-columns: minmax(0, 2.1fr) 122px minmax(0, 1.5fr) 88px 100px 80px 96px;
  gap: 6px 12px; align-items: center; }
.cat-h { font-size: var(--text-xs); color: var(--muted); font-weight: var(--weight-strong); padding: 8px var(--pad);
  border-bottom: var(--rule) solid var(--line); }
.cat-h small { display: block; font-size: inherit; font-weight: normal; }
.fam { padding: 10px var(--pad); }
.cat details > summary.fam { list-style: none; margin: 0; font-size: inherit; font-weight: inherit; }
.cat details > summary.fam::-webkit-details-marker { display: none; }
.cat details > summary.fam:hover { color: inherit; background: var(--hover); }
.fam .nm { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.fam small { display: block; color: var(--muted); font-size: var(--text-xs); line-height: 1.3; }
.tg { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; text-align: left;
  font-weight: var(--weight-strong); font-size: var(--text-base); cursor: pointer; }
.tg svg { flex: none; width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round; transition: transform var(--tick) var(--ease); }
details[open] > summary .tg svg, .tg[aria-expanded="true"] svg { transform: rotate(90deg); }
.fam .c { font-size: var(--text-sm); min-width: 0; }
.fam .c b { font-weight: var(--weight-strong); }
.fam .ft { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.fam .q select { max-width: 100%; }
.kids { padding-bottom: 6px; background: color-mix(in srgb, var(--pane) 55%, var(--surface)); }
.kids .fam .nm { padding-left: 24px; }
.kids .tg { font-size: var(--text-sm); }
.kids > li.open { box-shadow: inset calc(var(--rule) * 3) 0 0 var(--accent); background: var(--here); }
.cat .none { padding: 10px var(--pad); margin: 0; }
.detail { margin: 2px var(--pad) 10px 40px; }
.detail h3 { margin-bottom: 6px; font-family: var(--font-ui); font-size: var(--text-xs); font-weight: var(--weight-strong);
  letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.detail p, .detail li { font-size: var(--text-sm); }
.detail p, .detail ul { margin-bottom: 0; }
.detail ul { padding-left: 1.1em; }
.detail .bar { margin: 6px 0 4px; }
@media (max-width: 759px) {
  .cat-h { display: none; }
  .fam { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 10px 12px; gap: 8px 10px; }
  .fam .nm { grid-column: 1 / -1; }
  .fam .q { grid-column: 1; }
  .fam .ft { grid-column: 2 / 4; }
  .fam .lc { grid-column: 1 / -1; }
  .kids .fam .nm { padding-left: 12px; }
  .detail { margin: 2px 8px 10px; }
}


.approval { border: calc(var(--rule) * 2) solid var(--done-ring); background: var(--tint); border-radius: var(--radius);
  padding: calc(var(--pad) * .875) var(--pad); display: flex; flex-direction: column; gap: 8px; font-size: var(--text-sm); }
.approval .who { font-size: var(--text-xs); color: var(--muted); }
.approval strong { font-size: var(--text-base); }
.approval ul { margin: 0; padding-left: 1.1em; max-width: none; }


ul.rows > li.trow { grid-template-columns: minmax(0, 1fr) max-content; }
ul.rows > li.trow.sw { grid-template-columns: minmax(0, 1fr) max-content max-content; }
ul.rows .what strong { font-size: var(--text-sm); }
.trow .end { flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
@media (max-width: 759px) {
  ul.rows > li.trow { grid-template-columns: minmax(0, 1fr); }
  .trow .end { justify-self: start; justify-content: flex-start; }
  ul.rows > li.trow.sw { grid-template-columns: minmax(0, 1fr) max-content; }
  ul.rows > li.trow.sw > select { grid-column: 1; grid-row: 2; justify-self: start; }
  ul.rows > li.trow.sw > .toggle { grid-column: 2; grid-row: 1; }
}




.legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0; max-width: none;
  font-size: var(--text-xs); color: var(--muted); }
label.f { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: var(--text-sm); font-weight: var(--weight-medium); }
label.f input { width: 100%; box-sizing: border-box; }
label.f small { color: var(--muted); font-size: var(--text-xs); font-weight: normal; }
a.skills { display: flex; align-items: center; gap: 14px; color: inherit; }
a.skills svg { flex: none; width: 24px; height: 24px; fill: none; stroke: var(--accent); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
a.skills .end { margin-left: auto; color: var(--muted); font-size: var(--text-sm); white-space: nowrap; }
.row > .what { flex: 1 1 0; min-width: 0; }
.who-list { display: flex; flex-direction: column; }
.who-list .choice { min-height: 40px; font-size: var(--text-sm); color: var(--muted); }


ul.rows > li.dl { grid-template-columns: minmax(0, 1fr) max-content; gap: 8px 16px; padding-block: 12px; }
.dl > .prog, .dl > .words { grid-column: 1 / -1; }
.dl .prog { display: flex; flex-direction: column; gap: 4px; }
ul.rows .dl .what .meta { display: inline; }
.dl .prog p, .dl .words { margin: 0; max-width: none; }
.dl .actions { gap: 8px; justify-content: flex-end; }
.words { font-size: var(--text-sm); padding: 8px 12px; border-left: calc(var(--rule) * 3) solid var(--line-strong); background: var(--pane); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.words[data-state="bad"] { border-left-color: var(--warn); background: color-mix(in srgb, var(--warn) 8%, var(--surface)); }
.words[data-state="good"] { border-left-color: var(--ok); background: color-mix(in srgb, var(--ok) 8%, var(--surface)); }

.confirm-window.add-file { width: 100%; max-width: 520px; max-height: 100%; overflow: auto; }
.confirm-window.add-file > form { gap: 12px; } 
.af-path { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; }
.af-path .f { flex: 1 1 260px; }
.af-path input.mono { font-size: var(--text-sm); }
.add-file .words { margin: 0; overflow-wrap: anywhere; }
ul.rows .dl .where, ul.rows .dl .what small { overflow-wrap: anywhere; }
ul.rows .dl .where, .dl > details.file { grid-column: 1 / -1; margin: 0; } 
@media (max-width: 759px) {
  ul.rows > li.dl { grid-template-columns: minmax(0, 1fr); }
  .dl .actions { justify-content: flex-start; }
}


@media (min-width: 760px) {
  .card-head.lined { flex-wrap: nowrap; }
  .card-head.lined > :first-child { flex: 1 1 0; }
  .card-head.lined > :not(:first-child) { flex: none; }
  .grid.jobs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
#skills-add form.row > input { flex: 1 1 280px; }


ul.acks { list-style: none; margin: 0; padding: 0; max-width: none; }
ul.acks > li + li { border-top: var(--rule) solid var(--line); }
ul.acks label { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 2px 10px; align-items: start;
  min-height: 44px; padding-block: 10px; box-sizing: border-box; cursor: pointer; font-size: var(--text-sm); }
ul.acks label > input { grid-row: span 2; }
ul.acks label > strong { display: flex; align-items: center; min-height: var(--touch); }
ul.acks label small { color: var(--muted); font-size: var(--text-xs); overflow-wrap: anywhere; }


ul.rows > li.trow > .confirm { grid-column: 1 / -1; }


#skill-review .mono, #skill-review details > summary, #skills[data-quarantine] .mono,
  #skills[data-quarantine] details > summary { font-size: var(--text-sm); }
#skill-review pre.log, #skills[data-quarantine] pre.log { margin: 8px 0 0; padding: 8px 12px; border: var(--rule) solid var(--line-strong);
  border-radius: var(--radius-sm); background: var(--pane); }
#skill-review .badge[data-state="warn"], #skills[data-quarantine] .badge[data-state="warn"] { box-shadow: inset 0 0 0 var(--rule) currentColor; }
#skills[data-quarantine] .legend { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 10px; align-items: baseline; }
ul.acks input[type="checkbox"] { appearance: none; display: grid; place-content: center; width: var(--touch); height: var(--touch);
  box-sizing: border-box; border: calc(var(--rule) * 2) solid var(--field); border-radius: var(--radius-xs); background: var(--surface); }
ul.acks input[type="checkbox"]:checked { border-color: var(--accent); background: var(--accent); }
ul.acks input[type="checkbox"]:checked::after { content: ""; width: 6px; height: 11px; margin-top: -2px; rotate: 45deg;
  border: solid var(--accent-ink); border-width: 0 2.5px 2.5px 0; }
ul.acks input[type="checkbox"]:disabled { border-color: var(--line-strong); background: var(--hover); cursor: default; }
ul.acks input[type="checkbox"]:disabled:checked { border-color: var(--line-strong); background: var(--line-strong); }
@media (max-width: 759px) {
  #skill-review .btn, #skills[data-quarantine] .btn, #skills[data-quarantine] input:not([type="checkbox"]), #skill-review details > summary, #skills[data-quarantine] details > summary,
    #skills[data-quarantine] ul.rows .confirm a, #skills[data-quarantine] ul.rows .confirm button { min-height: 44px; box-sizing: border-box; }
  #skill-review details > summary, #skills[data-quarantine] details > summary { padding-block: 10px; }
  #skill-review nav a, #skills[data-quarantine] nav a, #skills[data-quarantine] ul.rows .what a { display: inline-flex; align-items: center; min-height: 44px; }
}





.view-switch { gap: 6px 14px; }
.view-switch .seg { max-width: 100%; box-sizing: border-box; }
.view-switch .seg button { flex: 1 1 auto; white-space: normal; text-align: center; line-height: var(--lh-tight); }
.view-switch > p { flex: 1 1 260px; margin: 0; max-width: none; }


.launch-bar { display: flex; flex-direction: column; gap: 10px; border-color: var(--done-ring); }

.launch-top { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.launch-says { display: flex; flex-direction: column; gap: 4px; min-width: 0; align-self: stretch; }
.launch-says > strong { font-size: var(--text-base); }
.launch-says .meta { font-size: var(--text-sm); }
.launch-top > .actions { gap: 8px; }
.start-from { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding-top: 10px;
  border-top: var(--rule) solid var(--line); font-size: var(--text-sm); }
.start-from .seg { max-width: 100%; flex-wrap: wrap; }


.places { gap: 20px; container-type: inline-size; }
.place-group { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.group-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.group-head h3 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); }
.group-head > p { flex: 1 1 220px; margin: 0; max-width: none; font-size: var(--text-sm); color: var(--muted); }
.group-head > .btn, .group-head > .badge { margin-left: auto; }
.group-none { margin: 0; padding: 10px 14px; font-size: var(--text-sm); color: var(--muted); max-width: none;
  border: var(--rule) dashed var(--line-strong); border-radius: var(--radius); }


.card.place { padding: 0; overflow: hidden; }
.place-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 6px 14px;
  padding: 12px 14px 10px; border-bottom: var(--rule) solid var(--line); }
.place-head > div:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 260px; }
.place-head h4 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); line-height: var(--lh-tight); }
.place-state { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: var(--text-xs); }
.place-state a { font-size: var(--text-xs); }
.sees { margin: 0; max-width: none; font-size: var(--text-sm); color: var(--muted); }
.sees b { color: var(--ink); font-weight: var(--weight-medium); }
.place-foot { margin: 0; padding: 8px 14px 12px; max-width: none; font-size: var(--text-xs); color: var(--muted);
  border-top: var(--rule) solid var(--line); }
.place-foot .actions { gap: 8px; margin-top: 6px; }
.place-body { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; font-size: var(--text-sm); }
.place-body .kv { grid-template-columns: minmax(96px, max-content) minmax(0, 1fr); gap: 4px 14px; font-size: var(--text-sm); }
.place-body .kv dd { overflow-wrap: anywhere; }
.place-body .slot-parts { gap: 6px; }
@media (max-width: 759px) { .place-body .kv { grid-template-columns: minmax(0, 1fr); gap: 0; } .place-body .kv dd { margin-bottom: 6px; } }


.pslots { list-style: none; margin: 0; padding: 0; max-width: none; }
.pslot { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 236px; gap: 8px 18px; padding: 12px 14px; }
.pslot + .pslot { border-top: var(--rule) solid var(--line); }
.pslot-main { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pslot-sum { margin: 0; max-width: none; font-size: var(--text-sm); color: var(--muted); }
.pslot-sum b { color: var(--ink); font-weight: var(--weight-strong); }
.pslot .membar { height: 22px; }
.pslot-fig-over { color: var(--ink); font-weight: var(--weight-strong); }

@container (max-width: 560px) { .pslot { grid-template-columns: minmax(0, 1fr); } }


.membar .x { background: repeating-linear-gradient(90deg, var(--part) 0 3px, color-mix(in srgb, var(--part) 45%, var(--surface)) 3px 6px); }


.bar-says { list-style: none; margin: 0; padding: 0; max-width: none; display: flex; flex-direction: column; gap: 2px;
  font-size: var(--text-sm); }
.bar-says > li { display: grid; grid-template-columns: 18px minmax(0, 1fr) max-content; gap: 0 8px; align-items: start; }
.bar-says > li > i { margin-top: 9px; width: 18px; height: 10px; box-sizing: border-box; border-radius: var(--radius-xs);
  border: var(--rule) solid var(--line-strong); }
.bar-says > li > .num { padding-top: 4px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.bar-says > li > span:not(.num) { padding-top: 4px; min-width: 0; }
.bar-says [data-kind="model"] { background: var(--part); }
.bar-says [data-kind="experts"] { background: repeating-linear-gradient(90deg, var(--part) 0 2px, color-mix(in srgb, var(--part) 45%, var(--surface)) 2px 4px); }
.bar-says [data-kind="memory"] { background: color-mix(in srgb, var(--part) 32%, var(--surface)); }
.bar-says [data-kind="other"] { background: repeating-linear-gradient(135deg, var(--line-strong) 0 2px, transparent 2px 5px); }
.bar-says [data-kind="free"] { background: var(--pane); }
.bar-says [data-kind="keep"] { border-left: var(--border-thin) solid var(--warn);
  background: repeating-linear-gradient(45deg, color-mix(in srgb, var(--warn) 30%, transparent) 0 2px, transparent 2px 5px); }


.pslot .part small { white-space: normal; }

.pslot .part[aria-pressed="true"] small { color: var(--ink); }


.card.who { padding: 0; overflow: hidden; }
.who > .lead { padding: 12px 14px 4px; }
.who > p { margin: 0; padding: 0 14px 8px; max-width: none; font-size: var(--text-sm); }
ul.rows.jobs-list > li { grid-template-columns: minmax(84px, max-content) minmax(0, 1fr); gap: 2px 12px; align-items: start;
  padding: 10px 14px; font-size: var(--text-sm); }
ul.rows.jobs-list .job { font-weight: var(--weight-strong); }
ul.rows.jobs-list .what small { font-size: var(--text-xs); }
ul.rows.jobs-list select { max-width: 100%; min-height: 36px; font-size: var(--text-sm); }
ol.fallbacks { margin: 6px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; max-width: none; }
ol.fallbacks > li { display: grid; grid-template-columns: 22px minmax(0, 1fr) max-content; gap: 6px; align-items: center;
  padding: 4px 6px 4px 8px; border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
ol.fallbacks .n { font-size: var(--text-xs); color: var(--muted); font-variant-numeric: tabular-nums; }
ol.fallbacks .end { display: inline-flex; gap: 2px; }
ol.fallbacks .end .btn { min-width: 36px; padding-inline: 6px; }
@media (max-width: 759px) { ul.rows.jobs-list > li { grid-template-columns: minmax(0, 1fr); } }


.side { display: flex; flex-direction: column; gap: var(--gap); min-width: 0; }
.card.tray { padding: 0; overflow: hidden; }
.tray > .lead { padding: 12px 14px 4px; }
.tray > p { margin: 0; padding: 0 14px 10px; max-width: none; font-size: var(--text-sm); color: var(--muted); }
ul.rows.tray-list > li { grid-template-columns: 16px minmax(0, 1fr) max-content; gap: 2px 10px; align-items: center;
  padding: 8px 14px; font-size: var(--text-sm); }
ul.rows.tray-list .grip { width: 16px; height: 20px; cursor: grab; color: var(--muted);
  background: radial-gradient(circle, currentColor 1.2px, transparent 1.6px) 0 0 / 8px 6px; }
ul.rows.tray-list .what small { font-size: var(--text-xs); }
ul.rows.tray-list > li[data-dragging] { outline: var(--ring) solid var(--accent); outline-offset: -2px; background: var(--here); }
ul.rows.tray-list > li[data-dragging] .grip { cursor: grabbing; }
ul.rows.tray-list > li > .moves-wrap { grid-column: 1 / -1; padding-top: 6px; }

ul.rows.tray-list.tray-others > li { grid-template-columns: minmax(0, 1fr); }

ul.rows.tray-list:not(.tray-others) > li > .what:first-child { grid-column: 2; }

@media (max-width: 759px), (pointer: coarse) { ul.rows.tray-list > li > .grip { display: none; }
  ul.rows.tray-list:not(.tray-others) > li { grid-template-columns: minmax(0, 1fr) max-content; }
  ul.rows.tray-list:not(.tray-others) > li > .what:first-child { grid-column: 1; }
  ul.rows.tray-list .end .btn { min-block-size: 44px; } }


.drag-ghost { position: fixed; left: 0; top: 0; z-index: 60; pointer-events: none; max-width: 240px; padding: 6px 10px;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: var(--text-sm); font-weight: var(--weight-medium);
  color: var(--ink); background: var(--surface); border: var(--rule) solid var(--accent); border-radius: var(--radius-sm);
  box-shadow: var(--shadow-pop); }


ul.placed-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
ul.placed-list > li { display: inline-flex; align-items: center; gap: 6px; min-width: 0; padding: 2px 2px 2px 10px;
  font-size: var(--text-sm); border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
ul.placed-list > li > span { min-width: 0; overflow-wrap: anywhere; }


.pslot[data-drop] { outline: var(--ring) dashed var(--accent); outline-offset: -3px; border-radius: var(--radius-sm); background: var(--here); }
.pslot[data-drop="refuse"] { outline-color: var(--warn); background: color-mix(in srgb, var(--warn) 6%, var(--surface)); }
.pslot .drop-says { grid-column: 1 / -1; margin: 0; max-width: none; font-size: var(--text-sm); font-weight: var(--weight-medium); }


.speed-pick { display: flex; flex-direction: column; gap: 6px; }
.speed-pick label { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 2px 8px; align-items: start; padding: 8px 10px;
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); font-size: var(--text-sm); cursor: pointer; }
.speed-pick label:has(input:checked) { border-color: var(--accent); background: var(--tint); }
.speed-pick input { margin: 3px 0 0; }
.speed-pick small { grid-column: 2; color: var(--muted); font-size: var(--text-xs); }
.speed-pick b { font-weight: var(--weight-strong); }
.speed-pick label:has(input:checked) small { color: var(--tint-ink); }

.speed-pick .pick { display: flex; flex-direction: column; gap: 2px; }
.speed-pick .pick > form > button { display: grid; gap: 2px; width: 100%; padding: 8px 10px; text-align: start; font: inherit;
  font-size: var(--text-sm); color: inherit; background: none; border: var(--rule) solid var(--line); border-radius: var(--radius-sm); cursor: pointer; }
.speed-pick .pick > form > button[aria-pressed="true"] { border-color: var(--accent); background: var(--tint); }
.speed-pick .pick > form > button[aria-pressed="true"] small { color: var(--tint-ink); }


.pieces { list-style: none; margin: 0; padding: 0; max-width: none; display: flex; flex-direction: column; gap: 6px; font-size: var(--text-sm); }
.pieces > li { display: grid; grid-template-columns: 18px minmax(0, 1fr) max-content; gap: 2px 8px; align-items: center; }
.pieces > li > i { width: 18px; height: 10px; box-sizing: border-box; border-radius: var(--radius-xs); border: var(--rule) solid var(--line-strong); }
.pieces [data-kind="model"] { background: var(--part); }
.pieces [data-kind="experts"] { background: repeating-linear-gradient(90deg, var(--part) 0 2px, color-mix(in srgb, var(--part) 45%, var(--surface)) 2px 4px); }
.pieces [data-kind="memory"] { background: color-mix(in srgb, var(--part) 32%, var(--surface)); }
.pieces .num { white-space: nowrap; }
.pieces > li > .stepper, .pieces > li > p { grid-column: 2 / -1; }
.pieces > li > p { margin: 0; font-size: var(--text-xs); color: var(--muted); }


.place-group[data-held] .group-none { border-style: dotted; }


.stepper button:not(:disabled):active { background: var(--press); }
.stepper button:disabled, .stepper button:disabled:hover { background: none; }
.stepper button[data-fit="tight"] { color: var(--warn); }
.part-panel .row { justify-content: space-between; }
.part-panel form.actions { margin: 0; }


.part-panel .engine p { margin: 0; }
.part-panel .engine .eng { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.part-panel .engine .now { display: flex; align-items: center; gap: 8px; }
.compare { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.compare > div { display: grid; gap: 4px; align-content: start; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--bg); }  
.compare > div[data-faster] { background: var(--here); }
.compare b.big { font-size: var(--text-lg); font-weight: var(--weight-strong); }
.compare small { color: var(--muted); font-size: var(--text-sm); }
.switched { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }



.composer .effort-nudge { margin: 0 0 6px; padding: 0 4px; font-size: var(--text-xs); }

.composer button.pick.effort { flex: none; white-space: nowrap; }

.composer .foot { align-items: flex-end; }
.composer button.pick { flex-wrap: wrap; row-gap: 1px; }
.composer button.pick .lbl, .composer .ctx .lbl { flex-basis: 100%; display: block; font-size: 0.6875rem; line-height: 1.1;
  font-weight: normal; color: var(--muted); text-align: left; }
.composer .ctx { display: inline-flex; flex-direction: column; align-items: center; gap: 1px; }
.composer .ctx .lbl { text-align: center; }

@media (max-width: 759px) {
  .composer .ctx .lbl { display: none; }
}

.sheet-shade { position: fixed; inset: 0; z-index: 12; background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
.settings-sheet { position: fixed; z-index: 13; left: 50%; top: 50%; transform: translate(-50%, -50%); box-sizing: border-box;
  width: min(420px, calc(100% - 2 * var(--side))); display: flex; flex-direction: column; gap: 4px; padding: var(--pad); }
.settings-sheet .card-head { padding: 0 4px 4px; }
.settings-sheet .set-row { display: flex; align-items: center; gap: 12px; width: 100%; box-sizing: border-box; min-height: var(--touch);
  padding: 8px 10px; border: 0; border-radius: var(--radius-sm); background: none; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.settings-sheet .set-row:hover { background: var(--hover); }
.settings-sheet .set-row > span:first-child { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.settings-sheet .set-row b { font-weight: var(--weight-medium); }
.settings-sheet .set-row small { color: var(--muted); font-size: var(--text-xs); }
.settings-sheet .set-row .val { flex: none; color: var(--muted); font-size: var(--text-sm); }
.settings-sheet .set-row svg { flex: none; width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.settings-sheet .done { align-self: stretch; margin-top: 4px; }
@media (max-width: 759px) {
  .settings-sheet { left: 0; right: 0; bottom: 0; top: auto; transform: none; width: auto; max-height: 74dvh; overflow-y: auto;
    border-radius: var(--radius) var(--radius) 0 0; }
}


.scan { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: var(--gap); align-items: start; }
.scan > .qr { width: 100%; }
@media (max-width: 759px) {
  .scan { grid-template-columns: minmax(0, 1fr); }
  .scan > .qr { width: min(100%, 16rem); }
}


ul.rows .kind { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round; color: var(--muted); }
ul.rows .what b { font-weight: var(--weight-medium); }


.done-mark { width: var(--touch); height: var(--touch); border-radius: var(--radius-round); background: var(--done-fill);
  border: var(--rule) solid var(--done-ring); display: grid; place-items: center; }
.done-mark svg { width: 22px; height: 22px; fill: none; stroke: var(--accent); stroke-width: 2.2; stroke-linecap: round;
  stroke-linejoin: round; }



.notify .track { position: relative; height: 44px; margin: 0 22px; }
.notify .track > .line { position: absolute; left: 0; right: 0; top: 20px; height: 4px; border-radius: var(--radius-pill); background: var(--line-strong); }
.notify .track > .span { position: absolute; top: 20px; height: 4px; left: var(--from); right: calc(100% - var(--to)); border-radius: var(--radius-pill); background: var(--accent); }
.notify .knob { position: absolute; top: 0; width: 44px; height: 44px; margin-left: -22px; padding: 0; border: 0; background: none; cursor: ew-resize; border-radius: var(--radius-round); }
.notify .knob::before { content: ""; position: absolute; inset: 11px; border-radius: var(--radius-round); background: var(--surface); border: 2px solid var(--accent); box-shadow: var(--shadow-btn); }
.notify .ticks { display: flex; justify-content: space-between; margin: 0 22px; font-size: var(--text-xs); color: var(--muted); }
.notify .times { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: var(--text-sm); }
.notify .times .choice { margin-left: auto; }
@media (max-width: 759px) {
  .notify .times input[type="time"] { flex: 1 1 40%; }
  .notify .times .choice { margin-left: 0; width: 100%; }
}


ul.facts.sched { list-style: none; padding: 0; max-width: none; }
.sched > .fact { grid-template-columns: minmax(0, 1.5fr) minmax(0, 3.4fr); align-items: center; padding: 10px var(--pad); }
.sched > .fact > .row { display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.4fr) minmax(0, 1.1fr) 10em; gap: 4px 14px;
  align-items: center; font-size: var(--text-sm); }
.sched .name a { font-weight: var(--weight-medium); }
.sched small { color: var(--muted); font-size: var(--text-sm); }
.sched .where, .sched .next { color: var(--muted); }
.sched > .fact > .hook { grid-column: 1 / -1; }
.sched > .fact[data-paused] .name a, .sched > .fact[data-paused] .last { color: var(--muted); }
@media (max-width: 759px) { .sched > .fact, .sched > .fact > .row { grid-template-columns: minmax(0, 1fr); } }


.series { letter-spacing: 3px; white-space: nowrap; }
.series.meta { letter-spacing: normal; white-space: normal; }


.card > h3.day { margin: 0; padding: calc(var(--gap) * .625) var(--pad) 0; font-family: var(--font-ui); font-size: var(--text-xs); color: var(--muted);
  font-weight: var(--weight-strong); letter-spacing: .06em; text-transform: uppercase; }
.switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-weight: var(--weight-medium); }
.switch input { appearance: none; -webkit-appearance: none; flex: none; width: 40px; height: 24px; border-radius: var(--radius-pill); background: var(--line-strong); position: relative; cursor: pointer; }
.switch input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: var(--radius-round); background: var(--surface); box-shadow: var(--shadow-btn); transition: left var(--quick) var(--ease); }
.switch input:checked { background: var(--accent); }
.switch input:checked::after { left: 19px; }


ul.goes { columns: 2; column-gap: 24px; color: var(--muted); font-size: var(--text-sm); max-width: none; }
ul.goes li { break-inside: avoid; }
@media (max-width: 759px) { ul.goes { columns: 1; } }


.nav [data-icon="bug"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 7.5a3 3 0 0 1 6 0M8 9h8v5.5a4 4 0 0 1-8 0zM12 11v7.5M4 12.5h4M16 12.5h4M5 7.5l3 2M19 7.5l-3 2M5 19l3.3-2.5M19 19l-3.3-2.5'/%3E%3C/svg%3E"); }
.report-over { position: fixed; inset: 0; z-index: 30; margin: 0; display: flex; align-items: flex-start; justify-content: center;
  padding: 6dvh var(--side); overflow-y: auto; background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
.report-window { display: flex; flex-direction: column; width: min(560px, 100%); max-height: 88dvh; box-sizing: border-box;
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow-pop);
  background: var(--bg); color: var(--ink); overflow: hidden; }
.report-window > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: none;
  padding: 8px 8px 8px 20px; border-bottom: var(--rule) solid var(--line); }
.report-window > header h2 { margin: 0; font-size: var(--text-lg); }
.report-window > .report-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 16px 20px 0; }
.report-window #report-files code { overflow-wrap: anywhere; }
@media (max-width: 759px) {
  .nav-foot button[data-report] { min-height: 44px; }
  .report-over { padding: 0; }
  .report-window { width: 100%; max-height: none; height: 100%; border: 0; border-radius: 0; box-shadow: none; }
  .report-window > header { padding-top: calc(8px + env(safe-area-inset-top)); }
  .report-window > .report-body { padding-inline: 16px; }
}


#memory-saved pre.log { margin: 0; padding: 8px 12px; border: var(--rule) solid var(--line); border-radius: var(--radius-sm);
  background: var(--pane); color: var(--ink); }

@media (prefers-color-scheme: dark) {
  :root:not([data-scheme="light"]) #memory-list .badge[data-state="paper"] { background: var(--line); }
}
:root[data-scheme="dark"] #memory-list .badge[data-state="paper"], :root[data-scheme="deep"] #memory-list .badge[data-state="paper"] { background: var(--line); }

#memory-saved { padding: var(--pad); border-radius: var(--radius-sm); }  
#memory-saved > p:has(> .badge:first-child) { display: flex; align-items: baseline; gap: 8px; }
#memory-saved > p > .badge:first-child { flex: none; }
@media (max-width: 759px) {
  #memory-saved .btn, #memory-saved .actions a { min-height: 44px; display: inline-flex; align-items: center; }
}



.page:has(> .bar-top [aria-label="Models sections"]) { --page-max: calc(var(--column) * 1.6); }
.bar-top.head [aria-label="Models sections"] a { white-space: nowrap; }
@media (max-width: 1199px) { .bar-top.head:has([aria-label="Models sections"]) > .meta { display: none; } }
@media (max-width: 759px) {
  .bar-top.head:has([aria-label="Models sections"]) { flex-wrap: wrap; }
  .bar-top.head [aria-label="Models sections"] { order: 5; flex: 1 0 100%; box-sizing: border-box;
    grid-auto-columns: minmax(max-content, 1fr); overflow-x: auto; }
  .bar-top.head [aria-label="Models sections"] a { font-size: var(--text-xs); text-align: center; line-height: var(--lh-tight);
    display: flex; align-items: center; justify-content: center; }
}


details.decides { padding: 0; overflow: hidden; }
details.decides > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: calc(var(--gap) * .75) calc(var(--pad) * .875);
  list-style: none; cursor: pointer; }
details.decides > summary::-webkit-details-marker { display: none; }
details.decides > summary > span:first-child { flex: 1 1 260px; min-width: 0; }
details.decides > summary b { font-weight: var(--weight-strong); }
details.decides > summary .btn { margin-left: auto; }
details.decides[open] > summary { margin-bottom: 0; border-bottom: var(--rule) solid var(--line); }
details.decides > .meta, details.decides > .actions { margin: 0; padding: calc(var(--gap) * .625) calc(var(--pad) * .875); max-width: none; }
ul.rows.jobs-list .job small { display: block; font-weight: normal; font-size: var(--text-xs); color: var(--muted); }


ul.rows.models > li > .prog, ul.rows.models > li > details.file { grid-column: 1 / -1; }
ul.rows.models > li > .prog { display: flex; flex-direction: column; gap: 4px; }
ul.rows.models > li > .prog p { margin: 0; font-size: var(--text-sm); }
ul.rows.models details.file > summary { font-size: var(--text-xs); color: var(--muted); cursor: pointer; }
ul.rows.models details.file > p { margin: 4px 0 0; font-size: var(--text-xs); color: var(--muted); }

@media (min-width: 760px) { ul.rows.models.yours > li { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(13rem, max-content); }
  ul.rows.models.yours .end { justify-self: end; } }
ul.rows.models .what .where { display: block; font-size: var(--text-sm); color: var(--muted); }


.readings { display: flex; flex-wrap: wrap; gap: 2px 14px; margin: 0; padding: 0; list-style: none; max-width: none;
  font-size: var(--text-sm); color: var(--muted); font-variant-numeric: tabular-nums; }
.readings b { color: var(--ink); font-weight: var(--weight-medium); }


.options > .option[aria-disabled="true"] { color: var(--muted); cursor: not-allowed; }
.options > .option[aria-disabled="true"]:hover { background: none; }
.options > .option > span > small { display: block; font-size: var(--text-xs); color: var(--muted); font-weight: normal; }
.options > .option > span { min-width: 0; }


.place-head h3 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); line-height: var(--lh-tight); }


.use-for { display: inline-flex; flex: none; }
.use-for > .btn { white-space: nowrap; }
.use-for > .btn:first-child { border-start-end-radius: 0; border-end-end-radius: 0; }
.use-for > .btn + .btn { margin-left: -1px; padding-inline: 8px; border-start-start-radius: 0; border-end-start-radius: 0; }

.use-for svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }


ul.rows.models > li > .pop { grid-column: 1 / -1; }
.pop.list.row-acts [role="menuitem"] { width: 100%; box-sizing: border-box; border: 0; background: none; color: inherit;
  font: inherit; text-align: left; display: flex; align-items: flex-start; gap: 10px; }
.pop.list.row-acts [role="menuitem"] > span { flex: 1 1 auto; min-width: 0; }
.pop.list.row-acts [role="menuitem"] small { display: block; color: var(--muted); font-size: var(--text-xs); font-weight: normal; }
.pop.list.row-acts [role="menuitem"] > .badge { flex: none; margin-left: auto; }
.pop.list.row-acts [role="menuitem"][aria-disabled="true"] { cursor: not-allowed; }
.pop.list.row-acts [role="menuitem"] small.cost { color: var(--ink); font-weight: var(--weight-medium); }
.pop.list.row-acts hr { border: 0; border-top: var(--rule) solid var(--line); margin: 4px 0; }


ul.rows .what > .bar { display: block; margin-top: 6px; }


.source-switch { flex-wrap: wrap; gap: 6px 12px; }
.listbar { flex-wrap: nowrap; align-items: center; }
.filters-at { position: relative; flex: none; }
.filters-at svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
.filters-menu { position: absolute; z-index: 15; inset-block-start: calc(100% + 4px); inset-inline-end: 0; box-sizing: border-box;
  width: min(36rem, calc(100vw - 32px)); padding: 12px 14px; background: var(--surface); border: var(--rule) solid var(--line-strong);
  border-radius: var(--radius); box-shadow: var(--shadow-pop); text-align: left; }
.filters-menu .fgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.filters-menu .more { margin-top: 8px; }
.filters-menu > .actions { justify-content: flex-end; margin-top: 10px; }
.fam .ft .badge.fit { white-space: normal; }
@media (max-width: 759px) {
  .listbar { flex-wrap: wrap; }
  .listbar input[type="search"] { flex-basis: 100%; }
  .filters-menu { position: fixed; inset: auto 0 0; width: auto; max-height: 80vh; overflow-y: auto; border-end-start-radius: 0;
    border-end-end-radius: 0; }
  .filters-menu .fgrid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}



.run-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
.run-plan .update > div > p { margin: 2px 0 0; }
.run-plan .update > div > .badge { margin-inline-start: 6px; }
.run-plan .doing { margin-top: 4px; padding-inline-start: 10px; border-inline-start: var(--rule) solid var(--accent); color: var(--ink); }
.run-plan .your-word { margin-top: 4px; padding-inline-start: 10px; border-inline-start: var(--rule) dashed var(--line-strong); color: var(--muted); }
.step-mark[data-state="dropped"] { border-style: dashed; }
.run-plan .update[data-state="dropped"] > div > b { color: var(--muted); text-decoration: line-through; }
.run-plan ul.rows.helpers { margin-top: 8px; border: var(--rule) solid var(--line); border-radius: var(--radius); }
.run-plan > .actions { margin-top: 10px; }
.run-plan > summary .doing { display: block; margin-top: 6px; }
ul.rows .what > .seg { margin-top: 8px; } 


ul.rows > li.helpers-of { border-top: 0; padding-block-start: 0; }
ul.rows > li.helpers-of > details { grid-column: 1 / -1; padding-inline-start: var(--pad); border-inline-start: var(--rule) solid var(--line-strong); }


.page:has(.trail-view) { --page-max: 100%; }
.trail-view { display: grid; grid-template-columns: 13rem minmax(0, 1fr); background: var(--bg); border: var(--rule) solid var(--line); border-radius: var(--radius); overflow: hidden; }
.tv-top { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 10px 14px; border-bottom: var(--rule) solid var(--line); }

.tv-name { display: flex; flex-direction: column; }
.tv-name small { color: var(--muted); font-size: var(--text-xs); }
.tv-state, .tv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tv-actions { margin-inline-start: auto; }

.tv-files { display: flex; flex-direction: column; min-width: 0; padding: 10px 0; border-inline-end: var(--rule) solid var(--line); font-size: var(--text-sm); }
.tv-files > summary { display: none; }
.tv-files > .tv-root { margin: 0 14px 6px; color: var(--muted); font-size: var(--text-xs); font-weight: var(--weight-strong); letter-spacing: var(--tracking-wide); text-transform: uppercase; }
.tv-tree, .tv-tree ul { list-style: none; margin: 0; padding: 0; }
.tv-tree ul { padding-inline-start: 14px; }
.tv-tree li > span { display: flex; justify-content: space-between; gap: 8px; padding: 3px 14px; }
.tv-tree .dir > span::before { content: "\203A"; width: 10px; color: var(--muted); }
.tv-tree .dir[data-open] > span::before { content: "\2304"; }
.tv-tree .dir > span { justify-content: flex-start; }
.tv-tree .dir > span > .age { margin-inline-start: auto; }

.tv-tree li:not(.dir) > span { padding-inline-start: 32px; }
.tv-tree .age { color: var(--muted); font-size: var(--text-xs); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tv-tree [data-recent], .tv-tree [data-recent] .age { color: var(--accent-text); }
.tv-tree [data-recent="since"], .tv-tree [data-recent="since"] .age { color: var(--warn); }
.tv-legend { margin: auto 14px 0; padding-top: 10px; color: var(--muted); font-size: var(--text-xs); }
.tv-legend i { display: inline-block; width: 6px; height: 6px; margin-inline-end: 6px; background: var(--accent); border-radius: var(--radius-round); }

.tv-canvas { --fit-top: 120px; --fit-bottom: 44px; position: relative; height: 36rem; overflow: hidden; touch-action: none; cursor: grab;
  background: var(--bg); -webkit-user-select: none; user-select: none; } 
.tv-dots { position: absolute; inset: 0; width: 100%; height: 100%; }
.tv-dots circle { fill: var(--line-strong); }
.tv-stage { position: absolute; inset-block-start: 0; inset-inline-start: 0; width: var(--w); height: var(--h); transform-origin: 0 0; }
.tv-edges { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: none; stroke: var(--line-strong); stroke-width: 1.5; }
.tv-edges marker path { fill: var(--line-strong); stroke: none; }
.tv-edges .on { stroke: var(--accent); stroke-dasharray: 5 4; }
.tv-edges .gone { stroke: var(--line); stroke-dasharray: 2 4; }
.tv-edges circle { fill: var(--accent); stroke: none; }
.tv-world { list-style: none; margin: 0; padding: 0; max-width: none; }

.tv-world > li { position: absolute; inset-inline-start: var(--x); inset-block-start: var(--y); box-sizing: border-box; width: 184px; }
.tv-node { display: flex; flex-direction: column; height: 232px; padding: 10px 12px 0; background: var(--surface); border: var(--rule) solid var(--line-strong); border-radius: var(--radius); font-size: var(--text-sm); }
.tv-node[data-state="run"] { border-color: var(--accent); outline: var(--rule) solid var(--accent); outline-offset: 3px; animation: tv-pulse calc(var(--blink) * 2) var(--ease) infinite; }
@keyframes tv-pulse { 50% { outline-offset: 6px; outline-color: var(--line); } }
.tv-node[data-state="dropped"] { color: var(--muted); background: var(--bg); border-style: dashed; }
.tv-node[data-state="dropped"] b { text-decoration: line-through; }
.tv-node .tv-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 6px; }
.tv-node .tv-head .ring { width: 16px; height: 16px; border-top-color: var(--accent); }
.tv-node code { font-size: var(--text-xs); }
.tv-kick { margin: 0; color: var(--muted); font-size: var(--text-xs); overflow-wrap: anywhere; }
.tv-node b { margin-top: 4px; line-height: var(--lh-tight); }
.tv-node > .badge { align-self: flex-start; margin-top: 4px; }
.tv-count { margin: 4px 0 0; color: var(--muted); font-size: var(--text-xs); }
.tv-node meter { display: block; width: 100%; height: 3px; margin-top: 8px; appearance: none; background: var(--line); border: 0; }
.tv-node meter::-webkit-meter-bar { height: 3px; background: var(--line); border: 0; border-radius: 0; }
.tv-node meter::-webkit-meter-optimum-value { background: var(--muted); }
.tv-node meter::-moz-meter-bar { background: var(--muted); }
.tv-node[data-state="run"] meter::-webkit-meter-optimum-value { background: var(--accent); }
.tv-node[data-state="run"] meter::-moz-meter-bar { background: var(--accent); }
.tv-wrote { margin: 6px 0 0; color: var(--accent-text); font-size: var(--text-xs); text-align: start; } 
.tv-node .your-word { margin: 6px 0 0; padding-inline-start: 8px; border-inline-start: var(--rule) dashed var(--line-strong); color: var(--muted); font-size: var(--text-xs); }
.tv-node .tv-foot { margin: auto -12px 0; padding: 6px 12px; min-height: 0; background: none; border: 0; border-top: var(--rule) solid var(--line); color: var(--muted); font-size: var(--text-xs); letter-spacing: var(--tracking-wide); text-align: start; text-transform: uppercase; }
.tv-task { display: flex; align-items: center; gap: 8px; height: 46px; padding: 0 10px; background: var(--surface); border: var(--rule) solid var(--line); border-radius: var(--radius); font-size: var(--text-xs); }

.tv-task .step-mark, .tv-task .ring { flex: none; box-sizing: border-box; width: 16px; height: 16px; }
.tv-task .ring { border-top-color: var(--accent); }
.tv-task > span { min-width: 0; }
.tv-task small { display: block; color: var(--muted); }
.tv-world > [hidden], .tv-edges [hidden] { display: none; }

.tv-zoom { position: absolute; z-index: 3; inset-block-start: 12px; inset-inline-start: 12px; display: flex; align-items: center; gap: 2px; padding: 3px; background: var(--surface); border: var(--rule) solid var(--line); border-radius: var(--radius); }
.tv-agents { position: absolute; z-index: 3; inset-block-start: 12px; inset-inline-end: 12px; max-width: calc(100% - 9rem); }
.tv-agents > summary { display: none; }
.tv-agent-list { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.tv-agent { box-sizing: border-box; width: 15rem; padding: 10px 12px; background: var(--surface); border: var(--rule) solid var(--line-strong); border-radius: var(--radius); font-size: var(--text-sm); }
.tv-agent > header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 8px; }
.tv-agent > header small { color: var(--muted); font-size: var(--text-xs); }
.tv-agent > p { margin: 4px 0 0; }
.tv-agent .tool { display: flex; justify-content: space-between; gap: 8px; color: var(--accent-text); font-size: var(--text-xs); }
.tv-hints { position: absolute; z-index: 3; inset-block-end: 10px; inset-inline-start: 12px; display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; color: var(--muted); font-size: var(--text-xs); }
.tv-hints kbd { margin-inline-end: 4px; padding: 0 4px; border: var(--rule) solid var(--line); border-radius: var(--radius-xs); }
details.tv-recent { margin-top: var(--gap); }


.trail-view[data-view="list"] .tv-canvas { height: auto; overflow: visible; touch-action: auto; cursor: auto; padding: 14px; -webkit-user-select: text; user-select: text; }
.trail-view[data-view="list"] .tv-stage { position: static; width: auto; height: auto; }
.trail-view[data-view="list"] :is(.tv-dots, .tv-edges, .tv-zoom, .tv-hints) { display: none; }
.trail-view[data-view="list"] .tv-agents { position: static; max-width: none; margin-bottom: 14px; }
.trail-view[data-view="list"] .tv-agent-list { justify-content: flex-start; }
.trail-view[data-view="list"] .tv-world { display: flex; flex-direction: column; gap: 10px; }
.trail-view[data-view="list"] .tv-world > li { position: relative; width: auto; inset: auto; }
.trail-view[data-view="list"] .tv-node { height: auto; min-height: 0; }
.trail-view[data-view="list"] .tv-node .tv-foot { margin-top: 10px; }
.trail-view[data-view="list"] .tv-task { margin-inline-start: 24px; }


@media (max-width: 759px) {
  .trail-view { grid-template-columns: minmax(0, 1fr); }
  .tv-actions { margin-inline-start: 0; } 
  .tv-files { padding: 0; border-inline-end: 0; border-bottom: var(--rule) solid var(--line); }
  .tv-files > summary { display: flex; align-items: center; margin: 0; padding: 10px 14px; }
  .tv-files[open] > summary { margin-bottom: 0; } 
  .tv-files[open] { padding-bottom: 10px; }
  .tv-canvas { --fit-top: 128px; --fit-bottom: 12px; height: 30rem; }
  .tv-hints { display: none; }
  .tv-agents { inset-block-start: 72px; inset-inline-start: 12px; inset-inline-end: 12px; max-width: none; } 
  .tv-agents > summary { display: flex; align-items: center; margin: 0; padding: 6px 10px; background: var(--surface); border: var(--rule) solid var(--line-strong); border-radius: var(--radius); font-size: var(--text-xs); }
  .tv-agents[open] > summary { margin-bottom: 6px; }
  .tv-agent { width: 100%; }
}


.live-open svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.live-open[aria-expanded="true"] { background: var(--here); border-color: var(--accent); color: var(--ink); }
.run-fold > details > summary .doing { display: block; margin-top: 6px; }

@media (min-width: 760px) { .run-fold > details > summary { display: none; } }
@media (max-width: 759px) { .run-fold > .run-head { display: none; } }
#panel .trail-view { border: 0; border-radius: 0; background: none; }
@media (min-width: 760px) {
  #chat:not([data-wide="on"]) > #panel .trail-view { grid-template-columns: minmax(0, 1fr); }
  #chat:not([data-wide="on"]) > #panel .tv-files { padding: 0; border-inline-end: 0; border-bottom: var(--rule) solid var(--line); }
  #chat:not([data-wide="on"]) > #panel .tv-files > summary { display: flex; align-items: center; margin: 0; padding: 10px 14px; }
  #chat:not([data-wide="on"]) > #panel .tv-files[open] { padding-bottom: 10px; }
  #chat:not([data-wide="on"]) > #panel .tv-canvas { --fit-top: 64px; --fit-bottom: 12px; }
  #chat:not([data-wide="on"]) > #panel .tv-hints { display: none; }
  #chat:not([data-wide="on"]) > #panel .tv-actions { margin-inline-start: 0; }
  #chat:not([data-wide="on"]) > #panel .tv-agents { inset-inline-start: 8.5rem; inset-inline-end: 8px; max-width: none; }
  #chat:not([data-wide="on"]) > #panel .tv-agents > summary { display: flex; align-items: center; margin: 0; padding: 6px 10px; background: var(--surface); border: var(--rule) solid var(--line-strong); border-radius: var(--radius); font-size: var(--text-xs); }
  #chat:not([data-wide="on"]) > #panel .tv-agents[open] > summary { margin-bottom: 6px; }
  #chat:not([data-wide="on"]) > #panel .tv-agent { width: 100%; }
  #panel .tv-canvas { height: max(22rem, calc(100dvh - 15rem - var(--chrome-bar, 0px))); }
}

@media (max-width: 759px) {
  .trail-view, .live-open, #panel:has(.trail-view) #panel-bar { --touch: 44px; }
  #panel:has(.trail-view) #panel-buttons > button { width: var(--touch); height: var(--touch); }
  #panel .tv-canvas { height: max(22rem, calc(100dvh - 19rem - var(--chrome-bar, 0px))); }
}


.run-open { display: inline-flex; gap: 6px; }
ul.rows.runs .what > a { color: var(--ink); font-weight: var(--weight-medium); text-decoration: none; }
ul.rows.runs .what > a:hover { text-decoration: underline; }

ul.rows.runs .when { min-width: 4.5rem; }

.runs-pager { margin-top: var(--gap); align-items: stretch; }
.runs-pager .pages { align-items: stretch; }
.runs-pager > .meta { align-self: center; }

.runs-pager > [aria-disabled="true"] { color: var(--muted); background: none; box-shadow: none; cursor: default; }
.card.empty > p { margin: 0; }
@media (max-width: 759px) {
  .run-filter, ul.rows.runs, .runs-pager { --touch: 44px; }
  ul.rows.runs > li > .end { grid-column: 1 / -1; justify-self: start; flex-wrap: wrap; }
  .run-filter { display: grid; grid-template-columns: 1fr 1fr; }
  .run-filter > .chip { justify-content: center; min-height: var(--touch); padding-block: 0; } 
  .runs-pager { display: grid; grid-template-columns: 1fr 1fr; }
  .runs-pager > .meta { grid-column: 1 / -1; order: -2; margin: 0; }
  .runs-pager > .pages { grid-column: 1 / -1; order: -1; }
  .runs-pager .pages a, .runs-pager .pages [aria-current="page"] { min-width: var(--touch); min-height: var(--touch); }
  .runs-pager > .btn { justify-content: center; }
}



.bw-world > li { width: 148px; }
.bw-card { box-sizing: border-box; height: 104px; display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; background: var(--surface);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius); font-size: var(--text-xs); overflow: hidden; }
.bw-card[aria-current="true"] { border-color: var(--accent); outline: var(--rule) solid var(--accent); outline-offset: 3px; background: var(--here); }
.bw-card:focus-visible { outline: var(--ring) solid var(--accent); outline-offset: 2px; }
.bw-card b { font-size: var(--text-sm); line-height: var(--lh-tight); }
.bw-head { display: flex; justify-content: space-between; align-items: center; min-height: 16px; }
.bw-head .ring { width: 14px; height: 14px; border-top-color: var(--accent); }
.bw-brief { margin: 0; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bw-n { margin: auto 0 0; color: var(--muted); }
.tv-edges path.pick { stroke: var(--accent); stroke-width: 2; }
.bw-reason { position: absolute; inset-inline-start: var(--x); inset-block-start: var(--y); translate: -50% -50%; padding: 2px 8px; background: var(--ink); color: var(--bg);
  border-radius: var(--radius-sm); font-size: var(--text-xs); white-space: nowrap; }


.bw .bw-list:not([hidden]) { height: auto; overflow: visible; padding: 14px; touch-action: auto; cursor: auto; display: grid; gap: 10px; align-content: start; }


.bw-dot { position: absolute; inset-inline-start: var(--x, 0); inset-block-start: var(--y, 0); width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px;
  border-radius: var(--radius-round); background: var(--accent); z-index: 1; }
.bw-travel { inset: 0; margin: 0; offset-path: var(--path); offset-rotate: 0deg; animation: bw-travel calc(var(--blink) * 3) linear infinite; }
@keyframes bw-travel { from { offset-distance: 0%; } to { offset-distance: 100%; } }
.bw-card[data-state="saving"] { border-color: var(--accent); outline: var(--rule) solid var(--accent); outline-offset: 3px; animation: bw-pulse calc(var(--blink) * 2) var(--ease) infinite; }
@keyframes bw-pulse { 50% { outline-offset: 6px; outline-color: var(--line); } }
.tv-edges path.on { stroke: var(--accent); stroke-dasharray: 5 4; }

.bw[data-motion="off"] .bw-card, .bw[data-motion="off"] .bw-travel { animation: none; }
.bw[data-motion="off"] .bw-card[data-state="saving"] { outline-offset: 3px; }
@media screen and (prefers-reduced-motion: reduce) {
  .bw-card[data-state="saving"] { animation: none; outline-offset: 3px; }
  .bw-travel { animation: none; offset-distance: 50%; }
}


.loader { display: grid; justify-items: center; gap: var(--gap); text-align: center; padding-block: calc(var(--gap) * 3);
  max-inline-size: 36rem; margin-inline: auto; }
.loader .mark { position: relative; display: grid; place-items: center; inline-size: 56px; block-size: 56px; }
.loader .mark > i:not(.ring) { inline-size: 22px; block-size: 22px; background: var(--accent); border-radius: var(--radius-xs); }
.loader .mark > .ring { position: absolute; inset: 0; inline-size: auto; block-size: auto; border-width: 3px;
  border-top-color: var(--accent); }
.loader h3 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); }
.loader p { margin: 0; }
.loader p.meta + p.meta { margin-block-start: calc(var(--gap) * -0.5); }  
.loader .bar { inline-size: min(100%, 20rem); }
.loader .actions { justify-content: center; }

.loader.small { padding-block: calc(var(--gap) * 6); }
.loader.small .mark { inline-size: 28px; block-size: 28px; }
.loader.small .mark > i:not(.ring) { inline-size: 10px; block-size: 10px; }
.loader.small .mark > .ring { border-width: 2px; }

#live .loader { justify-items: start; text-align: start; margin-inline: 0; padding-block: var(--gap); }
#live .loader .actions { justify-content: flex-start; }

.calc { color: var(--muted); font-style: normal; white-space: nowrap; min-inline-size: 7ch; display: inline-block; }


.loader .progress { display: flex; align-items: center; gap: 6px; inline-size: min(100%, 22rem); }
.loader .progress > .bar { flex: 1 1 auto; inline-size: auto; }
.loader .progress > p { flex: 1 1 auto; }
.stop-mini { position: relative; flex: none; display: grid; place-items: center; inline-size: 26px; block-size: 26px; padding: 0;
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); background: var(--bg); color: var(--ink); cursor: pointer; }
.stop-mini svg { inline-size: 12px; block-size: 12px; fill: currentColor; }
.stop-mini:hover, .stop-mini:focus-visible { background: var(--hover); }

@media (max-width: 759px) { .stop-mini::after { content: ""; position: absolute; inset: -9px; } }

dialog.tour[data-spot] .tour-ring { border-width: 1.5px; border-radius: calc(var(--spot-radius, var(--radius)) + 4px);
  transition: top 150ms var(--ease-out), left 150ms var(--ease-out), width 150ms var(--ease-out), height 150ms var(--ease-out); }
.tour-card .copy > .btn, .tour-card .copy > .chip { flex: none; white-space: nowrap; }
.tour-card .copy { display: flex; gap: 6px; align-items: center; padding: 8px; border-radius: var(--radius-sm); background: var(--bg); }
.tour-card .copy .chip { padding: 3px 10px; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-pill); font-size: var(--text-sm); }
.tour-card .copy .chip[aria-current] { border-color: var(--accent); background: var(--here); }
.tour-card .next { inline-size: 100%; justify-content: center; }
.tour-card .after { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.tour-card .kicker-new { color: var(--accent-text); font-size: var(--text-xs); font-weight: var(--weight-strong); letter-spacing: var(--tracking-wide); text-transform: uppercase; }


.new-tile > a { display: flex; align-items: center; gap: 12px; padding: 14px var(--pad); color: var(--ink);
  text-decoration: none; border-radius: var(--radius); background: var(--here);
  box-shadow: 0 0 0 var(--rule) var(--done-ring), 0 0 18px -4px color-mix(in srgb, var(--accent) 45%, transparent); }
.new-tile > a > svg { inline-size: 20px; block-size: 20px; flex: none; stroke: var(--accent); stroke-width: 2; fill: none; }
.new-tile small { display: block; color: var(--muted); font-size: var(--text-sm); }
ul.rows > li.new-tile { display: block; grid-column: 1 / -1; padding: var(--gap); border-block-end: var(--rule) solid var(--line); }  
.empty-tile { list-style: none; margin: 0; padding: 0; }
.lead .count { color: var(--muted); font-weight: normal; margin-inline-start: 2px; }  
.lead.tools { flex-wrap: wrap; gap: 8px 12px; }
.lead.tools .find { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-inline-start: auto; }
.lead.tools input[type="search"] { inline-size: 14rem; }
.pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px var(--pad);
  border-block-start: var(--rule) solid var(--line); }
@media (max-width: 759px) { .lead.tools .find { margin-inline-start: 0; inline-size: 100%; } .lead.tools input[type="search"] { flex: 1 1 100%; inline-size: auto; } }

ul.rows .what details.fold > pre.log { margin: 4px 0 0; padding: calc(var(--pad) / 2) calc(var(--pad) * .75); border: var(--rule) solid var(--line);
  border-radius: var(--radius-sm); background: var(--pane); color: var(--ink); font-size: var(--text-xs);
  max-height: calc(16 * var(--lh-body) * 1em); overflow-y: auto; }
ul.rows .what details.fold > p.meta { margin: 4px 0 0; }

@media (max-width: 759px) {
  ul.rows > li:has(> .what > details.fold) > .end { grid-column: 1 / -1; justify-self: start; }
}


.peek-host, ul.rows .what small.peek-host { display: grid; }  
.peek-host > * { grid-area: 1 / 1; transition: opacity var(--quick) var(--ease); }
.peek-host > .peek { opacity: 0; color: var(--ink); }
li:hover .peek-host > .face, li:focus-within .peek-host > .face, [data-peek] .peek-host > .face { opacity: 0; }
li:hover .peek-host > .peek, li:focus-within .peek-host > .peek, [data-peek] .peek-host > .peek { opacity: 1; }
[data-peek] > .row-link, li[data-peek] { background: var(--here); }
.row-menu-head .peek-line { display: block; margin-block-start: 6px; color: var(--ink); font-weight: normal; }
.peek-host { grid-template-columns: minmax(0, 1fr); }  
.peek-host > .peek { min-inline-size: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }  

.page:has(.mpath) { --page-max: calc(var(--column) * 1.6); }
.mpath { display: inline-flex; align-items: stretch; gap: 2px; padding: 2px; border-radius: var(--radius-btn); background: var(--line); }
.mpath a { display: grid; gap: 0; padding: 6px 14px; border-radius: var(--radius-sm); color: var(--muted); text-decoration: none; line-height: 1.25; }
.mpath a span { font-weight: var(--weight-medium); color: var(--ink); font-size: var(--text-sm); }
.mpath a[aria-current="page"] { background: var(--surface); box-shadow: var(--shadow-rest); }
.mpath a[aria-current="page"] span { color: var(--accent-text); font-weight: var(--weight-strong); }
.mpath > i { align-self: center; color: var(--muted); font-style: normal; font-size: var(--text-sm); padding-inline: 2px; }
.mpath-more { display: inline-flex; align-items: center; gap: 6px; margin-inline-start: 10px; padding-inline-start: 12px; border-inline-start: var(--rule) solid var(--line-strong); }
.mpath-more a { color: var(--muted); font-size: var(--text-sm); text-decoration: none; padding: 4px 8px; border-radius: var(--radius-sm); }
.mpath-more a[aria-current="page"] { color: var(--accent-text); font-weight: var(--weight-strong); }
.mpath-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 0; }
@media (max-width: 759px) {
  .mpath a { padding: 6px 8px; text-align: center; }
  .mpath-more { margin-inline-start: 6px; padding-inline-start: 6px; }
}

.mpath { background: none; }
.mpath a[aria-current="page"] { background: color-mix(in srgb, var(--accent) 22%, transparent); box-shadow: none; }
.mpath a span, .mpath-more a { white-space: nowrap; }
.mpath-row { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
  padding-block: 4px; margin-block: -4px; }  
.mpath-row > * { flex: none; }

.whatsnew { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--gap); align-items: start; }
.wn > .badge { justify-self: start; }
.whatsnew .side { display: grid; gap: var(--gap); }
.wn { display: grid; gap: 8px; align-content: start; }
.wn h3 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); }
.wn p { margin: 0; }
.wn .where { color: var(--muted); font-size: var(--text-sm); }
.wn .actions { margin-block-start: auto; }
.wn.feature { padding: calc(var(--pad) * 1.25); background: var(--here); border-color: var(--done-ring); }
.wn.feature h3 { font-size: var(--text-lg, 1.25rem); }
.wn.feature .shot { block-size: 9rem; border-radius: var(--radius-sm); border: var(--rule) solid var(--line); background: var(--bg);
  display: grid; place-items: center; }
.wn.feature .shot .loader { padding-block: 0; }
@media (max-width: 759px) { .whatsnew { grid-template-columns: minmax(0, 1fr); } }

.fixbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 14px; border-radius: var(--radius);
  background: color-mix(in srgb, var(--warn) 12%, var(--bg)); border: var(--rule) solid color-mix(in srgb, var(--warn) 45%, transparent); }
.fixbar > svg { inline-size: 18px; block-size: 18px; flex: none; stroke: var(--warn); stroke-width: 2.5; stroke-linecap: round; fill: none; }
.fixbar > p { margin: 0; flex: 1 1 16rem; min-inline-size: 0; }
.fixbar > p small { display: block; color: var(--muted); font-size: var(--text-sm); }
.fixbar > .btn { margin-inline-start: auto; }

.health { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; }
.health > .tick { inline-size: 28px; block-size: 28px; display: grid; place-items: center; border-radius: var(--radius-round);
  background: color-mix(in srgb, var(--ok) 14%, transparent); }
.health > .tick svg { inline-size: 16px; block-size: 16px; stroke: var(--ok); stroke-width: 2.5; stroke-linecap: round; fill: none; }
.health[data-state="warn"] > .tick svg { stroke-width: 3; }
.health[data-state="warn"] > .tick { background: color-mix(in srgb, var(--warn) 16%, transparent); }
.health[data-state="warn"] > .tick svg { stroke: var(--warn); }
.health h3 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); }
.health p { margin: 0; }
.health .fix { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
ul.rows.sizes > li { display: grid; grid-template-columns: minmax(0, 1fr) 8rem 6rem; align-items: center; gap: 12px; padding: 10px var(--pad); }
ul.rows.sizes .fig { text-align: end; }
ul.rows.sizes .act { justify-self: end; }
@media (max-width: 759px) { ul.rows.sizes > li { grid-template-columns: minmax(0, 1fr) auto; } ul.rows.sizes .act { grid-column: 1 / -1; justify-self: start; } }
.versions { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.versions label { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 12px;
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); }
.versions label:has(input:checked) { border-color: var(--accent); background: var(--here); }
.versions .current { color: var(--muted); font-weight: normal; }


.skel-body { padding: calc(var(--gap) * .75) var(--pad); }
.skel-line { display: block; block-size: 0.8em; border-radius: var(--radius-xs); background: var(--line); margin-block: 6px; }
.skel-line.short { inline-size: 40%; }
.skel-line.mid { inline-size: 70%; }

.dl-dock { position: fixed; inset-inline-end: 20px; inset-block-end: 20px; z-index: 5; display: grid; justify-items: end; gap: 10px; }
.dlpill { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px 8px 10px; border-radius: var(--radius-pill);
  border: var(--rule) solid var(--line-strong); background: var(--surface); color: var(--ink); font: inherit; font-size: var(--text-sm);
  box-shadow: 0 6px 20px -8px color-mix(in srgb, var(--ink) 35%, transparent); cursor: pointer; }
.dlpill .ring { inline-size: 16px; block-size: 16px; border-top-color: var(--accent); }
.dlpill .pct { font-weight: var(--weight-strong); }
.dlpill[data-state="ready"] { border-color: color-mix(in srgb, var(--ok) 55%, transparent); background: color-mix(in srgb, var(--ok) 14%, var(--surface)); }
.dlpill[data-state="ready"] svg { inline-size: 16px; block-size: 16px; stroke: var(--ok); stroke-width: 2.5; fill: none; stroke-linecap: round; }
.dlcard { inline-size: min(24rem, calc(100vw - 40px)); padding: 0; overflow: hidden;
  box-shadow: 0 12px 32px -12px color-mix(in srgb, var(--ink) 40%, transparent); }
.dlcard > header { display: grid; gap: 8px; padding: 12px 14px; border-block-end: var(--rule) solid var(--line); }
.dlcard > header .card-head { align-items: center; }
.dlcard ul { list-style: none; margin: 0; padding: 0; }
.dlcard li { display: grid; grid-template-columns: minmax(9rem, 1fr) auto; gap: 4px 12px; align-items: center; padding: 10px 14px; }
.dlcard li + li { border-block-start: var(--rule) solid var(--line); }
.dlcard li .bar { grid-column: 1 / -1; }
.dlcard li small { display: block; color: var(--muted); font-size: var(--text-sm); }
@media (max-width: 759px) { .dl-dock { inset-inline-end: 12px; inset-block-end: calc(76px + env(safe-area-inset-bottom)); } }
.dl-dock [hidden] { display: none; }
.dlcard > header p { margin: 0; }

.settings-search { display: flex; gap: 8px; }
.settings-search input { flex: 1 1 auto; }
.settings-split { display: grid; grid-template-columns: 13rem minmax(0, 1fr); gap: calc(var(--gap) * 1.5); align-items: start; }
.settings-menu { display: grid; gap: 2px; position: sticky; top: var(--gap); }
.settings-menu h3 { margin: 12px 10px 4px; font-size: var(--text-xs); letter-spacing: var(--tracking-wide); text-transform: uppercase; color: var(--muted); }
.settings-menu h3:first-child { margin-top: 0; }
.settings-menu a { display: block; padding: 7px 10px; border-radius: var(--radius-sm); color: var(--ink); text-decoration: none; }
.settings-menu a[aria-current="page"] { background: var(--here); box-shadow: inset 2px 0 0 var(--accent); font-weight: var(--weight-medium); }
ul.rows.set > li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(10rem, 16rem); align-items: center; gap: 8px 16px; padding: 12px var(--pad); }
ul.rows.set .ctl { justify-self: end; inline-size: 100%; display: flex; justify-content: flex-end; }
@media (max-width: 759px) {
  .settings-split { grid-template-columns: minmax(0, 1fr); }
  .settings-menu { position: static; display: flex; gap: 6px; overflow-x: auto; padding-block-end: 4px; }
  .settings-menu h3 { display: none; }
  .settings-menu a { white-space: nowrap; border: var(--rule) solid var(--line); border-radius: var(--radius-pill); }
  ul.rows.set > li { grid-template-columns: minmax(0, 1fr); }
  ul.rows.set .ctl { justify-content: flex-start; }
}

.trail-view.bw { grid-template-columns: minmax(0, 1fr) 20rem; grid-template-areas: "top top" "chips chips" "canvas detail"; }
.trail-view.bw:not(:has(.bw-detail)) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "chips" "canvas"; }
.trail-view.bw:has(.bw-empty) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "chips" "canvas" "detail"; }
.bw .tv-top { grid-area: top; }
.bw .bw-chips { grid-area: chips; padding: 10px 14px; border-bottom: var(--rule) solid var(--line); }
.bw .bw-chips .chip .num { color: var(--muted); }
.bw .tv-canvas { grid-area: canvas; --fit-top: 52px; } 

.bw .bw-beside { grid-area: detail; min-width: 0; display: flex; flex-direction: column; border-inline-start: var(--rule) solid var(--line); overflow-y: auto; }
.bw .bw-detail { margin: 0; border: 0; border-radius: 0; }
.bw .bw-detail + .bw-detail { border-top: var(--rule) solid var(--line); }


.bw-detail h4 { margin: 0; font-size: var(--text-sm); }
.bw-sec { display: grid; gap: 6px; }
.bw-rules, .bw-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bw-rules li { display: grid; gap: 2px; padding-inline-start: 8px; border-inline-start: var(--rule) solid var(--accent); }
.bw-rules .badge { justify-self: start; }
.bw-links small { color: var(--muted); font-size: var(--text-xs); }
.bw-links li { display: grid; }
.bw-detail .lead { align-items: center; }
.bw-detail .row { flex-wrap: wrap; gap: 6px; }
.bw-detail .row .btn { white-space: nowrap; }


.bw-empty { display: grid; place-items: center; }
.bw-empty-card { position: relative; z-index: 1; max-width: 26rem; text-align: start; }


@media (max-width: 759px) {
  .trail-view.bw, .trail-view.bw:not(:has(.bw-detail)) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "chips" "canvas" "detail"; }
  .trail-view.bw:has(.bw-empty) { grid-template-areas: "top" "chips" "canvas" "detail"; }
  .bw .tv-canvas { --fit-top: 84px; height: 23rem; } 
  .bw .bw-chips { flex-wrap: nowrap; overflow-x: auto; }
  .bw .bw-chips .chip { flex: none; }
  .bw-chips .chip { min-height: var(--touch); display: flex; align-items: center; box-sizing: border-box; }
  .bw .bw-beside { border-inline-start: 0; border-top: var(--rule) solid var(--line); }
  .bw-empty { padding: 14px; }
  .bw button.why { position: relative; border-color: transparent; background: none; }
  .bw button.why::before { content: ""; position: absolute; inset: 50% auto auto 50%; width: 24px; height: 24px; translate: -50% -50%;
    box-sizing: border-box; border: var(--rule) solid var(--line); border-radius: var(--radius-round); }
  .bw button.why:hover, .bw button.why[aria-expanded="true"] { background: none; }
  .bw button.why[aria-expanded="true"]::before { border-color: var(--accent); background: var(--tint); }
}


#mail .msg h3 { margin: 0; }
#mail .msg:is(.compose, .acct) :is(input:not([type="checkbox"]), select, textarea) { width: 100%; box-sizing: border-box; }
#mail .msg .sig { border-top: var(--rule) dashed var(--line-strong); padding-top: 8px; display: flex; flex-direction: column; gap: 4px; }
#mail .msg .sig[hidden] { display: none; }
#mail .msg .sig p { margin: 0; }
#mail .msg .sig label { color: var(--accent-text); text-decoration: underline var(--rule) var(--accent); text-underline-offset: 3px; cursor: pointer; }
#mail .msg .sig label input { position: absolute; inline-size: 1px; block-size: 1px; margin: 0; overflow: hidden; clip-path: inset(50%); }
#mail .msg .sig label:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
#mail .msg .sig:has(input:checked) > p:first-child { text-decoration: line-through; color: var(--muted); }
#mail .msg .list-line { justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
#mail .msg .unsub p { margin: 0; }

.rf-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 16px; margin: 4px 0 2px; padding: 10px 12px;
  background: color-mix(in srgb, var(--muted) 9%, transparent); border-radius: var(--radius-sm); }
.rf-strip > div { min-width: 0; }
.rf-strip dt { margin: 0; font-size: var(--text-xs); color: var(--muted); }
.rf-strip dd { margin: 2px 0 0; font-size: var(--text-sm); font-weight: var(--weight-strong); overflow-wrap: break-word; }
.rf-strip dd.none { color: var(--muted); font-weight: normal; }

.rf-strip.c4 { grid-template-columns: 1.8fr 1fr 1.4fr 1.4fr; }
.rf-strip.c3 { grid-template-columns: 1.8fr 1fr 1fr; }
.rf-strip.c2 { grid-template-columns: 1.8fr 1fr; }
.rf-strip.c3n { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 759px) {
  .rf-strip, .rf-strip.c4, .rf-strip.c3, .rf-strip.c2, .rf-strip.c3n { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rf-strip > .wide { grid-column: 1 / -1; }
}

ul.rows > li > details.rf-d { grid-column: 1 / -1; }
ul.rows > li:has(> a.row-link) > details.rf-d { padding-inline: var(--pad); padding-bottom: calc(var(--pad) / 2); }
ul.rows details.rf-d > summary { font-size: var(--text-xs); color: var(--muted); cursor: pointer; min-height: var(--touch, 24px); display: flex; align-items: center; }

ul.rows.rf-needs > li > .rf-strip { grid-column: 1 / -1; margin: 0 var(--pad, 16px) 12px; }

@media (max-width: 759px) { ul.rows.models details.file > summary, ul.rows details.rf-d > summary { min-height: 44px; display: flex; align-items: center; } }
.rf-strip code { font-size: inherit; font-weight: inherit; }

.push-ask { position: fixed; z-index: 30; top: calc(10px + env(safe-area-inset-top, 0px)); inset-inline: 0; margin-inline: auto;
  width: calc(100% - 24px); max-width: 440px; box-sizing: border-box; display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px;
  background: var(--surface); border: var(--rule) solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow-pop);
  --away: calc(-100% - 80px); transition: translate var(--slow) var(--ease-out); }
@starting-style { .push-ask { translate: 0 var(--away); } }
.push-ask[data-leaving] { translate: 0 var(--away); pointer-events: none; transition-timing-function: var(--ease-in); }

.push-ask[data-docked] { position: static; z-index: auto; margin: 8px 0 0; width: auto; box-shadow: none; translate: none; transition: opacity var(--slow) var(--ease-out); }
@starting-style { .push-ask[data-docked] { translate: none; opacity: 0; } }
.push-ask[data-docked][data-leaving] { translate: none; opacity: 0; }
.push-ask > svg { flex: none; width: 22px; height: 22px; margin-top: 2px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linejoin: round; }
.push-ask p { margin: 0; color: var(--muted); font-size: var(--text-sm); }
.push-ask .stack { gap: 4px; min-width: 0; }
.push-ask-more { font-size: var(--text-xs); }
.push-ask-more > summary { font-size: var(--text-xs); color: var(--muted); }
.push-ask-more[open] > summary { margin-bottom: 4px; }


.set-ia .set-split { display: grid; grid-template-columns: 17rem minmax(0, 1fr); gap: var(--gap); align-items: start; }
.set-ia .set-nav { position: sticky; top: 12px; padding: 12px 8px; display: grid; gap: 10px; max-height: calc(100vh - 140px); overflow: auto; }
.set-ia .set-nav-h { margin: 0 8px; font-weight: var(--weight-strong); font-size: var(--text-lg); }
.set-ia .set-grp h3 { margin: 0 8px; font-size: var(--text-xs); letter-spacing: var(--tracking-wide); text-transform: none; color: var(--muted); }
.set-ia .set-grp ul { list-style: none; margin: 0; padding: 0; }
.set-ia .set-grp a { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: var(--radius-sm); color: var(--ink); text-decoration: none; min-height: 36px; }
.set-ia .set-grp a { white-space: nowrap; overflow: hidden; }  
.set-ia .set-grp a > span { overflow: hidden; text-overflow: ellipsis; }
.set-ia .set-grp a:hover { background: var(--hover); }
.set-ia .set-grp a[aria-current="page"] { background: var(--here); box-shadow: inset 3px 0 0 var(--accent); font-weight: var(--weight-strong); }
.set-ia .si, .set-ia .chev { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.set-ia .si { color: var(--muted); }
.set-ia a[aria-current="page"] .si { color: var(--accent-text); }
.set-ia .chev { margin-left: auto; color: var(--muted); visibility: hidden; }
.set-ia .results .where { display: block; font-size: var(--text-xs); }
@media (max-width: 759px) {
  .set-ia .set-split { grid-template-columns: minmax(0, 1fr); }
  .set-ia .set-nav { position: static; max-height: none; }
  .set-ia .chev { visibility: visible; }
  .set-ia .set-grp a { min-height: var(--touch); }
  .set-ia.at-group .set-nav, .set-ia.at-search .set-nav { display: none; }
}
@media (min-width: 760px) {
  .set-ia .set-split { grid-template-columns: 15rem minmax(0, 1fr); }
  .set-ia .set-grp li { margin: 0; }
  .set-ia .set-grp a { min-height: 32px; padding: 4px 8px; }
  .set-ia .set-nav { gap: 8px; }
}
.set-ia .rows.set .what { flex: 1 1 auto; max-width: 34rem; }

.page:has(.set-ia) { --page-max: 72rem; }
@media (max-width: 759px) { .home-on-phone.set-ia .set-body { display: none; } .home-on-phone.set-ia .set-nav { display: grid; } }


.opt-count .seg label { position: relative; display: flex; align-items: center; justify-content: center; min-block-size: 32px; box-sizing: border-box;
  padding: 5px 12px; border-radius: var(--radius-sm); color: var(--muted); font-size: var(--text-sm); font-weight: var(--weight-medium);
  text-align: center; cursor: pointer; }
.opt-count .seg label input { position: absolute; inline-size: 1px; block-size: 1px; margin: 0; overflow: hidden; clip-path: inset(50%); }
.opt-count .seg label:has(input:checked) { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-rest); }
.opt-count .seg label:has(input:focus-visible) { outline: var(--ring) solid var(--accent); outline-offset: 1px; }
.opt-count .says { display: none; margin: 6px 0 0; }
.opt-count:has(.seg label:nth-child(1) input:checked) .says:nth-of-type(1),
.opt-count:has(.seg label:nth-child(2) input:checked) .says:nth-of-type(2),
.opt-count:has(.seg label:nth-child(3) input:checked) .says:nth-of-type(3) { display: block; }


.opt-count .seg.fill { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); inline-size: 100%; max-inline-size: 28rem; box-sizing: border-box; }


.opt-count select { max-inline-size: 100%; }

@media (max-width: 759px) {
  .opt-count .seg label { min-block-size: 44px; }
  .opt-count select { min-block-size: 44px; }
}


.bar-top .saving { display: inline-flex; align-items: center; gap: 8px; color: var(--muted);
  font-size: var(--text-sm); white-space: nowrap; }

.bar-top .saving { min-inline-size: 7em; justify-content: flex-end; }
form[data-saves] > button[hidden] { display: none; } 
.bar-top .saving .ring { width: 0.9em; height: 0.9em; }
.bar-top .saving.fail { color: var(--ink); }

.set small.why, form[data-saves] small.why { color: var(--ink); }
.set small.why::before, form[data-saves] small.why::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-inline-end: 6px;
  border-radius: var(--radius-round); background: var(--bad, var(--ink)); vertical-align: middle; }

@media (max-width: 759px) { .bar-top.head:has(> .saving) { gap: 4px; } .bar-top.head:has(> .saving) .here { flex-shrink: 0; } }
.set small.why .btn, form[data-saves] small.why .btn { display: flex; margin-top: 6px; }
@media (max-width: 759px) { .set small.why .btn, form[data-saves] small.why .btn { --touch: 44px; } }


.pm-window { width: min(40rem, 100%); max-height: 100%; overflow: auto; text-align: left; }
.pm-window ul { padding-left: 0; }
.pm-head { display: grid; gap: 4px; }
.pm-head p, .pm-window p { margin: 0; }
.pm-list, .pm-sub { list-style: none; margin: 0; padding: 0; max-width: none; }
.pm-list { border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: var(--surface); overflow: auto; max-height: 64dvh; }
.pm-item + .pm-item, .pm-sub { border-top: var(--rule) solid var(--line); }
.pm-sub { margin-left: 23px; border-left: calc(var(--rule) * 2) solid var(--line-strong); }
.pm-row { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; width: 100%;
  padding: 10px 12px; box-sizing: border-box; background: none; border: 0; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.pm-row:hover { background: var(--hover); }
.pm-row:focus-visible, .pm-back:focus-visible { outline: 2px solid var(--focus, var(--accent)); outline-offset: -2px; }
.pm-icon { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pm-what { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pm-what b { font-weight: var(--weight-strong); }
.pm-read { color: var(--muted); font-size: var(--text-sm); }
.pm-end { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 6px; }
.pm-open { display: inline-flex; align-items: center; gap: 2px; font-size: var(--text-sm); font-weight: var(--weight-medium); }
.pm-open .chev { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.pm-bar { display: block; width: 64px; height: 4px; box-sizing: content-box; border-radius: var(--radius-xs); background: var(--pane); border: var(--rule) solid var(--line); overflow: hidden; }
.pm-bar i { display: block; height: 100%; width: 100%; background: var(--accent); transform: scaleX(var(--at, 0)); transform-origin: left; }

.pm-row[aria-disabled="true"] { cursor: default; color: var(--muted); }
.pm-row[aria-disabled="true"]:hover { background: none; }
.pm-why { color: var(--ink); font-size: var(--text-sm); }
.pm-foot { flex-wrap: wrap; }
.pm-head + .pm-list { margin-top: 0; }
.pm-machine { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px 12px;
  border-radius: var(--radius-sm); background: var(--tint); }
.pm-inside { margin: 0; }
.pm-back { align-self: start; margin-left: -10px; }
.pm-window .crumbs ol { font-size: var(--text-sm); }

.pm-file { padding: 0; }
.pm-filerow { display: grid; grid-template-columns: subgrid; grid-column: 1 / -1; gap: 12px; align-items: center; padding: 10px 12px; color: var(--muted); }
.pm-filerow .end { display: flex; justify-content: flex-end; }

.pm-chip { min-width: 0; overflow-wrap: anywhere; }
.pm-chip-k { color: var(--muted); }
.pm-switched { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 8px 12px; border-radius: var(--radius-sm);
  background: var(--tint); font-size: var(--text-sm); max-width: none; }
.pm-switched .badge { flex: none; }
.pm-offer .card-head h3 { margin: 0; overflow-wrap: anywhere; }
.pm-offer .kv, .pm-offer p, .pm-offer .actions { margin: 0; }
.pm-offer .kv { grid-template-columns: max-content minmax(0, 1fr); font-size: var(--text-sm); gap: 4px var(--gap); }
.pm-offer .kv dd { margin: 0; }
.pm-offer .kv dd { overflow-wrap: anywhere; }
.composer .box .asking.pm-ask { max-height: none; }
.pm-ask .actions { flex-wrap: wrap; }
.pm-what > span:first-child .meta { white-space: nowrap; }
.pm-asks { margin: 0; padding-left: 1.2em; list-style: disc; }
.pm-ask .pm-asks { padding-left: 1.2em; }
@media (min-width: 760px) {
  .pm-window .crumbs { min-height: 0; }
}
@media (max-width: 759px) {
  .pm-window { max-height: 88dvh; }
  .pm-list { max-height: none; overflow: visible; }
  .pm-row[aria-disabled="true"] { grid-template-columns: 24px minmax(0, 1fr); }
  .pm-row[aria-disabled="true"] .pm-end { grid-column: 2; align-items: flex-start; }
  .pm-sub { margin-left: 15px; }
  .pm-offer .kv { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pm-offer .kv dd { margin-bottom: 8px; }
  .pm-native { display: none; }
  .pm-window .crumbs button { padding: 0 6px; }
  
  .pm-window .pm-foot { position: sticky; bottom: calc(-16px - env(safe-area-inset-bottom, 0px)); margin: 0 calc(-1 * var(--side));
    padding: 12px var(--side) calc(16px + env(safe-area-inset-bottom, 0px)); background: var(--surface); border-top: var(--rule) solid var(--line); }
  .pm-window .pm-foot { flex-direction: row; align-self: stretch; }
  .pm-window .pm-foot .btn { flex: 1 1 0; }
  .pm-window .pm-foot .meta { flex-basis: 100%; white-space: normal; }
}

.pm-window [hidden], #folder-browse [hidden], .pm-switched[hidden] { display: none; }
.pm-window .tools .choice { white-space: nowrap; }

#new-chat #folder-ask .pm-window p { margin-inline: 0; }
#folder-browse[data-pick]:not([hidden]) { display: flex; flex-direction: column; gap: 12px; }
#pm-notes:empty { display: none; }
#pm-notes p { margin: 0; }
#pm-title:focus { outline: none; }
#pm-state .actions { margin-top: 8px; }

.composer { --touch: 44px; }
.composer .box[data-glass] { border-radius: var(--radius-glass);
  background-color: color-mix(in srgb, var(--surface) var(--g-fill), transparent); border-color: var(--g-edge); box-shadow: var(--g-shadow); }
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  .composer .box[data-glass] { background-color: var(--surface); border-color: var(--line); box-shadow: var(--shadow-rest); }
}
:root[data-rt="on"] .composer .box[data-glass] { background-color: var(--surface); border-color: var(--line); box-shadow: var(--shadow-rest); }
.composer .box[data-glass] > textarea { padding: 12px 16px 4px; }
.composer .foot { flex-wrap: nowrap; align-items: center; gap: 8px; padding: 4px 8px 8px; }
.composer .foot:has(> .anchor.pill) > .anchor:not(.pill):not([data-effort-fault]):has(> button.pick),
.composer .foot:has(> .anchor.pill) > #leash-slot { display: none; }
.composer .foot > .anchor.pill { display: inline-flex; flex: 0 1 auto; min-width: 0; }
.composer button.pick.settings { flex-wrap: nowrap; gap: 6px; min-height: var(--touch); padding-inline: 14px; border-radius: var(--radius-pill);
  background: var(--pane); color: var(--muted); font-size: var(--text-sm); transition: scale var(--spring-settle-duration) var(--spring-settle); }
.composer button.pick.settings:hover, .composer button.pick.settings[aria-expanded="true"] { background: var(--hover); }
.composer button.pick.settings:active { scale: .97; }
.composer button.pick.settings b { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.composer button.pick.settings .eff { flex: none; white-space: nowrap; }
.composer .attach, .composer .send, .composer .stop { width: var(--touch); height: var(--touch); border-radius: var(--radius-round); flex: none; }
.composer .attach { background: var(--pane); color: var(--ink); }
.composer .send .enter { display: none; }
.composer .send .up { display: block; }
.composer .foot:has(> #stop[hidden])::after { display: none; }
.composer .send:disabled { background: color-mix(in srgb, var(--accent) 45%, var(--surface)); color: var(--accent-ink); }
.composer .ctx .lbl { display: none; }
.composer .box[data-glass] > textarea { resize: none; field-sizing: content; max-height: 40vh; overflow-y: auto; }
.composer .files:not(.rows)[data-shelf] { gap: 8px; padding: 12px 12px 0; }
.composer .files:not(.rows)[data-shelf] > li { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; width: 96px; height: 96px; box-sizing: border-box; padding: 8px; border: var(--rule) solid var(--line);
  border-radius: var(--radius); background: var(--pane); text-align: center; }
.composer .files:not(.rows)[data-shelf] > li > span { max-width: 100%; }
.composer .files:not(.rows)[data-shelf] > li > svg { width: 24px; height: 24px; }
.composer .files:not(.rows)[data-shelf] > li > button[data-unattach] { position: absolute; top: -12px; right: -12px; padding: 8px; background-color: var(--ink);
  background-clip: content-box; color: var(--surface); border-radius: var(--radius-round); font-size: var(--text-sm); line-height: 1; }
.composer .files:not(.rows)[data-shelf] > li > button[data-unattach]:hover { background-color: var(--ink); color: var(--surface); }
.settings-sheet[data-at] { top: auto; transform: none; }
.settings-sheet[data-at] ~ .sheet-shade { background: none; }

#documents .docs .what small { overflow-wrap: anywhere; }
#documents .doc-open > .doc-view { grid-column: 1 / -1; }
#documents .doc-view { display: flex; flex-direction: column; gap: 10px; padding: 0 16px 14px; }

pre.doc-text { margin: 0; max-height: 260px; overflow: auto; padding: 10px 12px; white-space: pre-wrap;
  background: color-mix(in srgb, var(--surface) 60%, transparent); border: var(--rule) solid var(--line); border-radius: var(--radius);
  font: var(--text-xs)/1.65 var(--font-mono); }
#documents .doc-acts { flex-wrap: wrap; gap: 8px; }
#documents .doc-acts .grow { flex: 1; }
@media (max-width: 640px) { #documents .doc-acts a:nth-child(2) { display: none; } }
#documents .doc-pic { display: block; max-width: 100%; height: auto; border-radius: var(--radius); }

.run-pick .run-kind { margin: 0; }
.run-pick .card-head h3 { font-size: var(--text-lg); }
.run-pick .run-dl { margin: var(--gap) 0 0; }
.run-where > h3, .run-change .lead h3 { font-size: var(--text-base); margin: 0; }


.run-comp .run-jobs { list-style: none; margin: 0; padding: 0; max-width: none; }
.run-comp .run-jobs > li { display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content; gap: 4px 10px; align-items: center;
  padding: 10px 14px; border-top: var(--rule) solid var(--line); }
.run-comp .run-jobs > li:first-child { border-top: 0; }
.run-comp .run-jobs .what { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 759px) { .run-comp .run-jobs > li { grid-template-columns: max-content minmax(0, 1fr); }
  .run-comp .run-jobs > li > .badge { grid-column: 2; justify-self: start; } }


.run-layout.card { margin: 0; padding: 0; }
.run-layout > summary { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 var(--pad); cursor: pointer;
  font-weight: var(--weight-strong); }
.run-layout > summary { list-style: none; }
.run-layout > summary::-webkit-details-marker { display: none; }

.run-layout > summary::after { order: -1; content: "\203A"; display: inline-block; width: 1ch; color: var(--muted); transition: transform var(--quick) var(--ease); }
.run-layout[open] > summary::after { transform: rotate(90deg); }
.run-layout[open] > summary { margin-bottom: 0; }
.run-layout > summary:focus-visible { outline-offset: -2px; }
.run-small { padding: 0 var(--pad) var(--pad); border-top: var(--rule) solid var(--line); }
.run-small-card { gap: 10px; padding-top: var(--gap); }
.run-small-card + .run-small-card { border-top: var(--rule) solid var(--line); }
.run-small-card .card-head h4 { margin: 0; font-size: var(--text-base); }
.run-slot { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.run-slot .pslot-sum { font-size: var(--text-sm); }
.run-slot .membar { height: 12px; }
.run-slot .meta { font-size: var(--text-xs); }
.run-note { margin: 0; }


.run-change-list { grid-template-columns: minmax(0, 1fr) max-content; }
.run-change-list a.row-link { min-height: 56px; }
.run-change-list .end { color: var(--muted); font-size: var(--text-lg); }

.run-change-list > li:has(> button.row-link) { padding: 0; }
.run-change-list > li > button.row-link { display: grid; grid-template-columns: subgrid; grid-column: 1 / -1; gap: 12px; align-items: center;
  width: 100%; padding: 10px var(--pad); border: 0; background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; }
.run-change-list > li > button.row-link:hover { background: var(--hover); }





.composer .box .asking.plan-card { gap: 8px; }
.plan-titles { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: var(--text-sm); }
.plan-titles > li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 8px; align-items: center; color: var(--muted); }
.plan-titles > li[data-state="run"] { color: var(--ink); font-weight: var(--weight-strong); }
.plan-titles .step-mark, .plan-titles .ring { width: 16px; height: 16px; justify-self: center; }
.plan-card .actions { margin: 0; }


#panel .plan-edit { gap: var(--gap); min-width: 0; padding-block-end: 0; }
.plan-edit > h3 { margin: 0; font-size: var(--text-base); }
.plan-edit > p { margin: 0; }
.plan-edit kbd { padding: 0 4px; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-xs); font-size: var(--text-xs); }
ol.plan-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.plan-row { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 0 8px; align-items: start; min-width: 0;
  padding: 10px; background: var(--surface); border: var(--rule) solid var(--line); border-radius: var(--radius); }
.plan-row[data-state="done"] { background: var(--bg); }
.plan-row[data-state="run"] { border-color: var(--accent); }
.plan-row[data-lifted] { outline: var(--ring) solid var(--accent); outline-offset: 2px; background: var(--here); }
.plan-row[data-state="dropped"] { border-style: dashed; background: var(--bg); }
.plan-row[data-state="dropped"] .plan-goal { text-decoration: line-through; color: var(--muted); }
.plan-grip { display: grid; place-items: center; width: 32px; height: 32px; min-width: 0; min-height: 0; padding: 0; border: 0; border-radius: var(--radius-sm);
  background: none; color: var(--muted); cursor: grab; }
.plan-grip svg { width: 16px; height: 16px; fill: currentColor; }
.plan-grip:hover, .plan-grip[aria-pressed="true"] { background: var(--hover); color: var(--ink); }
.plan-grip[aria-pressed="true"] { cursor: grabbing; }
.plan-grip:disabled, .plan-grip[aria-disabled="true"] { cursor: default; color: var(--line-strong); background: none; }
.plan-body { display: grid; gap: 8px; min-width: 0; }
.plan-top { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-height: 32px; }
.plan-top > b { font-size: var(--text-sm); }
.plan-acts { display: flex; flex-wrap: wrap; gap: 4px; margin-inline-start: auto; }
.plan-acts .btn { padding-inline: 10px; }
.plan-acts .btn:disabled, .plan-acts .btn[aria-disabled="true"] { color: var(--muted); }
.plan-touch { display: none; }
.plan-field { display: grid; gap: 2px; min-width: 0; font-size: var(--text-xs); color: var(--muted); }
.plan-field > input { width: 100%; box-sizing: border-box; font-size: var(--text-sm); }
.plan-field > input:focus-visible { outline: var(--ring) solid var(--accent); outline-offset: var(--focus-offset, 2px); }
.plan-field > input[readonly] { border-color: transparent; background: none; padding: 0; color: var(--ink); }
.plan-lock { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: var(--text-xs); }
.plan-lock svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.plan-row > .plan-note { grid-column: 1 / -1; margin: 8px 0 0; }
.plan-note { margin: 0; padding-inline-start: 10px; border-inline-start: calc(var(--rule) * 2) solid var(--line-strong); font-size: var(--text-sm); }
.plan-note[data-bad] { border-inline-start-color: var(--bad); color: var(--ink); }
.plan-note[data-live] { border-inline-start-color: var(--accent); }
.plan-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.plan-foot > .meta { margin: 0; }
.plan-bar { position: sticky; inset-block-end: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-inline: calc(var(--card-pad-x, var(--pad)) * -1);
  padding: 10px var(--pad); background: var(--surface); border-top: var(--rule) solid var(--line); }
.plan-bar > .meta { flex: 1 1 14rem; min-width: 0; margin: 0; }

@media (max-width: 759px) {
  #panel .plan-edit, .composer .plan-card { --touch: 44px; }
  .plan-grip, .plan-pointer { display: none; }
  .plan-touch { display: inline; }
  .plan-row { grid-template-columns: minmax(0, 1fr); padding: 12px; }
  .plan-acts { flex: 1 1 100%; margin-inline-start: 0; }
  .plan-acts .btn { flex: 1 1 0; min-height: var(--touch); }
  .plan-field > input, .plan-field > input[readonly] { min-height: var(--touch); }
  .plan-foot .btn, .plan-bar .btn, .plan-bar .btn.primary { min-height: var(--touch); } 
  .plan-bar > .meta { flex-basis: 100%; }
  .plan-bar .btn { flex: 1 1 0; }
  .plan-titles > li { padding-block: 2px; }
  .composer .plan-card .actions .btn { flex: 1 1 0; min-height: var(--touch); }
}


@media (forced-colors: active) {
  .box, .btn, .card, .bar, .badge, .rail li.here, .facts { border: var(--rule) solid CanvasText; box-shadow: none; }
  .tour-card { border: var(--rule) solid CanvasText; box-shadow: none; }
  .skel-line { forced-color-adjust: none; background: GrayText; } 
  .tour-ring { outline: 0; border-color: Highlight; } 
  
  .bar > i { forced-color-adjust: none; background: Highlight; }
  .step-track i { border: var(--rule) solid CanvasText; }
  .step-track i.done { forced-color-adjust: none; background: CanvasText; }
  .step-track i.here { forced-color-adjust: none; background: Highlight; }
}


@media (prefers-reduced-motion: reduce) { @layer floor { *, *::before, *::after { animation: none !important; transition-property: opacity !important; } .ring { animation: ring var(--blink) linear infinite !important; } .loader .mark > .ring { animation: none !important; } :is(.chat-window, .why-note, dialog.pop.palette, .report-over, .pres), dialog.pop.palette::backdrop, details::details-content { transition-property: opacity, display, overlay, content-visibility !important; transition-behavior: allow-discrete !important; transition-duration: var(--quick) !important; } } }

details.rename > summary, .actions > details.edit > summary { list-style: none; }
details.rename > summary::-webkit-details-marker, .actions > details.edit > summary::-webkit-details-marker { display: none; }
details.rename > summary > h2 { display: inline; }
.actions > details.edit[open] { flex-basis: 100%; }

#live:not([hidden]) { display: flex; flex-direction: column; gap: var(--gap); }


:root [data-glass] {
  --muted: var(--g-muted); 
  background-color: color-mix(in srgb, var(--surface) var(--g-fill-now), transparent);
  -webkit-backdrop-filter: blur(var(--g-blur)) saturate(var(--g-saturate));
  backdrop-filter: blur(var(--g-blur)) saturate(var(--g-saturate));
  border: var(--rule) solid var(--g-edge);
  box-shadow: var(--g-shadow);
}

[data-glass] :where(.btn:not(.primary)) { background-color: color-mix(in srgb, var(--surface) var(--g-fill-btn), transparent); border-color: var(--g-edge); }
[data-glass] :where(input:not([type="radio"], [type="checkbox"], [type="range"], [type="color"]), select, textarea, .field) {
  background-color: color-mix(in srgb, var(--surface) var(--g-fill-field), transparent); border-color: var(--g-edge);
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  :root [data-glass] { background-color: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; border-color: var(--line); box-shadow: var(--shadow-rest); }
  :root [data-glass] :where(.btn:not(.primary)) { background-color: var(--surface); border-color: var(--line-strong); }
  :root [data-glass] :where(input:not([type="radio"], [type="checkbox"], [type="range"], [type="color"]), select, textarea, .field) { background-color: var(--surface); border-color: var(--field); }
}
:root[data-rt="on"] [data-glass] { background-color: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; border-color: var(--line); box-shadow: var(--shadow-rest); }
:root[data-rt="on"] [data-glass] :where(.btn:not(.primary)) { background-color: var(--surface); border-color: var(--line-strong); }
:root[data-rt="on"] [data-glass] :where(input:not([type="radio"], [type="checkbox"], [type="range"], [type="color"]), select, textarea, .field) { background-color: var(--surface); border-color: var(--field); }

:root.lighter [data-glass] { background-color: var(--tint); -webkit-backdrop-filter: none; backdrop-filter: none; border-color: var(--line); box-shadow: var(--shadow-rest); }
:root.lighter { --spring-settle: linear; --spring-settle-duration: var(--quick); --spring-flick: linear; --spring-flick-duration: var(--quick); }

:root.lighter *:not(.ring), :root.lighter *::before, :root.lighter *::after { animation: none !important; transition-property: opacity !important; }
:root.lighter .loader .mark > .ring { animation: none !important; }
.lighter-said { position: fixed; z-index: 30; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); inset-inline: 0; margin-inline: auto; width: calc(100% - 24px);
  max-width: 440px; box-sizing: border-box; display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 10px 14px;
  background: var(--surface); border: var(--rule) solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow-pop); font-size: var(--text-sm); }
:root:has(.screen-foot) .lighter-said { bottom: auto; top: calc(10px + env(safe-area-inset-top, 0px)); }  

@layer floor { :root[data-rm="on"] *, :root[data-rm="on"] *::before, :root[data-rm="on"] *::after { animation: none !important; transition-property: opacity !important; } :root[data-rm="on"] .ring { animation: ring var(--blink) linear infinite !important; }
  :root[data-rm="on"] :is(.chat-window, .why-note, dialog.pop.palette, .report-over, .pres), :root[data-rm="on"] dialog.pop.palette::backdrop, :root[data-rm="on"] details::details-content { transition-property: opacity, display, overlay, content-visibility !important; transition-behavior: allow-discrete !important; transition-duration: var(--quick) !important; } }

#live > .stack:empty { display: none; }


@media (max-width: 759px) {
  .composer, .screen-foot { --touch: 44px; }
  .composer .send, .composer .attach, .composer .stop { width: var(--touch); height: var(--touch); }
  
  .screen-foot { padding-bottom: calc(14px + max(env(safe-area-inset-bottom), var(--vv-foot, 0px))); }
  #chat > #turn > form.composer, #new-chat > form.composer { padding-bottom: max(env(safe-area-inset-bottom), var(--vv-foot, 0px)); }
}


#folder-browse.sheet:not([hidden]) { position: fixed; inset: 0; z-index: 12; box-sizing: border-box; max-width: 44rem;
  margin-inline: auto; border-radius: 0; overflow-y: auto; }
#folder-browse.sheet:not([hidden]) > .stack { min-height: 100%; }
#folder-browse.sheet:not([hidden]) ul.files { max-height: none; flex: 1 1 auto; align-content: start; }

.bar-top.head .here { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }


.settings-sheet [data-options] { display: flex; flex-direction: column; gap: 2px; font-size: var(--text-sm); }
.settings-sheet [data-options][hidden], .settings-sheet [data-rows][hidden] { display: none; }
.settings-sheet [data-rows] { display: flex; flex-direction: column; gap: 2px; }
.settings-sheet [data-options] [role="option"] { min-height: var(--touch); box-sizing: border-box; align-items: flex-start; cursor: pointer; }
.settings-sheet [data-options] [aria-selected="true"] { background: var(--here); box-shadow: var(--shadow-rest); font-weight: var(--weight-strong); }

.settings-sheet [data-options] [role="option"]::before { content: ""; flex: none; inline-size: 16px; block-size: 16px; margin-block-start: 2px; }
.settings-sheet [data-options] [aria-selected="true"]::before { background: var(--accent); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.settings-sheet [data-options] [aria-disabled="true"] { cursor: default; }
.settings-sheet [data-options] small { display: block; color: var(--muted); font-size: var(--text-xs); font-weight: normal; }
.settings-sheet [data-options] .badge { margin-left: auto; flex: none; }
.settings-sheet [data-options] > .btn { align-self: flex-start; }
@media (max-width: 759px) {
  .settings-sheet { --touch: 44px; }
}

:is(.row, .help, .lead, .card-head, .group-head, .place-title, .fit-line, .slot-head, .slot-parts, .actions):has(button.why),
:is(.pieces, .bar-says, ul.rows) > li:has(button.why) { position: relative; }
:is(.pieces, .bar-says, ul.rows) > li .help:has(button.why) { position: static; }
:is(.row, .help, .lead, .card-head, .group-head, .place-title, .fit-line, .slot-head, .slot-parts, .actions) .why-note:not([hidden]),
:is(.pieces, .bar-says, ul.rows) > li .why-note:not([hidden]) { position: absolute; z-index: 15; inset-block-start: 100%;
  inset-inline-start: 0; inset-inline-end: auto; width: min(22rem, 100%); }  
ul.rows > li.has-why > .why-note:not([hidden]) { inset-inline-end: 0; inset-inline-start: auto; width: min(22rem, calc(100vw - 64px)); }

:is(.card:has(> ul.rows), ul.rows.card, .card:has(> ul.events), ul.events.card, ul.mail-list.card, .card.debrief,
  .card:has(> .card-head.lined), .card:has(> .card-foot), .card:has(> .cat), .card.place, .card.who, .card.tray, .card.together,
  .card.machine):has(button.why[aria-expanded="true"]) { overflow: visible; }

:root :has(button.why[aria-expanded="true"])[data-glass] { background-color: var(--surface); -webkit-backdrop-filter: none;
  backdrop-filter: none; }

.why-note:not([hidden]) { position: absolute; z-index: 15; box-sizing: border-box; width: min(22rem, calc(100vw - 64px));
  margin: 4px 0 0; padding: calc(var(--gap) * .375) calc(var(--pad) * .625); font-size: var(--text-xs);
  color: var(--ink); background: var(--surface); border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm);
  box-shadow: var(--shadow-pop); }

@supports (anchor-name: --why) {
  button.why { anchor-name: --why; }
  .why-note:not([hidden]) { position-anchor: --why; inset-block-start: anchor(bottom); inset-inline-start: anchor(start);
    position-try-fallbacks: flip-inline, flip-block; }
}

.why-note .why-close { margin: 0 0 0 6px; min-height: var(--touch); vertical-align: middle; }

.lead:has(> button.why) > :is(h2, h3) { margin-right: 0; }
.lead:has(> button.why) > .meta { margin-inline-start: auto; }

.named { display: flex; align-items: flex-start; gap: 6px; min-width: 0; }
.named > span { min-width: 0; font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--ink); }
.named small { display: block; font-weight: normal; color: var(--muted); font-size: var(--text-xs); }


.help { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; }
.help > p { margin: 0; }
.place-head > div.place-title:first-child { flex-direction: row; align-items: center; justify-content: flex-start; gap: 6px; min-width: 0; }
.place-title .sees { margin: 0; }
.pieces > li > .help { grid-column: 2 / -1; font-size: var(--text-xs); color: var(--muted); }


button.why { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle;
  align-self: flex-start; flex: none; 
  min-width: var(--touch); min-height: var(--touch); padding: 0; margin: 0; cursor: pointer; font: inherit;
  font-size: var(--text-xs); font-weight: var(--weight-strong); line-height: 1; color: var(--muted);
  background: transparent; border: var(--rule) solid var(--line); border-radius: var(--radius-round); }
button.why:hover, button.why[aria-expanded="true"] { color: var(--ink); border-color: var(--accent); background: var(--tint); }
.why-note { margin: 4px 0 0; font-size: var(--text-sm); color: var(--muted); }
.why-note[hidden] { display: none; }
@media (forced-colors: active) {
  button.why { color: ButtonText; background: ButtonFace; border-color: ButtonText; }
  button.why[aria-expanded="true"] { color: HighlightText; background: Highlight; border-color: Highlight; }
}

#pair-paired .home-screen-only { display: none; }
@media (display-mode: standalone) {
  @supports (-webkit-touch-callout: none) {
    #pair-paired .browser-only { display: none; }
    #pair-paired .home-screen-only { display: flex; }
  }
}

.pair-guide { margin: 0; padding: 0; list-style: none; counter-reset: guide; }
#pair-home[hidden], .pair-guide[hidden], .pair-guide [hidden] { display: none; }  
.pair-guide li { counter-increment: guide; display: flex; gap: 12px; align-items: center; }
.pair-guide li > span { min-width: 0; }
.pair-guide li > span::before { content: counter(guide) ". "; font-weight: var(--weight-strong); }
.pair-guide li button { display: block; margin-top: 8px; }
.guide-art { flex: none; width: 96px; height: 64px; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round;
  stroke-linejoin: round; background: var(--tint); border-radius: var(--radius-sm); }
.guide-art .hot { stroke: var(--accent); stroke-width: 2.2; animation: guide-pulse calc(var(--blink) * 2) var(--ease) infinite; }
.guide-art .hot-fill { fill: var(--accent); }
@media (forced-colors: active) { .guide-art, .guide-art .hot { stroke: CanvasText; } .guide-art .hot-fill { fill: Highlight; } }
@keyframes guide-pulse { 50% { stroke-opacity: .4; fill-opacity: .6; } }
@media (display-mode: standalone) { #pair-home { display: none; } }


@media (max-width: 759px) {
  .composer .box .asking { gap: 4px; padding: 8px 10px; }
  .composer .box .asking .options > .option { padding: 6px 10px; min-height: 0; gap: 8px; }
  .composer .box .asking .options > .option > kbd { display: none; }
  .composer .box .asking .actions { gap: 6px; }
  .composer .box .asking p.meta { margin: 0; line-height: 1.35; }
}


@media (max-width: 759px) {
  
  .bar-top .btn.search { --touch: 44px; box-sizing: border-box; min-width: var(--touch); min-height: var(--touch); }
}


.lead > a.meta, .facts-line > a, p > a.row-link.meta { --hit: 28px; position: relative; }
.lead > a.meta::before, .facts-line > a::before, p > a.row-link.meta::before {
  content: ""; position: absolute; inset-inline: 0;
  inset-block-start: calc(-1 * var(--up, (var(--hit) - 100%) / 2));
  inset-block-end: calc(var(--up, (var(--hit) - 100%) / 2) + 100% - var(--hit));
}
@media (max-width: 759px) {
  .lead > a.meta, .facts-line > a, p > a.row-link.meta { --hit: 44px; }
  .lead > a.meta { --up: 18px; }
  p > a.row-link.meta { --up: 11px; }
}


.nav a:active, .nav-more > button:active, .nav-foot button:active, .nav-fold:active,
body:has(> .nav) > .page > .bar-top > .head-menu:active, .composer .chip:active, .composer .attach:not(:disabled):active,
#turns .copy:active, #title > button:not(:disabled):active { background: var(--press); }
.composer .send:not(:disabled):active { background: var(--accent-press); }


ul.rows a.row-link:active, .seg a:active, .seg button:active, button.why:active { background: var(--press); }


.toggle:disabled, .toggle[aria-checked="true"]:disabled { cursor: not-allowed; }
.toggle[aria-checked="true"]:disabled { background: color-mix(in srgb, var(--accent) 40%, var(--pane)); }
.toggle:disabled::after { box-shadow: none; }

.filepick[data-over] { outline: var(--ring) solid var(--accent); outline-offset: -2px; background: var(--here); }

#panel .viewer textarea { width: 100%; box-sizing: border-box; font-size: var(--text-xs); line-height: 1.5;
  resize: vertical; } 
#panel .viewer .row { align-items: center; }

#panel .pfiles-bar { gap: 6px; align-items: center; }
#panel .pfiles-bar input[type="search"] { flex: 1; min-width: var(--touch); }
#panel .ptree { list-style: none; margin: 0; padding: 0; }
#panel .ptree li[role="treeitem"] { padding: 4px 8px 4px calc(8px + (var(--lvl, 1) - 1) * 14px); border-radius: var(--radius-sm);
  cursor: default; overflow-wrap: anywhere; -webkit-touch-callout: none; user-select: none; }
#panel .ptree li[role="treeitem"][data-dir="1"] .tname::before { content: "\25B8\00A0"; }
#panel .ptree li[role="treeitem"][aria-expanded="true"] .tname::before { content: "\25BE\00A0"; }
#panel .ptree li[aria-selected="true"] { background: var(--hover); }
#panel .ptree .pempty { padding: 6px 8px; color: var(--muted); }
.pop.pmenu[data-files-menu] { display: flex; flex-direction: column; min-width: 180px; padding: 4px; }
.pop.pmenu[data-files-menu] [role="menuitem"] { background: none; border: 0; color: inherit; font: inherit; text-align: start; }
.pop.pmenu [data-warn] { color: var(--bad-text); }
#panel fieldset.pitem { border: 0; margin: 0; padding: 0; min-width: 0; }

.trail-view:not(:has(.tv-files)) { grid-template-columns: minmax(0, 1fr); }

.bw-lead { align-items: center; }
.bw-lead > button.why { align-self: center; }
.bw-rule-rows .end { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bw-rule-rows .end form.inline { display: inline-flex; margin: 0; }

.bw-because { display: block; margin: 0; color: var(--muted); font-size: var(--text-xs); }
.bw-because b { color: var(--ink); }
.bw-because i { font-style: italic; }
@media (max-width: 759px) {
  ul.rows.bw-rule-rows > li { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .bw-rule-rows .end { justify-content: space-between; }
}

.bw-brief-card .lead { align-items: center; gap: 8px; }
.bw-brief-card .lead h3 { margin-right: 0; }
.bw-brief-card .lead > button.why { align-self: center; }
.bw-brief-card .lead .btn { margin-inline-start: auto; }
@media (max-width: 759px) {
  .bw-brief-card .lead .btn { flex: 1 1 100%; margin-inline-start: 0; min-height: var(--touch); }
}

.bw-yours .lead { align-items: center; gap: 8px; }
.bw-yours .lead h3 { margin-right: 0; }
.bw-yours .lead > button.why { align-self: center; }
.bw-yours .lead .meta { margin-inline-start: auto; }
.bw-yours > .btn { align-self: flex-start; justify-self: start; }
@media (max-width: 759px) {
  .bw-yours > .btn { min-height: var(--touch); }
}

.bw-look-rows .end { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bw-look-rows .end form.inline { display: inline-flex; margin: 0; }
.bw-look-rows .what .meta { margin-top: 2px; }
.bw-look-lines { margin: 8px 0 0; padding: 8px 10px; font-size: var(--text-xs); line-height: 1.5; background: var(--bg);
  border: 1px solid var(--line); border-radius: var(--radius-sm); white-space: pre; }
@media (max-width: 759px) {
  ul.rows.bw-look-rows > li { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .bw-look-rows .end { justify-content: flex-start; }
  .bw-look-rows .end .btn { min-height: var(--touch); }
}

.bw-detail .bw-gap { gap: 8px; }
.bw-detail .bw-gap + .bw-gap { padding-top: var(--gap); border-top: var(--rule) solid var(--line); }
.bw-detail .bw-gap p { margin: 0; }
.bw-detail .bw-gap form.inline { display: inline-flex; margin: 0; }
@media (max-width: 759px) { .bw-detail .bw-gap .btn { min-height: var(--touch); } }

.bw-standing .lead { align-items: center; gap: 8px; }
.bw-standing .lead h3 { margin-right: 0; }
.bw-standing .lead .btn { margin-inline-start: auto; }
.bw-standing .bw-standing-who { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bw-standing form.inline { display: inline-flex; margin: 0; }
@media (max-width: 759px) {
  .bw-standing .lead .btn { flex: 1 1 100%; margin-inline-start: 0; min-height: var(--touch); }
}

.toggle[data-tip]::before { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 6px); translate: -50% 0; padding: 4px 8px; border-radius: var(--radius-sm); background: var(--ink); color: var(--bg); font: 400 var(--text-xs)/1.3 var(--font-ui); white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity 120ms 300ms; z-index: 20; display: none; }
.toggle[data-tip]:hover::before, .toggle[data-tip]:focus-visible::before { display: block; opacity: 1; }
.switch-row .toggle[data-tip]::before { left: auto; right: 0; translate: none; white-space: normal; width: max-content; max-width: min(280px, calc(100vw - 32px)); }
@media (hover: none) { .toggle[data-tip]:hover::before { display: none; opacity: 0; } }

:is(.card:has(> ul.rows), ul.rows.card):has(.toggle[data-tip]:is(:hover, :focus-visible)) { overflow: visible; }


.page:has(.bw-page) { --page-max: 100%; }
.bw-page { display: grid; grid-template-columns: 13rem minmax(0, 1fr) 20rem; grid-template-areas: "side main detail" "side moved detail"; gap: 0 var(--gap); align-items: start; }
.bw-page:not(:has(> .bw-detail)) { grid-template-columns: 13rem minmax(0, 1fr); grid-template-areas: "side main" "side moved"; }
.bw-page > .bw-moved { grid-area: moved; min-width: 0; margin-top: var(--gap); }
.bw-page > .bw-side { grid-area: side; min-width: 0; padding: 10px 0; border-inline-end: var(--rule) solid var(--line); font-size: var(--text-sm); }
.bw-page > .bw-side > summary { display: none; }
.bw-page > .bw-main { grid-area: main; min-width: 0; }
.bw-page > .bw-detail { grid-area: detail; min-width: 0; margin: 0; }
.bw-tree { display: flex; flex-direction: column; gap: 2px; padding: 0 8px; }
.bw-tree input[type="search"] { width: 100%; box-sizing: border-box; margin-bottom: 8px; font-size: var(--text-sm); }
.bw-tree ul { list-style: none; margin: 0; padding: 0; }
.bw-tree [role="treeitem"] { outline-offset: -2px; }
.bw-tree[data-keys] [aria-expanded="false"] + [role="group"] { display: none; }
.bw-row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 4px 6px; cursor: pointer; border-radius: var(--radius-xs); }
.bw-row:hover { background: var(--hover); }
.bw-dir > .bw-row { color: var(--muted); font-size: var(--text-xs); font-weight: var(--weight-strong); letter-spacing: var(--tracking-wide); text-transform: uppercase; }
.bw-dir > ul { padding-inline-start: 6px; }
body .bw-tree a, body .bw-tree a:hover { color: var(--ink); }
.bw-leaf { display: flex; justify-content: space-between; gap: 8px; padding: 4px 6px; text-decoration: none; border-radius: var(--radius-xs); }
.bw-leaf:hover { background: var(--hover); }
.bw-thing > ul { padding-inline-start: 14px; border-inline-start: var(--rule) solid var(--line); margin-inline-start: 10px; }
.bw-mem { display: flex; align-items: baseline; gap: 6px; padding: 3px 6px; text-decoration: none; border-radius: var(--radius-xs); font-size: var(--text-xs); }
.bw-mem:hover { background: var(--hover); }
.bw-tree [aria-current="true"] { background: var(--here); border-inline-start: var(--ring) solid var(--accent); font-weight: var(--weight-strong); } 
.bw-tag { flex: none; color: var(--muted); font-size: var(--text-xs); }
.bw-detail .bw-by { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; }
.bw-acts { flex-wrap: wrap; gap: 6px; align-items: flex-start; }
.bw-acts > details[open] { flex-basis: 100%; }
.bw-acts > details > summary { list-style: none; display: inline-flex; align-items: center; box-sizing: border-box; } 
.bw-acts > details > summary::-webkit-details-marker { display: none; }
.bw-acts > details > form { margin-top: 8px; }
@media (min-width: 760px) and (max-width: 1199px) {
  .bw-page { grid-template-columns: 13rem minmax(0, 1fr); grid-template-areas: "side main" "side detail" "side moved"; }
  .bw-page > .bw-detail { margin-top: var(--gap); }
}
@media (max-width: 759px) {
  .bw-page, .bw-page:not(:has(> .bw-detail)) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main" "detail" "moved" "side"; gap: var(--gap) 0; }
  .bw-page { --touch: 44px; } 
  .bw-page > .bw-side { border-inline-end: 0; border-top: var(--rule) solid var(--line); padding: 0; }
  .bw-page > .bw-side > summary { display: flex; padding: 10px 14px; font-weight: var(--weight-strong); }
  .bw-row, .bw-leaf, .bw-mem, .bw-tree input[type="search"] { min-height: var(--touch); display: flex; align-items: center; box-sizing: border-box; }
}

@media (min-width: 1200px) {
  .bw-page:has(> .bw-detail) .bw-with-detail { grid-template-columns: minmax(0, 1fr); }
}

.bw-page > .bw-main { container: bwmain / inline-size; }
@container bwmain (max-width: 599.98px) {
  .trail-view.bw:not(:has(.bw-empty)) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "top" "chips" "canvas" "detail"; }
  .bw .bw-beside { border-inline-start: 0; border-top: var(--rule) solid var(--line); }
}




.lead > a.meta, p > a.row-link.meta, .lead .count, a.card.stack > .meta, .chips a.chip, .chips button.chip, .peek-host,
#cookbook-month, .countline, .speed b, .seg small, .pager .pages { font-variant-numeric: tabular-nums; }


h4 { text-wrap: balance; }
p, li, dd, figcaption, small { text-wrap: pretty; }
#turns p, #turns li, #turns dd, #turns figcaption, #turns small { text-wrap: wrap; }


a.card:active, .composer button.pick:active, .composer .ctx:active, .composer .stop:active,
.pop [role="option"]:active, .pop [role="menuitem"]:active, .pane a:active, .settings-sheet .set-row:active, .stop-mini:active,
#folder-browse ul.files > li > button.row-link:active, #report-pick button[data-chat]:active,
.options > .option:active { background: var(--press); }


:where(.btn, .back, button.why, details > summary:not(.fold details.more > summary), .composer .attach, .composer .send,
  .composer .ctx, .composer > p > a, p.meta > a, #cookbook-compare > a, .bar-top .brand a, .chips a.chip,
  .chips button.chip, .mpath a, .mpath-more a) { position: relative; --hit: 40px; --hit-i: var(--hit); }
@media (max-width: 759px) {
  :where(.btn, .back, button.why, details > summary:not(.fold details.more > summary), .composer .attach, .composer .send,
    .composer .ctx, .composer > p > a, p.meta > a, #cookbook-compare > a, .bar-top .brand a) { --hit: 44px; }
}
:where(.btn, .back, button.why, details > summary:not(.fold details.more > summary), .composer .attach, .composer .send,
  .composer .ctx, .composer > p > a, p.meta > a, #cookbook-compare > a, .bar-top .brand a, .chips a.chip,
  .chips button.chip, .mpath a, .mpath-more a)::before {
  content: ""; position: absolute; inset-block: min(0px, calc((100% - var(--hit)) / 2));
  inset-inline: min(0px, calc((100% - var(--hit-i)) / 2));
}
.chips a.chip, .chips button.chip { --hit: 38px; }
.mpath a, .mpath-more a { --hit: 34px; }
.bar-top .brand a { --hit-i: 38px; }
ul.rows button.why { --hit: 24px; }

@media (min-width: 760px) { .lead > a.meta, .facts-line > a, p > a.row-link.meta { --hit: 40px; } }

@media (pointer: coarse) {
  :root :is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"]), textarea, select) { font-size: max(1rem, 16px); }
  :where(.chip, [role=tab], .panel-icon, .pager a) { position: relative; --hit: 44px; --hit-i: var(--hit); }
  :where(.chip, #turns .rewind, [role=tab], .panel-icon, .pager a)::before {
    content: ""; position: absolute; inset-block: min(0px, calc((100% - var(--hit, 44px)) / 2)); inset-inline: min(0px, calc((100% - var(--hit-i, 44px)) / 2)); }
  .chip { box-sizing: border-box; min-inline-size: 44px; justify-content: center; }  
  #calendar span > a.btn.small + .btn.small { margin-inline-start: 8px; }  
  form.job-form > select + .btn { margin-block-start: 12px; }  
  .chips { row-gap: 14px; }  
  #turns { --copy-w: 44px; --copy-h: 44px; } #turns .copy { min-height: 44px; min-width: 44px; }  
  #memory-last-sort form.inline { display: inline-block; margin-block: 6px; }  
  :where(.btn, .back, button.why, details > summary:not(.fold details.more > summary), .composer .attach, .composer .send, .composer .ctx,
    .composer > p > a, p.meta > a, #cookbook-compare > a), .chips a.chip, .chips button.chip, .mpath a, .mpath-more a { --hit: 44px; --hit-i: 44px; }
}

.lead > a.meta { z-index: 1; }
.mpath-row { position: relative; z-index: 1; }

@media (max-width: 759px) {
  #cookbook-compare > button.why::before { inset-block: -11px -9px; }  
  #cookbook-compare + #cookbook-usage > summary::before { inset-block: -8px -10px; }
}


#turns > #away { margin: 0; padding-block: calc(var(--gap) * .25); border-block: var(--rule) solid var(--line); }
#turns > #away > summary { color: var(--muted); }
#turns > #away > p { margin: 0 0 var(--gap); }


.censor[aria-pressed="true"] { color: var(--ink); background: var(--tint); }

:is(.censor, .row-menu [data-act="head"]) .eye { position: relative; display: inline-block; inline-size: 1.25em; block-size: .8em; border: var(--rule) solid currentColor;
  border-radius: var(--radius-round); }
:is(.censor, .row-menu [data-act="head"]) .eye::after { content: ""; position: absolute; inset-block-start: 50%; inset-inline-start: 50%; inline-size: .3em;
  block-size: .3em; translate: -50% -50%; border-radius: var(--radius-round); background: currentColor; }
.censor[aria-pressed="true"] .eye::before { content: ""; position: absolute; inset-block-start: -.25em; inset-inline-start: 50%;
  block-size: 1.3em; border-inline-start: var(--rule) solid currentColor; rotate: 45deg; }
.censored :is(main, .nav-chats) :is(p, li, h1, h2, h3, h4, h5, dt, dd, td, th, blockquote, pre, summary, figcaption, label, textarea,
  strong, b, em, small, code, time, .badge, .meta, .model,
  input:not([type="checkbox"], [type="radio"], [type="range"])):not(:is(button, .btn, [role="button"]) *),
.censored :is(main, .nav-chats) :is(p, li, h1, h2, h3, h4, h5, dt, dd, td, th, blockquote, pre, summary, figcaption, label) *:not(:is(button, .btn, [role="button"]), :is(button, .btn, [role="button"]) *),
.censored .nav-chats a, .censored .bar-top .here {
  color: transparent !important; text-shadow: 0 0 max(.45em, 16px) var(--ink) !important; }
.censored main :is(img, picture, video, canvas) { filter: brightness(0); }

#chats .notice[role="status"] { padding: calc(var(--gap) / 2) 0 calc(var(--gap) / 2) var(--gap); border-left: calc(var(--rule) * 2) solid var(--accent); gap: 6px; }
#chats .notice[role="status"] p { margin: 0; }

.dl-ask .lead { align-items: center; gap: 10px; }
.dl-ask p { margin: 0; }

.crash .report-body { padding-bottom: 20px; }

ul.rows.models details.file[data-log] > pre.log { max-height: 8em; overflow: auto; margin: 6px 0; padding: calc(var(--pad) / 2) calc(var(--pad) * .75); background: var(--pane);
  border-radius: var(--radius-sm); font-size: var(--text-xs); }
ul.rows.models details.file[data-log] > .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
ul.rows.models details.file[data-log] > .actions .meta { margin: 0; font-size: var(--text-xs); }

.seg [aria-checked="true"] { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-rest); }
#frame-block[hidden], #frame-none[hidden], #frame-block .end[hidden] { display: none; }

#setting li[data-key="updates-remind"] .end { grid-column: 1 / -1; justify-self: start; }
#frame-block .frame-row .end:last-child { grid-column: 1 / -1; justify-self: start; }
@media (max-width: 759px) { #frame-block .frame-row .end { grid-column: 1 / -1; justify-self: start; } }  

@media (max-width: 759px) { #gpu-block .frame-row .end, .lighter-row .frame-row .end { grid-column: 1 / -1; justify-self: start; } }

.msg .img-gate { flex-wrap: wrap; gap: 6px 12px; align-items: center; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--pane); }
.msg .img-gate .end { margin-left: auto; display: flex; gap: 6px; flex-wrap: wrap; }
.msg .msg-html { border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: #ffffff; color: #1f2328; overflow: auto; }
.msg .msg-html iframe { display: block; inline-size: 100%; block-size: min(70dvh, 640px); border: 0; background: #ffffff; color-scheme: light; }
.msg .img-said { margin: 0; }
.msg .img-said form.inline, .msg .img-gate form.inline { display: inline; margin: 0; }
.msg ul.rows.attach { margin: 0; }

@media (min-width: 760px) { @container page (max-width: 829.98px) {
  .models-cols, .layout-cols, #capabilities .grid2, #tools .grid2 { grid-template-columns: minmax(0, 1fr); }
  ul.rows.models > li { grid-template-columns: minmax(0, 1fr); }
  ul.rows.models .end { justify-self: start; flex-wrap: wrap; }
  #tools ul.rows > li.trow { grid-template-columns: minmax(0, 1fr); }
  #tools .trow .end { justify-self: start; justify-content: flex-start; }
} }
@media (min-width: 760px) { @container page (max-width: 829.98px) { 
  .cat-h { display: none; }
  .fam, .cat .fam { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 10px 12px; gap: 8px 10px; }
  .fam .nm { grid-column: 1 / -1; }
  .cat .fam .q { grid-column: 1 / 3; }
  .cat .fam .ft { grid-column: 3 / 4; }
  .fam .lc { grid-column: 1 / -1; }
  .kids .fam .nm { padding-left: 12px; }
  .detail { margin: 2px 8px 10px; }
  .cat .get { padding: 0 12px 10px; }
  .recs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fgrid, details.filters-at .filters-menu .fgrid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
} }
.listbar > .btn { flex: none; white-space: nowrap; } 

.options.prof-pick > .option > .what { flex: 1; }
.confirm-window label:has(> input[type="checkbox"]) { display: flex; align-items: center; gap: 10px; }


ul.jobs-one { margin: 0; padding: 0; list-style: none; font-size: var(--text-sm); }
ul.jobs-one > li.jline { display: grid; grid-template-columns: minmax(7rem, .7fr) minmax(0, 1.5fr) minmax(0, 1.2fr) max-content;
  gap: 4px 16px; align-items: start; padding: 12px 14px; border-top: var(--rule) solid var(--line); font-size: var(--text-sm); }
ul.jobs-one > li.jline:first-child { border-top: 0; }
.jline .jn { display: flex; align-items: center; gap: 6px; font-weight: var(--weight-strong); min-height: 28px; }
.jline .jm, .jline .jk { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; min-width: 0; }
.jline .jm small, .jline .jk .jt { flex-basis: 100%; color: var(--muted); font-size: var(--text-xs); }
.jline .jk .jt { display: flex; gap: 6px; flex-wrap: wrap; }
.jline .jm b.none { color: var(--muted); font-weight: var(--weight-medium); }

ul.rows.perms { grid-template-columns: minmax(0, 1fr) max-content; }

.jline :is(.jn, .jm, .jk) { overflow-wrap: normal; word-break: normal; hyphens: manual; }
.jline .jm b.jname { display: inline-flex; min-width: 0; max-width: 100%; white-space: nowrap; }
.jline .jm b.jname > span:first-child { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.jline .jm b.jname > span + span { flex: none; }
:root:is([data-text="large"], [data-text="larger"]) ul.jobs-one > li.jline { grid-template-columns: minmax(0, 1fr) max-content; gap: 6px 10px; }
:root:is([data-text="large"], [data-text="larger"]) .jline > .jn { grid-column: 1; grid-row: 1; }
:root:is([data-text="large"], [data-text="larger"]) .jline > details.jchange { grid-column: 2; grid-row: 1; }
:root:is([data-text="large"], [data-text="larger"]) .jline > .jm { grid-column: 1 / -1; grid-row: 2; }
:root:is([data-text="large"], [data-text="larger"]) .jline > .jk { grid-column: 1 / -1; grid-row: 3; }
:root:is([data-text="large"], [data-text="larger"]) .jline > details.jchange[open] { grid-column: 1 / -1; grid-row: 1 / span 4; }
:root:is([data-text="large"], [data-text="larger"]) .jline > details.jchange[open]::details-content { grid-row: 4; }
.jline.later .jn { color: var(--muted); font-weight: var(--weight-medium); }
.jline > details.jchange { justify-self: end; }

.jline > .jn { grid-row: 1; grid-column: 1; }
.jline > .jm { grid-row: 1; grid-column: 2; }
.jline > .jk { grid-row: 1; grid-column: 3; }
.jline > details.jchange { display: grid; grid-template-columns: subgrid; grid-template-rows: subgrid; }  
.jline > details.jchange[open] { grid-column: 1 / -1; grid-row: 1 / span 2; justify-self: stretch; pointer-events: none; }
.jline > details.jchange[open] > summary { grid-column: -2 / -1; grid-row: 1; pointer-events: auto; }
.jline > details.jchange[open]::details-content { grid-column: 1 / -1; grid-row: 2; pointer-events: auto; min-block-size: 0; }
.jline details.jchange > summary { list-style: none; cursor: pointer; width: max-content; margin-left: auto; }
.jline details.jchange > summary::-webkit-details-marker { display: none; }
.jline details.jchange > form { margin-top: 8px; }
.jobs-card details.more-jobs { border-top: var(--rule) solid var(--line); padding-block: 0; padding-inline: 0; }
.jobs-card details.more-jobs > summary { padding: calc(var(--gap) * .75) calc(var(--pad) * .875); font-size: var(--text-sm); cursor: pointer; }
.jobs-card details.more-jobs[open] > summary { border-bottom: var(--rule) solid var(--line); }
@media (max-width: 759px) {
  ul.jobs-one > li.jline { grid-template-columns: minmax(0, 1fr) max-content; gap: 6px 10px; }
  .jline .jn { grid-column: 1; grid-row: 1; }
  .jline > details.jchange { grid-column: 2; grid-row: 1; }
  .jline > details.jchange > summary { min-height: 44px; }
  .jline > .jm { grid-column: 1 / -1; grid-row: 2; }
  .jline > .jk { grid-column: 1 / -1; grid-row: 3; }
  .jline > details.jchange[open] { grid-column: 1 / -1; grid-row: 1 / span 4; }
  .jline > details.jchange[open]::details-content { grid-row: 4; }
}


.launch-top { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.launch-top .lb-fields { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0; flex: 1 1 18rem; }
.launch-top .lb-fields > div { display: flex; flex-direction: column; gap: 0; }
.launch-top .lb-fields dt { font-size: var(--text-xs); color: var(--muted); }
.launch-top .lb-fields dd { margin: 0; font-weight: var(--weight-strong); font-size: var(--text-sm); }
.launch-top .lb-fields dd small { font-weight: normal; color: var(--muted); }
.launch-top > .actions { flex: 0 1 auto; align-items: center; }  
@media (max-width: 759px) { .launch-top > .actions { flex: 1 1 100%; } .launch-top > .actions .btn, .launch-top > .actions form { flex: 1 1 100%; }
  .launch-top > .actions .btn { min-block-size: 44px; } }


.mode-card .lead { margin: 0; }
.mode-card .lead .badge { flex: none; }
.mode-pick .what { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mode-pick .otags { margin-left: auto; display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; flex: none; }
@media (max-width: 759px) { .mode-pick > .option { align-items: flex-start; min-height: 44px; flex-wrap: wrap; }
  .mode-pick .otags { margin-left: 0; justify-content: flex-start; flex-basis: 100%; } }


.jobstrip, .jobs-ask { --touch: 44px; }
.model-card.has-jobs { position: relative; overflow: visible; }
.jobstrip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; margin: calc(-1 * var(--pad)) calc(-1 * var(--card-pad-x, var(--pad))) 0;
  border-bottom: var(--rule) solid var(--line); border-start-start-radius: var(--radius); border-start-end-radius: var(--radius); position: relative; }
.jobstrip .job { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  padding: 6px 10px; border: 0; border-bottom: 2px solid transparent; border-right: var(--rule) solid var(--line); background: none; color: var(--muted);
  font: inherit; font-size: var(--text-sm); font-weight: var(--weight-medium); line-height: var(--lh-tight); cursor: pointer; }
.jobstrip .job:first-child { border-top-left-radius: var(--radius); }
.jobstrip .job.other { flex-direction: row; gap: 4px; border-right: 0; border-top-right-radius: var(--radius); }
.jobstrip .job small { font-size: var(--text-xs); font-weight: var(--weight-strong); color: var(--muted); }
.jobstrip .job[aria-pressed="true"] { background: var(--tint); color: var(--tint-ink); border-bottom-color: var(--accent); }
.jobstrip .job[aria-pressed="true"] small { color: var(--tint-ink); }
.jobstrip .job:hover { background: var(--hover); }
.jobstrip .job[aria-pressed="true"]:hover { background: var(--tint); }
.jobstrip .job[aria-disabled="true"] { text-decoration: line-through; text-decoration-thickness: 1px; cursor: not-allowed; }
.jobstrip .job svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.jobstrip .job:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.jobs-menu { position: absolute; inset-block-start: calc(100% + 4px); inset-inline-end: 8px; z-index: 15; width: min(22rem, calc(100% - 16px)); }
.jobs-menu [role="menuitem"] { width: 100%; box-sizing: border-box; border: 0; background: none; color: inherit; text-align: left; font: inherit;
  cursor: pointer; }
.jobs-menu [role="menuitem"] > span { flex: 1 1 auto; min-width: 0; }
.jobs-menu [role="menuitem"] small { display: block; color: var(--muted); font-size: var(--text-xs); font-weight: normal; }
.jobs-menu [role="menuitem"] > .badge { flex: none; margin-left: auto; }
.jobs-ask { display: grid; gap: 6px; padding: 10px 12px; background: var(--tint); border-radius: var(--radius-sm); font-size: var(--text-sm); }
.jobs-ask p { margin: 0; }
.jobs-ask .cost { color: var(--muted); font-size: var(--text-xs); }
.jobs-ask .actions { margin: 4px 0 0; }
.jobs-ask .actions form { display: contents; }
@media (max-width: 759px) {
  .jobstrip .job { font-size: var(--text-xs); padding: 6px 4px; }
  .jobstrip .job.other span { max-width: 4.5em; line-height: 1.15; text-align: left; }
}


.stat-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0;
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.stat-strip > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 10px var(--pad);
  border-left: var(--rule) solid var(--line); }
.stat-strip > div:first-child { border-left: 0; }
.stat-strip dt { margin: 0; font-size: var(--text-xs); color: var(--muted); }
.stat-strip dd { margin: 0; font-size: var(--text-lg); font-weight: var(--weight-strong); color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stat-strip dd[data-empty] { color: var(--muted); font-weight: normal; }
.stat-strip dd[data-empty]::before { content: "\2013"; }
@media (max-width: 759px) {
  .stat-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-strip > div { min-height: 56px; }
  .stat-strip > div:nth-child(odd) { border-left: 0; }
  .stat-strip > div:nth-child(n+3) { border-top: var(--rule) solid var(--line); }
}


.pres { display: none; flex: none; flex-direction: column; gap: 8px; box-sizing: border-box; width: 0; padding: 14px 0; overflow: hidden;
  position: sticky; top: var(--chrome-bar, 0px); height: calc(100dvh - var(--chrome-bar, 0px)); background: var(--pane);
  border-right: var(--rule) solid var(--line);
  transition: width var(--tick) var(--ease-out), padding var(--tick) var(--ease-out), display var(--tick) var(--ease-out) allow-discrete; }
:root[data-presence="open"] .pres { display: flex; width: 272px; padding-inline: 12px; overflow-y: auto; }
@starting-style { :root[data-presence="open"][data-presence-move] .pres { width: 0; padding-inline: 0; } }
.pres > * { min-width: 248px; }
@media (min-width: 760px) { body > .pres + .page { flex: 1 1 auto; min-width: 0; } }  
.pres-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 36px; }
.pres-head h2 { margin: 0; font-size: var(--text-base); font-weight: var(--weight-strong); display: flex; align-items: center; gap: 8px; }
.pres-n { min-width: 22px; padding: 1px 7px; box-sizing: border-box; text-align: center; border-radius: var(--radius-pill);
  background: var(--surface); border: var(--rule) solid var(--line); font-size: var(--text-xs); font-weight: var(--weight-strong); color: var(--muted); }
.pres-tools { display: flex; gap: 2px; position: relative; }
.pres-tools .btn { width: 32px; height: 32px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.pres-find { width: 100%; box-sizing: border-box; min-height: 36px; }
.pres-group { display: block; }
.pres-group > summary { list-style: none; display: flex; align-items: center; gap: 8px; min-height: 32px; padding: 0 6px;
  cursor: pointer; border-radius: var(--radius-sm); color: var(--muted); font-size: var(--text-xs); font-weight: var(--weight-strong);
  letter-spacing: .06em; text-transform: uppercase; }
.pres-group > summary::-webkit-details-marker { display: none; }

.pres-group > summary::after { order: -1; content: ""; width: 6px; height: 6px; margin-right: 2px; border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor; transform: translateY(-1px) rotate(45deg); }
.pres-group:not([open]) > summary::after { transform: rotate(-45deg); }
.pres-group > summary:hover { background: var(--hover); }
.pres-group > summary b { margin-left: auto; font-weight: var(--weight-strong); font-variant-numeric: tabular-nums; }
.pres-group ul { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.pres-group[data-zero] > summary { cursor: default; }
.pres-group[open] > summary { margin-bottom: 0; }  
a.pres-row { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 6px 8px; border-radius: var(--radius-sm);
  color: var(--ink); text-decoration: none; }
a.pres-row:hover { background: var(--hover); color: var(--ink); }
.pres-row .kind { width: 18px; height: 18px; flex: none; fill: none; color: var(--muted); stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pres-row .what { min-width: 0; display: flex; flex-direction: column; }
.pres-row .what b { font-weight: var(--weight-medium); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pres-row .what small { color: var(--muted); font-size: var(--text-xs); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pres-dot { flex: none; width: 9px; height: 9px; box-sizing: border-box; border-radius: var(--radius-round); margin-left: auto; order: 3; }
.pres-dot[data-on] { background: var(--ok); }
.pres-dot:not([data-on]) { border: 2px solid var(--field); }
.pres-foot { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.pres-foot .btn { justify-content: center; }
.pres-menu { position: absolute; z-index: 5; top: 36px; right: 0; width: 200px; margin: 0; padding: 4px; list-style: none;
  background: var(--surface); border: var(--rule) solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-pop); }
.pres-menu a { display: flex; align-items: center; min-height: 40px; padding: 0 10px; border-radius: var(--radius-sm); color: var(--ink); text-decoration: none; }
.pres-menu a:hover { background: var(--hover); color: var(--ink); }
.pres-open { gap: 6px; }
.pres-open b { font-size: var(--text-xs); font-weight: var(--weight-strong); font-variant-numeric: tabular-nums; }
.pres-open[aria-expanded="true"] { background: var(--here); }
@media (max-width: 759px) {
  .pres { transition: none; }
  :root[data-presence="open"] .pres { position: fixed; inset: 0; z-index: 12; width: auto; height: auto;
    padding: calc(8px + env(safe-area-inset-top)) var(--side) 24px; border-right: 0; background: var(--bg); }
  .pres > * { min-width: 0; }
  .pres-head { min-height: 44px; }
  .pres-tools .btn { width: 44px; height: 44px; }
  .pres-group > summary { min-height: 44px; }
  a.pres-row { min-height: 56px; }
  .pres-open { min-width: 44px; min-height: 44px; }
  .pres-menu { top: 48px; }
  .pres-menu a { min-height: 44px; }
}


.compose-slots { display: flex; flex-direction: column; gap: 14px; padding: var(--pad); background: var(--here);
  border-radius: var(--radius); border: var(--rule) solid var(--line);
  box-shadow: 0 0 0 var(--rule) var(--done-ring), 0 0 18px -4px color-mix(in srgb, var(--accent) 45%, transparent); }
.compose-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.compose-head h3 { margin: 0; }
.compose-head .meta { margin: 0; }
.compose-slots textarea { inline-size: 100%; box-sizing: border-box; }
.compose-field { display: flex; flex-direction: column; gap: 6px; }
.compose-field > label, .compose-field > span { font-size: var(--text-sm); color: var(--muted); }
.cs-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cs-wrap { position: relative; min-inline-size: 0; }
.cs-slot { display: flex; align-items: center; gap: 10px; inline-size: 100%; min-block-size: 52px; box-sizing: border-box;
  padding: 6px 14px 6px 8px; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-pill);
  background: var(--surface); color: var(--ink); font: inherit; text-align: start; cursor: pointer; }
.cs-slot:hover { background: var(--hover); }
.cs-slot:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.cs-slot[aria-expanded="true"] { border-color: var(--accent); background: var(--tint); }
.cs-slot .ico { display: grid; place-items: center; flex: none; inline-size: 36px; block-size: 36px; border-radius: var(--radius-pill);
  background: var(--tint); color: var(--accent-text); }
.cs-slot .ico svg { inline-size: 18px; block-size: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cs-slot .txt { display: flex; flex-direction: column; min-inline-size: 0; line-height: 1.25; }
.cs-slot small { color: var(--muted); font-size: var(--text-xs); }
.cs-slot b { font-weight: var(--weight-strong); font-size: var(--text-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-panel { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; padding: 12px; background: var(--pane);
  border: var(--rule) solid var(--line); border-radius: var(--radius-sm); }
.cs-panel .seg button { white-space: nowrap; }
.cs-panel .field-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.cs-panel .meta { margin: 0; }
.compose-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.compose-foot .more { display: inline-flex; align-items: center; gap: 6px; }
.compose-foot .more svg { flex: none; }
.compose-foot .more[aria-expanded="true"] svg { rotate: 180deg; }
.compose-foot .btn.primary { min-block-size: 44px; padding-inline: 22px; }
.compose-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; padding-block-start: 14px;
  border-block-start: var(--rule) solid var(--line); }
.compose-more .compose-field.wide { grid-column: 1 / -1; }
.compose-more input[type="text"], .compose-more select { inline-size: 100%; box-sizing: border-box; }
.compose-more .meta { margin: 0; }
.cs-panel[hidden], .compose-more[hidden], .cs-panel .field-row[hidden] { display: none; }
.compose-slots[data-press] .cs-slot[data-task] { background: var(--pane); color: var(--muted); }  
.compose-slots .cs-status { margin: 0; }
.compose-slots .cs-panel .asking { inline-size: 100%; }

.cs-slot[data-tip]::after { left: 0; translate: none; inline-size: max-content; max-inline-size: min(280px, calc(100vw - 2 * var(--side, 20px)));
  white-space: normal; overflow-wrap: anywhere; }
.cs-wrap:nth-child(n+3) .cs-slot[data-tip]::after { left: auto; right: 0; }
.compose-slots .cs-panel .mono { overflow-wrap: anywhere; }

.compose-slots { container-type: inline-size; }
@container (max-width: 640px) {
  .cs-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-wrap:nth-child(odd) .cs-slot[data-tip]::after { left: 0; right: auto; }
  .cs-wrap:nth-child(even) .cs-slot[data-tip]::after { left: auto; right: 0; }
}
@media (max-width: 759px) {
  .cs-wrap:nth-child(odd) .cs-slot[data-tip]::after { left: 0; right: auto; }
  .cs-wrap:nth-child(even) .cs-slot[data-tip]::after { left: auto; right: 0; }
}
@media (max-width: 759px) {
  .cs-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-slot { min-block-size: 56px; padding-inline-end: 10px; }
  .compose-foot { flex-wrap: wrap; }
  .compose-foot .btn { min-block-size: 44px; }
  .compose-foot .btn.primary { flex: 1 1 100%; order: -1; }
  .compose-more { grid-template-columns: 1fr; }
}


.composer .box { position: relative; }
#slash-place { position: absolute; z-index: 5; left: 0; right: 0; bottom: calc(100% + 6px); } 
#slash { margin: 0; }
#slash > .pop { max-height: min(60dvh, 420px); overflow-y: auto; }
#slash [hidden] { display: none; }
#slash [role="option"] { color: var(--ink); text-decoration: none; }
#slash [data-row] { min-width: 0; } 
#slash [data-skills] { display: contents; }
#slash-said { margin: 0; padding: 6px 10px; }
#slash-said:empty { display: none; }
#slash-said { background-color: var(--surface); border-radius: var(--radius-sm); }  
@media (max-width: 759px) { 
  #slash > .pop { max-height: 50dvh; }
  #slash [role="option"] { min-height: var(--touch); box-sizing: border-box; }
}

.lg-picker [hidden], .lg-accent [hidden] { display: none; }
.lg-prev { position: relative; background: var(--wall-shown), var(--bg); min-height: calc(var(--touch) * 7); border-radius: var(--radius); overflow: hidden; display: grid;
  place-items: center; padding: calc(var(--touch) * 1.3) var(--pad); border: var(--rule) solid var(--line); }
.lg-prev .lg-card { width: min(100%, 20rem); padding: var(--pad); border-radius: var(--radius); display: grid; gap: calc(var(--gap) / 2); justify-items: start; }
.lg-prev .lg-card .btn { margin-top: calc(var(--gap) / 2); }
.lg-dot[data-n="1"] { left: 12%; top: 12%; }  
.lg-dot[data-n="2"] { left: 88%; top: 12%; }
.lg-dot[data-n="3"] { left: 30%; top: 88%; }
.lg-dot { position: absolute; z-index: 1; inline-size: calc(var(--touch) * .8); block-size: calc(var(--touch) * .8); translate: -50% -50%; border-radius: var(--radius-round);
  background: var(--c); border: 3px solid var(--ink); display: grid; place-items: center; }
.lg-dot b { font-size: var(--text-xs); line-height: 1; color: var(--ink); background: var(--surface); border-radius: var(--radius-round); padding: 1px 4px; }
.lg-dot[data-sel] { border-color: var(--accent); scale: 1.2; }
.lg-bar-wrap { display: grid; gap: calc(var(--gap) / 2); padding-block: calc(var(--touch) * .6) calc(var(--touch) * 1.4); padding-inline: calc(var(--touch) / 2); margin-block-end: var(--pad); }
.lg-bar { position: relative; block-size: calc(var(--touch) * 1.1); border-radius: var(--radius-pill); border: var(--rule) solid var(--line-strong); }
.lg-stop { position: absolute; top: 50%; inset-inline-start: var(--at); translate: -50% -50%; inline-size: var(--touch); block-size: calc(var(--touch) * 1.8);
  border-radius: var(--radius-sm); background: var(--c); border: 3px solid var(--ink); box-shadow: var(--shadow-btn);
  cursor: grab; touch-action: none; }
.lg-stop i { position: absolute; top: calc(100% + 6px); left: 50%; translate: -50% 0; font-style: normal; font-size: var(--text-xs); color: var(--muted); }
.lg-stop[data-sel] { border-color: var(--accent); scale: 1.1; }
.lg-stop[data-sel] i { color: var(--ink); font-weight: var(--weight-strong); }

.lg-stop { display: grid; place-items: center; inline-size: 28px; block-size: 28px; border-radius: var(--radius-round); background: var(--surface);
  border-color: var(--c); }
.lg-stop::before { content: ""; position: absolute; inset: -8px; }  
.lg-stop i, .lg-stop[data-sel] i { position: static; translate: none; color: var(--ink); font-size: var(--text-xs); font-weight: var(--weight-strong); line-height: 1; }
.lg-stop[data-sel] { border-color: var(--c); outline: 2px solid var(--accent); outline-offset: 2px; scale: 1.1; }
.lg-stop:focus-visible { outline: var(--ring) solid var(--accent); outline-offset: calc(var(--focus-offset) + 4px); }
.lg-keys { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px var(--pad); }
.lg-keys kbd { margin-inline: 2px; }
@media (hover: none) and (pointer: coarse) { .lg-keys { display: none; } }  
.lg-stops { list-style: none; margin: 0; padding: 0; display: grid; gap: calc(var(--gap) / 2); }
.lg-stops > li { display: grid; grid-template-columns: auto auto minmax(0, 12rem) auto; gap: var(--gap); align-items: center; padding: calc(var(--gap) / 2) var(--gap);
  border-radius: var(--radius-sm); border: var(--rule) solid transparent; }
.lg-stops > li[data-sel] { background: var(--tint); border-color: var(--line-strong); }
.lg-stops input[type="color"] { inline-size: calc(var(--touch) * 1.6); block-size: calc(var(--touch) * 1.2); }
@media (max-width: 480px) {  
  .lg-stops > li { gap: calc(var(--gap) / 2); padding-inline: calc(var(--gap) / 2); }
  .lg-stops input[type="color"] { inline-size: var(--touch); }
}
.lg-n { inline-size: var(--touch); block-size: var(--touch); display: grid; place-items: center; border-radius: var(--radius-round); background: var(--pane);
  font-size: var(--text-sm); font-weight: var(--weight-strong); }
.lg-picker input[data-hex], .lg-accent input[data-accent-hex] { min-block-size: var(--touch); text-transform: uppercase; }
.lg-tools { display: flex; flex-wrap: wrap; gap: var(--gap); align-items: center; }
.lg-presets { display: flex; flex-wrap: wrap; gap: var(--gap); margin-block-start: calc(var(--gap) / 2); }
.lg-preset { display: grid; gap: 4px; justify-items: center; cursor: pointer; font-size: var(--text-sm); }
.lg-preset > span.lg-mini { inline-size: calc(var(--touch) * 3); block-size: calc(var(--touch) * 1.4); border-radius: var(--radius-sm); border: var(--rule) solid var(--line-strong); }
.lg-preset:has(input:checked) .lg-mini { outline: var(--ring) solid var(--ink); outline-offset: 2px; }
.lg-preset:has(input:checked) > span:last-child { font-weight: var(--weight-strong); }
.lg-preset:has(input:focus-visible) .lg-mini { outline-color: var(--accent); outline-offset: 4px; }
.lg-accents { display: flex; flex-wrap: wrap; gap: var(--gap); }
.lg-acc { cursor: pointer; display: grid; place-items: center; inline-size: calc(var(--touch) * 1.4); block-size: calc(var(--touch) * 1.4); }
.lg-acc i { box-sizing: border-box; inline-size: calc(var(--touch) * 1.1); block-size: calc(var(--touch) * 1.1); border-radius: var(--radius-round); background: var(--c); border: 3px solid var(--line-strong); }  
.lg-acc:has(input:checked) i { border-color: var(--ink); scale: 1.15; }
.lg-acc:has(input:focus-visible) i { outline: var(--ring) solid var(--accent); outline-offset: 6px; }
.lg-check { display: flex; align-items: center; gap: calc(var(--gap) / 2); margin: 0; }
.lg-warn { display: flex; align-items: flex-start; gap: var(--gap); padding: var(--gap) var(--pad); border-radius: var(--radius-sm); margin: 0;
  border: var(--rule) solid var(--warn); background: color-mix(in srgb, var(--warn) 12%, var(--surface)); }
.lg-warn p { margin: 0; }
.lg-was { display: flex; align-items: center; gap: calc(var(--gap) / 2); font-size: var(--text-sm); color: var(--muted); }
.lg-was i { inline-size: var(--touch); block-size: var(--touch); border-radius: var(--radius-sm); background: var(--c); border: var(--rule) solid var(--line-strong); }
.lg-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); }
.lg-chip { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: calc(var(--gap) * .75); align-items: center; text-align: start; min-block-size: var(--touch);
  padding: calc(var(--gap) / 2) calc(var(--gap) * .75); border-radius: var(--radius-sm); border: var(--rule) solid var(--line-strong); background: var(--surface); color: var(--ink); font: inherit; font-size: var(--text-sm); white-space: nowrap; }
.lg-chip i { grid-row: span 2; inline-size: calc(var(--touch) * .7); block-size: calc(var(--touch) * .7); border-radius: var(--radius-round); background: var(--c); border: 2px solid var(--ink); }
.lg-chip small { color: var(--muted); text-transform: uppercase; }
.lg-chip[aria-expanded="true"] { border-color: var(--accent); outline: calc(var(--ring) - var(--rule)) solid var(--accent); outline-offset: 0; }
.lg-sheet { position: fixed; inset: auto 0 0 0; z-index: 5; max-block-size: 78dvh; overflow: auto; display: grid; gap: var(--gap); padding: var(--pad);
  border-radius: var(--radius); border-end-start-radius: 0; border-end-end-radius: 0; background: var(--surface); border: var(--rule) solid var(--line-strong); border-block-end: 0; box-shadow: var(--shadow-pop); }
.lg-sheet[hidden] { display: none; }
.lg-sheet h3 { margin: 0; display: flex; align-items: center; gap: var(--gap); }
.lg-sheet h3 i { inline-size: var(--touch); block-size: var(--touch); border-radius: var(--radius-round); background: var(--c); border: 2px solid var(--ink); }
.lg-grab { justify-self: center; inline-size: 40px; block-size: 5px; border-radius: var(--radius-xs); background: var(--line-strong); }
.lg-sl { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: var(--gap); align-items: center; }
.lg-sl input[type="range"] { inline-size: 100%; block-size: var(--touch); margin: 0; padding: 0; border: 0; border-radius: var(--radius-pill); appearance: none; -webkit-appearance: none; }
.lg-sl input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; inline-size: calc(var(--touch) * .8); block-size: calc(var(--touch) * .8); border-radius: var(--radius-round);
  background: var(--surface); border: 3px solid var(--ink); }
.lg-sl input[type="range"]::-moz-range-thumb { inline-size: calc(var(--touch) * .8); block-size: calc(var(--touch) * .8); border-radius: var(--radius-round); background: var(--surface); border: 3px solid var(--ink); }
.lg-tints { display: flex; flex-wrap: wrap; gap: calc(var(--gap) / 2); }
.lg-tints .lg-acc { inline-size: var(--touch); block-size: var(--touch); }
.lg-tints .lg-acc i { inline-size: calc(var(--touch) * .8); block-size: calc(var(--touch) * .8); }
.lg-sheet .actions { display: flex; flex-wrap: wrap; gap: var(--gap); }
.lg-sheet .actions .btn.primary { margin-inline-start: auto; }
@media (max-width: 759px) {
  .lg-chip, .lg-stops, .lg-presets, .lg-accents, .lg-tools, .lg-sheet, .lg-stop, .lg-picker, .lg-accent, .lg-transparency { --touch: 44px; }
  .lg-prev { padding-inline: calc(var(--touch) * .8); min-block-size: calc(var(--touch) * 4.5); }
  .lg-picker button.btn, .lg-accent button.btn { min-block-size: 44px; }
  .lg-stops > li { grid-template-columns: auto auto minmax(0, 1fr); }  
  .lg-stops > li > button { display: none; }
}


.asking .ask-h { font-weight: var(--weight-strong); }
dl.fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); gap: 8px 16px; margin: 0; }
dl.fields > div { min-width: 0; }
dl.fields dt { margin: 0; font-size: var(--text-xs); color: var(--muted); }
dl.fields dd { margin: 2px 0 0; font-size: var(--text-sm); font-weight: var(--weight-strong); color: var(--ink); overflow-wrap: anywhere; }
dl.fields dd.none { color: var(--muted); font-weight: normal; }
dl.fields dd.quoted { font-weight: normal; }
dl.fields > .wide { grid-column: 1 / -1; }
dl.fields.strip { padding: 10px 12px; border-radius: var(--radius-sm); background: color-mix(in srgb, var(--muted) 9%, transparent); }
.composer .box .asking > dl.fields { margin-block: 8px; }
@media (max-width: 759px) { dl.fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }


:root { --corner-end: 20px; --corner-h: 40px; }  
.dock-row { position: fixed; inset-inline-end: 20px; inset-block-end: var(--corner-end); z-index: 5; display: grid; grid-template-columns: auto auto;
  justify-content: end; align-items: center; gap: 10px; }
.dock-row [hidden] { display: none; }
.dock-row .dl-dock { position: static; display: contents; }
.dock-row .dlcard { grid-column: 1 / -1; justify-self: end; }
.dlpill .dl-short { display: none; }
@media (max-width: 759px) {
  :root { --corner-end: calc(76px + env(safe-area-inset-bottom)); --corner-h: 44px; }
  .dock-row { inset-inline-end: 12px; }
  .dlpill .dl-long { display: none; } .dlpill .dl-short { display: inline; }
  .dock-row .dlpill { min-block-size: var(--corner-h); box-sizing: border-box; }
}


:root [data-glass] [data-glass] { -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: var(--shadow-rest); }

:root :has(.pop[data-glass]:not([hidden]):not([hidden] *):not([style*="display: none"]):not([popover]:not(:popover-open)))[data-glass],
:root :has(.pres-menu[data-glass]:not([hidden]):not([hidden] *):not([style*="display: none"]):not([popover]:not(:popover-open)))[data-glass],
:root :has(.filters-menu[data-glass]:not([hidden]):not([hidden] *):not([style*="display: none"]):not([popover]:not(:popover-open)))[data-glass] {
  -webkit-backdrop-filter: none; backdrop-filter: none; background-color: var(--surface); }
:root [data-glass] :is(.pop, .pres-menu, .filters-menu)[data-glass] { box-shadow: var(--g-shadow); }
@media (prefers-reduced-transparency: no-preference) and (prefers-contrast: no-preference) {
  :root:not([data-rt="on"]):not(.lighter) [data-glass] .pop[data-glass],
  :root:not([data-rt="on"]):not(.lighter) [data-glass] .pres-menu[data-glass],
  :root:not([data-rt="on"]):not(.lighter) [data-glass] .filters-menu[data-glass] {
    -webkit-backdrop-filter: blur(var(--g-blur)) saturate(var(--g-saturate)); backdrop-filter: blur(var(--g-blur)) saturate(var(--g-saturate)); }
}

:root [data-glass] :is(.card, .question-card, .facts, .stat-strip, .trail-view, .mpath-row, #memory-saved):not([data-glass], .dashed, .staged, .lg-picker) {
  background: none; border-width: var(--rule) 0 0; border-color: var(--line); border-radius: 0; box-shadow: none; padding-inline: 0;
  --card-pad-x: 0px; }
@media (prefers-reduced-transparency: no-preference) and (prefers-contrast: no-preference) {
  :root:not([data-rt="on"]):not(.lighter) [popover]:popover-open[data-glass],
  :root:not([data-rt="on"]):not(.lighter) dialog:modal[data-glass] {
    -webkit-backdrop-filter: blur(var(--g-blur)) saturate(var(--g-saturate)); backdrop-filter: blur(var(--g-blur)) saturate(var(--g-saturate)); }
}

.bar-top[data-glass] { padding-inline: max(var(--side), calc((100% - var(--page-max)) / 2 + var(--side))); border-width: 0 0 var(--rule); border-radius: 0; }

:root { --foot-h: 64px; }  
body:has(> .nav) { --nav-room: var(--shell-start); }  
.screen-foot[data-glass] { position: fixed; z-index: 8; inset-inline: var(--nav-room, 0px) 0; inset-block-end: 0; margin: 0; box-sizing: border-box;
  min-block-size: calc(var(--foot-h) + env(safe-area-inset-bottom, 0px)); padding-block: 10px calc(10px + env(safe-area-inset-bottom, 0px));
  padding-inline: max(var(--side), calc((100% - var(--nav-room, 0px) - var(--page-max)) / 2 + var(--side)));
  border-width: var(--rule) 0 0; border-radius: 0; }
.page:has(.screen-foot[data-glass]) { padding-block-end: calc(var(--foot-h) + env(safe-area-inset-bottom, 0px)); }

.screen-foot[data-glass]:has(> .foot-step) { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 12px; }
.screen-foot[data-glass]:has(> .foot-step) > :last-child { margin-inline-start: 0; }
.foot-step { display: flex; align-items: center; gap: 10px; margin-inline-end: auto; color: var(--muted); font-size: var(--text-sm); white-space: nowrap; }
.foot-step .dots { display: flex; align-items: center; gap: 5px; }
.foot-step .dots i { inline-size: 6px; block-size: 6px; border-radius: var(--radius-pill); background: var(--line-strong); }
.foot-step .dots i.done { background: color-mix(in srgb, var(--accent) 45%, transparent); }
.foot-step .dots i.here { inline-size: 16px; background: var(--accent); }
.screen-foot[data-glass]:has(> .foot-step) .actions { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; }
.screen-foot[data-glass]:has(> .foot-step) .actions > .primary { order: 2; }
.screen-foot[data-glass]:has(> .foot-step) .btn:not(.primary) { background: none; border-color: transparent; box-shadow: none; }
@media (max-width: 759px) {
  .foot-step .num { position: absolute; clip-path: inset(50%); white-space: nowrap; }  
  .foot-step { margin-inline-end: 0; }
  .screen-foot[data-glass]:has(> .foot-step) .actions { display: flex; flex: 1 1 auto; inline-size: auto; }
  .screen-foot[data-glass]:has(> .foot-step) .actions > .primary, .screen-foot[data-glass]:has(> .foot-step) > .primary { flex: 1 1 auto; }
  .screen-foot[data-glass]:has(> .foot-step) .primary { inline-size: 100%; }
  
  .foot-step[data-crowd] { position: relative; min-block-size: var(--touch); min-inline-size: var(--touch); }
  .foot-step[data-crowd] .foot-more { display: block; position: absolute; inset: 0; margin: 0; appearance: none; background: none; border: 0; cursor: pointer; }
  .foot-step[data-crowd]:has(.foot-more:focus-visible) { outline: var(--ring) solid var(--accent); outline-offset: var(--focus-offset); }
  .screen-foot[data-glass]:has(> .foot-step[data-crowd]) .btn:not(.primary) { display: none; }
  .screen-foot[data-glass]:has(> .foot-step[data-crowd] .foot-more:checked) { flex-wrap: wrap; }
  .screen-foot[data-glass]:has(> .foot-step[data-crowd] .foot-more:checked) .actions { flex-wrap: wrap; }
  .screen-foot[data-glass]:has(> .foot-step[data-crowd] .foot-more:checked) .btn:not(.primary) { display: inline-flex; }
  .screen-foot[data-glass]:has(> .foot-step[data-crowd] .foot-more:checked) :is(.primary, form:has(> .primary)) { flex: 1 0 100%; order: 3; }
}
.foot-more { display: none; }  

#panel[data-glass] { border-radius: var(--radius); }
#panel > #work[data-glass] { border: 0; border-radius: 0; background: none; box-shadow: none; }

#panel > #work { padding-inline: 14px; }
#panel-head [role="tablist"] { padding-inline-end: 20px; mask-image: linear-gradient(to left, transparent, black 20px); }

.composer .box[data-glass] { border-color: var(--field); }

.dock[data-glass] { padding: var(--pad); border-radius: var(--radius); }

.dlpill[data-state="ready"][data-glass] { border-color: color-mix(in srgb, var(--ok) 55%, transparent); }

#panel .trail-view[data-glass] { box-shadow: none; }

#capabilities[data-glass], .set-body[data-glass], .bw-main[data-glass] { padding: var(--pad); border-radius: var(--radius); }
.bw-tree[data-glass] { padding-block: 8px; border-radius: var(--radius); }

@media (max-width: 759px) {
  :root { --pad-x: 12px; --pad-end: max(var(--pad-x), env(safe-area-inset-right, 0px)); }
  body:has(> .nav) > .page > main { inline-size: auto; max-inline-size: none; margin-inline: 0; padding-inline: var(--pad-x) var(--pad-end); }
  
  body:has(> .nav) > .page > main:not(:has(> #chat, > #new-chat)) { padding-block-end: calc(var(--pad-x) + var(--vv-foot, 0px) + env(safe-area-inset-bottom, 0px)); }
  
  .push-ask { top: var(--ask-top, calc(10px + env(safe-area-inset-top, 0px))); }
  body:has(> .nav) > .page > main { margin-block-start: var(--ask-room, 0px); }
  
  body:has(> .nav) > .page > main { padding-inline-start: max(var(--pad-x), env(safe-area-inset-left, 0px)); }
  body:has(> .nav) main :is(.card, #capabilities[data-glass], .bw-main, .bw-tree, .set-body, .facts):not(.card .card, .chatbubble, .dlcard, #work) {
    margin-inline: calc(-1 * var(--pad-x)) calc(-1 * var(--pad-end)); inline-size: auto; max-inline-size: none; padding-inline: var(--pad-x) var(--pad-end);
    border-inline-width: 0; border-radius: 0; box-shadow: none; }
  
  body:has(> .nav) main .mpath-row[data-glass] { box-shadow: none; }
  
  body:has(> .nav) > .page > main:not(:has(#chat, #new-chat)):has(:is(.card, #capabilities, .bw-main, .bw-tree, .set-body, .facts)[data-glass]) {
    background-color: color-mix(in srgb, var(--surface) var(--g-fill-now), transparent); }
  :root[data-rt="on"] body:has(> .nav) > .page > main:not(:has(#chat, #new-chat)):has(:is(.card, #capabilities, .bw-main, .bw-tree, .set-body, .facts)[data-glass]) {
    background-color: var(--surface); }
  :root:not([data-rt="on"]) body:has(> .nav) > .page > main:not(:has(#chat, #new-chat)) :is(.card, #capabilities, .bw-main, .bw-tree, .set-body, .facts)[data-glass]:not(.card .card, .chatbubble, #work) {
    background-color: color-mix(in srgb, var(--surface) clamp(0%, (var(--g-fill-now) - 99%) * 100, 100%), transparent); }
  
  ul.jobs-one > li.jline { align-items: center; }
  .jline > details.jchange[open] { align-self: stretch; }
  body:has(> .nav) main .card .card { margin-inline: 0; padding-inline: 0; border-inline-width: 0; border-radius: 0; box-shadow: none; }
  body:has(> .nav) main .card > .jobstrip { margin-inline: calc(-1 * var(--pad-x)) calc(-1 * var(--pad-end)); }  
  body:has(> .nav) main .card :is(.rf-strip, .prov) { margin-inline: calc(-1 * var(--pad-x)) calc(-1 * var(--pad-end)); padding-inline: var(--pad-x) var(--pad-end);
    border-inline-width: 0; border-radius: 0; }
}
.mpath-row[data-glass] { padding-inline: var(--pad); border-radius: var(--radius); }
footer.meta[data-glass] { padding: var(--pad); border-radius: var(--radius); }
footer.meta[data-glass]:empty { padding: 0; border: 0; box-shadow: none; background: none; }


:root {
  --shell-nav-w: 290px;  
  --rail-touch: 44px; --rail-gutter: 12px; --rail-gap: 8px;  
  --rail-w: calc(var(--rail-touch) + 2 * var(--rule));
  
  --rail-right: max(var(--rail-gutter), calc((env(safe-area-inset-right, 0px) - var(--rail-w)) / 2));
  --rail-room: max(env(safe-area-inset-right, 0px), calc(var(--rail-right) + var(--rail-w) + var(--rail-gutter)));
  
  --rail-status: min(160px, calc(env(safe-area-inset-right, 0px) * 1000));
  --rail-top: max(calc(env(safe-area-inset-top, 0px) + var(--rail-gutter)), calc(var(--rail-status) + var(--rail-gutter)));
  --nav-w: min(var(--shell-nav-w), calc(100vw - var(--rail-room) - var(--rail-gutter)));
  --nav-end: 0px;  
  --shell-start: 0px;  
  
  --duo-touch: var(--rail-touch); --duo-gutter: var(--rail-gutter); --duo-gap: var(--rail-gap); --duo-right: var(--rail-right);
  --duo-room: var(--rail-room); --duo-left: max(env(safe-area-inset-left, 0px), var(--rail-gutter));
  --corner-end: max(env(safe-area-inset-bottom, 0px), var(--rail-gutter));
}
@media (min-width: 900px) { :root:not([data-nav="folded"]):not(:has(#chat[data-panel="open"])) { --shell-start: var(--nav-w); } }
html { min-block-size: 100svh; }  

:root { --page-end: var(--rail-room); }
@media (max-width: 759px) { :root { --page-end: 0px; } }
body:has(> .nav) { display: block; box-sizing: border-box; padding: 0 var(--page-end) 0 var(--shell-start); }
body:has(> .nav) > .page { margin-inline: auto; }

@media (min-width: 760px) {
  body:has(> .nav) > .pres { position: fixed; z-index: 10; inset-block: var(--chrome-bar, 0px) 0; inset-inline-start: var(--shell-start); height: auto; }
  :root[data-presence="open"] body:has(> .nav) { padding-inline-start: calc(var(--shell-start) + 272px); }
  :root[data-presence="open"] body:has(> .nav) { --nav-room: calc(var(--shell-start) + 272px); }
}

@media (prefers-reduced-motion: no-preference) {
  :root:not([data-nav-snap]) body:has(> .nav) { transition: padding var(--spring-settle-duration) var(--spring-settle); }
  .duo-top, .dock-row { transition: inset-inline-end var(--spring-settle-duration) var(--spring-settle), inset-block-start var(--spring-settle-duration) var(--spring-settle),
    inline-size var(--spring-settle-duration) var(--spring-settle); }
  .duo-key, .duo-place, .duo-pill { transition: inline-size var(--spring-settle-duration) var(--spring-settle),
    block-size var(--spring-settle-duration) var(--spring-settle), background-color var(--tick) var(--ease),
    scale var(--spring-settle-duration) var(--spring-settle); }  
}

body:has(> .nav) > .page > .bar-top { position: sticky; top: var(--chrome-bar, 0px); z-index: 9; box-sizing: border-box;
  --head-side: max(var(--side), calc((100% - var(--page-max)) / 2 + var(--side)));
  
  margin-inline: 0 calc(-1 * var(--page-end));
  padding: calc(8px + env(safe-area-inset-top, 0px)) calc(var(--head-side) + max(var(--page-end), calc(var(--rail-w) + 2 * var(--rail-gutter)))) 8px var(--head-side); }
@media (max-width: 759px) {
  body:has(> .nav) > .page > .bar-top { padding-inline-end: calc(var(--pad-x) + max(env(safe-area-inset-right, 0px), calc(var(--rail-w) + 2 * var(--rail-gutter)))); }
  
  :root:has(.duo-top > .duo-pill) body:has(> .nav) main :is(#turns, #live) { padding-inline-end: max(0px, calc(var(--rail-room) - var(--pad-end))); }
  body:has(> .nav) > .page > .bar-top::after { content: ""; position: absolute; inset: 100% 0 auto; block-size: 24px; pointer-events: none;
    background: var(--wall), var(--bg); background-attachment: fixed; mask-image: linear-gradient(black, transparent); }
}

@media (max-width: 499px) {
  :root:has(.duo-top > .duo-pill) body:has(> .nav) > .page > .bar-top :is(.censor, .pres-open) { display: none; }
  .row-menu [data-act="head"] svg { inline-size: 18px; block-size: 18px; flex: none; }
  .row-menu [role="menuitemcheckbox"] { display: flex; align-items: center; gap: 10px; inline-size: 100%; box-sizing: border-box; padding: 10px;
    border: 0; border-radius: var(--radius-sm); background: none; color: inherit; font: inherit; text-align: left; }  
  .row-menu [role="menuitemcheckbox"]:is(:hover, :focus-visible) { background: var(--hover); }
  .row-menu [role="menuitemcheckbox"][aria-checked="true"] { color: var(--accent-text); font-weight: var(--weight-strong); }
  .bw .bw-chips { padding-inline-end: 24px; mask-image: linear-gradient(to left, transparent, black 24px); }
}

@media (max-width: 759px) { body:has(> .nav) > .page > .bar-top.head > :not(.here, .grow) { flex-shrink: 0; } }

@media (max-height: 449px) {
  body:has(> .nav) > .page > .bar-top { padding-block: calc(4px + env(safe-area-inset-top, 0px)) 4px; }
  .composer .foot > .meta { display: none; }
  form.composer { gap: 2px; }
  .composer textarea { --touch: 32px; padding-top: 6px; }  
}

@media (max-width: 359px) { .composer .foot > .anchor.end:has(.ctx) { display: none; } }

@media (min-width: 760px) { .with-dock { grid-template-columns: minmax(min(100%, 260px), 1fr) minmax(0, 320px); } }
#calendar { container-type: inline-size; }
#calendar .split > .pane[popover] { display: flex; position: static; inset: auto; inline-size: auto; block-size: auto; margin: 0; overflow: visible; color: inherit; }
#calendar .pane-open { display: none; }
@container (max-width: 519px) {
  #calendar .split { grid-template-columns: minmax(0, 1fr); }
  #calendar .split > .pane[popover]:not(:popover-open) { display: none; }
  #calendar .split > .pane[popover]:popover-open { position: fixed; position-anchor: --cal-pane; inset: auto; top: calc(anchor(bottom) + 6px);
    left: anchor(left); min-inline-size: 200px; box-shadow: var(--shadow-pop); }
  #calendar .pane-open { display: inline-flex; anchor-name: --cal-pane; }
  #calendar .lead .chips > .chip { white-space: nowrap; }
}

@media (max-width: 499px) {
  .mpath > i { display: none; }
  
  main .mpath-row, main .mpath-row[data-glass] { gap: 2px; padding: 3px; border-radius: var(--radius-pill); }
  .mpath, .mpath-more { gap: 2px; margin: 0; padding: 0; border: 0; background: none; }
  .mpath a, .mpath-more a { display: grid; place-items: center; box-sizing: border-box; min-block-size: 44px; padding: 0 14px; border-radius: var(--radius-pill);
    font-size: var(--text-sm); font-weight: var(--weight-strong); color: var(--ink); --hit: 44px; }
  .mpath a span { font-weight: inherit; }
  .mpath-more a[aria-current="page"] { background: color-mix(in srgb, var(--accent) 22%, transparent); }  
  .mpath a[aria-current="page"] span, .mpath-more a[aria-current="page"] { color: var(--accent-text); }
  
  .mpath a[href$="/computers"] > span { font-size: 0; }
  .mpath a[href$="/computers"] > span::after { content: "Computers" / ""; font-size: var(--text-sm); }
  .mpath-row::after { content: ""; position: sticky; inset-inline-end: 0; flex: none; align-self: stretch; inline-size: 24px; pointer-events: none;
    background: linear-gradient(to right, transparent, var(--surface)); }
}

:is(#plan-card, .plan-card, #job-strip) .actions .btn { white-space: nowrap; }
.actions > small.needs { flex: 1 1 100%; order: 1; color: var(--muted); font-size: var(--text-xs); }

@media (max-width: 759px) { #notes .split:has(> .pane > h3 + a[aria-current]) > .section > .lead > h3 { position: absolute; inline-size: 1px;
  block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } }

@media (pointer: coarse) and (max-height: 699px) {
  .composer .asking[data-approvals]:not(:has(details[open])) :is(.row > .badge[data-tier], .row > .why, [data-floor]) { display: none; }
  .composer:has(.box[data-asking]) .foot > .meta { display: none; }
}

body:has(> .nav) > .page > .bar-top[data-glass] { margin-block-start: 0; border-width: 0 0 var(--rule); border-radius: 0; box-shadow: none; }
body:has(> .nav) > .page > .bar-top > .brand, body:has(> .nav) > .page > .bar-top.head > .search { display: none; }
body:has(> .nav) > .page > .bar-top.head > .here { padding-left: 0; border-left: 0; }

:root body > .nav { display: flex; flex-direction: column; position: fixed; z-index: 12; inset-block: var(--chrome-bar, 0px) var(--nav-end);
  inset-inline-start: 0; inline-size: var(--nav-w); block-size: auto; box-sizing: border-box; overflow: hidden; overscroll-behavior: contain;
  padding: calc(10px + env(safe-area-inset-top, 0px)) 10px calc(10px + env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
  color: var(--ink); border-width: 0 var(--rule) 0 0; border-radius: 0; translate: 0 0; visibility: visible;
  transition: translate var(--spring-settle-duration) var(--spring-settle), visibility 0s var(--ease-linear) 0s; }
:root[data-nav="folded"] body > .nav { translate: calc(-100% - 16px) 0; visibility: hidden;
  transition: translate var(--spring-settle-duration) var(--spring-settle), visibility 0s var(--ease-linear) var(--spring-settle-duration); }
:root[data-nav-snap] body > .nav { transition: none; }
@media (max-width: 899.98px) {
  :root:not([data-menu="open"]) body > .nav { translate: calc(-100% - 16px) 0; visibility: hidden;
    transition: translate var(--spring-settle-duration) var(--spring-settle), visibility 0s var(--ease-linear) var(--spring-settle-duration); }
  :root[data-menu="open"] body > .nav { translate: 0 0; visibility: visible; border-width: 0 var(--rule) 0 0;
    border-radius: 0; border-start-end-radius: var(--radius); border-end-end-radius: var(--radius); box-shadow: var(--shadow-pop); }
  
  :root[data-menu="open"] body:has(> .nav)::after { content: ""; position: fixed; inset: 0; z-index: 11;
    background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
}

:root:has(#chat[data-panel="open"]):not([data-menu="open"]) body > .nav { translate: calc(-100% - 16px) 0; visibility: hidden;
  transition: translate var(--spring-settle-duration) var(--spring-settle), visibility 0s var(--ease-linear) var(--spring-settle-duration); }
:root:has(#chat[data-panel="open"])[data-menu="open"] body > .nav { translate: 0 0; visibility: visible; border-radius: 0;
  border-start-end-radius: var(--radius); border-end-end-radius: var(--radius); box-shadow: var(--shadow-pop); }
:root:has(#chat[data-panel="open"])[data-menu="open"] body:has(> .nav)::after { content: ""; position: fixed; inset: 0; z-index: 11;
  background: color-mix(in srgb, var(--ink-light) 45%, transparent); }

@media (min-width: 900px) and (max-width: 1239.98px) {
  :root:not([data-nav="folded"]):not(:has(#chat[data-panel="open"])):has(.with-dock) { --shell-start: 0px; }
  :root:has(.with-dock):not([data-menu="open"]) body > .nav { translate: calc(-100% - 16px) 0; visibility: hidden;
    transition: translate var(--spring-settle-duration) var(--spring-settle), visibility 0s var(--ease-linear) var(--spring-settle-duration); }
  :root:has(.with-dock)[data-menu="open"] body > .nav { translate: 0 0; visibility: visible; border-radius: 0;
    border-start-end-radius: var(--radius); border-end-end-radius: var(--radius); box-shadow: var(--shadow-pop); }
  :root:has(.with-dock)[data-menu="open"] body:has(> .nav)::after { content: ""; position: fixed; inset: 0; z-index: 11;
    background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
}

@media (min-width: 900px) and (max-width: 1171.98px) {
  :root[data-presence="open"]:not(:has(#chat[data-panel="open"])) { --shell-start: 0px; }
  :root[data-presence="open"]:not([data-menu="open"]) body > .nav { translate: calc(-100% - 16px) 0; visibility: hidden;
    transition: translate var(--spring-settle-duration) var(--spring-settle), visibility 0s var(--ease-linear) var(--spring-settle-duration); }
  :root[data-presence="open"][data-menu="open"] body > .nav { translate: 0 0; visibility: visible; border-radius: 0;
    border-start-end-radius: var(--radius); border-end-end-radius: var(--radius); box-shadow: var(--shadow-pop); }
  :root[data-presence="open"][data-menu="open"] body:has(> .nav)::after { content: ""; position: fixed; inset: 0; z-index: 11;
    background: color-mix(in srgb, var(--ink-light) 45%, transparent); }
}
.nav-head { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 8px; padding: 2px 2px 2px 10px; }
.nav .nav-brand { padding: 0; font-size: var(--text-lg, 1.125rem); font-weight: var(--weight-strong); color: var(--ink); background: none; }
.nav .nav-search { justify-content: center; inline-size: 40px; block-size: 40px; padding: 0; border-radius: var(--radius-round); }
.nav-body { display: flex; flex-direction: column; flex: 1 1 auto; min-block-size: 0; overflow-y: auto; }
.nav-body #nav-list { display: flex; flex-direction: column; gap: 2px; }
.nav-body .nav-chats { margin-top: 10px; padding-top: 6px; }
.nav-body .nav-chats h3.nav-recents { margin-top: 2px; text-transform: none; letter-spacing: 0; font-size: var(--text-sm); }
.nav-more { margin-top: 10px; padding-top: 6px; border-top: var(--rule) solid var(--line); }
.nav-more > summary { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-radius: var(--radius-sm); cursor: pointer;
  list-style: none; color: var(--ink); font-weight: var(--weight-medium); }
.nav-more > summary::-webkit-details-marker { display: none; }
.nav-more > summary:hover { background: var(--hover); }
.nav-more > ul { display: flex; flex-direction: column; gap: 2px; margin-top: 2px; }
.nav .nav-foot { display: flex; flex: none; align-items: center; gap: 4px; margin: 8px 0 0; padding: 8px 0 0; border-top: var(--rule) solid var(--line); }
.nav .nav-foot > a, .nav .nav-foot > button { justify-content: center; inline-size: 40px; block-size: 40px; padding: 0; border-radius: var(--radius-round); }
.nav .nav-foot > :is(a, button) span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.nav .nav-foot > .nav-profile { background: var(--surface); border: var(--rule) solid var(--line-strong); }
.nav .nav-foot > a.nav-new { margin: 0 0 0 auto; inline-size: 44px; block-size: 44px; background: var(--accent); border: 0; box-shadow: var(--shadow-rest); }
.nav .nav-foot > a.nav-new i { background: var(--accent-ink); }
@media (pointer: coarse) { .nav a, .nav-more > summary { min-height: 44px; } }

.duo { display: contents; }
.duo-top { position: fixed; z-index: 13; inset-inline-end: var(--rail-right); inset-block-start: calc(var(--rail-top) + var(--chrome-bar, 0px));
  display: flex; flex-direction: column; align-items: center; gap: var(--rail-gap); inline-size: var(--rail-w); }
.duo-key, .duo-place { display: flex; align-items: center; justify-content: center; flex: none; box-sizing: border-box; inline-size: var(--rail-touch);
  block-size: var(--rail-touch); margin: 0; padding: 0; border-radius: var(--radius-round); font: inherit; text-decoration: none; cursor: pointer; }
body .duo-key, body .duo-key:hover, body .duo-place, body .duo-place:hover { color: var(--ink); }  
.duo-pill { display: flex; flex-direction: column; align-items: center; box-sizing: content-box; inline-size: var(--rail-touch); border-radius: var(--radius-pill); }
.duo-place { background: none; border: 0; }
.duo-place:active, .duo-key:active { background-color: var(--press); }

:root .duo-key[data-glass]:active { background-color: color-mix(in srgb, var(--ink) 6%, color-mix(in srgb, var(--surface) var(--g-fill-now), transparent)); }
@media (prefers-reduced-motion: no-preference) {
  :root:not([data-rm="on"]) :is(.duo-key, .duo-place):active { scale: 0.96; }
}
.duo i { flex: none; inline-size: 20px; block-size: 20px; background: currentColor; mask: var(--icon) center / contain no-repeat; }
.duo-ctx svg { inline-size: 22px; block-size: 22px; transform: rotate(-90deg); fill: none; stroke-width: 3; }
.duo-ctx .track { stroke: var(--line-strong); }
.duo-ctx .arc { stroke: var(--accent); }
.duo-ctx[data-level="high"] .arc { stroke: var(--ink); }
.duo-ctx[data-level="full"] .arc { stroke: var(--warn, var(--ink)); }
.duo-top > .row-menu { left: auto; right: calc(var(--rail-room) + 4px); top: anchor(top); }  

@media (max-width: 759px) { .duo-top > .row-menu { inset: auto 0 0 0; } }
:is(.nav, .duo) [data-icon="menu"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 7h14M5 12h14M5 17h9'/%3E%3C/svg%3E"); }
:is(.nav, .duo) [data-icon="search"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 4a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13zM15.5 15.5 20 20'/%3E%3C/svg%3E"); }
:is(.nav, .duo) [data-icon="account"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4.5a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7zM5 19.5a7 7 0 0 1 14 0'/%3E%3C/svg%3E"); }
.duo [data-icon="more"] { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12h.01M12 12h.01M18.5 12h.01'/%3E%3C/svg%3E"); }

:root { --rail-stack: var(--rail-touch); }
:root:has(.duo-top > .duo-pill:not(.page-pill)) { --rail-stack: calc(3 * var(--rail-touch) + var(--rail-gap)); }

.page-pill { display: none; }
@media (max-width: 499px) { .page-pill { display: flex; } :root:has(.duo-top > .page-pill) { --rail-stack: calc(2 * var(--rail-touch) + var(--rail-gap)); } }
.dock-row { position: fixed; z-index: 13; display: flex; flex-direction: column; align-items: center; gap: var(--rail-gap); inline-size: var(--rail-w);
  inset-inline: auto var(--rail-right); inset-block: calc(var(--rail-top) + var(--chrome-bar, 0px) + var(--rail-stack) + var(--rail-gap)) auto; }
.dock-row .dlpill { position: relative; box-sizing: border-box; inline-size: var(--rail-touch); block-size: var(--rail-touch); min-block-size: 0;
  justify-content: center; gap: 0; padding: 0; border-radius: var(--radius-round); }
.dock-row .dlpill :is(.dl-long, .dl-short) { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; }

.dock-row .dlpill[data-state="ready"] { inline-size: auto; align-self: flex-end; gap: 6px; padding-inline: 10px 14px; white-space: nowrap; }
.dock-row:has(.dlpill[data-state="ready"]) .dlcard { inset-block-start: calc(var(--rail-top) + var(--chrome-bar, 0px) + var(--rail-stack) + 2 * var(--rail-gap) + var(--rail-touch)); }  
.dock-row .dlpill .pct { position: absolute; inset: -6px -6px auto auto; padding: 0 5px; border-radius: var(--radius-pill);
  font-size: 0.625rem; line-height: 1.5; background: var(--accent); color: var(--accent-ink); }
@starting-style { .dock-row .dlpill { scale: 0.6; } }
@media (prefers-reduced-motion: no-preference) {
  .dock-row .dlpill { transition: scale var(--spring-settle-duration) var(--spring-settle),
    inline-size var(--spring-settle-duration) var(--spring-settle), block-size var(--spring-settle-duration) var(--spring-settle), background-color var(--tick) var(--ease); }
}

:root { --bubble: 56px; --bubble-right: calc(var(--rail-right) + (var(--rail-w) - var(--bubble)) / 2);
  --bubble-end: calc(max(env(safe-area-inset-bottom, 0px), var(--vv-foot, 0px)) + var(--rail-gutter)); }  

:root { --bubble-right: max(calc(var(--rail-right) + (var(--rail-w) - var(--bubble)) / 2),
  min(calc(env(safe-area-inset-right, 0px) + 20px), calc(env(safe-area-inset-right, 0px) * 1000))); }
:root a.chatbubble, :root a.chatbubble[data-glass] { position: fixed; z-index: 13; inset-inline: auto var(--bubble-right); inset-block: auto var(--bubble-end);
  display: grid; place-items: center; box-sizing: border-box; inline-size: var(--bubble); block-size: var(--bubble); padding: 0; border: 0;
  border-radius: var(--radius-round); background: var(--accent); color: var(--accent-ink); box-shadow: var(--shadow-pop);
  text-decoration: none; cursor: pointer; }
.chatbubble .mark { inline-size: 60%; block-size: 60%; }
.chatbubble [hidden] { display: none; }  
.chatbubble .mark .drop { fill: var(--accent-ink); }
.chatbubble .mark .eye { fill: var(--accent); }
.chatbubble .mark .shine { fill: color-mix(in srgb, var(--accent) 30%, transparent); }
.chatbubble .word { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.chatbubble .ring { position: absolute; inset: -4px; inline-size: auto; block-size: auto; border-color: transparent; border-top-color: var(--accent); }
.chatbubble .new { position: absolute; inset: 50% calc(100% + 6px) auto auto; translate: 0 -50%; padding: 0 6px; border: 2px solid var(--accent); border-radius: var(--radius-pill);
  background: var(--surface); color: var(--ink); font-size: var(--text-xs); font-weight: var(--weight-strong); line-height: 1.5; white-space: nowrap; }

@media (max-width: 759px) {
  :root:has(a.chatbubble) body:has(> .nav) > .page { padding-block-end: calc(var(--bubble-end) + var(--bubble) + var(--rail-gap)); }
}
@starting-style { .chatbubble { scale: 0.6; } }
@media (prefers-reduced-motion: no-preference) { .chatbubble { transition: scale var(--spring-settle-duration) var(--spring-settle); } }

.mark .eye { transform-box: fill-box; transform-origin: center; }
:is([data-charm="working"], .chatbubble[data-working="true"]) .mark { filter: drop-shadow(0 0 4px currentColor); }
:is([data-charm="working"], .chatbubble[data-working="true"]) .mark .eye { scale: 1 0.75; }
@media (prefers-reduced-motion: no-preference) {
  [data-charm="rest"] .mark .eye { animation: mark-blink 4s var(--ease) infinite; }
  [data-charm="thinking"] .mark .eye { animation: mark-glance 3s var(--ease) infinite alternate; }
  [data-charm="done"] .mark { animation: mark-nod var(--spring-settle-duration) var(--spring-settle); }
}
@keyframes mark-blink { 0%, 92%, 100% { scale: 1 1; } 95% { scale: 1 0.12; } }
@keyframes mark-glance { 0%, 30% { translate: -2.5px -2px; } 70%, 100% { translate: 2.5px -2px; } }
@keyframes mark-nod { 0%, 100% { translate: 0 0; } 50% { translate: 0 3px; } }
.dock-row .dlcard { position: fixed; inset-block: calc(var(--rail-top) + var(--chrome-bar, 0px)) auto; inset-inline: auto calc(var(--rail-right) + var(--rail-w) + var(--rail-gap));
  inline-size: min(24rem, calc(100vw - var(--rail-room) - var(--duo-left))); }

.chat-window { position: fixed; z-index: 14; display: flex; flex-direction: column; box-sizing: border-box; inline-size: 380px; block-size: 560px;
  max-block-size: calc(100dvh - var(--bubble-end) - var(--bubble) - var(--rail-gap) - 8px - var(--chrome-bar, 0px));
  inset-block: auto calc(var(--bubble-end) + var(--bubble) + var(--rail-gap)); inset-inline: auto var(--bubble-right); overflow: hidden;
  border-radius: var(--radius); color: var(--ink); transform-origin: bottom right; scale: 1; }
.chat-window[hidden] { display: none; }
@starting-style { .chat-window { scale: 0.85; } }
@media (prefers-reduced-motion: no-preference) {
  .chat-window { transition: scale var(--spring-settle-duration) var(--spring-settle), translate var(--spring-settle-duration) var(--spring-settle); }
}
.chat-window-head { display: flex; flex: none; align-items: center; gap: 8px; padding: 6px 6px 6px 16px; border-bottom: var(--rule) solid var(--line); }
.chat-window-head .meta { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-window-close { display: flex; align-items: center; justify-content: center; flex: none; inline-size: var(--rail-touch); block-size: var(--rail-touch);
  margin-inline-start: auto; padding: 0; border: 0; border-radius: var(--radius-round); background: none; color: var(--ink); cursor: pointer; }
.chat-window-close svg { inline-size: 18px; block-size: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.chat-window > aside.dock { display: flex; flex-direction: column; flex: 1 1 auto; min-block-size: 0; margin: 0; padding: 10px 14px 14px; border: 0;
  border-radius: 0; box-shadow: none; }

@media (prefers-reduced-transparency: no-preference) and (prefers-contrast: no-preference) { .chat-window > aside.dock { background-color: transparent; } }
.chat-window > aside.dock > .lead { flex: none; }
.chat-window > aside.dock > [data-turns] { flex: 1 1 auto; min-block-size: 0; overflow-y: auto; }
.chat-window > aside.dock > .composer { flex: none; }
@media (max-width: 759px) {
  .chat-window { inset: auto 0 0 0; inline-size: auto; block-size: 70dvh; max-block-size: 70dvh;
    border-radius: 0; border-start-start-radius: var(--radius); border-start-end-radius: var(--radius); transform-origin: bottom center; padding-bottom: env(safe-area-inset-bottom, 0px); }
  @starting-style { .chat-window { scale: 1; translate: 0 100%; } }
}

:root { --item-chat-w: min(440px, 42vw); --strip: env(safe-area-inset-right, 0px);  
  --keys-end: max(0px, calc(var(--rail-top) + var(--chrome-bar, 0px) + var(--rail-w) + var(--rail-gap) - env(safe-area-inset-right, 0px) * 1000)); }
.chat-window.item-chat { inset-block: var(--chrome-bar, 0px) 0; inset-inline: auto var(--rail-room); inline-size: var(--item-chat-w); block-size: auto;
  max-block-size: none; border-radius: 0; transform-origin: center right; background-color: var(--surface); }
.chat-window.item-chat > aside.dock { background-color: var(--surface); }
@media (min-width: 760px) { :root[data-item-chat="open"] body:has(> .nav) { padding-inline-end: calc(var(--rail-room) + var(--item-chat-w)); } }
.chat-window-move { display: flex; flex: none; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; padding: 8px 14px; border-bottom: var(--rule) solid var(--line); }
.moved-pointer { margin: 0; }
@media (max-width: 759px) {
  .chat-window, .chat-window.item-chat, .part-panel[data-sheet="open"], .lg-sheet { inset-inline: 0 env(safe-area-inset-right, 0px); }
  .filters-menu { inset-inline: 0 env(safe-area-inset-right, 0px); }  
  .chat-window, .part-panel[data-sheet="open"], .lg-sheet { max-block-size: calc(100dvh - var(--keys-end)); }
  .chat-window.item-chat { inset-block: var(--keys-end) 0; inline-size: auto; block-size: auto; max-block-size: none;
    border-start-start-radius: var(--radius); border-start-end-radius: var(--radius); transform-origin: bottom center; }
  @starting-style { .chat-window.item-chat { scale: 1; translate: 0 100%; } }
  :root[data-item-chat="open"] .dock-row .chatbubble { visibility: hidden; }
  
  #chat[data-panel="open"] > #panel { position: fixed; z-index: 12; inset: var(--keys-end) env(safe-area-inset-right, 0px) 0 0; overflow-y: auto;
    background-color: var(--surface); border: 0; border-radius: 0; }  
  #chat[data-panel="open"] > #panel > #work { border-radius: 0; }
  
  #panel #panel-tabs { display: none; }
  #panel [data-phone-bar] { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-inline-size: 0; }
  #panel [data-phone-bar] .btn { min-block-size: var(--touch); }
  #panel [data-phone-bar] [data-phone-switch] { display: inline-flex; align-items: center; gap: 4px; }
  #panel [data-phone-name] { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  #panel [data-phone-sheet] { position: fixed; z-index: 13; inset: auto env(safe-area-inset-right, 0px) 0 0; max-block-size: calc(100dvh - var(--keys-end));
    overflow-y: auto; display: grid; gap: var(--gap); padding: var(--pad); box-sizing: border-box; background-color: var(--surface);
    border-start-start-radius: var(--radius); border-start-end-radius: var(--radius); box-shadow: var(--shadow-pop); padding-bottom: max(var(--pad), env(safe-area-inset-bottom, 0px)); }
  #panel [data-phone-sheet][hidden] { display: none; }
  #panel [data-phone-sheet] [data-phone-row], #panel [data-phone-sheet] li[role="treeitem"] { min-block-size: var(--touch); text-align: start; }
  #panel [data-phone-row][aria-current="true"] { border-inline-start: calc(3 * var(--rule)) solid var(--accent); background: var(--hover); }
}
@media (min-width: 760px) {
  #panel [data-phone-bar], #panel [data-phone-close] { display: none; }
  #panel [data-phone-sheet="switch"] { display: none; }
}

#panel-head [role="tab"] { min-width: 96px; }
#panel-head [role="tab"] > code:has(> .mid) { display: inline-flex; }
#panel-head [role="tab"] > code > .mid { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#panel-head [role="tab"] > code > .end { flex: none; white-space: nowrap; }
#panel-buttons > button { width: 32px; height: 32px; color: var(--muted); border-radius: var(--radius-round); }
#panel-buttons > button:hover { background: var(--hover); color: var(--ink); }
#panel-buttons span { width: 16px; height: 16px; background: none; border: 0; }
#panel-buttons svg { width: 14px; height: 14px; visibility: visible; }
@media (max-width: 759px) {
  #chat[data-panel="open"] > #turn { display: flex; }
  #chat[data-panel="open"] > #panel { inset-block-start: max(var(--keys-end), 18dvh); border-start-start-radius: var(--radius-glass);
    border-start-end-radius: var(--radius-glass); box-shadow: var(--shadow-pop); }
  #chat[data-panel="open"] > #panel > #work { min-height: 0; padding-block-start: 22px; }
  #chat[data-panel="open"] > #panel::before { content: ""; position: sticky; top: 8px; z-index: 1; display: block; inline-size: 36px; block-size: 5px;
    margin: 8px auto -13px; border-radius: var(--radius-pill); background: var(--line-strong); }
  #chat[data-panel="open"] > #panel > #work[data-chat-name]::before { content: attr(data-chat-name); display: block; overflow: hidden; white-space: nowrap;
    text-overflow: ellipsis; color: var(--muted); font-size: var(--text-sm); text-align: center; }
}

@media (pointer: fine) and (hover: hover) {  
  :root { --rail-touch: 32px; --bubble: 48px; }
  .duo-key:hover, .duo-place:hover, .dock-row .dlpill:hover { background-color: var(--hover); }
  :root a.chatbubble:hover { background-color: var(--accent-hover); }
}

@media (max-width: 759px) {
  @media not (prefers-reduced-transparency: reduce) {
    :root:not([data-rt="on"]) :is(.duo-key, .duo-pill, .dock-row > .dlpill, .dock-row > .chatbubble)[data-glass] {
      
      --g-fill-now: 10%; --g-blur: 0px; box-shadow: none; }
  }
  :root :is(.duo-key, .duo-pill, .dock-row > .dlpill, .dock-row > .chatbubble)[data-glass]:is(:hover, :focus-visible, :focus-within, :active, [aria-expanded="true"]),
  :root[data-menu="open"] .duo-toggle[data-glass], :root:has(.chat-window:not([hidden])) .dock-row > .chatbubble[data-glass] {
    --g-fill-now: clamp(0%, 100% - (100% - var(--g-fill)) * var(--g-t), 100%); --g-blur: inherit; box-shadow: var(--g-shadow); }
  @media (prefers-reduced-motion: no-preference) {
    .duo-key[data-glass], .duo-pill[data-glass], .dock-row > .dlpill[data-glass], .dock-row > .chatbubble[data-glass] { transition: background-color var(--spring-settle-duration) var(--spring-settle),
      box-shadow var(--spring-settle-duration) var(--spring-settle), inline-size var(--spring-settle-duration) var(--spring-settle),
      block-size var(--spring-settle-duration) var(--spring-settle), scale var(--spring-settle-duration) var(--spring-settle); }
  }
}

@media (max-width: 759px) {
  :root { --dock-right: max(var(--rail-right), min(calc(env(safe-area-inset-right, 0px) + 20px), calc(env(safe-area-inset-right, 0px) * 1000))); }
  .dock-row { inset-inline-end: var(--dock-right); }
  .dock-row .dlcard { inset-inline-end: calc(var(--dock-right) + var(--rail-w) + var(--rail-gap)); }
}


:root:has(.part-panel[data-sheet="open"], .lg-sheet:not([hidden])) .chatbubble { visibility: hidden; }

@media (min-width: 760px) {
  .listbar { position: relative; }
  .listbar > details.filters-at { position: static; }
  .listbar > details.filters-at .filters-menu { max-inline-size: 100%; }
}

@media (max-width: 759px) {
  #turns .bubble { margin-inline-start: calc(var(--gap) + 24px); }
  .composer .box .asking > .row { flex-wrap: wrap; }
  .composer .foot:has(> [data-history], > .meta) { flex-wrap: wrap; }  
  .composer .foot > [data-history] { order: 3; flex: 1 1 100%; }
}

.composer .foot:has(> [data-history], > .meta) { flex-wrap: wrap; }  
.composer .foot:has(> .anchor.pill) > .meta { order: -1; flex: 1 1 100%; }

.composer .foot:has(> .anchor.pill):has(> [data-history], > .meta) > .anchor.pill { flex: 1 1 0; }

.composer .box .asking[data-approvals] > .actions { position: sticky; inset-block-end: -10px; z-index: 1; margin: 0 -12px -10px; padding: 8px 12px 10px;
  background-color: var(--surface); border-block-start: var(--rule) solid var(--line); }
@media (max-width: 759px) { .composer .box .asking[data-approvals] > .actions { inset-block-end: -8px; margin: 0 -10px -8px; padding: 6px 10px 8px; } }

.composer .box .asking > .row > button.why { min-width: var(--touch); min-height: var(--touch); align-self: center; }
@media (forced-colors: active) {
  .duo-place[aria-current="page"] { outline: var(--rule) solid CanvasText; }
  .duo i { forced-color-adjust: none; background: CanvasText; }
}

@media (pointer: coarse) and (hover: none) and (min-aspect-ratio: 5/8) and (max-aspect-ratio: 2/1) and (min-width: 380px) and (max-width: 1000px) and (max-height: 960px) {
  
  :root { --duo-fold-gap: 19px; }
  
  @media (max-width: 759px) { .filters-menu { max-height: 80dvh; } }
  @media (min-width: 760px) { .set-ia .set-nav { max-height: calc(100dvh - 140px - var(--chrome-bar, 0px)); } }  
  @media (device-posture: folded) and (min-width: 600px) {
    :root { --duo-fold-a: calc(50vw - var(--duo-fold-gap) / 2); --duo-fold-b: calc(50vw + var(--duo-fold-gap) / 2); }
  }
  @media (min-width: 900px) {  
    :root { --duo-fold-a: calc(50vw - var(--duo-fold-gap) / 2); --duo-fold-b: calc(50vw + var(--duo-fold-gap) / 2); }
  }
  @media (horizontal-viewport-segments: 2) {
    :root { --duo-fold-a: env(viewport-segment-right 0 0); --duo-fold-b: env(viewport-segment-left 1 0); }
  }
  
  @media ((device-posture: folded) and (min-width: 600px)), (horizontal-viewport-segments: 2), (min-width: 900px) {
    .dock-row .dlcard { inline-size: min(24rem, calc(100vw - var(--duo-room) - max(var(--duo-left), calc(var(--duo-fold-b) + var(--duo-gutter))))); }
    .part-panel[data-sheet="open"], .lg-sheet { inset-inline-start: var(--duo-fold-b); }
    @media (max-width: 759px) { .settings-sheet, .row-menu, .filters-menu { left: var(--duo-fold-b); } }
    @media (min-width: 760px) { .settings-sheet { left: calc((var(--duo-fold-b) + 100%) / 2); } }  
  }
  
  @media (min-height: 900px) {
    :root { --nav-end: calc(50dvh + var(--duo-fold-gap) / 2 + var(--duo-gutter)); }
    :root body > .nav { padding-block-end: 10px; }  
  }
  
  @media (vertical-viewport-segments: 2) {
    :root { --duo-fold-b: 0px; }
  }
  
  .grid { grid-template-columns: repeat(auto-fill, minmax(max(var(--card-min), calc((100% - var(--gap)) / 2 - 1px)), 1fr)); }
  dl.fields { grid-template-columns: repeat(auto-fit, minmax(max(7.5rem, calc((100% - 16px) / 2 - 1px)), 1fr)); }  
  @media (min-width: 760px) { .grid.jobs, .previews, .rf-strip.c3n { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  
  @media (max-width: 759px) {
    .composer .foot:has(> [data-history], > .meta) { flex-wrap: wrap; }
    .composer .foot > .meta { order: -1; flex: 1 1 100%; }
  }
}

.to-latest { position: sticky; bottom: calc(14px + env(safe-area-inset-bottom)); height: 0; z-index: 5; align-self: center; }
.to-latest button { position: absolute; bottom: 0; left: 0; transform: translateX(-50%); display: grid; place-items: center;
  width: 44px; height: 44px; padding: 0; border-radius: var(--radius-round); color: var(--ink); cursor: pointer; }
.to-latest button[hidden] { display: none; }
.to-latest button:hover { background-color: var(--hover); }
.to-latest svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.adopt-depth { border: 0; padding: 0; margin: 0; min-width: 0; }
.adopt-depth legend { padding: 0; margin-bottom: 8px; }
.adopt-depth legend h4 { margin: 0; }
.adopt-one .rows .when { flex: 0 0 8.5rem; }


@media (prefers-reduced-motion: no-preference) {
  details::details-content { interpolate-size: allow-keywords; block-size: 0; overflow: clip;
    transition: block-size var(--spring-settle-duration) var(--spring-settle), content-visibility var(--spring-settle-duration) var(--ease-linear) allow-discrete; }
  details[open]::details-content { block-size: auto; }
  details > summary { transition: margin-block-end var(--spring-settle-duration) var(--spring-settle); }  
}


ul.rows .end > details.more { position: relative; }
ul.rows .end > details.more::details-content { transition: none; }
ul.rows .end > details.more[open] > summary { margin-block-end: 0; }
ul.rows .end > details.more[open]::details-content { position: absolute; z-index: 6; inset-inline-end: 0; inset-block-start: calc(100% + 4px);
  display: flex; flex-direction: column; align-items: stretch; gap: 2px; min-inline-size: 12rem; padding: 6px; background: var(--surface);
  border: var(--rule) solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow-pop); }
.card:has(> ul.rows .end > details.more[open]) { overflow: visible; }


@supports (anchor-name: --cs-foot) {
  .compose-slots { anchor-scope: --cs-foot; }
  .compose-slots > .compose-foot { anchor-name: --cs-foot; }
  .compose-slots > .cs-panel:not([hidden]), .compose-slots > .compose-more:not([hidden]) { position: absolute; z-index: 8; margin: 0;
    box-sizing: border-box; left: anchor(left); right: anchor(right); box-shadow: var(--shadow-pop); }
  .compose-slots > .cs-panel:not([hidden]), .compose-slots > .compose-more:not([hidden]) { position-anchor: --cs-foot;
    top: calc(anchor(bottom) + 12px); }
  .compose-slots > .compose-more:not([hidden]) { padding: 12px; background: var(--surface); border: var(--rule) solid var(--line);
    border-radius: var(--radius-sm); }
}

.page:has(.screen-foot[data-glass]) { padding-block-end: calc(var(--foot-h) + 24px + env(safe-area-inset-bottom, 0px)); }
@media (max-height: 639px) {
  .screen-foot[data-glass] { position: static; inset-inline: auto; }
  .page:has(.screen-foot[data-glass]) { padding-block-end: 0; }
}

.why-note { transition: opacity var(--quick) var(--ease-out), translate var(--spring-settle-duration) var(--spring-settle); }
.why-note[data-leaving] { opacity: 0; }  
.chat-window, dialog.pop.palette, dialog.pop.palette::backdrop {
  transition: opacity var(--quick) var(--ease-out), scale var(--spring-settle-duration) var(--spring-settle), translate var(--spring-settle-duration) var(--spring-settle),
    display var(--quick) var(--ease-linear) allow-discrete, overlay var(--quick) var(--ease-linear) allow-discrete; }
.chat-window[hidden], dialog.pop.palette:not([open]) { opacity: 0; }
dialog.pop.palette:not([open]) { scale: 0.98; }
@starting-style {
  .chat-window:not([hidden]) { opacity: 0; scale: 0.85; }
  .why-note:not([hidden]) { opacity: 0; translate: 0 -4px; }
  dialog.pop.palette[open] { opacity: 0; scale: 0.98; }
}
.chat-window[hidden] { scale: 0.85; }
.report-over { transition: opacity var(--quick) var(--ease-out); }
.report-over > .report-window { transition: scale var(--spring-settle-duration) var(--spring-settle); }
.report-over[data-leaving] { opacity: 0; }
.report-over[data-leaving] > .report-window { scale: 0.96; }
@starting-style { .report-over { opacity: 0; } .report-over > .report-window { scale: 0.96; } }
details { interpolate-size: allow-keywords; }
:is(.page, .nav, .pres, .chat-window, .report-over) details::details-content { opacity: 0; transition: opacity var(--quick) var(--ease-out), content-visibility var(--quick) var(--ease-linear) allow-discrete; }
details[open]::details-content { opacity: 1; }
:is(details.fold, details.more, details.meta, details.file, details.did, details.jchange, details.nav-more)::details-content {
  block-size: 0; overflow: clip; transition: opacity var(--quick) var(--ease-out), block-size var(--spring-settle-duration) var(--spring-settle),
    content-visibility var(--spring-settle-duration) var(--ease-linear) allow-discrete; }
:is(details.fold, details.more, details.meta, details.file, details.did, details.jchange, details.nav-more)[open]::details-content { block-size: auto; }
@media (min-width: 760px) {
  .pres { opacity: 0; transition: width var(--tick) var(--ease-out), padding var(--tick) var(--ease-out), opacity var(--tick) var(--ease-out),
    display var(--tick) var(--ease-out) allow-discrete; }  
  :root[data-presence="open"] .pres { opacity: 1; }
  @starting-style { :root[data-presence="open"][data-presence-move] .pres { opacity: 0; } }
}
#turns > article[data-ended] footer {
  --rise: 4px; transition: opacity var(--base) var(--ease-out), translate var(--base) var(--ease-out); }
@starting-style { #turns > article[data-ended] footer { opacity: 0; translate: 0 var(--rise); } }
@media screen and (prefers-reduced-motion: reduce) { #turns > article[data-ended] footer { --rise: 0; } details::details-content { block-size: auto !important; } }
:root[data-rm="on"] details::details-content { block-size: auto !important; }
:root[data-fade]::view-transition-old(root), :root[data-fade]::view-transition-new(root) { animation-duration: var(--quick); }

:root :is(#turns :is(button.rewind, button.copy, button.forward), #panel-open, .composer button.pick.settings, button.job.other, summary.btn,
  .pres-tools .btn) > svg {
  inline-size: 16px; block-size: 16px; }
:root :is(.composer :is(button.attach, button.send), .composer .where, :is(a, button).chip) > svg, :root .pres-row > svg.kind {
  inline-size: 20px; block-size: 20px; }
:root :is(#turns :is(button.rewind, button.copy, button.forward), #panel-open, .composer button.pick.settings, button.job.other, summary.btn,
  .pres-tools .btn, .composer :is(button.attach, button.send), .composer .where, :is(a, button).chip) > svg :is(path, circle, line, polyline, rect),
:root .pres-row > svg.kind :is(path, circle, line, polyline, rect) { stroke-width: 1.8; }

.brand, .bar-top .here, main h1, main h2, main h3, .tour-card.welcome #tour-name { font-family: var(--font-display); font-weight: 600; }


@media (min-width: 760px) {
  #chat[data-panel="open"] > #panel { top: calc(var(--chrome-bar, 0px) + var(--panel-top, 0px)); box-sizing: border-box; 
    height: calc(100dvh - var(--chrome-bar, 0px) - var(--panel-top, 0px) - var(--panel-under, 0px)); }
}

aside.dock .answer figure.code { margin-inline: 0; margin-top: 0; border: var(--rule) solid var(--line-strong); border-radius: var(--radius-sm); overflow: hidden; background: var(--surface); }
aside.dock .answer figure.code > figcaption { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 28px;
  padding: 0 4px 0 calc(var(--pad) * .75); background: var(--hover); border-bottom: var(--rule) solid var(--line-strong); font-size: var(--text-xs); color: var(--muted); }
aside.dock .answer .code-copy { display: inline-flex; align-items: center; justify-content: center; inline-size: 28px; block-size: 28px; margin-left: auto;
  padding: 0; border: 0; border-radius: var(--radius-sm); background: none; color: var(--muted); cursor: pointer; }
aside.dock .answer .code-copy:hover, aside.dock .answer .code-copy:focus-visible { background: var(--press); color: var(--ink); }
aside.dock .answer .code-copy > span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
aside.dock .answer .code-copy svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
aside.dock .answer figure.code > pre { margin: 0; padding: calc(var(--gap) * .75) calc(var(--pad) * .875); overflow-x: auto; line-height: 1.6; font-size: var(--text-sm); tab-size: 4;
  mask-image: linear-gradient(to left, transparent, black 16px); }



@media (pointer: coarse) and (min-height: 450px) { #panel-open { --touch: 44px; min-inline-size: var(--touch); min-block-size: var(--touch); } .composer .box .asking .btn { min-height: var(--touch); } }
#model-for-chat { max-inline-size: 100%; min-inline-size: 0; }