:root {
  --mask-chevron: var(--icon-chevron-mask);
  --mask-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5.25 12.5 4.25 4.25 9.25-9.5'/%3E%3C/svg%3E");
  --safe-top: max(12px, env(safe-area-inset-top));
  
  --edge-top: calc(max(env(safe-area-inset-top, 0px), var(--telegram-device-top, 0px)) + var(--telegram-content-top, 0px));
  --edge-bottom: calc(max(env(safe-area-inset-bottom, 0px), var(--telegram-device-bottom, 0px)) + var(--telegram-content-bottom, 0px));
  --edge-left: calc(max(env(safe-area-inset-left, 0px), var(--telegram-device-left, 0px)) + var(--telegram-content-left, 0px));
  --edge-right: calc(max(env(safe-area-inset-right, 0px), var(--telegram-device-right, 0px)) + var(--telegram-content-right, 0px));
  
  --below: max(0px, calc(100dvh - var(--app-height, 100dvh) - var(--app-top, 0px)));
  --icon-coin-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.25'/%3E%3Cpath fill='black' fill-opacity='0' stroke='none' d='M12 7.4c.3 2.4 2.2 4.3 4.6 4.6-2.4.3-4.3 2.2-4.6 4.6-.3-2.4-2.2-4.3-4.6-4.6 2.4-.3 4.3-2.2 4.6-4.6Z'/%3E%3Cpath d='M12 7.4c.3 2.4 2.2 4.3 4.6 4.6-2.4.3-4.3 2.2-4.6 4.6-.3-2.4-2.2-4.3-4.6-4.6 2.4-.3 4.3-2.2 4.6-4.6Z'/%3E%3C/svg%3E");
  --mask-alert: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.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 7.75v5'/%3E%3Ccircle fill='black' stroke='none' cx='12' cy='16.25' r='1.1'/%3E%3C/svg%3E");
  --scrim:var(--color-scrim);
  --code-keyword:#ff7b72;
  --code-string:#a5d6ff;
  --code-comment:#9198a1;
  --code-number:#79c0ff;
  --code-function:#d2a8ff;
  --code-type:#ffa657;
  --code-tag:#7ee787;
  --mask-info: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.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 11v5'/%3E%3Ccircle fill='black' stroke='none' cx='12' cy='8' r='1.1'/%3E%3C/svg%3E");
}

.visually-hidden { position: fixed !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; }
html, body { width: 100%; height: 100%; min-height: 0; overscroll-behavior: none; }
html { background: var(--bg); }
body {
  overflow: hidden;
}
button { border: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
svg { display: block; width: var(--icon-toolbar); height: var(--icon-toolbar); fill: none; stroke: currentColor; stroke-width: var(--icon-stroke); stroke-linecap: round; stroke-linejoin: round; }
.icon-sprite { position: fixed; width: 0; height: 0; overflow: hidden; }
.ambient { display: none; }
h1, h2, h3, p { margin-top: 0; }
code, pre { font-family: var(--font-code); }

.app-shell {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  width: 100%;
  height: var(--app-height, 100dvh);
  max-width: 1920px;
  margin: 0 auto;
}

.sidebar {
  position: relative;
  z-index: 3;
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: var(--sidebar);
}
.brand { display: inline-flex; width: max-content; align-items: center; padding: 0 var(--space-2); color: var(--text); }
.brand-mark { display: grid; width: 31px; height: 31px; place-items: center; border-radius: var(--radius-control); background: var(--green-wash); }
.brand-mark img { width: 25px; height: 25px; }

.brand-lockup { --brand-size: 30px; height: 44px; gap: 9px; }
.brand-glyph { display:block; flex:none; width:var(--brand-size); height:var(--brand-size); background:var(--color-accent); mask:url('/snake.svg') center / contain no-repeat; -webkit-mask:url('/snake.svg') center / contain no-repeat; }
.brand-glyph img { display:block; width:100%; height:100%; opacity:0; }
.brand-name em { color:inherit; font-style:normal; }

.brand .brand-glyph { background:currentColor; }

.brand-name{font-size:21px;font-weight:600;letter-spacing:-.045em;line-height:1;display:inline-block;flex:none;height:.82em;width:4.09em;background-color:currentColor;mask:url('/wordmark.svg') left center/contain no-repeat;-webkit-mask:url('/wordmark.svg') left center/contain no-repeat;text-indent:-999em;overflow:hidden;white-space:nowrap;translate:0 2px}

.new-chat-button {
  display: flex;
  align-items: center;
  border-radius: var(--radius-control);
  transition: background var(--motion-hover) ease, transform var(--motion-press) ease;
  justify-content:flex-start;
  margin:var(--space-6) 0 0;
  color:var(--text);
  font-size:var(--text-nav);
  margin-top: var(--space-3);
  min-height: 40px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  font-weight: 500;
  gap: 10px;
}
.new-chat-button svg { color: currentColor; }
.sidebar-primary-nav { display: grid; gap:0; margin:0 0 var(--space-3); }
.sidebar-primary-nav button {
  display: flex;
  align-items: center;
  border-radius: var(--radius-control);
  color: var(--text-soft);
  background: transparent;
  font-weight: 500;
  text-align: left;
  transition: background var(--motion-hover) ease, color var(--motion-hover) ease;
}
.sidebar-primary-nav button svg { width: var(--icon-toolbar); height: var(--icon-toolbar); color: var(--muted); }
.sidebar-primary-nav button:hover { color: var(--text); background: var(--surface); }
.sidebar-primary-nav button.active { color: var(--text); background: var(--color-active); }
.sidebar-primary-nav button.active svg { color: var(--green-strong); }
.chat-item {
  position: relative;
  width: 100%;
  min-height: 54px;
  padding: 10px 11px;
  border-radius: var(--radius-control);
  color: var(--text-soft);
  background: transparent;
  text-align: left;
  transition: background var(--motion-hover) ease, color var(--motion-hover) ease;
}
.chat-item:hover { background: var(--surface); }
.chat-item.active { color: var(--text); background: var(--surface-hover); }
.chat-item strong, .chat-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-item strong { font-size: var(--fs-small); font-weight: 500; }
.chat-item small { margin-top: var(--space-1); color: var(--faint); font-size: var(--fs-small); }
.chat-item .item-meta { display: none; }

.sidebar-footer { display: grid; grid-template-columns: minmax(0, 1fr); flex-shrink: 0; gap: var(--space-3); margin-top: auto; background: var(--sidebar); padding-inline: 0; padding:var(--space-3) 0 0; border-top:1px solid var(--color-border); }
.settings-shortcut { display: flex; width:100%; min-width: 46px; align-items: center; justify-content:flex-start; border:1px solid transparent; border-radius:var(--radius-control); color: var(--text-soft); }
.settings-shortcut span { display:block; }
.settings-shortcut:hover, .settings-shortcut.active { color: var(--text); background: var(--surface-hover); }
.settings-shortcut svg { width: var(--icon-toolbar); height: var(--icon-toolbar); }
.sidebar-recents { flex: 1; min-height: 0; display: flex; flex-direction: column; padding-top:var(--space-3); }

.sidebar-studio[hidden], .sidebar-code[hidden], .mode-switch[hidden] { display:none !important; }
.sidebar-chat-list { overflow-y: auto; min-height: 0; overscroll-behavior: contain; }
.sidebar-chat-list .chat-item small, .sidebar-chat-list .item-meta { display: none; }
.sidebar-empty { padding: 0 10px; margin: 6px 0; color: var(--faint); font-size: var(--fs-small); line-height: 1.6; }
.models-catalog { grid-template-columns:minmax(0,1fr); align-content:start; align-items:start; min-height: 0; overflow-y: auto; padding-bottom: var(--space-8); overscroll-behavior: contain; display:grid; gap:var(--space-3); }
.models-screen .catalog-heading { flex-shrink: 0; }
.model-family-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.catalog-model { display: flex; min-width: 0; flex-direction: column; padding:var(--space-5) 0; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; }
.catalog-model-heading { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:var(--space-2); padding-top:var(--space-1); }
.catalog-model h3 { margin:0; font-size:var(--text-input); line-height:var(--leading-body); font-weight:600; letter-spacing:-.02em; }
.model-state { color: var(--faint); font-size: var(--fs-micro); overflow-wrap:anywhere; }
.model-state.available { color: var(--green-strong); }
.catalog-model p { margin: var(--space-3) 0 18px; color: var(--muted); font-size: var(--fs-body); line-height: 1.55; }
.catalog-model button svg { width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); transform: rotate(180deg); }
.catalog-model button { background: transparent; }
.catalog-model button:hover { color: var(--text); }
.model-access { margin-top: var(--space-4); font-size: var(--fs-small); }
.model-access summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); cursor: pointer; list-style: none; }
.model-access summary::-webkit-details-marker { display: none; }
.model-access summary::after { content: "+"; font-size: 18px; }
.model-access[open] summary::after { content: "−"; }
.model-access dl { margin: 0; }
.model-access dl > div { padding: 9px 0; border-top: 1px solid var(--line); }
.model-access dt { color: var(--text-soft); }
.model-access dd { margin: var(--space-1) 0 0; color: var(--muted); line-height: 1.5; }

.catalog-model-heading .model-brand { margin:0; }
.catalog-model-title { min-width:0; }
.catalog-model-title h3 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.model-kind { display:block; margin-top:3px; color:var(--muted); font-size:var(--fs-micro); }
.catalog-model p.catalog-model-purpose { margin:var(--space-3) 0 var(--space-1); }
.model-state.unstable { color:var(--amber); }
.catalog-details { margin-top:var(--space-2); border-top:1px solid var(--line); border-top-color:var(--line); }
.catalog-details > summary { min-height:44px; display:flex; align-items:center; justify-content:space-between; color:var(--muted); cursor:pointer; list-style:none; }
.catalog-details > summary::-webkit-details-marker { display:none; }
.catalog-details > summary::after { content:"+"; font-size:18px; }
.catalog-details[open] > summary::after { content:"−"; }
.catalog-details .picker-detail-content { margin:0; padding-top:var(--space-2); }
.catalog-details .model-summary { margin-top:0; }
.catalog-model-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); margin-top:auto; border-top:0; padding-top:var(--space-1); }
.catalog-model-actions button { display: flex; align-items: center; font-size: var(--fs-small); text-align: left; flex:1 1 180px; min-height:44px; margin:0; padding:0 var(--space-2); border:0; border-radius:var(--radius-control); border-top:0; background:transparent; color:var(--green-strong); }
.model-empty strong { color:var(--text); font-size:var(--fs-body); font-weight:500; }
.model-empty p { margin:var(--space-1) 0 var(--space-3); }
.model-empty button { min-height:44px; margin:0; padding:0 var(--space-3); border:1px solid var(--line-strong); border-radius:var(--radius-control); color:var(--text); background:var(--surface); }

.status-dot { width: 7px; height: 7px; border-radius: 50%; background:var(--color-success); }

.workspace { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: var(--workspace); }
.screen { display: none; height: 100%; overflow: auto; padding: clamp(42px, 7vw, 88px) clamp(var(--space-8), 8vw, 110px) 92px; }
.screen.active { display: block; animation: screen-in var(--motion-modal) var(--ease-ui) backwards; }
@keyframes screen-in { from { opacity: 0; transform: translateY(4px); } }
.eyebrow { margin: 0 0 9px; color: var(--green-strong); font-size: var(--fs-small); font-weight: 600; letter-spacing: .055em; text-transform: uppercase; }
h1 { margin-bottom: 0; font-family: inherit; font-size: var(--text-title); font-weight: 600; line-height: var(--leading-title); letter-spacing: -.02em; }
.mobile-header { display: none; }
.empty-copy { color: var(--muted); font-size: var(--fs-small); }

.conversation-screen { padding: 0; overflow: hidden; }
.conversation-screen.active { display: flex; flex-direction: column; }
.conversation-header {
  display: grid;
  min-height: 64px;
  
  align-items: center;
  gap: var(--space-2);
  padding: 10px 22px;
  border-bottom: 1px solid var(--line);
  
  background: var(--workspace);
}
.conversation-header .more-button { justify-self: end; grid-column: 3; }
.back-button { display: none; }
.conversation-title { min-width: 0; }
.conversation-title h2 { overflow: hidden; margin: 0 0 var(--space-half); font-size: var(--fs-lead); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.conversation-title span { color: var(--faint); font-size: var(--fs-micro); }
.model-pill {
  display: flex;
  min-height: 44px;
  align-items: center;
  gap: var(--space-2);
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  color: var(--text-soft);
  background: var(--panel);
  font-size: var(--fs-micro);
  font-weight: 600;
  transition: border-color var(--motion-hover) ease, background var(--motion-hover) ease;
}
.model-pill:hover { border-color: var(--line-strong); background: var(--surface); }
.model-pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--pill-accent, var(--green)); }
.model-pill svg { width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); color: var(--faint); }
.more-button, .back-button { place-items: center; width: 44px; height: 44px; border-radius: var(--radius-control); color: var(--muted); background: transparent; }
.more-button { display: grid; }
.more-button[hidden] { display: none; }
.more-button:hover, .back-button:hover { color: var(--text); background: var(--surface); }
.messages { flex: 1; min-height: 0; overflow: auto; padding: 29px clamp(var(--space-6), 8vw, 120px) var(--space-5); scroll-behavior: auto; }
.message-row { display: flex; margin: 0 auto var(--space-6); }
.message-row.user { justify-content: flex-end; }
.message-bubble { min-width:0; max-width: min(82%, 650px); color: var(--text-soft); font-size: var(--text-message); line-height: var(--leading-message); overflow-wrap: anywhere; }
.message-row.assistant .message-bubble { width: min(100%, 760px); }
.message-bubble p { margin-bottom: 0; }
.message-row.assistant .message-bubble p + p { margin-top: 13px; }
.message-bubble h2, .message-bubble h3, .message-bubble h4, .message-bubble h5, .message-bubble h6 { margin: var(--space-5) 0 var(--space-2); color: var(--text); line-height: 1.35; font-size: var(--fs-lead); }
.message-bubble h2 { font-size:24px; }
.message-bubble h3 { font-size:20px; }
.message-bubble h4 { font-size:18px; }
.message-bubble h5,.message-bubble h6 { font-size:var(--text-message); }
.message-bubble ul, .message-bubble ol { margin: 10px 0; padding-left: 1.4em; }
.message-bubble li { padding-left: .15em; margin: var(--space-1) 0; }
.message-bubble a { color: var(--green-strong); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.message-bubble :not(pre) > code { padding: 2px 5px; border-radius: var(--radius-xs); background: var(--surface); font-size: calc(1em - 2px); }  
.table-scroll { position: relative; max-width: 100%; overflow-x: auto; margin: var(--space-3) 0; border: 1px solid var(--line-strong); border-radius: var(--radius-control); background: var(--panel); }

.table-scroll table { width: max-content; min-width: 100%; border-collapse: collapse; font-size: calc(var(--text-message) - 1px); }
.table-scroll th, .table-scroll td { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow-wrap: normal; word-break: normal; vertical-align: top; }
.table-scroll th:last-child, .table-scroll td:last-child { border-right: 0; }
.table-scroll tbody tr:last-child td { border-bottom: 0; }
.table-scroll th { color: var(--text); font-weight: 600; white-space: nowrap; background:var(--color-hover); }
.table-scroll th:first-child, .table-scroll td:first-child { position: sticky; left: 0; z-index: 1; background: var(--panel); }
.table-scroll th:first-child { z-index: 2; background:var(--color-hover); }
.table-scroll::after { content: ""; z-index: 3; pointer-events: none; position:sticky; top:auto; right:0; bottom:auto; flex:none; width:var(--space-8); margin-left:calc(-1 * var(--space-8)); background:linear-gradient(90deg, transparent, var(--color-surface) 85%); }
.math-expression { max-width: 100%; overflow-x: auto; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; white-space: nowrap; }
.math-inline { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.math-expression sup, .math-expression sub, .math-inline sup, .math-inline sub { font-size: .72em; line-height: 0; }
.code-block { overflow: hidden; margin: var(--space-3) 0; border: 1px solid var(--line-strong); border-radius: var(--radius-control); background: var(--surface); border-color:var(--color-border); }
.code-toolbar { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); min-height:var(--control-compact); padding:0 var(--space-1) 0 var(--space-3); color:var(--color-text-secondary); font-size:var(--text-secondary); line-height:var(--leading-secondary); }
.code-toolbar button, .message-actions button { padding: 0 var(--space-2); border-radius: var(--radius-control); color: var(--muted); background: transparent; font-size: var(--fs-small); }
.code-toolbar button:hover, .message-actions button:hover { color: var(--text); background: var(--surface-hover); }
.code-block pre { margin: 0; overflow-x: auto; max-width: 100%; tab-size: 2; line-height: 22px; }
.code-block code { white-space: pre; }

.answer-image { display:block; width:fit-content; max-width:100%; margin:var(--space-2) 0; border-radius:var(--radius-control); overflow:hidden; }
.answer-image-ask { display:inline-flex; align-items:center; gap:var(--space-2); max-width:100%; min-height:36px; margin:var(--space-2) 0; padding:0 var(--space-3); border:1px solid var(--color-border); border-radius:var(--radius-control); color:var(--color-text-secondary); background:transparent; font-size:var(--text-secondary); }
.answer-image-ask:hover { color:var(--color-text); background:var(--color-hover); }
.answer-image-ask svg { flex:none; width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
.answer-image-host { overflow:hidden; color:var(--color-text-tertiary); text-overflow:ellipsis; white-space:nowrap; }
@media (pointer:coarse) { .answer-image-ask { min-height:44px; } }
.answer-image img { display:block; max-width:100%; max-height:480px; height:auto; object-fit:contain; background:var(--color-surface); }

.code-block[data-viz-ready] { position:relative; border-radius:var(--radius-panel); border-color:var(--color-border); background:var(--color-surface); }
.code-block[data-viz-ready] .code-toolbar { position:absolute; top:var(--space-2); right:var(--space-2); z-index:1; gap:2px; min-height:0; padding:2px; border:0; border-radius:var(--radius-control); background:var(--color-surface); }
.code-block[data-viz-ready] .code-toolbar button { justify-content:center; width:32px; min-height:32px; height:32px; padding:0; color:var(--color-text-tertiary); }
.code-block[data-viz-ready] .code-toolbar button:hover, .code-block[data-viz-ready] .code-toolbar button[aria-pressed="true"] { color:var(--color-text); background:var(--color-hover); }
.code-block[data-viz-ready] .code-toolbar button[hidden] { display:none; }
.code-block[data-viz-ready] pre { padding-top:calc(var(--space-3) + 36px); }
@media (hover:hover) {
  .code-block[data-viz-ready] .code-toolbar { opacity:0; transition:opacity .15s ease; }
  .code-block[data-viz-ready]:is(:hover, :focus-within) .code-toolbar { opacity:1; }
}
@media (pointer:coarse) { .code-block[data-viz-ready] .code-toolbar button { width:44px; min-height:44px; height:44px; } }

@media (hover:none) {
  .code-block[data-viz-ready] .code-toolbar { position:static; justify-content:flex-end; padding:var(--space-1) var(--space-1) 0; border-radius:0; background:var(--color-surface); }
  .code-block[data-viz-ready]:has(> pre:not([hidden])) .code-toolbar { background:transparent; }   
  .code-block[data-viz-ready] pre { padding-top:var(--space-3); }
}
.code-block[data-viz-failed] .code-toolbar { justify-content:flex-end; }
.code-preview { background:var(--color-surface); }
.code-preview[hidden], .code-block pre[hidden] { display:none; }
.code-preview iframe { display:block; width:100%; border:0; background:transparent; }

@media (prefers-reduced-motion:no-preference) { .code-preview iframe { transition:height 220ms var(--ease-ui); } }

.message-row.pending .code-block[data-viz-open] pre, .code-block[data-viz]:not([data-viz-ready]):not([data-viz-failed]) pre { display:flex; flex-direction:column-reverse; max-height:240px; overflow:hidden; -webkit-mask-image:linear-gradient(transparent, #000 64px); mask-image:linear-gradient(transparent, #000 64px); }
.message-row.pending .code-block[data-viz-open] .code-toolbar, .code-block[data-viz]:not([data-viz-ready]):not([data-viz-failed]) .code-toolbar { display:none; }   

.user-actions[data-actions-placeholder] { visibility:hidden; }
.viz-loading { border-radius:var(--radius-control); background:linear-gradient(100deg, var(--color-hover) 30%, var(--color-border) 50%, var(--color-hover) 70%) 0 0 / 200% 100%; animation:viz-shimmer 1.4s linear infinite; }
@keyframes viz-shimmer { to { background-position:-200% 0; } }
@media (prefers-reduced-motion:reduce) { .viz-loading { animation:none; } }
.viz-dialog { width:min(1100px, calc(100vw - 32px)); height:min(800px, calc(100dvh - 32px)); max-width:none; max-height:none; padding:0; border:1px solid var(--color-border); border-radius:var(--radius-panel); color:var(--color-text); background:var(--color-surface); }
.viz-dialog[open] { display:flex; flex-direction:column; }
.viz-dialog::backdrop { background:var(--color-viewer); }   

.viz-dialog-bar { display:flex; justify-content:flex-end; padding:var(--space-1); }
.viz-dialog-bar button { display:inline-flex; align-items:center; justify-content:center; width:44px; min-height:44px; padding:0; border-radius:var(--radius-control); color:var(--color-text-tertiary); background:transparent; }
.viz-dialog-bar button svg { width:18px; height:18px; stroke-width:var(--icon-stroke-small); }
.viz-dialog-bar button:hover { color:var(--color-text); background:var(--color-hover); }
.viz-dialog-body { flex:1; min-height:0; }
.viz-dialog-body iframe { display:block; width:100%; height:100%; border:0; }
@media (max-width:640px) { .viz-dialog { width:100vw; height:100dvh; margin:0; inset:0; border:0; border-radius:0; } }
.pending-answer:empty { display: none; }
.message-actions { display: flex; gap:var(--space-1); margin-top:var(--space-3); }
.message-privacy { display: block; margin-top: 7px; color: var(--faint); font-size: var(--fs-micro); width:auto; max-width:100%; line-height:1.5; }
.message-privacy.local_only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.message-row.user .message-privacy { margin-left: auto; }

.is-empty .messages { display:flex; flex-direction:column; flex:0 1 auto; margin-top:auto; padding-bottom:0; }
.is-empty .composer-wrap { margin-bottom:auto; padding-top:var(--space-6); }
.empty-conversation { width: 100%; max-width: 640px; margin:0 auto; padding:var(--space-4) 0 0; text-align:center; }
.empty-conversation p { margin: 0; color: var(--muted); font-size: var(--text-body); }

.attachment-chip { max-width:100%; white-space:normal; overflow-wrap:anywhere; display: flex; align-items: center; gap: 9px; margin-top: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--radius-control); color: var(--text-soft); background: var(--panel); font-size: var(--fs-micro); }
.attachment-chip i { color: var(--green-strong); font-style: normal; }
.artifact-card { width: 100%; text-align: left; text-decoration: none; cursor: pointer; }
.artifact-card:disabled { cursor: wait; opacity: .7; }
.artifact-card b { flex-shrink: 0; white-space: nowrap; margin-left: auto; color: var(--green-strong); font-size: var(--fs-small); }

.composer-wrap { position: relative; padding: 10px clamp(var(--space-6), 8vw, 120px) max(15px, env(safe-area-inset-bottom)); background: linear-gradient(transparent, var(--workspace) 30%); anchor-name:--composer; }
.composer-controls { display: flex; max-width: 780px; align-items: center; gap: 7px; margin: 0 auto var(--space-2); overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-right: 76px; min-height: 44px; }
.composer-controls::-webkit-scrollbar { display: none; }
.composer-control { display: inline-flex; flex: 0 0 auto; min-height: var(--control-size); align-items: center; gap: 7px; padding: 0 11px; border: 1px solid var(--line); border-radius: var(--radius-control); color: var(--muted); background: color-mix(in srgb, var(--input) 88%, transparent); font-size: var(--fs-small); white-space: nowrap; transition: color var(--motion-hover) ease, border-color var(--motion-hover) ease, background var(--motion-hover) ease; }
.composer-control svg { width:20px; height:20px; }
.composer-control small { padding: 2px 5px; border-radius: var(--radius-pill); color: var(--faint); background: var(--surface); font-size: var(--fs-micro); letter-spacing: .02em; text-transform: uppercase; }
.composer-control.icon-only { width: 40px; justify-content: center; padding: 0; }
.composer-control:hover:not(:disabled) { border-color: var(--line-strong); color: var(--text); background: var(--surface-hover); }
.composer-control[aria-pressed="true"] { border-color: var(--green); color: var(--green-strong); background: var(--green-focus); }
.composer-control:disabled { cursor: not-allowed; opacity: .62; }
.composer-control:disabled small { opacity: 1; }
.thinking-control[data-mode="on"] { border-color: color-mix(in srgb, var(--green) 42%, var(--line)); color: var(--text); }
.thinking-control[data-mode="on"] svg, .thinking-control[data-mode="auto"] svg { color: var(--green-strong); }
.thinking-control[aria-expanded="true"] { border-color: var(--green); color: var(--text); background: var(--green-focus); }
.thinking-menu { position: absolute; z-index: 38; bottom: calc(100% - 5px); left: max(clamp(73px, calc(8vw + 49px), 169px), calc((100% - 682px) / 2)); display: grid; width: min(350px, calc(100vw - 24px)); max-height: min(390px, calc(var(--app-height, 100dvh) - 150px)); overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--line-strong); border-radius: var(--radius-panel); background: var(--color-elevated); box-shadow: var(--shadow-overlay); }
.thinking-menu[hidden] { display: none; }
.attach-menu { position: absolute; z-index: 12; bottom: calc(100% - 5px); left: max(clamp(24px, 8vw, 120px), calc((100% - 780px) / 2)); display: grid; width: min(260px, calc(100vw - 24px)); padding: 6px; border: 1px solid var(--line-strong); border-radius: var(--radius-control); background: var(--color-elevated); box-shadow: var(--shadow-overlay); }
.attach-menu[hidden] { display: none; }
.attach-menu button { display: flex; min-height: 44px; align-items: center; gap: 10px; padding: 0 11px; border-radius: var(--radius-control); color: var(--text); background: transparent; text-align: left; }
.attach-menu button:hover:not(:disabled) { background: var(--surface-hover); }
.attach-menu button:disabled { opacity: .45; cursor: not-allowed; }
.attach-menu svg { width:20px; height:20px; color: var(--green-strong); }
.voice-recorder { display: grid; grid-template-columns: 8px auto minmax(34px, 1fr) auto auto; max-width: 780px; min-height: 50px; align-items: center; gap: 6px; margin: 0 auto 7px; padding: 5px 6px 5px 10px; border: 1px solid var(--line-strong); border-radius: var(--radius-control); background: var(--panel); }
.voice-recorder[hidden] { display: none; }
.voice-recorder strong { color: var(--text); font-size: var(--fs-small); font-weight: 500; }
.voice-recorder time { flex: 1; }
.voice-recorder button { display: inline-flex; min-height: var(--control-size); align-items: center; gap: 5px; padding: 0 10px; border-radius: var(--radius-control); color: var(--text-soft); background: transparent; font-size: var(--fs-small); }
.voice-recorder button:last-child { color: var(--on-accent); background: var(--green); }
.voice-recorder button svg { width:16px; height:16px; }
@keyframes record-pulse { 50% { opacity: .45; } }
.composer:focus-within { box-shadow: none; border-color: var(--color-border-strong); background: var(--color-surface); }
.composer-stage { position: relative; max-width: 760px; margin: 0 auto; }
.composer-control[hidden] { display: none; }
.composer .voice-button { border-color: transparent; background: transparent; }
.voice-recorder:not([hidden]) { margin-bottom: 7px; }
.composer textarea::placeholder { color: var(--faint); }
.send-button { display: grid; flex: 0 0 auto; width: 39px; height: 39px; place-items: center; border-radius: var(--radius-control); transition: color var(--motion-hover) ease, background var(--motion-hover) ease, transform var(--motion-press) ease; color:var(--color-on-action); background:var(--color-action); }
.send-button:hover:not(:disabled) { background:color-mix(in srgb,var(--color-action) 86%,var(--color-bg)); }
.send-button svg { width:24px; height:24px; }
.send-button:disabled { cursor:default; opacity:.35; }
.composer.locked, .composer.limit-spent { opacity: .6; }
.composer.locked textarea { cursor: not-allowed; }

.limit-row { display: flex; max-width: 756px; margin: 0 auto; padding: 0 0 6px 6px; padding-bottom: var(--space-2); }
.limit-row:has(> [hidden]) { display: none; }
.limit-line { display: inline-flex; align-items: center; margin-left: -6px; border: 0; border-radius: var(--radius-pill); background: transparent; font: inherit; line-height: 18px; cursor: pointer; min-height: 32px; gap: 6px; padding: var(--space-half) var(--space-2) var(--space-half) var(--space-1); color: var(--color-text-tertiary); font-size: var(--fs-micro); }
.limit-line:hover { background: var(--color-hover); color: var(--color-text); }
.limit-line:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.limit-bar { position: relative; display: block; flex: none; width: 32px; height: 4px; overflow: hidden; border-radius: 2px; background: color-mix(in srgb, currentColor 24%, transparent); }
.limit-bar-fill { position: absolute; inset: 0 auto 0 0; width: 100%; border-radius: inherit; background: var(--color-accent); transition: width 200ms ease; }

.limit-line[data-level="mint"] .limit-bar-fill { background: var(--color-brand); }
.limit-line[data-level="amber"] .limit-bar-fill { background: var(--color-warning); }
.limit-line[data-level="red"] .limit-bar-fill { background: var(--color-danger); }
.limit-line.is-empty .limit-bar { background: color-mix(in srgb, var(--color-danger) 40%, transparent); }
@media (prefers-reduced-motion: reduce) { .limit-bar-fill { transition: none; } }

.chat-origin { display: inline-flex; align-items: center; padding: 0 6px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-pill); color: var(--color-text-tertiary); font-size: var(--fs-micro); line-height: 16px; }

.usage-sheet { display: flex; flex-direction: column; gap:0; }
.usage-bars { display: flex; flex-direction: column; gap:18px; padding:var(--space-1) 0 var(--space-3); }
.usage-row { display: grid; align-items: center; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"title left" "track track" "note note"; row-gap:6px; column-gap:var(--space-3); }
.usage-row .usage-title { grid-area: title; font-weight: 500; font-size:16px; }
.usage-row .usage-track { grid-area: track; border-radius: var(--radius-pill); overflow: hidden; }
.usage-row .usage-track i { display: block; height: 100%; border-radius: var(--radius-pill); background: var(--color-accent); }
.usage-row[data-level="amber"] .usage-track i { background: var(--color-warning); }
.usage-row[data-level="red"] .usage-track i { background: var(--color-danger); }
.usage-row b { grid-area: left; white-space: nowrap; }
.usage-row .usage-note { grid-area: note; color: var(--color-text-tertiary); font-size:var(--text-secondary); line-height:var(--leading-secondary); }
.usage-row.is-off { grid-template-rows: auto; grid-template-areas:"title note"; }
.usage-row.is-off .usage-note { grid-area: note; }
.usage-extra, .usage-how, .usage-empty { margin: 0; color: var(--color-text-secondary); font-size: var(--text-secondary); line-height: 18px; }
.usage-model-limits { margin-top: var(--space-3); }
.usage-model-limits > p { margin: 0 0 var(--space-2); font-weight: 600; }
.usage-model-limits dl { margin: 0; line-height: 1.5; }
.usage-model-limits dl > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--space-4); padding: 9px 0; border-top: 1px solid var(--color-border); }
.usage-model-limits dt { color: var(--color-text-secondary); }
.usage-model-limits dd { margin: 0; overflow-wrap: anywhere; }
.usage-sheet h3 { margin: 14px 0 4px; font-size: var(--text-secondary); font-weight: 600; color: var(--color-text-secondary); text-transform: none; }
.settings-toggle-card { margin-top: var(--space-6); }
.settings-toggle { display: flex; min-height: 55px; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 10px var(--space-4); cursor: pointer; }
.settings-toggle b { display: block; color: var(--text); font-weight: 500; }
.settings-toggle small { display: block; margin-top: var(--space-half); color: var(--muted); font-size: var(--fs-small); line-height: 1.4; }
.settings-toggle .switch { flex: none; }
.switch input:focus-visible + i { outline: 2px solid var(--green); outline-offset: 2px; }
.composer-meta { display: flex; max-width: 756px; margin: 6px auto 0; font-size: var(--fs-micro); justify-content: center; gap: var(--space-3); color: var(--color-text-tertiary); }
.composer-meta span { display: flex; align-items: center; gap: 5px; }
.composer-meta svg { width: 11px; height: 11px; color: var(--green); }

.snake-pet {
  --pet-frames: 5;
  --pet-travel: min(40vw, 240px);
  position: absolute; z-index: 2; bottom: 100%;
  right: 14px;
  width: 58px; height: 51px; padding: 0; background: transparent;
  transform-origin: 50% 100%;
}
.snake-pet:active { transform: none; }
.pet-walker { position: absolute; inset: 0; pointer-events: none; }
.pet-body, .pet-apple {
  position: absolute; display: block;
  background-repeat: no-repeat;
  
  image-rendering: pixelated;
}
.pet-body {
  inset: 0;
  background-image: url("/pet.png?v=133ce3f41c");
  
  background-size: calc(var(--pet-frames) * 100%) 100%;
  background-position: 0 0;
}
.pet-apple {
  
  left: 66%; top: 55%; width: 24%; height: 25%;
  background-image: url("/apple.png");
  background-size: 100% 100%;
  transform-origin: 50% 90%;
}
.pet-spark { position: absolute; top: 2px; right: -4px; color: var(--color-warning); width:16px; height:16px; opacity: 0; pointer-events: none; }
.pet-spark svg { width:16px; height:16px; }


.snake-pet[data-animation="apple"] .pet-apple { animation: pet-offer 1.8s cubic-bezier(.2,.8,.3,1); }
.snake-pet[data-animation="apple"] { animation: pet-lean 1.8s cubic-bezier(.2,.8,.3,1); }
.snake-pet[data-animation="apple"] .pet-spark { animation: pet-glint 1.8s ease-in-out; }

.snake-pet[data-animation="tongue"] .pet-body { animation: pet-hiss 1.8s step-end; }
.snake-pet[data-animation="tongue"] { animation: pet-peek 1.8s cubic-bezier(.2,.8,.3,1); }

.snake-pet[data-animation="crawl"] .pet-walker { animation: pet-journey 4.8s cubic-bezier(.4,0,.3,1); }
.snake-pet[data-animation="crawl"] .pet-body { animation: pet-slither 4.8s step-end, pet-facing 4.8s linear; }
.snake-pet[data-animation="crawl"] .pet-apple { animation: pet-drop 4.8s cubic-bezier(.3,0,.4,1); }

@keyframes pet-peek { 0%,100% { transform: none; } 30%,65% { transform: translateY(-4px) scale(1.1); } }
@keyframes pet-lean { 0%,100% { transform: none; } 35%,65% { transform: translate(2px,-3px) rotate(-4deg); } }
@keyframes pet-offer { 0%,100% { transform: none; } 35%,65% { transform: translate(6px,-10px) scale(1.3) rotate(-10deg); } }
@keyframes pet-glint { 0%,25%,85%,100% { opacity: 0; transform: scale(.5); } 40%,65% { opacity: 1; transform: translate(4px,-7px) scale(1); } }

@keyframes pet-hiss {
  0% { background-position-x: 0%; }
  14% { background-position-x: 25%; }
  84% { background-position-x: 0%; }
}

@keyframes pet-journey {
  0%, 14% { transform: none; }
  22% { transform: translateX(calc(-.16 * var(--pet-travel))); }
  52%, 62% { transform: translateX(calc(-1 * var(--pet-travel))); }
  84% { transform: translateX(calc(-.06 * var(--pet-travel))); }
  92%, 100% { transform: none; }
}

@keyframes pet-facing {
  0%, 52% { transform: scaleX(1); }
  55% { transform: scaleX(.1); }
  58%, 91% { transform: scaleX(-1); }
  92%, 100% { transform: scaleX(1); }
}

@keyframes pet-slither {
  0% { background-position-x: 0%; }
  13% { background-position-x: 50%; }
  18% { background-position-x: 75%; }
  24% { background-position-x: 100%; }
  30% { background-position-x: 75%; }
  36% { background-position-x: 100%; }
  42% { background-position-x: 75%; }
  48% { background-position-x: 100%; }
  56% { background-position-x: 75%; }
  62% { background-position-x: 100%; }
  68% { background-position-x: 75%; }
  74% { background-position-x: 100%; }
  80% { background-position-x: 75%; }
  86% { background-position-x: 50%; }
  93% { background-position-x: 0%; }
}

@keyframes pet-drop {
  0% { transform: none; }
  10% { transform: translateY(80%); }
  14% { transform: translateY(60%); }
  18%, 92% { transform: translateY(80%); }
  100% { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  
  .snake-pet[data-animation], .snake-pet[data-animation] .pet-walker, .snake-pet[data-animation] .pet-apple { animation: none; }
  .snake-pet[data-animation] .pet-body { animation: pet-hiss .3s step-end; }
}
@keyframes eden-pulse { 0%,70%,100% { opacity: .28; transform: translateY(0); } 35% { opacity: 1; transform: translateY(-3px); } }
.message-row.failed .message-bubble { opacity: 1; }
.message-row.pending .message-bubble { opacity: 1; }
.message-row.pending #pending-status { color: var(--faint); }

.context-rail { display: none; }
.switch { position: relative; display: inline-flex; }
.switch input { position: absolute; opacity: 0; }
.switch i { position: relative; width: 35px; height: 21px; border-radius: var(--radius-panel); background: var(--line-strong); transition: background var(--motion-hover) ease; }
.switch i::after { position: absolute; top: 3px; left: 3px; width: 15px; height: 15px; border-radius: 50%; transition: left var(--motion-hover) ease, background var(--motion-hover) ease; content: ""; background:var(--color-knob); box-shadow:var(--shadow-raised); }
.switch input:checked + i::after { left: 17px; background:var(--color-on-accent); }

.catalog-screen { overflow: hidden; }

.sc-page-screen { overflow-y: auto; }
.sc-page-screen .catalog-shell { height: auto; }
.catalog-shell { display: flex; width: 100%; max-width: 860px; height: 100%; min-height: 0; flex-direction: column; margin: 0 auto; }

.catalog-menu { display: none; }
.catalog-heading { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; gap:var(--space-4); margin-bottom:var(--space-6); }
.catalog-heading h1 { font-size: var(--text-screen); line-height: var(--leading-screen); letter-spacing: var(--tracking-heading); }
.catalog-action { display: flex; min-height: 44px; align-items: center; border-radius: var(--radius-control); color: var(--on-accent); background: var(--green); }
.catalog-action:hover { background: var(--green-strong); }
#chat-selection-toggle:hover { background: var(--surface-hover); }
#chat-selection-toggle[aria-pressed="true"] { color: var(--text); background: var(--surface-hover); }
.catalog-search { display: flex; min-height: 46px; flex-shrink: 0; align-items: center; gap: 10px; margin-bottom: 14px; padding: 0 14px; border: 1px solid var(--line); border-radius: var(--radius-control); color: var(--muted); background: var(--panel); }
.catalog-search:focus-within { border-color:var(--color-focus-border); box-shadow:none; }

.catalog-search input:focus-visible { outline:none; box-shadow:none; }
.catalog-search svg { width:20px; height:20px; }
.catalog-search input { flex:1; min-width:0; width: 100%; border: 0; outline: 0; color: var(--text); background: transparent; font-size: var(--text-input); }
.catalog-search > svg { flex-shrink:0; }
.search-clear { display:grid; place-items:center; flex:0 0 44px; width:44px; min-width:44px; height:44px; padding:0; border:0; border-radius:var(--radius-control); color:var(--muted); background:transparent; }
.search-clear svg { width:20px; height:20px; }
.search-clear:hover { color:var(--text); background:var(--surface-hover); }
#model-search::-webkit-search-cancel-button,
#catalog-search::-webkit-search-cancel-button,
#all-chats-search::-webkit-search-cancel-button,
.media-voice-search input::-webkit-search-cancel-button { display:none; }
.catalog-list { min-height: 0; flex: 1; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.catalog-list .chat-list-row { margin: 0; border-bottom: 1px solid var(--line); border-radius: 0; }
.catalog-list .chat-item { display: block; margin: 0; padding: var(--space-3); }
.catalog-list .chat-item strong { font-size: var(--fs-body); }
.catalog-list .chat-item small { display: block; color: var(--muted); }
.catalog-list .item-meta { display: flex; gap: var(--space-3); }
.catalog-list .item-meta > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.catalog-list .item-meta time { flex-shrink: 0; margin-left: auto; }
.catalog-list .row-more { position: static; flex: 0 0 44px; width: 44px; height: 44px; opacity: 1; }
.catalog-list .chat-day { margin: var(--space-5) var(--space-3) var(--space-2); }
.catalog-list .chat-day:first-child { margin-top: var(--space-2); }
.history-search input { min-width: 0; min-height: 44px; }
.history-search > svg { flex-shrink: 0; }
.history-search button { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; color: var(--muted); background: transparent; border-radius: var(--radius-control); }
.history-search input::-webkit-search-cancel-button { display: none; }
.history-state { max-width: 440px; margin: var(--space-8) 0; padding: var(--space-5) var(--space-3); }

.history-state:not(.nested):not(.loading) { display: grid; justify-items: center; margin: 12vh auto 0; text-align: center; }
.history-state-icon { display: grid; place-items: center; border-radius: 50%; width:var(--space-12); height:var(--space-12); margin-bottom:var(--space-4); color:var(--color-text-secondary); background:var(--color-hover); }
.history-state strong { font-size: var(--text-headline); font-weight: 600; line-height: var(--leading-headline); }
.history-state p { margin: var(--space-2) 0 var(--space-4); color: var(--muted); font-size: var(--fs-body); line-height: 1.6; }
.history-state button { min-height: 44px; padding: 0 var(--space-4); border: 1px solid var(--line-strong); border-radius: var(--radius-control); background: var(--surface); color: var(--text); font-size: var(--fs-body); }
.history-state button:hover { background: var(--surface-hover); }
.list-skeleton { display: block; height: 52px; margin-top: var(--space-2); border-radius: var(--radius-control); background: var(--surface); animation: skeleton-pulse 1.2s ease-in-out infinite; }
.list-skeleton + .list-skeleton { animation-delay: .15s; }
.list-skeleton + .list-skeleton + .list-skeleton { animation-delay: .3s; }
@keyframes skeleton-pulse { 50% { opacity: .55; } }

.history-state.loading, .history-state.projectLoading { padding-top: 0; padding-bottom: 0; }
.history-state.loading strong, .history-state.projectLoading strong { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .list-skeleton { animation: none; } }
.catalog-list .project-item { min-height: 52px; padding: 0 44px 0 var(--space-3); }
.catalog-list .project-item strong { font-size: var(--fs-body); }
.catalog-list .empty-copy { max-width: 420px; margin: 28px var(--space-1); line-height: 1.55; }

.settings-screen {
  position: absolute; inset: 0; z-index: 5; max-width: none; height: auto; margin: 0;
  overflow-y: auto; padding: clamp(42px, 7vw, 88px) var(--space-8) var(--space-8); background: var(--workspace);
}
.settings-screen.active { display: block; }
.settings-shell {
  container-type: inline-size;
  position: relative; display: grid; width: min(920px, 100%); min-height: 0;
  grid-template-columns: 200px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: var(--space-10);
  margin: 0 auto;
  --settings-card:transparent;
}
.settings-grip { display: none; }
.settings-heading { grid-column: 1 / -1; grid-row: 1; display: flex; min-height: var(--control-size); align-items: center; margin: 0 0 var(--space-8); padding: 0; }
.settings-heading .eyebrow { margin-bottom: 5px; }
.settings-heading h1 { margin: 0; font-size: var(--text-screen); line-height: var(--leading-screen); letter-spacing: var(--tracking-heading); }
.settings-close {
  grid-column: 2; grid-row: 1; justify-self: end; z-index: 2; display: flex; align-items: center; gap: var(--space-1);
  min-height: var(--control-size); padding: 0 var(--space-3) 0 var(--space-2); border-radius: var(--radius-control);
  color: var(--color-text-secondary); background: transparent; font-size: var(--text-label); font-weight: var(--weight-medium); white-space: nowrap;
}
.settings-close svg { width: var(--icon-toolbar); height: var(--icon-toolbar); }
.settings-close .icon-x { display: none; }
.settings-close:hover { color: var(--text); background: var(--surface-hover); }
.settings-header-back { display: none; }
.settings-home { display: grid; min-height: 0; grid-column: 1; grid-row: 2; align-content: start; gap: 13px; padding: 0; }
.settings-group { overflow: visible; border: 0; border-radius: 0; background: transparent; }
.settings-group > button { display: grid; width: 100%; min-height: var(--control-size); grid-template-columns: 25px minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 7px 10px; border: 0; border-radius: var(--radius-control); color: var(--text-soft); background: transparent; text-align: left; }
.settings-group > button:hover, .settings-group > button.active { color: var(--text); background: var(--surface-hover); }
.settings-group > button.active { background: var(--color-active); }
.settings-group > button > svg { width:20px; height:20px; color: var(--muted); }
.settings-group > button > span, .settings-group > button b, .settings-group > button small { display: block; }
.settings-group > button b { font-size: var(--text-label); font-weight: var(--weight-medium); }
.settings-group > button small, .settings-group > button > .row-end { display: none; }
.settings-group > button > .row-end.is-external { display: block; width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); color: var(--faint); }
.settings-group > button > em { color: var(--muted); font-size: var(--fs-small); font-style: normal; }
.settings-content { min-width: 0; min-height: 0; grid-column: 2; grid-row: 2; }
.settings-view { box-sizing: border-box; min-width: 0; width: 100%; padding: 0 0 var(--space-8); }
.settings-back { display: none; min-height: 44px; align-items: center; gap: 7px; margin: -8px 0 var(--space-5); padding: 0 6px; color: var(--muted); background: transparent; font-size: var(--fs-small); }
.settings-back:hover { color: var(--text); }
.settings-back svg { width:20px; height:20px; }
.settings-view-title { display: flex; align-items: center; justify-content: flex-start; gap: var(--space-4); margin-bottom:var(--space-6); }
.settings-view-title .avatar { display: grid; flex: 0 0 54px; width: 54px; height: 54px; place-items: center; font-size: 20px; font-weight: 600; }
.settings-view-title h2 { overflow-wrap: anywhere; margin: 0; }
.settings-view-title p:last-child { margin: 6px 0 0; color: var(--muted); font-size: var(--fs-small); line-height: 1.5; }
.settings-detail-card { overflow: hidden; border: 1px solid var(--line); background: var(--panel); }
.settings-detail-card button, .settings-detail-card .settings-row { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); color: var(--text-soft); background: transparent; font-size: var(--fs-body); text-align: left; }
.settings-detail-card button:last-child { border-bottom: 0; }
.settings-detail-card button:hover { background: var(--surface); }
.settings-detail-card span, .settings-detail-card b { display: flex; align-items: center; }
.settings-detail-card b { min-width: 0; overflow-wrap: anywhere; text-align: right; color: var(--muted); font-weight: 500; }
.settings-detail-card svg { width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); }
.settings-row-link { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); color: var(--text); text-decoration: none; }
.settings-row-link:last-child { border-bottom: 0; }
.settings-row-link:hover { background: var(--surface); }
.settings-detail-card .settings-row-link svg { width: 16px; height: 16px; color: var(--muted); }
.theme-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--appearance-option-min)), 1fr)); gap: var(--space-2); }
.theme-option { position: relative; min-width: 0; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-control); color: var(--text-soft); background: var(--panel); text-align: left; }
.theme-option:hover { border-color: var(--line-strong); background: var(--surface); }
.theme-option[aria-checked="true"] { border-color: var(--green); background: var(--green-wash); }
.theme-check { display: none; position: absolute; top: 16px; right: 16px; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: var(--on-accent); background: var(--green); }
.theme-check svg { width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); }
.settings-subtitle { margin: var(--space-4, 20px) 0 var(--space-2, 10px); font-size: var(--fs-small, 13px); font-weight: 600; color: var(--text-soft); }
.language-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--appearance-option-min)), 1fr)); gap: var(--space-2); }
.language-option { min-height: 44px; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--radius-control); color: var(--text); background: var(--panel); font: inherit; font-weight: 600; text-align: left; }
.language-option:hover { border-color: var(--line-strong); background: var(--surface); }
.language-option[aria-checked="true"] { border-color: var(--green); background: var(--green-wash); }
.language-option:active { opacity: .7; }
.theme-option[aria-checked="true"] .theme-check { display: grid; }
.theme-option > b { overflow-wrap: anywhere; display: block; margin: 10px 2px 2px; overflow: hidden; font-size: var(--fs-small); font-weight: 600; text-overflow: ellipsis; }
.theme-preview { position: relative; display: block; height: 78px; overflow: hidden; border: 1px solid #7774; border-radius: var(--radius-control); background: #f8f8f8; }
.theme-preview::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 29%; border-right: 1px solid #7774; background: #e8e8e8; }
.theme-preview::after { content: ""; position: absolute; top: 14px; right: 12px; width: 52%; height: 32px; border-radius: 6px; background: repeating-linear-gradient(to bottom, #7778 0 3px, transparent 3px 10px); }
.theme-preview i { position: absolute; right: 10px; bottom: 9px; width: 56%; height: 11px; border: 1px solid #7775; border-radius: 6px; background: #fff; }
.theme-preview-dark { background: #1C1E21; }
.theme-preview-dark::before { background: #151515; border-color: #ffffff24; }
.theme-preview-dark::after { background: repeating-linear-gradient(to bottom, #ffffff80 0 3px, transparent 3px 10px); }
.theme-preview-dark i { border-color: #ffffff24; background: #303030; }
.theme-preview-system { background: linear-gradient(90deg, #1C1E21 0 50%, #f8f8f8 50%); }
.theme-preview-system::before { background: linear-gradient(90deg, #151515 0 50%, #e8e8e8 50%); }
.theme-preview-system::after { background: repeating-linear-gradient(to bottom, #888 0 3px, transparent 3px 10px); }
.theme-preview-system i { background: linear-gradient(90deg, #303030 0 50%, #fff 50%); }
.settings-note { margin: var(--space-3) 0 0; color: var(--muted); font-size: var(--fs-small); line-height: 1.55; }
.settings-primary-action { display: flex; width: 100%; min-height: 52px; align-items: center; justify-content: center; gap: var(--space-2); border-radius: var(--radius-control); color: var(--on-accent); background: var(--green); font-size: var(--fs-body); font-weight: 600; text-decoration: none; }
.settings-primary-action:hover { background: var(--green-strong); }
.settings-primary-action svg { width:20px; height:20px; }

.plan-stats { display: grid; margin: var(--space-6) 0 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--panel); }
.plan-stats:empty { display: none; }
.plan-stats span { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 10px var(--space-4); border-bottom: 1px solid var(--line); color: var(--text-soft); font-size: var(--fs-body); }
.plan-stats span:last-child { border-bottom: 0; }
.plan-stats b { color: var(--muted); font-weight: 500; text-align: right; }
.profile-periods { display: grid; gap: 1px; margin: var(--space-3) 0 var(--space-5); border: 1px solid var(--line); overflow: hidden; }
.profile-periods:empty, .tariff-catalog:empty { display: none; }
.entitlement-warning button { min-height: var(--control-size); flex-shrink: 0; padding: 0 9px; font-size: var(--fs-small); }
.profile-periods > div { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 10px var(--space-4); background: var(--panel); font-size: var(--fs-body); }
.profile-periods span { color: var(--text-soft); }
.profile-periods b { color: var(--muted); font-weight: 500; text-align: right; }
.profile-periods .period-total { background: var(--green-wash); }
.plan-comparison > p { margin: 0 0 var(--space-6); color: var(--muted); line-height: 1.55; }
.tariff-catalog { display: grid; gap: var(--space-3); }
.tariff-option { padding: 18px; border: 1px solid var(--line); }
.tariff-option.is-current { border-color: var(--green); background: var(--green-focus); }
.tariff-option header { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 6px var(--space-3); }
.tariff-option h3 { margin: 0; font-size: 18px; font-weight: 600; }
.tariff-option header b { font-size: var(--fs-body); font-weight: 500; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tariff-option ul { display: grid; gap: 7px; margin: 14px 0 0; padding: 0; list-style: none; color: var(--text-soft); font-size: var(--fs-small); line-height: 1.45; }
.tariff-option li { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 10px; align-items: start; }
.tariff-option li::before { content: ""; width: 16px; height: 16px; margin-top: .2em; background: var(--green-strong); -webkit-mask: var(--mask-check) center / contain no-repeat; mask: var(--mask-check) center / contain no-repeat; }
.tariff-current { display: block; margin-top: 6px; color: var(--green-strong); font-size: var(--fs-small); font-weight: 500; }
.model-abilities { display: grid; gap: var(--space-3); margin: var(--space-4) 0 var(--space-3); font-size: var(--fs-small); line-height: 1.5; }
.model-abilities dt { margin-bottom: 3px; color: var(--muted); font-size: var(--fs-small); }
.model-abilities dd { margin: 0; color: var(--text-soft); }
.catalog-model .model-ability-note, .model-ability-note { color: var(--muted); font-size: var(--fs-small); line-height: 1.5; }
.model-ability-note a { color: var(--text-soft); text-underline-offset: 3px; }
.model-ability-details { grid-column: 1 / -1; padding: 0 var(--space-3) var(--space-3); }
.model-ability-details summary { color: var(--muted); font-size: var(--fs-small); cursor: pointer; }
.settings-row b#support-key { overflow-wrap: anywhere; text-align: right; }
.settings-row { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); color: var(--text-soft); background: transparent; font-size: var(--fs-micro); text-align: left; }

.sheet-backdrop { position: fixed; z-index: 20; inset: 0; animation: scrim-in var(--dur-base, .2s) ease-out; background:var(--scrim); }
@keyframes scrim-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .sheet-backdrop { animation: none; } }
@keyframes fade-in { from { opacity: 0; } }
.model-sheet {
  position: fixed; z-index: 21;
  max-height: calc(100dvh - 110px); overscroll-behavior: contain; border: 1px solid var(--line-strong);
  background: var(--color-elevated);
  transform-origin: top right; animation: sheet-in var(--motion-popover) var(--ease-ui) both; display:flex; flex-direction:column; overflow:hidden; width:440px; height:auto; min-height:0; border-radius: var(--radius-panel);
}
@keyframes sheet-in { from { opacity: 0; transform: translateY(-5px) scale(.98); } }
.model-sheet[hidden], .sheet-backdrop[hidden] { display: none; }
.model-sheet header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-3); }
.model-sheet h2 { margin: 0; }
.model-sheet header button { display: grid; place-items: center; background: transparent; font-size: 22px; width:44px; height:44px; border-radius:50%; margin-right:calc(-1 * var(--space-1)); color:var(--color-text-secondary); }
.model-options { display: grid; gap: var(--space-1); }
.model-option { display: grid; grid-template-columns: minmax(0, 1fr) 40px; min-width: 0; align-items: center; border-radius:var(--radius-control); border-bottom:1px solid var(--line); background:transparent; }
.model-select { display: flex; flex: 1; min-width: 0; align-items: center; gap: 9px; color: var(--text); background: transparent; text-align: left; border-radius: var(--radius-control); min-height:68px; padding:var(--space-2) var(--space-3); }

.model-select:disabled { cursor: default; opacity:1; }
.model-copy { flex: 1; min-width: 0; }
.model-copy strong, .model-copy small { display: block; }
.model-copy strong { font-size: var(--fs-body); font-weight: 600; }
.model-copy small { margin-top: var(--space-1); color: var(--muted); font-size: var(--fs-small); line-height: 1.4; }
.availability { display: inline-flex; font-size: var(--fs-small); font-weight: 500; white-space: nowrap; }
.model-empty { padding:var(--space-5) var(--space-3); margin:0; color: var(--muted); font-size: var(--fs-small); line-height: 1.6; }
.context-modes { display: grid; gap: var(--space-1); margin-top: var(--space-3); }
.context-mode { position: relative; min-height: 48px; padding: var(--space-2) 10px var(--space-2) 29px; border: 1px solid transparent; border-radius: var(--radius-control); color: var(--text-soft); background: transparent; text-align: left; }
.context-mode::before { position: absolute; left: 10px; top: 14px; width: 10px; height: 10px; border: 1px solid var(--muted); border-radius: 50%; content: ""; }
.context-mode:hover { background: var(--surface); }
.context-mode strong, .context-mode small { display: block; }
.context-mode strong { font-size: var(--fs-micro); font-weight: 500; }
.context-mode small { margin-top: 3px; color: var(--muted); font-size: var(--fs-small); }
.context-mode.active { background: var(--surface-hover); }
.context-mode.active::before { border-color: var(--green); background: var(--green); box-shadow: inset 0 0 0 2px var(--surface-hover); }
.model-pill[aria-expanded="true"] { border-color: var(--green); }
.model-pill[aria-expanded="true"] > svg { transform: rotate(180deg); }


.toast { position: fixed; z-index: 60; left: 50%; opacity: 0; pointer-events: none; transform: translate(-50%, 9px); transition: opacity var(--motion-popover) ease, transform var(--motion-popover) ease; top: calc(var(--safe-top, 0px) + 14px); bottom: auto; width: max-content; max-width: min(520px, calc(100vw - 32px)); padding:var(--space-3) var(--space-4); border:0; border-radius:var(--radius-control); background:var(--color-elevated); box-shadow:var(--shadow-popover); color:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label); }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

.drop-layer { position: fixed; z-index: 80; inset: 0; display: grid; place-items: center; padding: var(--space-6); background: var(--color-scrim); animation: scrim-in var(--dur-base, .2s) ease-out; }
.drop-layer[hidden] { display: none; }
.drop-layer * { pointer-events: none; }
.drop-layer-card { display: grid; justify-items: center; gap: var(--space-2); width: min(420px, 100%); padding: var(--space-8) var(--space-6); border: 1.5px dashed var(--muted); border-radius: var(--radius-large); color: var(--text); background: var(--color-elevated); box-shadow: var(--shadow-overlay); text-align: center; }
.drop-layer-card svg { width: 24px; height: 24px; color: var(--text); }
.drop-layer-card strong { font-size: var(--fs-lead); font-weight: 600; }
.drop-layer-card span { color: var(--muted); font-size: var(--fs-small); }
.drop-layer-card span[hidden] { display: none; }
.drop-layer[data-state="off"] .drop-layer-card { border-color: var(--line-strong); }
.drop-layer[data-state="off"] .drop-layer-card svg { color: var(--muted); }
@media (prefers-reduced-motion: reduce) { .drop-layer { animation: none; } }

.loading:not(.history-state) { position: fixed; z-index: 50; inset: 0; display: grid; place-content: center; justify-items: center; gap: 11px; background: var(--bg); transition: opacity var(--motion-modal) ease; }
.loading-copy { display: grid; max-width: 350px; justify-items: center; padding: 0 var(--space-6); text-align: center; }
.loading-copy h1 { font-family: inherit; font-weight: var(--weight-semibold); }
.loading-copy h1 span { color: var(--green-strong); }
.loading-copy p { margin: 0; color: var(--muted); font-size: var(--fs-micro); }
.loading-copy a { display: flex; min-height: var(--control-size); align-items: center; gap: 7px; margin-top: 21px; padding: 0 var(--space-4); border-radius: var(--radius-control); color: var(--on-accent); background: var(--green); font-size: var(--fs-small); font-weight: 600; text-decoration: none; }
.loading-copy button { min-height: var(--control-size); margin-top: 21px; padding: 0 var(--space-4); border: 0; border-radius: var(--radius-control); color: var(--on-accent); background: var(--green); font-size: var(--fs-small); font-weight: 600; }
.loading-copy a[hidden], .loading-copy small[hidden] { display: none; }
.loading-copy button[hidden] { display: none; }
.loading-copy a svg { width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
.loading-copy small { max-width: 290px; margin-top: var(--space-3); color: var(--faint); font-size: var(--fs-micro); line-height: 1.5; }
.loading.auth-gate .brand-mark img { width: 40px; height: 40px; }
.loading.auth-gate .loading-copy p { color: var(--text-soft); font-weight: 600; font-size:var(--fs-lead); line-height:1.35; }
.loading.done { opacity: 0; pointer-events: none; }
.loading[hidden] { display: none; }


.brand:focus { outline: none; }
.brand:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; border-radius: var(--radius-control); }
.drawer-close, .drawer-backdrop { display: none; }
.app-sidebar-head { display:none; }

.chat-list-row { display: flex; position: relative; align-items: center; border-radius: var(--radius-control); -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.chat-list-row .chat-item { flex: 1; min-width: 0; }


.row-more { flex: none; display: grid; place-items: center; width: 32px; height: 36px; border-radius: var(--radius-control); color: var(--muted); background: transparent; opacity: 0; pointer-events: none; }
.chat-list-row:hover .row-more, .chat-list-row:focus-within .row-more { opacity: 1; pointer-events: auto; }
.row-more:hover { color: var(--text); background: var(--surface-hover); }
.row-more svg { width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); }
.chat-list-row.nested { margin-left: 14px; }
.chat-list-row.nested .chat-item strong { font-weight: 500; }
.empty-copy.nested { margin: 2px 0 6px var(--space-6); font-size: var(--fs-micro); }
.pin-mark { display:inline-block; width: 11px; height: 11px; margin-right: 5px; color: var(--green-strong); vertical-align: -1px; }


.project-item { display: flex; flex: 1; min-width: 0; align-items: center; gap: var(--space-2); min-height: var(--control-size); padding: 0 35px 0 9px; border-radius: var(--radius-control); color: var(--text-soft); background: transparent; text-align: left; }
.project-item:hover { background: var(--surface); }
.project-item strong { overflow: hidden; font-size: var(--fs-small); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.project-item .folder { flex: 0 0 auto; width: 15px; height: 15px; color: var(--green-strong); }
.project-item .twist { flex: 0 0 auto; width: 13px; height: 13px; margin-left: auto; color: var(--faint); transition: transform var(--motion-hover) ease; }
.project-block.open .project-item .twist { transform: rotate(180deg); }
.project-count { flex: 0 0 auto; min-width: 18px; padding: 1px 5px; border-radius: var(--radius-pill); color: var(--faint); background: var(--surface); font-size: var(--fs-micro); text-align: center; }
.project-block { margin-bottom: var(--space-half); }



.row-menu { max-height: calc(var(--app-height, 100dvh) - 24px); overflow-y: auto; position: fixed; z-index: 62; display: flex; width: 232px; flex-direction: column; --menu-pad:var(--space-1); padding:var(--menu-pad); }
.row-menu[hidden] { display: none; }
.menu-backdrop { position: fixed; z-index: 61; inset: 0; background: transparent; }
.menu-backdrop[hidden] { display: none; }
.sheet-grip { display: none; }

.chat-day { margin: 14px 10px 5px; color: var(--faint); font-size: var(--fs-micro); font-weight: 600; letter-spacing: .03em; }
.chat-day:first-child { margin-top: var(--space-half); }
.row-menu button { display: flex; align-items: center; background: transparent; text-align: left; }
.row-menu button:hover { color: var(--text); background: var(--surface-hover); }
.row-menu button.danger:hover { background: color-mix(in srgb, var(--red) 14%, transparent); }


.project-choices { display: flex; max-height: 264px; flex-direction: column; gap: var(--space-1); overflow: auto; margin-top: var(--space-1); }
.project-choices button { display: flex; min-height: 44px; align-items: center; gap: 10px; border-radius: var(--radius-control); color: var(--text-soft); background: var(--surface); font-size: var(--fs-body); text-align: left; overflow-wrap: anywhere; }
.project-choices button:hover { color: var(--text); background: var(--surface-hover); }
.project-choices button svg { flex-shrink: 0; width:20px; height:20px; color: var(--green-strong); }
.project-choices small { margin-left: auto; color: var(--faint); font-size: var(--fs-small); }
#rename-input { width: 100%; min-height: 46px; padding: 0 13px; border: 1px solid var(--line-strong); border-radius: var(--radius-control); color: var(--text); background: var(--input); font-size: var(--text-input); }
#rename-input:focus { border-color: var(--color-focus-border); }
.delete-dialog button.primary { color: var(--on-accent); background: var(--green); }
.delete-dialog button.primary:hover { background: var(--green-strong); }
.is-empty .snake-pet { display:none; }
.delete-dialog { width: min(390px, calc(100vw - 32px)); border: 1px solid var(--line-strong); border-radius: var(--radius-panel); padding: var(--space-6); color: var(--text); background: var(--color-elevated); box-shadow: var(--shadow); }
.delete-dialog::backdrop { background: var(--color-scrim); }
.delete-dialog h2 { margin: 0 0 var(--space-3); font-size: var(--text-headline); }
.delete-dialog p { font-size: var(--fs-body); line-height: 1.6; color: var(--muted); overflow-wrap: anywhere; }
.delete-dialog > div { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-5); }
.delete-dialog button { min-height: 44px; padding: 0 var(--space-4); border-radius: var(--radius-control); background: var(--surface-hover); }
.delete-dialog button:disabled { opacity: .5; cursor: wait; }
.toast button { pointer-events: auto; margin-left: 14px; background: transparent; }
.toast:has(button) { width: max-content; display: flex; align-items: center; flex-wrap: wrap; }
.toast .undo-progress { position: absolute; right: 0; bottom: 0; left: 0; transform-origin: left; animation: undo-countdown 5.5s linear forwards; }
@keyframes undo-countdown { to { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) { .toast .undo-progress { animation: none; opacity: .45; } }
[hidden] { display: none !important; }

@media (max-width: 899px) {
  body { overflow: hidden; }
  .app-shell { display:block; position:fixed; top:var(--app-top,0px); left:0; right:0; height:var(--app-height,100dvh); }
  .workspace { height: 100%; }

  
  .sidebar {
    display: flex; position: fixed; z-index: 40; inset:var(--app-top,0px) auto auto 0; border-radius:0 var(--radius-panel) var(--radius-panel) 0;
    width: min(320px, calc(100vw - 44px)); height: var(--app-height, 100dvh);
    padding: max(14px, env(safe-area-inset-top)) 10px max(14px, env(safe-area-inset-bottom));
    transform: translateX(-100%); visibility: hidden;
    transition: transform var(--motion-modal) cubic-bezier(.22,.68,0,1), visibility 0s linear var(--motion-modal);
    border-right: 1px solid var(--line);
    box-shadow: var(--shadow-drawer);
    will-change: transform;
  }
  .drawer-open .sidebar { transform: translateX(0); visibility: visible; transition: transform var(--motion-modal) cubic-bezier(.22,.68,0,1), visibility 0s; }
  
  .drawer-dragging .sidebar, .drawer-dragging .drawer-backdrop { transition: none; }
  .drawer-backdrop { display: block; position: fixed; z-index: 35; inset: 0; background: var(--color-scrim); opacity: 0; transition: opacity var(--motion-modal) ease; }
  .drawer-open .drawer-backdrop { opacity: 1; }
  .drawer-close { display: grid; position: absolute; right: 8px; top: max(14px, env(safe-area-inset-top)); width: var(--navigation-size); height: var(--navigation-size); place-items: center; background: transparent; color: var(--muted); border-radius: 50%; font-size: 26px; }
  .sidebar .brand { padding: 0 6px; }
  .sidebar .brand-lockup { height: 41px; --brand-size: 32px; }

  
  .chat-list-row { margin-bottom: 1px; }
  .sidebar-chat-list .chat-list-row .chat-item { margin: 0; display: flex; align-items: center; border-radius: var(--radius-control); }
  .chat-item strong { font-size: var(--fs-body); font-weight: 500; line-height: 1.25; }
  .sidebar-chat-list .chat-item small, .sidebar-chat-list .chat-item .item-meta { display: none; }
  .chat-item.active { background: var(--surface-hover); }
  .chat-item:active { transform: none; background: var(--surface-hover); }
  .sidebar-footer .new-chat-button { min-height: var(--navigation-size); font-size: var(--text-nav); }
  .settings-shortcut { min-width: var(--navigation-size); }
  .context-rail { display: none; }

  .mobile-header { display: flex; height: 56px; align-items: center; justify-content: flex-start; gap: var(--space-3); padding: 6px var(--space-3); background: var(--workspace); }
  .mobile-header .brand { order: 2; }
  .mobile-header .brand-lockup { height: 36px; padding: 0; --brand-size: 28px; }
  .round-button { display: grid; width: 44px; height: 44px; place-items: center; border: 0; border-radius: var(--radius-control); background: transparent; color: var(--text-soft); }
  .round-button:active { background: var(--surface); }
  body[data-view="chat"] .mobile-header { display: none; }
  .screen { height: calc(100% - 56px); padding: 18px var(--space-4) var(--space-6); -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
  
  .screen.active { animation: none; }

  
  .conversation-screen { position: relative; z-index: 12; height: 100%; padding: 0; background: var(--workspace); }
  .conversation-header { flex-shrink: 0; border: 0; position: relative; min-height: 56px; padding: 6px 6px; border-bottom-color: transparent; }
  .back-button { display: grid; width: 44px; height: 44px; border: 0; border-radius: var(--radius-control); background: transparent; color: var(--text-soft); }
  .back-button:active { background: var(--surface); }
  .back-button svg { width:24px; height:24px; }
  
  .row-more { width: 44px; height: 44px; opacity: 1; pointer-events: auto; }
  .chat-list-row .chat-item { padding-right: 6px; }

  
  .row-menu.as-sheet {
    top: auto; box-shadow: var(--shadow-overlay);
    animation: sheet-up var(--motion-modal) var(--ease-ui) both;
  }
  .row-menu.as-sheet .sheet-grip { display: block; }
  .menu-backdrop { background: var(--color-scrim); }
  .project-item { min-height: 46px; }
  .conversation-header .more-button { display: grid; width: 44px; height: 44px; grid-column: 3; }
  .model-pill { justify-self: center; grid-column: 2; min-height: 44px; max-width: 190px; padding: 0 var(--space-3); border: 0; background: transparent; font-size: var(--fs-body); font-weight: 600; }
  .model-pill:active { background: var(--surface); border-radius: var(--radius-control); }
  .model-pill span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .model-pill svg { width: 16px; height: 16px; }
  .messages { padding: 14px 14px var(--space-2); overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .message-row { margin-bottom: 18px; }
  .message-bubble { max-width: 100%; font-size: var(--text-message); line-height: var(--leading-message); }
  .message-row.user .message-bubble { max-width: 86%; }
  .message-row.assistant .message-bubble { width: 100%; }
  .attachment-chip { font-size: var(--fs-small); }
  .empty-conversation { padding:var(--space-4) 0 0; }

  
  .composer-wrap { z-index: 3; flex-shrink: 0; overflow: visible; padding: var(--space-1) 10px max(var(--space-2), env(safe-area-inset-bottom)); }
  .composer-controls { gap: 6px; margin-bottom: 6px; padding-right: 0; }
  .composer-control { min-height: 44px; padding: 0 11px; border-radius: var(--radius-panel); }
  .composer-control.icon-only { width: 44px; }
  .thinking-menu { right: 12px; bottom: calc(100% + 10px); left: 12px; width: auto; border-radius: var(--radius-panel); }
  .attach-menu { position: absolute; z-index: 36; right: 12px; bottom: calc(100% + 10px); left: 12px; width: auto; grid-template-columns: repeat(3, 1fr); gap: var(--space-1); padding: 6px; border-radius: var(--radius-panel); }
  .attach-menu button { min-height: 72px; flex-direction: column; justify-content: center; gap: var(--space-2); border-radius: var(--radius-control); font-size: var(--fs-small); font-weight: 500; background: var(--surface); }
  .voice-recorder { min-height: 54px; }
  .voice-recorder button { min-height: 44px; padding: 0 var(--space-2); }
  .composer:focus-within { box-shadow: none; }
  .composer textarea::placeholder { color: var(--muted); }
  .send-button { width: 44px; height: 44px; border-radius: 50%; }
  .composer-meta { display: flex; min-height: 20px; }
  .composer-meta #composer-quota { display: none; }
  .composer-wrap .snake-pet { display: none; }
  .compact-viewport .thinking-menu { max-height: calc(var(--app-height, 100dvh) - 110px); }

  
  .catalog-heading { align-items: center; }
  .catalog-heading h1 { font-size: var(--text-screen); }
  .model-family-grid { grid-template-columns: 1fr; }
  .catalog-heading .eyebrow { display: none; }
  .catalog-action { min-width: 44px; justify-content: center; }
  .catalog-search { min-height: 44px; margin-bottom: 10px; }
  .catalog-list { margin: 0 -4px; padding: 0 var(--space-1) var(--space-4); -webkit-overflow-scrolling: touch; }
  .settings-screen {
    position: fixed; z-index: 70; inset:var(--app-top,0px) 0 auto; height:var(--app-height,100dvh); margin:0; padding:0;
    overflow: hidden; background: var(--scrim);
  }
  .settings-screen:is(.active, .is-leaving) { display: grid; place-items: stretch; align-items: end; }
  .settings-shell {
    position: relative; display: grid; width: 100%; height: calc(var(--app-height, 100dvh) - 12px); min-height: 0;
    grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); column-gap: 0; margin: 0;
    overflow: hidden; border: 1px solid var(--line-strong); border-bottom: 0; border-radius: var(--radius-sheet) var(--radius-sheet) 0 0;
    background: var(--color-elevated); box-shadow: var(--shadow-overlay);
    animation: settings-sheet-up var(--motion-modal) var(--ease-ui) both;
    will-change: transform;
  }
  @keyframes settings-sheet-up { from { opacity: .65; transform: translateY(42px); } }
  
  .settings-screen.active { animation: settings-dim-in var(--motion-modal) var(--ease-ui); }
  @keyframes settings-dim-in { from { background-color: transparent; } }
  .settings-screen.is-leaving { pointer-events: none; background-color: transparent !important; transition: background-color 280ms var(--ease-ui); }
  .settings-screen.is-leaving .settings-shell { transform: translateY(100%) !important; animation: none; transition: transform 300ms cubic-bezier(.32, .72, 0, 1); }
  
  .settings-screen[data-nav="push"] .settings-view:not([hidden]) { animation: settings-push 280ms cubic-bezier(.32, .72, 0, 1) both; }
  .settings-screen[data-nav="pop"] .settings-home:not([hidden]) { animation: settings-pop 280ms cubic-bezier(.32, .72, 0, 1) both; }
  @keyframes settings-push { from { opacity: 0; transform: translateX(40%); } }
  @keyframes settings-pop { from { opacity: 0; transform: translateX(-24%); } }
  .settings-dragging .settings-shell, .settings-dragging .settings-screen { transition: none; animation: none; }
  .settings-grip { display: block; position: absolute; z-index: 4; top: 9px; left: 50%; width: 38px; height: 4px; border-radius: var(--radius-pill); background: var(--line-strong); transform: translateX(-50%); }
  .settings-heading { position: relative; z-index: 3; grid-column: 1; grid-row: 1; display: block; min-height: 0; margin: 0; padding: 30px 58px 15px 18px; background: var(--panel); border-bottom: 1px solid var(--line); }
  .settings-heading .eyebrow { display: none; }
  .settings-heading h1 { font-size: var(--text-modal); line-height: var(--leading-modal); letter-spacing: normal; }
  .settings-close { display: grid; position: absolute; z-index: 5; top: 21px; right: 12px; width: var(--navigation-size); height: var(--navigation-size); min-height: 0; padding: 0; place-items: center; border-radius: 50%; color: var(--text-soft); background: var(--surface); }
  .settings-close .icon-x { display: block; }
  .settings-close .icon-back { display: none; }
  .settings-close .settings-close-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .settings-home { grid-column: 1; grid-row: 2; grid-auto-rows: max-content; min-height: 0; overflow-y: auto; gap: 15px; padding: var(--space-3) var(--space-3) max(22px, env(safe-area-inset-bottom)); background: var(--panel); overscroll-behavior: contain; }
  .settings-group { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface); }
  .settings-group > button { min-height: 62px; grid-template-columns: 24px minmax(0, 1fr) 18px; gap: var(--space-3); padding: 10px 14px; border-top: 1px solid var(--line); border-radius: 0; }
  .settings-group > button > svg { width:20px; height:20px; color: var(--green-strong); }
  .settings-group > button b { font-size: var(--fs-body); }
  .settings-group > button small { display: block; margin-top: 3px; color: var(--muted); font-size: var(--fs-small); line-height: 1.35; }
  .settings-group > button > .row-end, .settings-group > button > .row-end.is-external { display: block; width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); color: var(--faint); }
  .settings-content { grid-column: 1; grid-row: 2; overflow: hidden; border-left: 0; background: var(--panel); }
  .settings-view { height: 100%; min-width: 0; max-width: 720px; margin: 0 auto; overflow-x: hidden; overflow-y: auto; padding: 14px var(--space-4) max(var(--space-6), env(safe-area-inset-bottom)); overscroll-behavior: contain; }
  .settings-header-back:not([hidden]) { display: grid; position: absolute; z-index: 5; top: 21px; left: 8px; width: var(--navigation-size); height: var(--navigation-size); place-items: center; border-radius: 50%; color: var(--text); background: transparent; }
  .settings-header-back svg { width:24px; height:24px; }
  .settings-heading.has-back { padding-left: 58px; }
  .settings-view:not([data-settings-view="profile"]) > .settings-view-title { display: none; }
  .settings-view-title { align-items: flex-start; }
  .theme-options { gap: var(--space-2); }
  .theme-option { padding: var(--space-2); border-radius: var(--radius-control); }
  .theme-check { top: 12px; right: 12px; width: 20px; height: 20px; }
  .theme-preview { height: 66px; border-radius: var(--radius-control); }
  .theme-option > b { margin-top: var(--space-2); font-size: var(--fs-small); }
  .settings-row { font-size: var(--fs-body); }
  
  .delete-dialog { position: fixed; margin: 0; top: calc(var(--app-height, 100dvh) / 2); left: 50%; transform: translate(-50%, -50%); }
  .model-copy strong { font-size: var(--fs-body); }
  .model-copy small { font-size: var(--fs-small); }
  .context-mode small { font-size: var(--fs-micro); }
}
@keyframes sheet-up { from { opacity: 0; transform: translateY(16px); } }


@media (hover: none) {
  .chat-item:hover,
  .project-item:hover,
  .row-more:hover,
  .sidebar-primary-nav button:hover,
  .settings-shortcut:hover,
  .row-menu button:hover,
  .model-pill:hover,
  .new-chat-button:hover,
  .more-button:hover,
  .back-button:hover,
  .settings-group button:hover,
  .project-choices button:hover,
  .model-option:hover {
    color: inherit;
    background: transparent;
  }
  .chat-item.active:hover { background: var(--surface-hover); }
  .row-menu button.danger:hover { color: var(--red); }
}
@media (max-width: 390px) {
  .model-pill { max-width: 170px; width: max-content; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

.model-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.model-summary > div:first-child { grid-column: 1 / -1; }
.model-summary dd { overflow-wrap: anywhere; }

.model-option > .model-summary,
.model-option > .model-ability-note { grid-column: 1 / -1; margin: var(--space-2) var(--space-3) var(--space-3); }


.composer-shelf { display:flex; flex-wrap:wrap; max-width:780px; margin:0 auto 10px; padding:10px; border:1px solid var(--line); border-radius: var(--radius-panel); background:var(--panel); max-height:min(220px,35dvh); overflow:auto; gap:6px; }
.composer-shelf[hidden] { display:none; }
.composer-shelf .composer-control { flex-shrink:0; min-height:44px; }
.composer-shelf select { color:var(--text); background:var(--panel); border:0; font:inherit; font-size:var(--text-input); min-height:var(--control-size); }
.composer-active { color:var(--muted); font-size:var(--fs-micro); overflow:hidden; text-overflow:ellipsis; }
@media (max-height:500px) { .composer-shelf { max-height:100px; } }

.media-job { border: 1px solid var(--line); border-radius: var(--radius-panel); padding: var(--space-4); max-width: 100%; }
.media-job p { margin: 0 0 10px; }
.media-job button { font: inherit; color: inherit; background: transparent; border: 1px solid var(--line); border-radius: var(--radius-control); padding: var(--space-2) var(--space-3); margin: var(--space-2) var(--space-2) 0 0; cursor: pointer; }
.media-job button:hover { background: var(--color-hover); }
.media-job small, .media-job details { color: var(--muted); }
.media-job img, .media-job video { display: block; max-width: 100%; max-height: 420px; object-fit: contain; border-radius: var(--radius-control); margin: var(--space-3) 0; }


.media-choices { display:flex; flex-wrap:wrap; gap:var(--space-2); }
.media-choices button { min-height:44px; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
.media-choices img { object-fit:cover; border-radius: var(--radius-control); margin-inline-end:var(--space-2); vertical-align:middle; }
.media-viewer-toolbar { top: 0; }
.media-viewer-toolbar button { font: inherit; cursor: pointer; }

.media-viewer-content audio { display: block; width: 100%; max-width: 420px; margin-inline: auto; }



.catalog-filters { display:grid; gap:var(--space-3); margin-bottom:var(--space-5); }
.catalog-filters .catalog-search { min-width:0; margin:0; }
.catalog-tabs { display:flex; flex-wrap:wrap; gap:var(--space-1); }
.catalog-tabs button { min-height:var(--control-size); padding:0 var(--space-4); border:0; border-radius:var(--radius-control); background:transparent; color:var(--color-text-secondary); font-size:var(--text-body); font-weight:var(--weight-medium); }
.catalog-tabs button[aria-pressed="true"] { background:var(--color-active); color:var(--color-text); }
.catalog-tabs button:active { background:var(--color-active); }
@media (hover:hover) { .catalog-tabs button:hover { background:var(--color-hover); color:var(--color-text); } }

.catalog-back { display:flex; flex:none; align-items:center; gap:var(--space-1); min-height:var(--control-size); padding:0 var(--space-3) 0 var(--space-2); border:0; border-radius:var(--radius-control); background:transparent; color:var(--color-text-secondary); font-size:var(--text-label); font-weight:var(--weight-medium); }
.catalog-back svg { width:var(--icon-toolbar); height:var(--icon-toolbar); }
.catalog-back:active { background:var(--color-active); }
@media (hover:hover) { .catalog-back:hover { background:var(--color-hover); color:var(--color-text); } }


@media (max-width: 899px) { .toast { top: calc(var(--safe-top, env(safe-area-inset-top)) + 12px); bottom: auto; } }


.composer { display:grid; position:relative; max-width:760px; margin:0 auto; gap:6px; transition:border-color var(--motion-hover); grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "actions actions actions" "input input input" "controls voice send"; align-items: center; column-gap: var(--space-1); row-gap: var(--space-half); min-height: 0; border: 1px solid var(--color-border); background: var(--color-surface); box-shadow: var(--shadow-composer); }
.composer textarea { grid-column:1 / -1; width:100%; min-width:0; max-height:156px; resize:none; border:0; outline:0; background:transparent; font-size:var(--text-input); padding-right:50px; }
.composer textarea:focus-visible { outline:none; }

.composer .composer-controls { width:100%; margin:0; padding:0; overflow:visible; grid-area: controls; gap: 0; }
.composer-controls .composer-control { background:transparent; border-color:transparent; }
.composer-controls .composer-control:hover { background:var(--surface-hover); color: var(--color-text); }
.composer-controls .composer-active { display:none; }
.composer-controls .model-pill { display:flex; min-width:0; max-width:none; border:0; background:transparent; justify-content:flex-start; }
.composer-controls .model-pill:hover, .composer-controls .model-pill[aria-expanded="true"] { background:var(--surface-hover); color: var(--color-text); border-radius: var(--radius-pill); }
.composer-controls .model-pill span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.composer-model-notice { max-width:760px; box-sizing:border-box; width:100%; margin:0 auto var(--space-2); color:var(--color-text-secondary); font-size:15px; line-height:22px; }
.composer-model-notice summary { width:max-content; max-width:100%; cursor:pointer; min-height:44px; padding:var(--space-3) 0; }
.composer-model-notice summary::marker { color:var(--amber); }
.composer-model-notice p { margin:0 0 var(--space-3); }
.request-activity { display:flex; align-items:center; gap:10px; min-height:38px; margin-bottom:var(--space-2); color:var(--text-soft); font-size:14px; }
.generation-orbit { display:block; width:20px; height:20px; border:2px solid var(--line-strong); border-top-color:var(--color-accent); border-radius:50%; animation:media-wait 1.3s linear infinite; }
.request-activity time { color:var(--muted); font-variant-numeric:tabular-nums; margin-left:var(--space-half); }
.pending-answer:not(:empty), .message-row.assistant:last-child .answer-content { animation:answer-arrive .28s ease-out; }
@keyframes answer-arrive { from { opacity:.15; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }

.stream-word { animation:stream-word-in .16s ease-out backwards; }
@keyframes stream-word-in { from { opacity:0; } }
.stream-done .stream-word { animation:none; }
@media(prefers-reduced-motion:reduce) { .generation-orbit { animation:none; border-style:dotted; } .pending-answer:not(:empty),.message-row.assistant:last-child .answer-content,.stream-word { animation:none; } }
@media(max-height:540px) { .is-empty .composer-wrap { margin-bottom:0; padding-top:var(--space-3); } }

.composer-meta:has(#composer-identity:empty) { min-height:0; margin-block:0; }
.model-sheet > * { flex-shrink:0; }
.model-sheet h2 { font-weight:600; }
.model-sheet header button svg { width:20px; height:20px; }
.tool-tabs button { flex:1; font-size:14px; font-weight:500; }
.model-sheet > .catalog-search { border-radius: var(--radius-control); border:1px solid transparent; }
.model-sheet > .catalog-search:focus-within { border-color:var(--color-focus-border); }
.model-sheet > .catalog-search input { min-height:44px; font-size: var(--text-input); }
.model-sheet .model-options { display:flex; flex-direction:column; flex:1 1 auto; min-height:40px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.model-sheet .model-option { position:relative; display:block; flex:none; border-radius: var(--radius-control); background:transparent; }
.model-sheet .model-select { display:flex; flex-wrap:nowrap; width:100%; border-radius:var(--radius-control); box-shadow:none; }
.model-select .model-copy { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 10px; flex:1; min-width:0; }
.model-copy > small,.model-copy > .model-warning { grid-column:1 / -1; }
.model-sheet .model-copy small { margin:0; color:var(--color-text-secondary); font-size:var(--text-caption); line-height:var(--leading-label); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.model-selection { flex:none; width:18px; font-size:18px; color:var(--green-strong); }
.model-warning { display:block; margin-top:5px; font-size:14px; line-height:1.4; color:var(--amber); }
.model-option.is-soon { opacity:1; }
.model-option.is-soon .model-copy strong, .model-option.is-soon .model-warning { color:var(--muted); }
.picker-detail-content { margin:0 var(--space-3) var(--space-3); padding:var(--space-2) 0 2px; border-top:1px solid var(--line); color:var(--muted); line-height:1.5; }
.picker-detail-content p { margin:6px 0; }
@media (max-width:899px) {
  .model-sheet { border-radius: var(--radius-panel); }
  .composer-wrap { padding-left:var(--space-3); padding-right:var(--space-3); }
}
@media (max-height:560px) {
  .model-sheet { padding-top:6px; overflow-y:auto; }
  .model-sheet header { margin-bottom:0; }
  .model-sheet .model-options { flex-shrink:0; overflow:visible; }
}
@media (prefers-reduced-motion:reduce) { .model-sheet, .model-pill { transition:none; animation:none; } }

.model-pill.media-identity small { display:block; color:var(--muted); font-size:14px; font-weight:400; }
.model-pill.media-identity strong { display:block; color:var(--text); font-size:14px; font-weight:500; }
.composer-controls .model-pill.media-identity { padding-top:var(--space-1); padding-bottom:var(--space-1); }
.message-row.assistant .message-bubble { max-width:100%; }
.message-row.assistant .message-bubble:not(.media-job) { font-size:var(--text-message); line-height:var(--leading-message); }
.message-bubble blockquote { margin:var(--space-5) 0; padding:2px 0 2px 18px; border-left:3px solid var(--line-strong); color:var(--text-soft); }
.message-row.assistant .message-bubble > :first-child { margin-top:0; }
.message-actions button, .code-toolbar button { min-height:44px; }
.message-actions button { font-size:14px; }
.message-row.assistant .media-result { width:min(100%,520px); padding:0; border:0; background:transparent; }
.media-stage { overflow:hidden; border-radius:14px; background:var(--surface); }
.media-result button.media-visual { position:relative; display:block; width:100%; padding:0; margin:0; border:0; border-radius:0; background:transparent; line-height:0; cursor:zoom-in; }
.media-result .media-stage img, .media-result .media-stage video { display:block; width:100%; height:auto; max-height:520px; min-height:180px; object-fit:contain; margin:0; border-radius:0; }
.media-result .media-stage video { background:var(--color-media-stage); }
.media-result .media-stage audio { display:block; width:100%; max-width:100%; box-sizing:border-box; padding:var(--space-3); }
.media-placeholder { position:relative; isolation:isolate; overflow:hidden; min-height:260px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:14px; padding:var(--space-6); text-align:center; color:var(--muted); }
.media-placeholder > :not(.media-pulse) { position:relative; z-index:1; }
.media-placeholder p { margin:0; max-width:290px; font-size:15px; line-height:1.5; }
.media-placeholder .media-state-mark { width:25px; height:25px; border:2px solid var(--line-strong); border-radius:50%; }
.media-placeholder.is-working .media-state-mark { border-top-color:var(--green); animation:media-wait 1.1s linear infinite; }
.media-placeholder:has(.media-pulse) .media-state-mark { display:none; }
.media-pulse { position:absolute; inset:0; z-index:0; background-image:radial-gradient(circle,var(--color-accent) 1.4px,transparent 1.8px); background-size:14px 14px; mask-image:radial-gradient(ellipse at 50% 50%,#000,transparent 72%); -webkit-mask-image:radial-gradient(ellipse at 50% 50%,#000,transparent 72%); opacity:.28; animation:media-breathe 3.2s ease-in-out infinite; }
.media-elapsed { font-size:14px; font-variant-numeric:tabular-nums; color:var(--text); }
.media-complete { color:var(--color-accent-text); font-size:14px; }
@keyframes media-breathe { 0%,100% { opacity:.16; transform:scale(.97); } 50% { opacity:.4; transform:scale(1.025); } }
@media(prefers-reduced-motion:reduce) { .media-pulse { animation:none; } }
.media-result .media-placeholder button { min-height:44px; margin:0; padding:0 var(--space-4); border-radius:var(--radius-pill); font-size:14px; background:var(--panel); }
.media-result-footer { position:relative; display:flex; align-items:center; gap:var(--space-1); min-height:52px; padding:var(--space-1) 0; color:var(--muted); }
.media-result-footer .media-model { flex:1; min-width:0; font-size:14px; line-height:1.4; padding-left:var(--space-half); }
.media-result .media-result-footer button, .media-result-details > summary { display:grid; place-items:center; width:44px; min-height:44px; padding:0; margin:0; border:0; border-radius: var(--radius-control); color:var(--muted); background:transparent; cursor:pointer; list-style:none; }
.media-result .media-result-footer button:hover, .media-result-details > summary:hover { color:var(--text); }
.media-result-footer svg { width:20px; height:20px; }
.media-result-details { position:static; font-size:14px; }
.media-result-details > summary { font-size:22px; letter-spacing:1px; }
.media-result-details > summary::-webkit-details-marker { display:none; }
.media-result-details > div { position:absolute; z-index:5; right:0; bottom:100%; width:min(310px,calc(100vw - 40px)); padding:14px; border:1px solid var(--line); border-radius: var(--radius-control); background:var(--panel); box-shadow:var(--shadow); font-size:14px; line-height:1.5; }
.media-result-details p { margin:0 0 var(--space-2); }
.media-result-details p:last-child { margin:0; }
.media-result-details code { overflow-wrap:anywhere; }
.media-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); padding:0 0 var(--space-2); }

.media-actions button { min-height:44px; padding:0 var(--space-4); border:1px solid var(--line); border-radius:var(--radius-pill); color:var(--text); background:transparent; font-size:14px; cursor:pointer; }

@media (hover:hover) { .media-actions button:hover { background:var(--surface-hover); } }
.media-actions button:active:not(:disabled) { background:var(--color-active); }
.media-actions button:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }
.media-job[tabindex="-1"]:focus { outline:none; }
.media-status-note { font-size:14px; color:var(--muted); line-height:1.5; margin:10px 0!important; }
#pending-status { display:flex; align-items:center; gap:9px; color:var(--muted); font-size:14px; line-height:1.5; }
#pending-status[hidden] { display:none; }
#pending-status::before { content:""; flex:none; width:7px; height:7px; border-radius:50%; background:var(--red); }
@keyframes media-wait { to { transform:rotate(360deg); } }

@keyframes office-frames { from { background-position-x:calc(var(--col) * -1 * var(--cell)); } to { background-position-x:calc((var(--col) + 2) * -1 * var(--cell)); } }
@media (prefers-reduced-motion:reduce) {
 .media-placeholder.is-working .media-state-mark { animation:none; }
}
.message-actions [data-copy-message] { display:grid; width:44px; place-items:center; padding:0; }


.message-actions.response-footer, .media-result-footer.response-footer { display:flex; align-items:center; min-height:44px; gap:var(--space-half); padding:0; }
.response-footer .response-model, .media-result-footer .media-model.response-model { flex:1; min-width:0; padding:0; color:var(--muted); font-size:var(--text-caption); font-weight:400; line-height:var(--leading-caption); overflow-wrap:anywhere; }
@media (min-width:900px) {
  .is-empty .conversation-title { visibility:hidden; }
  .composer-controls .model-pill { padding-left:10px; padding-right:10px; }
}


.model-brand { margin-right:var(--space-1); font-size:17px; font-weight:600; display:grid; place-items:center; flex:none; width:36px; height:36px; border:0; border-radius:var(--radius-control); color:var(--family-color,var(--text)); background:var(--family-wash,var(--surface)); }
.model-brand.brand-auto { color:var(--color-text); }
.model-brand.brand-auto svg { width:20px; height:20px; }

.user-actions { justify-content:flex-end; margin:3px -8px -8px 0; }
.message-actions button { min-width:var(--control-size); min-height:var(--control-size); }
.message-row.user .message-actions button { color:var(--muted); }
.selection-tools { position:fixed; z-index:90; left:50%; bottom:calc(210px + env(safe-area-inset-bottom)); transform:translateX(-50%); max-width:calc(100vw - 24px); border:1px solid var(--line); border-radius: var(--radius-control); background:var(--panel); box-shadow:var(--shadow-overlay); }
.selection-tools button { display:flex; align-items:center; gap:var(--space-2); min-height:44px; padding:10px var(--space-4); border:0; border-radius: var(--radius-control); background:var(--surface); color:var(--text); font-size: var(--text-nav); white-space:nowrap; }
.selection-tools svg { width:20px; height:20px; }
.edit-message-dialog { max-height:calc(100dvh - 32px); padding:var(--space-6); border:1px solid var(--line); border-radius: var(--radius-panel); background: var(--color-elevated); color:var(--text); width:min(560px, calc(100vw - 32px)); }
.edit-message-dialog::backdrop { background:var(--color-scrim); }
.edit-message-dialog h2 { margin:0 0 var(--space-2); font-size:var(--text-headline); }
.edit-message-dialog p { color:var(--muted); font-size:14px; line-height:1.5; }
.edit-message-dialog textarea { box-sizing:border-box; resize:vertical; width:100%; min-height:140px; max-height:45dvh; padding:var(--space-3); border:1px solid var(--line); border-radius: var(--radius-control); font:inherit; font-size:var(--text-input); line-height:1.5; color:var(--text); background:var(--surface); }
.edit-message-dialog button { min-height:44px; padding:10px 14px; border-radius: var(--radius-control); border:0; background:var(--surface-hover); color:var(--text); }
#save-message-branch { background:var(--green-strong); color:var(--bg); }
@media (pointer:coarse) { .message-actions button { min-width:44px; min-height:44px; } }
.composer-shelf .thinking-control { gap:var(--space-2); }
.composer-shelf .thinking-control small { font-size:14px; color:var(--text); }
@media (hover:hover) and (pointer:fine) {
  .user-actions { opacity:0; transition:opacity var(--motion-press) ease; }
  .message-row.user:hover .user-actions, .user-actions:focus-within { opacity:1; }
}
@media (prefers-reduced-motion:reduce) { .user-actions { transition:none; } }

.web-logout{display:flex;width:100%;min-height:48px;align-items:center;justify-content:center;margin-top:var(--space-6);border:1px solid var(--line);background:var(--panel);color:var(--color-danger);border-radius: var(--radius-control);padding:9px 14px;font:inherit;font-weight:500}.web-logout[hidden]{display:none}

.attachment-capability-note{max-width:280px;padding:6px var(--space-3);margin:0 0 6px;font-size:var(--fs-micro);line-height:1.5;color:var(--muted)}

.attachment-chip.inline-photo{display:flex;flex-direction:column;align-items:flex-start;max-width:100%;white-space:normal}.inline-photo img{display:block;width:320px;max-width:100%;max-height:320px;object-fit:contain;border-radius: var(--radius-control);margin-bottom:var(--space-2)}.inline-photo img[hidden]{display:none}


.composer-controls .model-pill.media-identity > span { min-width:0; overflow:hidden; text-overflow:ellipsis; line-height:1.25; display: flex; align-items: baseline; gap: 5px; white-space: nowrap; }
.composer-controls .model-pill.media-identity small, .composer-controls .model-pill.media-identity strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display: inline; font-size: 14px; }
@media (max-height:560px) and (max-width:899px) {
  .composer-wrap { padding-bottom:max(6px, env(safe-area-inset-bottom)); }
  .composer-meta { margin-top:var(--space-half); }
}


.tool-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:0; gap: var(--space-1); padding: var(--space-1); border-radius: var(--radius-pill); background: var(--color-sidebar); }
.tool-tabs button { display:flex; min-width:0; text-align:left; }
.tool-tabs button strong { font-size:14px; font-weight:600; }
.tool-tabs button[aria-pressed="true"] { border-color:var(--color-accent); }
.model-option:hover { background:var(--surface-hover); }
.model-option.is-selected { box-shadow:inset 2px 0 0 var(--green); background:color-mix(in srgb, var(--green) 7%, transparent); }
.model-sheet .model-copy strong { overflow-wrap:anywhere; letter-spacing:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.company-disclosure { --family-wash:color-mix(in srgb,var(--family-color) 7%,var(--surface)); flex:none; border:1px solid var(--line-strong); overflow:clip; margin:0 0 10px; border-color:var(--color-border); background:transparent; }
.company-disclosure > summary { display:flex; align-items:center; gap:var(--space-3); min-height:76px; padding:12px 14px; cursor:pointer; list-style:none; background:transparent; }
.company-disclosure > summary::-webkit-details-marker { display:none; }
.company-heading { display:grid; gap:3px; flex:1; min-width:0; }
.company-heading strong { color:var(--text); font-size:16px; font-weight:600; }
.company-heading small { color:var(--muted); font-size:14px; }
.company-count { color:var(--muted); font-size:14px; }
.company-count b { font-variant-numeric:tabular-nums; }
.company-count small { font-size:14px; position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.company-chevron { width:16px; height:16px; stroke-width:var(--icon-stroke-small); transition:transform .18s; }
.company-disclosure[open] > summary .company-chevron { transform:rotate(180deg); }
.model-brand svg { width:25px; height:25px; stroke-width:1.6; }
.brand-serpentai img { display:none; }
.brand-serpentai::before { content:''; width:100%; height:100%; background:currentColor; mask:url('/snake.svg') center/contain no-repeat; -webkit-mask:url('/snake.svg') center/contain no-repeat; }
.catalog-company .model-family-grid { grid-template-columns:1fr; align-items:start; gap:0; padding:0 var(--space-4); }
.catalog-company .catalog-model { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 var(--space-3); padding:14px 0; }
.catalog-company .catalog-model-purpose { grid-column:1 / -1; font-size:14px; }
.catalog-company .catalog-model:first-child { border-top:0; }
.catalog-company .catalog-model-heading { grid-column:1 / -1; grid-template-columns:minmax(0,1fr); }
.catalog-company .catalog-model-heading > .model-brand { display:none; }
.catalog-company .catalog-model h3 { font-size:16px; }
.catalog-company .catalog-model p { margin:var(--space-2) 0; }
.catalog-company .catalog-model-actions { grid-column:2; grid-row:3; align-self:start; margin:0; padding:0; }
.catalog-company .catalog-model-actions button { font-size:14px; padding:0 var(--space-2); min-width:0; color:var(--family-color); }
.catalog-company .catalog-details { grid-column:1 / -1; grid-row:3; margin:0; border:0; }
.catalog-company .catalog-details > summary { min-width:92px; font-size:14px; }
.catalog-company .catalog-details > summary::after { display:none; }
.catalog-company .catalog-model-title h3 { white-space:normal; }
.models-catalog .company-disclosure { margin:0; }
@media(min-width:1100px) { .models-catalog { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-content:start; align-items:start; gap:var(--space-3); align-items:stretch; } .models-catalog .company-disclosure { margin:0; } .catalog-company[open] { grid-column:1 / -1; } .catalog-company[open] .model-family-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 var(--space-6); } }
@media(max-width:640px) { .tool-tabs button small,.picker-context-note { display:none; } }
@media(max-height:560px) { .tool-tabs button svg,.tool-tabs button small,.picker-context-note { display:none; } }
.model-family-grid { gap:var(--space-6) var(--space-8); }
.catalog-model.is-available { border-top-color:var(--line-strong); }
.catalog-model-purpose { color:var(--text-soft) !important; }
.catalog-model-actions button { justify-content:flex-start; padding-left:0; }
.catalog-model-actions button svg { margin-left:auto; }
.catalog-model-actions button:hover { background:transparent; color:var(--text); }
@media (max-width:640px) {
  .model-family-grid { gap:0; }
  .catalog-model { padding:var(--space-4) 0; }
  .catalog-model-purpose { min-height:0; }
}


.chat-selection-bar { flex:none; margin:0 0 var(--space-3); padding:var(--space-3) var(--space-4); border:1px solid var(--line); border-radius:var(--radius-panel); background:var(--surface); }
.chat-selection-heading { display:flex; align-items:center; justify-content:space-between; gap:var(--space-2); font-size:14px; }
.chat-selection-heading button { min-height:44px; padding:0 var(--space-2); color:var(--color-accent-text); background:transparent; }
.chat-batch-actions { display:flex; flex-wrap:wrap; gap:6px; }
.chat-batch-actions button { display:flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:var(--space-2) var(--space-3); border:1px solid var(--line); border-radius:var(--radius-control); background:var(--color-elevated); font-size:14px; }
.chat-batch-actions svg { width:20px; height:20px; }
.chat-batch-actions .danger { color:var(--color-danger); }
.chat-batch-actions button:disabled { opacity:.45; cursor:default; }
#all-chats-list .chat-item[role="checkbox"] { position:relative; padding-left:var(--space-12); padding-right:var(--space-3); }
.chat-check { position:absolute; left:12px; top:22px; width:22px; height:22px; border:1px solid var(--line-strong); border-radius:50%; color:transparent; display:grid; place-items:center; font-size:14px; }
[aria-checked="true"] .chat-check { background:var(--color-accent); border-color:var(--color-accent); color:var(--color-on-accent); }
.chat-batch-notice { flex:none; border:1px solid var(--line); }
.chat-batch-notice p { margin:0; color:var(--text-soft); font-size:14px; line-height:1.5; }
.chat-batch-notice button { min-height:44px; padding:6px 0; color:var(--color-accent-text); background:transparent; }
#chat-batch-project-field { margin-top:var(--space-4); }
#chat-batch-confirm.danger { color:var(--color-on-danger); background:var(--color-danger-fill); }
@media(max-width:480px) { .chat-selection-bar { padding:8px 10px; } .chat-batch-actions { display:grid; grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); } .chat-selection-heading { font-size:14px; } .chat-selection-heading button { font-size:14px; } }


.model-brand svg.brand-logo { width:22px; height:22px; fill:currentColor; stroke:none; }


.tariff-pay { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-top: var(--space-4); border-radius: var(--radius-control); color: var(--green-strong); background: var(--green-wash); font-weight: 600; text-decoration: none; }
.tariff-pay:hover { background: var(--green-focus); }
.tariff-option.is-current .tariff-pay { color: var(--on-accent); background: var(--green); }
.tariff-option.is-current .tariff-pay:hover { background: var(--green-strong); }




.composer textarea {
  grid-area: input;
  min-height: 44px;
  padding: 10px 8px 6px;
  line-height: 1.5;
}
.composer .voice-button {
  top:14px;
  right:14px;
  position: static;
  grid-area: voice;
}
.composer .voice-button:hover:not(:disabled) { background: var(--color-hover); }
.composer .send-button.has-price { display:inline-flex; align-items:center; justify-content:center; min-width:44px; padding-inline:10px; border-radius:var(--radius-pill); width:auto; gap:var(--space-1); padding:0 var(--space-3) 0 var(--space-2); }
.composer .send-button.has-price .send-price { white-space:nowrap; font-variant-numeric:tabular-nums; font-size:var(--text-label); font-weight:var(--weight-semibold); line-height:var(--leading-label); }
.composer-controls .composer-control { padding: var(--space-2); border-radius: var(--radius-pill); color: var(--color-text-secondary); }

.composer-controls .model-pill {
  flex: 0 1 auto;
  padding: 0 10px;
  gap: var(--space-1);
  border-radius: var(--radius-pill);
  color: var(--color-text-secondary);
  font-size: 14px;
  font-weight: 500;
}
.composer-controls .model-pill svg { flex:none; margin-left: 0; width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); }

.composer-controls .model-pill.media-identity small::after { content: " ·"; }

.composer-quick-actions { display:flex; flex-wrap:nowrap; align-items:center; gap:6px; width:max-content; max-width:100%; margin:0 0 var(--space-2) var(--space-1); padding:3px; border:1px solid var(--color-border); border-radius:var(--radius-pill); background:var(--color-surface); box-shadow:var(--shadow-raised); overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.composer-quick-actions::-webkit-scrollbar { display:none; }
.composer-quick-actions button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:0 13px; border:0; border-radius:var(--radius-pill); background:transparent; color:var(--color-text-secondary); font:inherit; font-size:14px; cursor:pointer; white-space:nowrap; }
.composer-quick-actions button:hover { color:var(--color-text); background:var(--color-hover); }
.composer-quick-actions button[aria-disabled="true"] { color:var(--color-text-tertiary); }
.composer-quick-actions button:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }
.composer-quick-actions svg { width:20px; height:20px; flex:none; }
.composer-controls .model-pill > .model-pill-mark { display:grid; place-items:center; width:21px; height:21px; flex:none; overflow:visible; }
.model-pill-mark .model-brand { width:21px; height:21px; margin:0; }
.composer-controls .model-pill .model-pill-mark svg { width:18px; height:18px; margin:0; }
.composer-controls .model-pill > .model-pill-name,.composer-controls .model-pill.media-identity > .model-pill-name { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#thinking-control { display:inline-flex; min-width:0; max-width:150px; white-space:nowrap; font-variant-numeric:tabular-nums; }
#thinking-control[hidden] { display:none; }
#thinking-control svg { width:16px; height:16px; flex:none; stroke-width:var(--icon-stroke-small); }
#thinking-control span { overflow:hidden; text-overflow:ellipsis; }
.thinking-menu { padding:14px; }
.media-parameters { margin:0 var(--space-1) var(--space-2); color:var(--color-text-secondary); font-size:14px; }
.media-parameter-list { display:flex; flex-wrap:wrap; gap:6px; }
.media-parameter-warning { display:block; }
.media-parameter-note { margin:0; padding:5px 2px; }
@media(max-width:640px) { .composer-quick-actions { width:100%; margin-left:0; } .composer-quick-actions button { flex:0 0 auto; gap:var(--space-1); padding:0 10px; font-size:14px; } .composer-quick-actions svg { width:20px; height:20px; } }


.composer-wrap .thinking-menu, .composer-wrap .attach-menu {
  position:fixed; bottom:auto; right:auto; height:auto;
}
.attach-menu .attachment-capability-note { grid-column:1 / -1; }
.composer-wrap .limit-line { min-height:44px; }
.composer .voice-button, .composer .send-button { width:44px; height:44px; min-height:44px; }
.credit-ring-count:not([hidden]) { display:inline-flex; align-items:center; justify-content:center; min-width:36px; height:32px; padding-inline:var(--space-1); border:0; border-radius:var(--radius-control); background:var(--surface-hover); font-variant-numeric:tabular-nums; font-size:var(--fs-micro); font-weight:600; color:var(--color-text); }
.limit-bar[hidden] { display:none; }
.limit-line.is-empty .credit-ring-count { color:var(--color-danger); }
.credit-expiry { margin:var(--space-1) 0; font-variant-numeric:tabular-nums; color:var(--color-text-secondary); }
.credit-wallet h4 { margin:var(--space-5) 0 var(--space-2); }
.credit-packs { display:grid; gap:0; border:1px solid var(--color-border); border-radius:var(--radius-panel); overflow:hidden; background:var(--color-surface); }
.credit-packs button { width:100%; min-height:52px; display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:var(--space-2); padding:var(--space-3) var(--space-4);
  border:0; border-radius:0;
  background:transparent; color:var(--color-text); text-align:left; font:inherit; cursor:pointer; }
.credit-packs button + button { border-top:1px solid var(--color-border); }
.credit-packs button:focus-visible { outline:2px solid var(--color-accent); outline-offset:-3px; }
.credit-packs button span { color:var(--color-text-secondary); font-variant-numeric:tabular-nums; }
@media (hover:hover) { .credit-packs button:hover { background:var(--color-hover); } }
.credit-packs button:active { background:var(--color-active); }
.composer-controls .composer-control, .composer-controls .model-pill { min-height:44px; }
.composer-controls .composer-control { min-width:44px; }
@media(max-width:640px) {
  
  .composer .composer-controls { overflow:visible; }
  #attach-control { grid-column:1; grid-row:1; }
  .composer-controls .model-pill, .composer-controls .model-pill.media-identity { grid-column:2; grid-row:1; max-width:none; width:auto; min-width:0; margin:0; justify-self:start; }
  
  #thinking-control, #media-settings { grid-row:1; }
  
  .composer-controls .model-pill { padding:0 var(--space-1); justify-content:flex-start; text-align:left; }
  .composer-controls .model-pill > .model-pill-name, .composer-controls .model-pill.media-identity > .model-pill-name { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; white-space:normal; overflow:hidden; font-size:var(--text-meta); line-height:1.2; }
  .composer-active { grid-column:1 / -1; }
}


.composer-stage > .voice-recorder {
  position: absolute; inset: 0; z-index: 4;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto 40px;
  align-items: center;
  gap: 10px;
  max-width: none; min-height: 0;
  margin: 0; padding: 0 10px;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-composer);
  background: var(--color-surface);
  animation: voice-in var(--motion-popover) var(--ease-ui) both;
}
.composer-stage > .voice-recorder[hidden] { display: none; }
@keyframes voice-in { from { opacity: 0; } }
.voice-recorder .voice-icon-button {
  display: grid; place-items: center;
  width: 40px; height: 40px; min-width: 40px; min-height: 40px;
  padding: 0; border: 0; border-radius: 50%;
  color: var(--color-text-secondary); background: transparent;
}
.voice-recorder .voice-icon-button:hover:not(:disabled) { color: var(--color-text); background: var(--color-hover); }
.voice-recorder .voice-icon-button svg { width: 20px; height: 20px; }
.voice-recorder .voice-confirm, .voice-recorder button.voice-confirm:last-child { color: var(--color-on-action); background: var(--color-action); }
.voice-recorder .voice-confirm:hover:not(:disabled) { color: var(--color-on-action); background: color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
.voice-recorder .voice-icon-button[hidden] { display: none; }
.voice-meter { position: relative; height: 40px; min-width: 0; display: flex; align-items: center; }
.voice-meter canvas { display: block; width: 100%; height: 32px; color: var(--color-text); }
.voice-meter .voice-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.voice-recorder time::before { content: ""; width: 8px; height: 8px; border-radius: 50%; animation: voice-dot 1.2s ease-in-out infinite; }
@keyframes voice-dot { 50% { opacity: .35; } }

.voice-recorder.is-busy .voice-meter canvas { display: none; }
.voice-recorder.is-busy .voice-meter .voice-status {
  position: static; width: auto; height: auto; overflow: visible; clip: auto;
  color: var(--color-text-secondary); font-size: 15px; font-weight: 400;
  background: linear-gradient(90deg, var(--color-text-secondary) 0%, var(--color-text) 50%, var(--color-text-secondary) 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  animation: voice-shimmer 1.6s linear infinite;
}
.voice-recorder.is-busy time::before { display: none; }
@keyframes voice-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) {
  .voice-recorder time::before, .voice-recorder.is-busy .voice-meter .voice-status { animation: none; }
}


.header-new-chat { display: none; }
@media (max-width: 899px) {
  .conversation-header .back-button { display: grid; grid-column: 1; }
  .conversation-title { display: block; grid-column: 2; min-width: 0; text-align: center; }
  .conversation-title h2 { margin: 0; font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
  .conversation-title span { display: none; }
  .header-new-chat { display: grid; grid-column: 4; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--color-text-secondary); background: transparent; }
  .header-new-chat svg { width: 20px; height: 20px; }
  .header-new-chat:active { background: var(--color-hover); }
  .is-empty .conversation-title { visibility: hidden; }
}


@media (max-width: 899px) {
  .is-empty .messages { flex: 1 1 auto; margin-top: 0; justify-content: center; padding-bottom: var(--space-4); }
  .is-empty .composer-wrap { margin-bottom: 0; padding-top: var(--space-1); }
}


.message-row.user { flex-direction: column; align-items: flex-end; }
.message-row.user > .user-actions { display: flex; gap: 0; margin: var(--space-1) 0 0; }

.message-row.user > .user-actions button { min-width: var(--control-size); min-height: var(--control-size); width: var(--control-size); height: var(--control-size); padding: 0; display: grid; place-items: center; border-radius: 50%; }

.message-actions.response-footer { gap: 0; margin-left:-12px; }
.message-actions.response-footer button { order: 1; min-width: 36px; min-height: 36px; width: 36px; padding: 0; display: grid; place-items: center; border-radius: 9px; color: var(--color-text-secondary); }
@media (hover:hover) { .message-actions.response-footer button:hover { color: var(--color-text); background: var(--color-hover); } }
.response-footer .response-model { order: 2; flex: 0 1 auto; margin-left: var(--space-2); }
.message-actions svg { width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
@media (pointer: coarse) { .message-actions.response-footer button { min-width: 44px; min-height: 44px; width: 44px; } }

.composer-stage > .voice-recorder > #voice-cancel { grid-column: 1; }
.composer-stage > .voice-recorder > .voice-meter { grid-column: 2; }
.composer-stage > .voice-recorder > time { grid-column: 3; }
.composer-stage > .voice-recorder > #voice-done { grid-column: 4; }
.composer-stage > .voice-recorder.is-busy > .voice-meter { grid-column: 1 / 4; padding-left: var(--space-3); }
.composer-stage > .voice-recorder.is-busy > time { display: none; }



.new-chat-button:hover { background: var(--color-hover); }
.sidebar-section-label { margin: 0; color: var(--color-text-secondary); font-size: var(--text-caption); line-height: var(--leading-caption); font-weight: var(--weight-semibold); }
.sidebar-chat-list .chat-day { color: var(--color-text-tertiary); font-size: var(--fs-micro); font-weight: 500; letter-spacing: .01em; margin:var(--space-4) var(--space-3) var(--space-1); }
.sidebar-chat-list .chat-item { min-height: 36px; padding: 8px 10px; }
.sidebar-chat-list .chat-item.active strong { font-weight: 500; }
.settings-shortcut { min-height: 44px; background: transparent; font-size: 14px; }
.settings-shortcut:hover { background: var(--color-hover); }

.new-chat-button svg { width: var(--icon-toolbar); height: var(--icon-toolbar); } 
@media (max-width: 899px) {
  .new-chat-button, .sidebar-primary-nav button, .settings-shortcut { min-height: 44px; font-size: 16px; }
  .sidebar-chat-list .chat-item, .sidebar-chat-list .chat-list-row .chat-item { min-height: 44px; }
}


@media (min-width: 900px) {
  .conversation-header { min-height: 52px; padding: var(--space-2) var(--space-5); border-bottom-color: transparent; }
  .conversation-title h2 { font-size: 15px; font-weight: 600; }
  .conversation-title span { display: none; }
}
.message-row { max-width: 760px; }

@media (pointer: coarse) {
  .drawer-close:focus-visible, .settings-close:focus-visible, #close-sheet:focus-visible { outline: none; }
}


:root:not([data-input="keyboard"]) :is(button, a, summary, [tabindex]):focus-visible { outline: none; }


.tool-tabs button { flex-direction: row; align-items: center; justify-content: center; gap: var(--space-2); min-height: 40px; padding: 0 10px; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--color-text-secondary); }
.tool-tabs button small { font-size:14px; line-height:1.35; display: none; }
.tool-tabs button svg { width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); }
.tool-tabs button[aria-pressed="true"] { border: 0; background: var(--color-elevated); color: var(--color-text); box-shadow: var(--shadow-raised); }
@media (max-width: 640px) { .tool-tabs button { min-height: 40px; padding: 0 6px; } }
.picker-context-note { margin:var(--space-3) 0 0; color:var(--muted); font-size:var(--text-secondary); line-height:1.5; display: none; }


.message-row.user .message-bubble { max-width:85%; padding:12px 18px; border-radius:var(--radius-bubble); color:var(--color-text); background:var(--color-bubble); font-size:15px; line-height:24px; }
@media (max-width:899px) { .message-row.user .message-bubble { max-width:90%; padding:12px 16px; font-size:16px; line-height:25px; } }


@media (max-width: 640px) {
  .composer-controls .model-pill.media-identity small { display: none; }
  .composer-controls .model-pill.media-identity { max-width: 58vw; }
}


[data-settings-panel]:focus-visible { outline-offset: -2px; }


.model-selection svg, .company-current svg { display: block; width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); }
.company-current { display: inline-grid; place-items: center; color: var(--green-strong); }
.chat-check svg { width: 16px; height: 16px; stroke-width: var(--icon-stroke-small); }
.drawer-close svg, #clear-quote svg { width: 20px; height: 20px; }
.settings-detail-card .settings-toggle > span:first-child { display: block; min-width: 0; }
.settings-detail-card .settings-toggle b { display: block; color: var(--text); font-weight: 500; text-align: left; }
.settings-toggle .switch i { width: 44px; height: 26px; }
.settings-toggle .switch i::after { top: 3px; left: 3px; width: 20px; height: 20px; }
.settings-toggle .switch input:checked + i::after { left: 21px; }
.settings-view[data-settings-view="profile"] > .settings-view-title { align-items: center; }


.conversation-header .limit-row { margin:0 0 0 auto; padding:0; flex:none; }
@media(max-width:899px) {
  .conversation-header { grid-template-columns:44px minmax(0,1fr) auto 44px 44px; }
  .conversation-header .limit-row { grid-column:3; grid-row:1; }
  .conversation-header .more-button { grid-column:4; grid-row:1; }
  .conversation-header .header-new-chat { grid-column:5; grid-row:1; }
}
@media(max-width:640px) {
  .composer { box-shadow:var(--shadow-composer); padding-top:var(--space-1); padding-bottom:var(--space-1); }
  .media-parameters { margin:0 8px 6px; }
  .media-parameter-list { gap:4px 10px; }
}
@media(max-width:400px) {
  .composer-controls .model-pill > svg { display:none; }
}

@media(max-width:440px) {
  .composer:has(.send-button.has-price) { grid-template-areas:"actions actions actions" "input input input" "controls controls controls" ". voice send"; }
}

@media(max-width:340px) {
  .composer:not(:has(.send-button.has-price)) .composer-controls .model-pill { min-width:44px; justify-content:center; }
  body:not(.guest-mode) .composer:not(:has(.send-button.has-price)) .composer-controls .model-pill > .model-pill-name { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
}


.model-sheet .tool-tabs, .model-sheet .picker-context-note { display:none; }

.model-sheet .model-copy { display:block; }

@media (min-width:900px) {
  
  .conversation-header .limit-row { grid-column:2; grid-row:1; }
  .conversation-header .more-button { grid-column:3; grid-row:1; }
}





#thinking-control .reply-effort { display:inline-flex; align-items:center; min-width:0; gap:5px; }
#thinking-control .reply-effort[hidden] { display:none; }
#thinking-control[aria-expanded="true"], #media-settings[aria-expanded="true"] { background:var(--color-active); }


#media-settings { display:inline-flex; white-space:nowrap; font-variant-numeric:tabular-nums; }
#media-settings[hidden] { display:none; }
#media-settings svg { width:16px; height:16px; flex:none; stroke-width:var(--icon-stroke-small); }
.composer-wrap .media-parameters { position:fixed; z-index:38; display:grid; width:min(340px, calc(100vw - 24px)); max-height:calc(var(--app-height, 100dvh) - 24px); margin:0; overflow-y:auto; overscroll-behavior:contain; font-size:15px; gap:0; }
.composer-wrap .media-parameters[hidden] { display:none; }

.composer-wrap .media-parameters:focus, .composer-wrap .media-parameters:focus-visible { outline:none; }
.media-panel-heading { display:grid; gap:var(--space-half); }
.media-panel-heading strong { font-size:15px; font-weight:600; }
.media-panel-heading span { color:var(--color-text-secondary); font-size:14px; }

.media-parameters .media-parameter-list > .media-choice-row { display:grid; justify-content:stretch; gap:6px; padding:10px 12px; }
.media-choice { display:flex; flex-wrap:wrap; gap:6px; }
.media-choice button { min-width:44px; min-height:44px; padding:0 var(--space-3); border:1px solid var(--color-border); border-radius:var(--radius-control); background:var(--color-elevated); color:var(--color-text); font:inherit; font-size:15px; font-variant-numeric:tabular-nums; cursor:pointer; }
.media-choice button[aria-checked="true"] { border-color:transparent; background:var(--color-accent-subtle); color:var(--color-accent-text); font-weight:600; }
.media-choice button:focus-visible { outline:2px solid var(--color-accent); outline-offset:1px; }

.media-select-row label { cursor:pointer; }
.media-select { position:relative; display:inline-flex; max-width:100%; }
.media-select::after { content:""; position:absolute; top:50%; right:12px; width:14px; height:14px; transform:translateY(-50%); color:var(--color-text-secondary); background:currentColor; -webkit-mask:var(--mask-chevron) center / contain no-repeat; mask:var(--mask-chevron) center / contain no-repeat; pointer-events:none; }
.media-select select { appearance:none; -webkit-appearance:none; min-width:96px; max-width:100%; min-height:44px; margin:0; padding:0 34px 0 12px; border:1px solid var(--color-border); border-radius:var(--radius-control); background:var(--color-elevated); color:var(--color-text); font:inherit; font-size:16px; font-variant-numeric:tabular-nums; cursor:pointer; }
.media-select select:focus-visible { outline:2px solid var(--color-accent); outline-offset:1px; }

.select-field { position:relative; display:block; min-width:0; }
.select-field[hidden] { display:none; }
.select-field::after { content:""; position:absolute; top:50%; right:16px; width:16px; height:16px; transform:translateY(-50%); background:var(--color-text-secondary); -webkit-mask:var(--icon-chevron-mask) center / contain no-repeat; mask:var(--icon-chevron-mask) center / contain no-repeat; pointer-events:none; }
.select-field select { appearance:none; -webkit-appearance:none; display:block; width:100%; min-height:48px; margin:0; padding:0 44px 0 16px; border:1px solid var(--line-strong); border-radius:var(--radius-control); color:var(--text); background:var(--input); font:inherit; font-size:16px; line-height:1.25; cursor:pointer; }
.select-field select:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }

:root:not([data-input="keyboard"]) .select-field select:focus-visible { outline:none; }
:root:not([data-input="keyboard"]) #chat-batch-project:focus-visible { border-color:var(--line-strong); box-shadow:none; }
.media-parameters .media-choice-row dd { text-align:left; }
.media-parameters .media-parameter-note { color:var(--color-text-secondary); }
.media-parameters .media-parameter-change { color:var(--color-text); }
.media-sound-control { display:flex; align-items:center; gap:var(--space-2); flex-wrap:wrap; }
.media-sound-toggle { display:inline-flex; align-items:center; gap:7px; min-height:44px; padding:0 var(--space-3); border:1px solid var(--color-border); border-radius:var(--radius-control); background:var(--color-elevated); color:var(--color-text); font:inherit; font-size:15px; cursor:pointer; }
.media-sound-toggle[aria-checked="true"] { border-color:transparent; background:var(--color-accent-subtle); color:var(--color-accent-text); font-weight:600; }
.media-sound-toggle:focus-visible { outline:2px solid var(--color-accent); outline-offset:1px; }
.media-sound-control > span { color:var(--color-text-secondary); font-size:14px; }
.media-panel-link { justify-self:start; min-height:44px; margin:-6px 0 -6px -2px; padding:0 var(--space-half); border:0; background:none; color:var(--color-accent-text); font:inherit; font-size:15px; font-weight:500; cursor:pointer; }
.media-panel-link:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; border-radius:var(--radius-control); }



.edit-model-notice[hidden] { display:none; }
.edit-model-notice p { margin:0 0 var(--space-2); }
.edit-model-notice strong { color:var(--color-text); font-weight:600; }
.edit-model-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); }
.edit-model-actions .model-brand { width:18px; height:18px; min-width:18px; }
.edit-model-actions .model-brand svg, .edit-model-actions .model-brand img { width:18px; height:18px; }

.media-result-footer.response-footer { flex-wrap:wrap; }
.media-result-footer .media-model.response-model { flex:1 1 8rem; min-width:0; }
.media-result .media-result-footer button.media-edit { display:inline-flex; width:auto; gap:6px; padding:0 var(--space-3); color:var(--color-text); font-size:14px; white-space:nowrap; }
.media-result .media-result-footer button.media-edit svg { width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
.media-source-note { display:flex; align-items:center; gap:var(--space-2); margin:0 0 6px; color:var(--color-text-secondary); font-size:14px; line-height:20px; }
.media-source-note img { display:block; width:28px; height:28px; margin:0; border-radius:var(--radius-control); object-fit:cover; }

.message-bubble .message-quote { display:-webkit-box; margin:0 0 var(--space-2); padding:0 0 0 var(--space-3); border-left:2px solid var(--color-border-strong); color:var(--color-text-secondary); font-size:var(--text-secondary); line-height:var(--leading-secondary); overflow:hidden; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:4; line-clamp:4; }
.edit-model-actions button:focus-visible, .media-result .media-result-footer button.media-edit:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }

.media-ended { display:flex; align-items:flex-start; gap:var(--space-3); color:var(--color-text); padding:var(--space-4); }
.media-result .media-ended-mark { flex:none; color:var(--color-text-tertiary); }
.media-ended-copy { flex:1; min-width:0; }
.media-ended-copy p { margin:0; }
.media-ended-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); margin-top:var(--space-3); }
.media-result .media-ended-actions button, .media-result > button[data-media-action="refresh"] { min-height:44px; margin:0; padding:0 var(--space-4); border:1px solid var(--line); border-radius:var(--radius-pill); color:var(--color-text); background:transparent; font-size:14px; cursor:pointer; }
@media (hover:hover) { .media-result .media-ended-actions button:hover, .media-result > button[data-media-action="refresh"]:hover { background:var(--surface-hover); } }
.media-result .media-ended-actions button:active:not(:disabled), .media-result > button[data-media-action="refresh"]:active:not(:disabled) { background:var(--color-active); }
.media-action-cost { color:var(--color-text-secondary); }
.media-result .media-actions { padding:var(--space-2) 0; }
.media-result .media-actions button { margin:0; }
@media (max-width:460px) {
  
  .media-result .media-result-footer button.media-edit { width:44px; padding:0; gap:0; justify-content:center; }
  .media-result .media-result-footer button.media-edit span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .media-result-footer .media-model.response-model { flex:1 1 0; min-width:4.5rem; }
}
@media (max-width:588px) {
  
  .media-result .media-actions { flex-wrap:nowrap; overflow-x:auto; margin:0 calc(-1 * var(--space-4)); padding:var(--space-2) var(--space-4); scroll-padding-inline:var(--space-4); scrollbar-width:none; overscroll-behavior-x:contain;
    -webkit-mask-image:linear-gradient(90deg, transparent, #000 var(--space-4), #000 calc(100% - var(--space-4)), transparent);
    mask-image:linear-gradient(90deg, transparent, #000 var(--space-4), #000 calc(100% - var(--space-4)), transparent); }
  .media-actions::-webkit-scrollbar { display:none; }
  .media-actions button { flex:none; white-space:nowrap; }
}


.message-actions.response-footer button[data-continue-message] { width:auto; margin-left:6px; padding:0 15px; border:1px solid var(--line-strong); border-radius:var(--radius-control); color:var(--color-text); white-space:nowrap; flex:none; order:2; }
.message-actions.response-footer button[data-continue-message]:hover { background:var(--surface-hover); }

.assistant-byline { display:flex; align-items:center; gap:9px; margin:0 0 12px; color:var(--color-text-secondary); font-size:var(--text-caption); line-height:20px; }
.assistant-byline .model-brand { width:19px; height:19px; margin:0; border-radius:0; background:none; }
.assistant-byline .model-brand :is(svg, img) { width:19px; height:19px; }
.assistant-byline .response-model { min-width:0; font-weight:500; overflow-wrap:anywhere; }


.message-row .attachment-chip:not(.inline-photo) { max-width:min(400px, 100%); gap:var(--space-3); padding:8px 14px 8px 8px; overflow-wrap:normal; }
.message-row .artifact-card { width:360px; max-width:100%; min-height:76px; padding:12px 14px; border:1px solid var(--color-border-strong); border-radius:12px; }
.message-row .artifact-card .attachment-tile { width:36px; height:40px; border-radius:7px; background:var(--color-surface); }
.message-row .artifact-card .attachment-copy { gap:4px; }
.message-row .artifact-card .attachment-copy strong { font-size:14px; font-weight:550; }
.message-row .artifact-card .attachment-copy small { margin-top:0; line-height:18px; }
@media (max-width:899px) { .message-row .artifact-card { width:100%; min-height:72px; padding:10px 12px; } }

.office-card { width:400px; max-width:100%; margin-top:10px; overflow:hidden; border:1px solid var(--color-border-strong); border-radius:12px; background:var(--color-surface); cursor:pointer; }
.office-stage { display:block; position:relative; width:100%; aspect-ratio:var(--office-ratio); padding:0; overflow:hidden; border:0; border-radius:0; border-bottom:1px solid var(--color-border); background:var(--color-hover); cursor:pointer; }
.office-stage img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.office-strip-wrap { position:relative; border-bottom:1px solid var(--color-border); }
.office-strip { display:flex; gap:6px; padding:8px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:8px; scrollbar-width:none; overscroll-behavior-x:contain; }
.office-strip::-webkit-scrollbar { display:none; }
.office-thumb { flex:none; height:56px; aspect-ratio:var(--office-thumb); overflow:hidden; border:1px solid var(--color-border); border-radius:6px; background:var(--color-hover); scroll-snap-align:start; }
.office-thumb img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.office-card[data-state="loading"] :is(.office-stage, .office-thumb) { animation:skeleton-pulse 1.4s ease-in-out infinite; }
.office-arrow { display:none; position:absolute; z-index:1; inset-block:0; margin-block:auto; width:32px; height:32px; place-items:center; padding:0; border:1px solid var(--color-border-strong); border-radius:50%; color:var(--color-text); background:var(--color-elevated); cursor:pointer; }
.office-arrow[data-office-scroll="-1"] { left:8px; }
.office-arrow[data-office-scroll="1"] { right:8px; }
.office-arrow[data-office-scroll="1"] svg { transform:scaleX(-1); }
.office-arrow svg { width:18px; height:18px; pointer-events:none; }
@media (hover:hover) {
  .office-card:hover[data-from] .office-arrow[data-office-scroll="-1"], .office-card:hover[data-more] .office-arrow[data-office-scroll="1"] { display:grid; }
  .office-card:hover .office-stage img { opacity:.92; }
  .office-download:hover { color:var(--color-text); background:var(--color-hover); }
}
.office-text { display:flex; flex-direction:column; gap:4px; width:100%; height:100%; padding:14px 16px; overflow:hidden; color:var(--color-text-secondary); font-size:var(--fs-micro); line-height:var(--leading-caption); text-align:left; }
.office-text span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.office-text .is-head { color:var(--color-text); font-weight:550; }

table.office-text { display:table; width:100%; border-collapse:collapse; table-layout:auto; }
table.office-text td { padding:4px 6px; border:1px solid var(--color-border); white-space:nowrap; }
table.office-text td:first-child { width:100%; max-width:0; overflow:hidden; text-overflow:ellipsis; }
table.office-text td + td { width:1%; }
table.office-text td > span { display:block; max-width:8em; }
table.office-text .is-num { text-align:right; font-variant-numeric:tabular-nums; }
table.office-text tr:first-child td { color:var(--color-text); font-weight:550; }
.office-foot { display:flex; align-items:center; gap:var(--space-3); padding:10px 8px 10px 14px; }
.office-icon { display:grid; flex:none; width:32px; height:32px; place-items:center; border-radius:7px; color:var(--color-text-secondary); background:var(--color-hover); }
.office-icon svg { width:18px; height:18px; }
.office-copy { display:flex; flex:1; flex-direction:column; gap:2px; min-width:0; }
.office-copy b { overflow:hidden; color:var(--color-text); font-size:14px; font-weight:550; line-height:20px; text-overflow:ellipsis; white-space:nowrap; }

.office-copy small { display:flex; flex-wrap:wrap; height:18px; overflow:hidden; color:var(--color-text-secondary); font-size:var(--text-caption); line-height:18px; }
.office-copy small > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.office-copy small > .office-size { flex:none; }
.office-download { display:grid; flex:none; width:36px; height:36px; place-items:center; padding:0; border:0; border-radius:50%; color:var(--color-text-secondary); background:none; cursor:pointer; }
.office-download svg { width:20px; height:20px; }

@media (max-width:899px) { .message-row.assistant .office-card { width:100%; } }
@media (prefers-reduced-motion:reduce) { .office-card[data-state="loading"] :is(.office-stage, .office-thumb) { animation:none; } }
.attachment-tile { display:grid; flex:none; width:40px; height:40px; place-items:center; border-radius:var(--radius-control); color:var(--color-text-secondary); background:var(--surface-hover); }
.attachment-chip .attachment-tile svg { width:20px; height:20px; }
.attachment-tile.has-frame { overflow:hidden; }
.attachment-tile.has-frame img { width:100%; height:100%; object-fit:cover; }
.attachment-copy { display:flex; flex:1; flex-direction:column; min-width:0; text-align:left; }
.attachment-copy strong { overflow:hidden; color:var(--color-text); font-size:15px; font-weight:500; line-height:20px; text-overflow:ellipsis; white-space:nowrap; }
.attachment-copy small { margin-top:var(--space-half); color:var(--color-text-secondary); font-size:var(--text-caption); line-height:var(--leading-caption); }
.attachment-chip svg.attachment-download { flex:none; width:20px; height:20px; color:var(--color-text-secondary); }
.artifact-card:hover svg.attachment-download { color:var(--color-text); }

.attachment-chip.inline-photo:has(img:not([hidden])) { padding:0; border:0; background:none; }
.attachment-chip.inline-photo:has(img:not([hidden])) > :not(img) { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.attachment-chip.inline-photo img { width:auto; max-width:min(100%, 320px); height:auto; margin:0; border-radius:var(--radius-panel); }

.search-sources { margin-top:var(--space-2); }
.search-sources > summary {
  display:inline-flex; align-items:center; gap:6px; min-height:32px; margin-left:-2px; padding-right:4px; position:relative;
  color:var(--color-text-tertiary); font-size:var(--text-caption); cursor:pointer; list-style:none; -webkit-user-select:none; user-select:none;
  transition:color 160ms var(--ease-ui);
}
.search-sources > summary::-webkit-details-marker { display:none; }
.search-sources > summary::after { content:""; position:absolute; inset:-6px -8px; }
.search-sources > summary svg { flex:none; width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
.search-sources[open] > summary { color:var(--color-text-secondary); }
@media (hover:hover) { .search-sources > summary:hover { color:var(--color-text-secondary); } }
.search-sources > summary:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; border-radius:6px; }
.search-sources > nav { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.message-bubble a.source-chip { text-decoration:none; overflow-wrap:normal; }
.message-bubble a.source-chip:hover { color:var(--color-text); background:var(--surface-hover); }

.message-bubble .source-chip { display:inline-flex; align-items:center; gap:6px; max-width:100%; min-height:32px; padding:0 12px 0 10px; border:1px solid var(--line); border-radius:var(--radius-pill); color:var(--color-text-secondary); font-size:var(--text-caption); text-decoration:none; position:relative; }
.source-chip::after { content:""; position:absolute; inset:-6px -3px; }
.source-chip svg { flex:none; width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
.source-chip span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.message-row.failed .message-privacy { color: var(--red); display:flex; align-items:center; gap:6px; margin-top:var(--space-2); font-size:14px; line-height:23px; }
.message-row.failed .message-privacy svg { flex:none; width:16px; height:16px; }
.message-row.failed .message-actions { opacity: 1; margin-top:10px; }
.message-row.failed .message-actions button { min-height:44px; padding:0 14px; border:1px solid var(--line-strong); border-radius:var(--radius-control); color:var(--color-text); font-size:14px; }
.message-row.failed .message-actions button:hover { background:var(--surface-hover); }

@media (pointer:fine) {
  .message-actions.response-footer button[data-continue-message] { height:36px; min-height:36px; }
}

.message-bubble > .pending-status { margin-top:10px; color:var(--color-text-secondary); font-size:14px; }

.compact-viewport .edit-model-notice { margin-bottom:var(--space-1); }
.compact-viewport .messages { padding-top:var(--space-1); padding-bottom:var(--space-1); }


.composer-controls .model-pill { margin-right:0; }
#thinking-control, #media-settings { margin-left:var(--space-1); }
#thinking-control:hover:not(:disabled), #media-settings:hover { background-color:color-mix(in srgb, var(--color-text) 12%, transparent); }
#media-settings .media-settings-icon { display:inline-grid; place-items:center; flex:none; }


@media(max-width:640px) {
  .composer-controls .model-pill > .model-pill-name { flex:0 1 auto; }
  .composer-controls .model-pill > svg { margin-left:0; }
}

.composer textarea:placeholder-shown { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.limit-caption { font-size:14px; font-weight:500; }
.media-settings-copy { display:inline-flex; align-items:center; gap:6px; }

@media(min-width:641px) {
  #thinking-control { flex:0 0 auto; width:max-content; max-width:none; }
  #thinking-control span { overflow:visible; text-overflow:clip; }
}
@media(max-width:640px) {
  
  #thinking-control { justify-content:center; }
  .media-settings-copy { line-height:17px; }
  #media-settings { font-size:14px; }
}


.message-actions.response-footer button[data-speak-message] {
  min-height: var(--control-size);
  padding-inline: var(--space-2);
  white-space: nowrap;
}


.media-voice-search { display:flex; gap:var(--space-2); margin-bottom:var(--space-3); }
.voice-search-field { display:flex; flex:1; min-width:0; align-items:center; border:1px solid var(--line); border-radius:var(--radius-control); background:var(--bg); }
.voice-search-field:focus-within { border-color:var(--color-focus-border); }
.media-voice-search input { flex:1; min-width:0; min-height:44px; font:inherit; color:var(--text); background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-control); padding:var(--space-2); }
.voice-search-field input { width:100%; border:0; background:transparent; }
.voice-search-field input:focus-visible { outline:none; box-shadow:none; }
.media-voice-search .search-clear { margin:0; }
.media-voice-search button { min-height:44px; margin:0; }
.media-voice-choices { max-height:38dvh; overflow-y:auto; overscroll-behavior:contain; }
.media-voice-choices button { flex:1 1 100%; margin:0; text-align:start; }
.media-voice-dismiss { min-height:44px; }
.media-speech-text { display:block; width:100%; box-sizing:border-box; min-height:140px; max-height:35dvh; resize:vertical; font:inherit; line-height:1.5; color:var(--text); background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-control); padding:var(--space-3); margin-bottom:var(--space-3); }
.media-character-name { min-height:44px; height:44px; }
.media-character-photos { display:block; width:100%; min-height:44px; margin-block:var(--space-2); font:inherit; }
.media-character-photos::file-selector-button { min-height:44px; padding:var(--space-2) var(--space-3); margin-inline-end:var(--space-2); color:var(--text); background:var(--bg); border:1px solid var(--line); border-radius:var(--radius-control); font:inherit; }


@container (max-width: 280px) {
  .settings-heading, .settings-heading.has-back {
    padding: calc(var(--navigation-size) + var(--space-8)) var(--space-4) var(--space-4);
  }
  .settings-heading h1 { overflow-wrap: anywhere; }
}


.conversation-header {
  grid-template-columns: minmax(0, 1fr) auto var(--navigation-size) var(--navigation-size);
}
.conversation-header > .conversation-title { grid-column: 1; grid-row: 1; padding-left:var(--space-4); min-width: 0; text-align: left; }
.conversation-header > .limit-row { grid-column: 2; grid-row: 1; }
.conversation-header > .more-button { grid-column: 3; grid-row: 1; }
.conversation-header > .header-new-chat { grid-column: 4; grid-row: 1; }
.composer .composer-controls { display: flex; align-items: center; flex-wrap: nowrap; min-width: 0; }

@media (max-width: 899px) {
  .conversation-header {
    grid-template-columns: var(--navigation-size) minmax(0, 1fr) auto var(--navigation-size) var(--navigation-size);
  }
  .conversation-header > .conversation-title { display: block; grid-column: 2; padding-left: var(--space-1); }
  .conversation-header > .limit-row { grid-column: 3; justify-self:center; }
  .conversation-header .limit-caption { display:none; }
  
  .conversation-header .limit-line { width:auto; min-width:var(--navigation-size); max-width:none; padding:0 var(--space-1); justify-content:center; }
  .conversation-header .credit-ring-count { flex:none; white-space:nowrap; line-height:17px; font-size:14px; }
  .message-actions.response-footer button { min-width:44px; min-height:44px; width:44px; }
  .conversation-header > .more-button { grid-column: 4; }
  .conversation-header > .header-new-chat { grid-column: 5; }
}

@media (max-width: 640px) {
  .composer .composer-controls { gap: var(--space-1); }
  
  #thinking-control { width:max-content; max-width:none; overflow:visible; }
  #thinking-control .reply-effort { min-width:0; overflow:visible; text-overflow:clip; white-space:nowrap; }
  
  #media-settings { flex:0 0 auto; max-width:none; }
}

@media (max-width:640px) {
  
  .composer .composer-controls { display:grid; grid-template-columns:44px minmax(0,1fr) max-content max-content; gap:0; }
  
  #thinking-control, #media-settings { grid-column:3; min-width:0; max-width:100%; margin-left:0; }
  
  #action-tools { grid-column:4; grid-row:1; width:44px; padding:0; justify-content:center; }
  #action-tools span { display:none; }
  #media-settings .media-settings-copy { min-width:0; line-height:17px; }
}

.media-choice-description { color:var(--text-soft); font-size:var(--fs-micro); line-height:1.5; }


@media (max-width:640px) {
  .conversation-header { grid-template-columns:var(--navigation-size) minmax(0,1fr) auto; }
  .conversation-header > .limit-row { grid-column:3; }
  .conversation-header > .header-new-chat, .conversation-header > .more-button { display:none; }
}


.settings-status{position:absolute;top:14px;bottom:auto;max-width:calc(100% - 32px)}
@media (max-width:899px) { .settings-status { top:auto; bottom:calc(env(safe-area-inset-bottom) + var(--space-4)); } }

.tariff-option summary{display:grid;align-items:center;cursor:pointer;list-style:none;grid-template-columns:minmax(0,1fr) auto 16px;gap:6px 12px;min-height:44px}
.tariff-option summary::-webkit-details-marker{display:none}.tariff-option summary::after{content:'';justify-self:end;width:16px;height:16px;background:currentColor;mask:var(--mask-chevron) center/contain no-repeat;-webkit-mask:var(--mask-chevron) center/contain no-repeat;color:var(--muted)}
.tariff-option[open] summary::after{transform:rotate(180deg)}.tariff-option-name{display:grid;gap:var(--space-1)}.tariff-option-name strong{font-size:var(--text-headline);font-weight:600}
.tariff-option summary>b{font-size:var(--fs-body);font-weight:500;font-variant-numeric:tabular-nums;text-align:right;max-width:210px}.tariff-credit-summary{grid-column:1/-1;font-size:var(--fs-small);color:var(--text-soft)}
@media(max-width:380px){.tariff-option summary::after{justify-self:end}}


html[data-telegram-safe="true"] .toast { top: calc(var(--app-top, 0px) + max(12px, var(--edge-top)) + 12px); }
html[data-telegram-safe="true"] .media-viewer-content,
html[data-telegram-safe="true"] .media-viewer-content img,
html[data-telegram-safe="true"] .media-viewer-content video { max-height: calc(var(--app-height, 100dvh) - var(--edge-top) - var(--edge-bottom) - 112px); }

@media (min-width: 900px) {
  html[data-telegram-safe="true"] .app-shell {
    position: relative; top: calc(var(--app-top, 0px) + var(--edge-top));
    left: calc((var(--edge-left) - var(--edge-right)) / 2);
    width: calc(100% - var(--edge-left) - var(--edge-right));
    height: calc(var(--app-height, 100dvh) - var(--edge-top) - var(--edge-bottom));
  }
}
@media (max-width: 899px) {
  html[data-telegram-safe="true"] { --content-height: calc(var(--app-height, 100dvh) - var(--edge-top) - var(--edge-bottom)); }
  html[data-telegram-safe="true"] .app-shell {
    top: calc(var(--app-top, 0px) + var(--edge-top)); left: var(--edge-left); right: var(--edge-right);
    width: auto; height: var(--content-height);
  }
  html[data-telegram-safe="true"] .conversation-header { padding: var(--space-1) 10px; }
  html[data-telegram-safe="true"] .composer-wrap { padding-bottom: 6px; }
  html[data-telegram-safe="true"] .sidebar {
    inset: calc(var(--app-top, 0px) + var(--edge-top)) auto auto var(--edge-left);
    width: min(320px, calc(100vw - var(--edge-left) - var(--edge-right) - 44px));
    height: var(--content-height); padding: 12px 10px 10px;
  }
  html[data-telegram-safe="true"] .drawer-close { top: 14px; }
  
  html[data-telegram-safe="true"] .settings-screen { padding: 0 var(--edge-right) 0 var(--edge-left); }
  html[data-telegram-safe="true"] .settings-shell { height: calc(var(--app-height, 100dvh) - var(--edge-top) - 8px); }
  html[data-telegram-safe="true"] .settings-home { padding-bottom: calc(22px + var(--edge-bottom)); }
  html[data-telegram-safe="true"] .settings-view { padding-bottom: calc(var(--space-6) + var(--edge-bottom)); }
  html[data-telegram-safe="true"] .delete-dialog { top: calc(var(--app-top, 0px) + var(--edge-top) + var(--content-height) / 2); }
  html[data-telegram-safe="true"] .selection-tools { bottom: calc(var(--below) + var(--edge-bottom) + 210px); }
}


.history-erase-counts { overflow:hidden; margin:var(--space-5) 0 0; border:1px solid var(--line); border-radius:var(--radius-control); background:var(--panel); }
.history-erase-counts div { display:flex; min-height:55px; align-items:center; justify-content:space-between; gap:var(--space-3); padding:var(--space-3) var(--space-4); border-bottom:1px solid var(--line); }
.history-erase-counts div:last-child { border-bottom:0; }
.history-erase-counts dt { min-width:0; color:var(--text-soft); font-size:var(--fs-body); }
.history-erase-counts dd { margin:0; color:var(--muted); font-size:var(--fs-body); font-weight:500; font-variant-numeric:tabular-nums; }
#history-erase-status { color:var(--text); }
.history-erase-actions { display:grid; gap:var(--space-3); margin-top:var(--space-6); }
.history-erase-actions button { display:flex; width:100%; min-height:48px; align-items:center; justify-content:center; padding:9px 14px; border:1px solid var(--line); border-radius:var(--radius-control); color:var(--text); background:var(--panel); font:inherit; font-weight:500; }
.history-erase-actions button:disabled { opacity:.55; cursor:wait; }
.history-erase-actions .history-erase-danger { color:var(--color-danger); }

.account-delete-entry { display:flex; width:100%; min-height:44px; align-items:center; justify-content:center; margin-top:var(--space-3); border:0; background:transparent; color:var(--color-danger); border-radius:var(--radius-control); font:inherit; font-size:15px; cursor:pointer; }
.account-delete-entry[hidden] { display:none; }
@media (hover:hover) { .account-delete-entry:hover { background:var(--color-hover); } }
.account-delete-field { display:grid; gap:var(--space-2); margin:var(--space-3) 0 0; font-size:15px; line-height:22px; color:var(--color-text-secondary); }
.account-delete-field input { min-height:44px; padding:0 12px; border:1px solid var(--color-border-strong); border-radius:var(--radius-control); background:var(--color-bg); color:var(--color-text); font:inherit; font-size:16px; letter-spacing:.04em; }
.account-delete-field input:focus-visible { outline:2px solid var(--color-focus-border, var(--color-accent)); outline-offset:1px; }
#account-delete-confirm:disabled { opacity:.45; cursor:default; }
.payments-list { display:grid; }
.payments-list .payment-row { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:2px 16px; padding:12px 16px; }
.payments-list .payment-row + .payment-row { border-top:1px solid var(--color-border); }
.payments-list .payment-row strong { font-weight:500; }
.payments-list .payment-row b { font-weight:500; font-variant-numeric:tabular-nums; text-align:right; }
.payments-list .payment-row small { grid-column:1 / -1; color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption, 18px); }
.payments-list .payment-row[data-status="failed"] small { color:var(--color-danger); }
#history-erase-confirm { color:var(--color-on-danger); background:var(--color-danger-fill); border-color:transparent; }
#history-erase-entry[hidden], .history-erase-counts[hidden], .history-erase-actions button[hidden] { display:none; }


.temporary-chat-toggle { display:flex; grid-column:2; grid-row:1; justify-self:end; align-items:center; gap:7px; min-width:44px; min-height:44px; padding:0 12px 0 10px; border:0; border-radius:var(--radius-pill); color:var(--color-text-secondary); background:transparent; font:inherit; font-size:14px; font-weight:500; white-space:nowrap; }
.temporary-chat-toggle svg { flex:none; width:20px; height:20px; }
.temporary-chat-toggle[aria-checked="true"] { color:var(--color-text); background:var(--color-active); }
.conversation-header:has(> .temporary-chat-toggle:not([hidden])) > .conversation-title { display:none; }
.temporary-chat-notice { display:grid; grid-template-columns:20px minmax(0,1fr) auto; align-items:center; column-gap:10px; flex:none; padding:6px 20px 6px 22px; border-bottom:1px solid var(--line); background:var(--workspace); }
.temporary-chat-mark { grid-column:1; grid-row:1; width:20px; height:20px; color:var(--color-text); }
#temporary-chat-title { grid-column:2; grid-row:1; min-width:0; color:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-semibold); line-height:var(--leading-label); }
.temporary-chat-warning { grid-column:2; grid-row:2; min-width:0; margin:0; color:var(--color-text-secondary); }
.temporary-chat-actions { display:flex; grid-column:3; grid-row:1 / span 2; align-items:center; gap:var(--space-half); }
.temporary-chat-info { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; color:var(--color-text-secondary); background:transparent; }
.temporary-chat-info svg { width:20px; height:20px; }
.temporary-chat-info[aria-expanded="true"] { color:var(--color-text); background:var(--color-active); }
.temporary-chat-leave { border:0; border-radius:var(--radius-pill); color:var(--color-text); background:var(--panel); font:inherit; font-weight:500; white-space:nowrap; position:relative; min-height:var(--control-compact); padding:0 var(--space-4); font-size:var(--text-label); }
.temporary-chat-about { grid-column:2 / -1; grid-row:3; padding:4px 0 6px; color:var(--color-text-secondary); }
.temporary-chat-about p { max-width:70ch; margin:0; }
.temporary-chat-about p + p { margin-top:var(--space-1); }
@media (hover:hover) {
  .temporary-chat-toggle:hover, .temporary-chat-info:hover { color:var(--color-text); background:var(--color-hover); }
  .temporary-chat-toggle[aria-checked="true"]:hover, .temporary-chat-info[aria-expanded="true"]:hover, .temporary-chat-leave:hover { background:var(--color-active); }
}
.temporary-chat-toggle[hidden], .temporary-chat-notice[hidden] { display:none; }
.temporary-chat-dialog { max-height:calc(var(--app-height, 100dvh) - 32px); overflow-y:auto; }
.temporary-chat-dialog > div { flex-wrap:wrap; }
.temporary-chat-dialog > div > button { flex:1 1 140px; padding-block:var(--space-2); line-height:1.4; }
@media (max-width:899px) {
  .conversation-header:has(> .temporary-chat-toggle:not([hidden])) { grid-template-columns:var(--navigation-size) minmax(0,1fr) auto 44px; }
  .conversation-header:has(> .temporary-chat-toggle:not([hidden])) > .limit-row { grid-column:3; }
  .conversation-header:has(> .temporary-chat-toggle:not([hidden])) > .more-button,
  .conversation-header:has(> .temporary-chat-toggle:not([hidden])) > .header-new-chat { display:none; }
  .conversation-header > .temporary-chat-toggle { grid-column:4; width:44px; padding:0; justify-content:center; border-radius:50%; }
  .temporary-chat-toggle > span { display:none; }
  
  .temporary-chat-notice { padding:4px 12px 6px 24px; }
}
@media (max-width:640px) {
  
  .temporary-chat-notice { padding:0 12px 8px 18px; }
  .temporary-chat-actions { grid-row:1; }
  .temporary-chat-warning { grid-column:2 / -1; }
}


.model-tier { flex-shrink:0; }
.catalog-model h3 .model-tier { margin-left:var(--space-2); }


.sidebar-primary-nav button.active > svg,
.settings-group > button.active > svg,
.composer-actions button[aria-pressed="true"] > svg,
.composer-quick-actions button[aria-pressed="true"] > svg,
.tool-tabs button[aria-pressed="true"] > svg {
  color: var(--color-accent-text);
  --icon-fill-opacity: .32;
}


.limit-line.has-credits .limit-caption { display:none; }
.conversation-header .limit-line .credit-ring-count:not([hidden]) { min-width:0; height:auto; padding:0; border-radius:0; background:none; white-space:nowrap; font-size:inherit; font-weight:var(--weight-semibold); line-height:inherit;
}
.conversation-header .limit-line .credit-ring-count:not([hidden])::before { width:16px; height:16px; flex:none; background:var(--color-accent-text);
  -webkit-mask:var(--icon-coin-mask) center / contain no-repeat; mask:var(--icon-coin-mask) center / contain no-repeat; content:none;
}
.conversation-header .limit-line.is-empty .credit-ring-count::before { background:currentColor; }

@media (min-width:900px) {
  .conversation-title { text-align:left; }
  .conversation-title h2 { font-size:14px; font-weight:500; color:var(--color-text-secondary); }
}


@media (max-width:899px) {
  .settings-group { overflow: visible; border: 0; border-radius: 0; background: transparent; }
  .settings-group > button { border: 1px solid var(--line); border-top-width: 0; background:var(--settings-card); }
  .settings-group > button:first-child { border-top-width: 1px; }
}

@media (min-width:900px) {
  .settings-home { gap: 0; padding-top: var(--space-1); }
  .settings-group > button { margin-bottom: var(--space-half); }
  .settings-group + .settings-group { margin-top: 10px; padding-top: var(--space-3); border-top: 1px solid var(--line); }
}




.composer { border-radius:var(--radius-composer); padding:var(--space-2) var(--space-2) var(--space-2) var(--space-3); --attach-tile:64px; }
@media (max-width:640px) {
  .composer { border-radius:var(--radius-composer); padding:6px 8px 8px 10px; --attach-tile:56px; }
}


.model-sheet .model-option { border-bottom:0; box-shadow:none; }

.model-sheet .model-group { margin:var(--space-4) var(--space-3) var(--space-1); color:var(--color-text-tertiary); font-size:var(--fs-micro); font-weight:500; letter-spacing:.01em; }
.model-sheet .model-group:first-child { margin-top:0; }

.model-sheet .model-select { align-items:center; }
.model-sheet .model-select .model-copy { display:flex; flex-direction:column; justify-content:center; gap:var(--space-half); }
.model-sheet .model-warning { font-size:var(--text-secondary); line-height:1.35; color:var(--color-text-tertiary); }

.model-sheet .model-cost { flex:none; margin-left:auto; color:var(--color-text-tertiary); font-size:var(--text-secondary); font-variant-numeric:tabular-nums; }
.model-sheet .model-option.is-selected .model-cost { color:var(--color-text-secondary); }

.model-sheet .model-option.is-down:hover { background:transparent; }

.model-sheet .model-down-line { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-half); min-width:0; margin-top:5px; }
.model-sheet .model-down-line .model-warning { margin:0; }
.model-sheet .model-similar { position:relative; display:inline; min-height:0; padding:0; border:0; border-radius:0; background:none; color:var(--color-text-secondary); font:inherit; font-size:var(--text-secondary); line-height:1.35; text-align:left; text-decoration:underline; text-decoration-color:color-mix(in srgb, currentColor 40%, transparent); text-underline-offset:3px; cursor:pointer; }
.model-sheet .model-similar::after { content:""; position:absolute; inset:-10px -4px; }
.model-sheet .model-similar:hover { color:var(--color-text); }
.model-sheet .model-similar:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; border-radius:2px; }
.model-sheet .model-cost-hint { margin:0 var(--space-3) var(--space-2); color:var(--color-text-tertiary); font-size:var(--text-secondary); line-height:1.4; }
.model-sheet .model-brand { margin:0; }
.model-sheet .model-selection { position:absolute; top:50%; transform:translateY(-50%); }


.sidebar-chat-list .chat-list-row { position:relative; --more-gap:0px; }
.sidebar-chat-list .chat-list-row .chat-item { width:100%; min-height:var(--row-height); padding:var(--space-2) var(--space-3); }

.sidebar-chat-list .chat-item strong { font-weight: 400; flex:1 1 auto; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; padding-right:max(var(--more-gap), var(--more-min, 0px)); }
.sidebar-chat-list .row-more { position:absolute; z-index:1; color:var(--color-text-tertiary); }

.sidebar-chat-list .chat-list-row:is(:hover, :focus-within, :has(> .chat-item.active), :has(> .row-more[aria-expanded="true"])) { --more-gap:calc(var(--control-min) + 2 * var(--space-1)); }
.sidebar-chat-list .chat-list-row:is(:has(> .chat-item.active), :has(> .row-more[aria-expanded="true"])) > .row-more { opacity:1; pointer-events:auto; }



.usage-row b { font-size:15px; font-weight:500; color:var(--color-text-secondary); font-variant-numeric:tabular-nums; }
.usage-row .usage-track { height:6px; background:var(--color-active); }
.usage-sheet .credit-wallet { margin-top:6px; padding-top:18px; border-top:1px solid var(--color-border); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0; }
.usage-sheet .credit-wallet h3 { margin:0; }
.usage-sheet .credit-total { margin:0; color:var(--color-text-secondary); font-size:14px; line-height:1.45; }
.usage-sheet .credit-total b { margin-bottom:var(--space-half); font-variant-numeric:tabular-nums; }
.usage-sheet .credit-wallet .credit-expiry { margin:0; font-size:14px; color:var(--color-text-tertiary); }
.usage-sheet .credit-wallet details { margin-top:var(--space-1); }
.usage-sheet .credit-wallet summary { display:flex; align-items:center; justify-content:space-between; list-style:none; cursor:pointer; color:var(--color-text); }
.usage-sheet .credit-wallet summary::-webkit-details-marker { display:none; }
.usage-sheet .credit-wallet summary::after { content:""; width:8px; height:8px; margin-right:var(--space-1); border-right:1.6px solid var(--color-text-tertiary); border-bottom:1.6px solid var(--color-text-tertiary); transform:rotate(45deg) translateY(-2px); transition:transform var(--motion-hover) ease; }
.usage-sheet .credit-wallet details[open] > summary::after { transform:rotate(-135deg) translateY(-2px); }
.usage-sheet .credit-wallet [data-open-plans] { margin-top:6px; }
.usage-sheet .usage-model-limits { margin-top:var(--space-2); padding-top:18px; border-top:1px solid var(--color-border); }
.usage-sheet .usage-model-limits h3 { margin-top:0; }
.usage-sheet .usage-model-limits dl { font-size:15px; }
.usage-sheet .usage-model-limits dl > div { padding:11px 0; }
.usage-sheet .usage-how { margin-top:6px; font-size:var(--text-secondary); line-height:1.5; color:var(--color-text-tertiary); }


.media-placeholder .media-wait-note { max-width:300px; margin:0; color:var(--color-text-tertiary); font-size:var(--text-secondary); line-height:1.5; }


@media (min-width:1280px) {
  .message-bubble { font-size:var(--text-message); line-height:var(--leading-message); }
  .composer textarea { font-size:var(--text-input); }
  .sidebar-primary-nav button, .new-chat-button, .settings-shortcut { font-size:var(--text-body); min-height:var(--row-height); }
  .sidebar-chat-list .chat-item { min-height:var(--row-height); padding:9px 12px; }
}


.row-menu button[hidden] { display:none; }

.context-dialog > .context-modes { display:grid; grid-template-columns:minmax(0,1fr); justify-content:stretch; gap:var(--space-1); margin-top:6px; }
.context-dialog .context-mode { min-height:56px; padding:10px 12px 10px 38px; border-radius:var(--radius-control); background:transparent; }
.context-dialog .context-mode:hover { background:var(--color-hover); }
.context-dialog .context-mode.active::before { box-shadow:none; border-color:var(--color-accent); background:radial-gradient(circle, var(--color-accent) 0 3.5px, transparent 4px); }
.context-dialog .context-mode::before { left:13px; top:15px; width:14px; height:14px; box-sizing:border-box; border-width:1.5px; }
.context-dialog .context-mode small { margin-top:3px; }
.context-dialog > p { margin:var(--space-3) var(--space-half) 0; }
.context-dialog > div { margin-top:var(--space-4); }


.usage-sheet .usage-model-details { margin-top:var(--space-2); border-top:1px solid var(--color-border); }
.usage-sheet .usage-model-details > summary { display:flex; align-items:center; gap:var(--space-3); list-style:none; cursor:pointer; color:var(--color-text); }
.usage-sheet .usage-model-details > summary::-webkit-details-marker { display:none; }
.usage-sheet .usage-model-details > summary > span { flex:none; }
.usage-sheet .usage-model-details > summary > small { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:right; font-size:14px; color:var(--color-text-tertiary); }
.usage-sheet .usage-model-details > summary::after { content:""; flex:none; width:8px; height:8px; margin-right:var(--space-1); border-right:1.6px solid var(--color-text-tertiary); border-bottom:1.6px solid var(--color-text-tertiary); transform:rotate(45deg) translateY(-2px); transition:transform var(--motion-hover) ease; }
.usage-sheet .usage-model-details[open] > summary::after { transform:rotate(-135deg) translateY(-2px); }
.usage-sheet .usage-model-details .usage-model-limits { margin-top:0; padding-top:0; border-top:0; }
.usage-sheet .usage-model-details .usage-model-limits dl > div:first-child { border-top:0; }


@media (min-width:900px) {
  .conversation-header { grid-template-columns:minmax(0, 1fr) auto var(--navigation-size); }
  
  .conversation-header:has(> .more-button[hidden]) { grid-template-columns:minmax(0, 1fr) auto; }
}

[data-settings-view="usage"] .plan-stats:not(:empty):has(+ .entitlement-warning[hidden] + .profile-periods:not(:empty)) { border-bottom:0; border-bottom-left-radius:0; border-bottom-right-radius:0; }
[data-settings-view="usage"] .plan-stats:not(:empty) + .entitlement-warning[hidden] + .profile-periods:not(:empty) { margin-top:0; border-top-left-radius:0; border-top-right-radius:0; }




.company-disclosure .model-brand { background:transparent; }


.settings-toggle-card.is-palette { margin-top:var(--space-3); }


.media-parameters .media-panel-link[data-media-quote-retry] { flex:none; justify-self:start; min-height:36px; border:1px solid var(--color-border-strong); border-radius:var(--radius-control); font-weight:500; white-space:nowrap; border-color:transparent; background:var(--color-action); color:var(--color-on-action); }
.media-parameters .media-panel-link[data-media-quote-retry]:hover { background:var(--color-hover); }




.switch i { background:color-mix(in srgb, var(--color-text) 16%, transparent); }
.switch input:checked + i { background:var(--color-accent); }


@media (max-width:899px) {
  .settings-shell { --settings-card:var(--color-elevated); }
}
.settings-shell .settings-detail-card,
.settings-shell .plan-stats,
.settings-shell .profile-periods > div:not(.period-total),
.settings-shell .tariff-option,
.settings-shell .theme-option,
.settings-shell .language-option,
.settings-shell .web-logout,
.settings-shell .history-erase-counts,
.settings-shell .history-erase-actions button { background:var(--settings-card); }
.settings-shell .theme-option:hover,
.settings-shell .language-option:hover { background:var(--color-hover); }
@media (hover:hover) {
  .settings-shell .web-logout:hover,
  .settings-shell .history-erase-actions button:not(:disabled):hover { background:var(--color-hover); }
}


.settings-shell .theme-option[aria-checked="true"],
.settings-shell .language-option[aria-checked="true"] { border-color:var(--color-accent); box-shadow:inset 0 0 0 1px var(--color-accent); background:var(--settings-card); }


.settings-shell .tariff-option { padding:14px 16px; }
.tariff-option summary::after { grid-column:3; grid-row:1; align-self:center; }
.tariff-option .tariff-credit-summary { grid-column:1 / 3; }
.tariff-option .tariff-option-name { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-1) var(--space-2); }
.tariff-option .tariff-current { display:inline-flex; align-items:center; height:24px; margin:0; padding:0 9px; border-radius:var(--radius-pill); background:var(--green-wash); color:var(--color-accent-text); font-size:var(--text-caption); font-weight:600; line-height:1; }
.settings-shell .tariff-option.is-current { border-color:var(--color-border); background:var(--color-hover); }
@media (max-width:380px) {
  .tariff-option summary { grid-template-columns:minmax(0,1fr) auto 16px; }
  .tariff-option summary > b { text-align:right; }
  .tariff-option summary::after { grid-column:3; grid-row:1; }
  .tariff-credit-summary { padding-right:0; }
}


[data-settings-view="usage"] .plan-stats:not(:empty) { margin-top:0; }


.status-dot.is-off { background:var(--color-text-tertiary); }



@media (hover:hover) and (pointer:fine) {
  .message-row.user { margin-bottom:var(--space-4); }
  .message-row.user > .user-actions { margin-top:var(--space-half); }
  .message-row.user > .user-actions button { width:32px; height:32px; min-width:32px; min-height:32px; }
}


.catalog-screen { padding-bottom:0; }
.catalog-screen .catalog-list, .catalog-screen .models-catalog { padding-bottom:calc(var(--space-8) + var(--edge-bottom)); }


.company-count b { color:var(--color-text-tertiary); font-weight:500; }

@media (min-width:1100px) {
  .models-catalog .catalog-company:not([open]) > summary { box-sizing:border-box; min-height:100%; }
}


.settings-shortcut .account-avatar[hidden], .settings-shortcut .account-copy[hidden], .settings-shortcut .settings-label[hidden], .account-copy small[hidden] { display:none; }
.settings-shortcut.has-account { min-height:52px; }
.settings-shortcut.has-account .settings-label { display:none; }
.settings-shortcut.has-account > svg { order:3; flex:none; margin-left:auto; color:var(--color-text-tertiary); }
.settings-shortcut .account-avatar { display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:50%; background:var(--color-accent); color:var(--color-on-accent); font-size:14px; font-weight:600; line-height:1; }
.settings-shortcut .account-copy { display:grid; flex:1 1 auto; min-width:0; gap:1px; text-align:left; line-height:1.25; }
.settings-shortcut .account-copy b { overflow:hidden; color:var(--color-text); font-size:var(--text-nav); font-weight:500; text-overflow:ellipsis; white-space:nowrap; }
.settings-shortcut .account-copy small { font-size:var(--text-caption); }


.catalog-list .chat-list-row:hover, .catalog-list .chat-list-row:focus-within { background:var(--color-hover); }
.catalog-list .chat-list-row .chat-item:hover, .catalog-list .chat-list-row .chat-item.active { background:transparent; }
.catalog-list .chat-item { min-height:0; }


.settings-view-title .avatar { border-radius:50%; background:var(--color-accent); color:var(--color-on-accent); }


:is(.delete-dialog, .edit-message-dialog) { padding:var(--space-6); border:1px solid var(--line); border-radius:var(--radius-panel); color:var(--text); background:var(--color-elevated); box-shadow:var(--shadow); }
.context-dialog { width:min(460px, calc(100vw - 32px)); }
:is(.delete-dialog, .edit-message-dialog) h2, .context-dialog h2 { margin:0 0 var(--space-2); font-size:var(--text-headline); line-height:var(--leading-headline); font-weight:600; }
:is(.delete-dialog, .edit-message-dialog) p { margin:0; color:var(--muted); }
:is(.delete-dialog, .edit-message-dialog) p + p { margin-top:var(--space-2); }
.delete-dialog #delete-chat-name { color:var(--text); font-weight:600; }
.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions { display:flex; flex-wrap:nowrap; justify-content:flex-end; gap:var(--space-2); margin-top:var(--space-5); }
:is(.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions) > button { flex:none; min-width:0; white-space:nowrap; }
.edit-message-dialog .dialog-actions > button { color:var(--text); background:var(--surface-hover); }
.edit-message-dialog #save-message-branch:hover { background:var(--green-strong); }
.edit-message-dialog #edit-message-error:empty { display:none; }
#rename-form > input { margin-top:var(--space-1); }
:is(#rename-input, #edit-message-input, #chat-batch-project) { border:1px solid var(--line-strong); background:var(--input); }
#edit-message-input { margin-top:var(--space-4); }
:is(#rename-input, #edit-message-input, #chat-batch-project):focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; border-color:var(--line-strong); box-shadow:none; }
.context-dialog > div:last-child { margin-top:var(--space-4); }

@media (hover:none) { .context-dialog .context-mode:hover:not(.active) { background:transparent; } }
@media (max-width:899px) {
  :is(.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions) > button { flex:1 1 0; }
}


.media-viewer { inset:0; width:100vw; max-width:none; height:var(--app-height, 100dvh); max-height:none; margin:0; padding:0; border:0; border-radius:0; color:var(--color-on-viewer); background:transparent; overflow:hidden; }
.media-viewer[open] { display:flex; flex-direction:column; }
.media-viewer::backdrop { background:var(--color-viewer); }
.media-viewer-toolbar { position:static; display:flex; justify-content:space-between; gap:var(--space-3); padding:max(12px, env(safe-area-inset-top)) 16px 12px; background:transparent; }
.media-viewer-toolbar button { display:grid; place-items:center; flex:none; width:44px; height:44px; min-height:44px; padding:0; border:0; border-radius:50%; color:var(--color-on-viewer); background:var(--color-viewer-control); }
@media (hover:hover) { .media-viewer-toolbar button:hover { background:var(--color-viewer-control-hover); } }
.media-viewer-toolbar button svg { width:20px; height:20px; }

.media-viewer-content { text-align: center; touch-action: pan-x pan-y pinch-zoom; display:grid; grid-template:minmax(0, 1fr) / minmax(0, 1fr); flex:1; min-height:0; max-height:none; place-items:center; padding:0 16px max(16px, env(safe-area-inset-bottom)); overflow:auto; }
.media-viewer-content img, .media-viewer-content video { max-width:100%; max-height:100%; border-radius:var(--radius-control); object-fit:contain; }
html[data-telegram-safe="true"] .media-viewer { inset:0; margin:0; width:100vw; max-width:none; height:var(--app-height, 100dvh); max-height:none; }
html[data-telegram-safe="true"] .media-viewer-toolbar { padding:calc(var(--app-top, 0px) + var(--edge-top) + 12px) calc(var(--edge-right) + 16px) 12px calc(var(--edge-left) + 16px); }
html[data-telegram-safe="true"] .media-viewer-content { max-height:none; padding:0 calc(var(--edge-right) + 16px) calc(var(--edge-bottom) + 16px) calc(var(--edge-left) + 16px); }
html[data-telegram-safe="true"] .media-viewer-content img,
html[data-telegram-safe="true"] .media-viewer-content video { max-height:100%; }


@keyframes dialog-in { from { opacity:0; translate:0 6px; scale:.985; } }
:is(.delete-dialog, .edit-message-dialog)[open] { animation:dialog-in var(--motion-modal) var(--ease-ui) both; }
:is(.delete-dialog, .edit-message-dialog, .media-viewer)[open]::backdrop, .media-viewer[open] { animation:fade-in var(--motion-modal) ease-out both; }

.media-viewer.is-closing, .media-viewer.is-closing::backdrop { animation:fade-out 160ms ease-in both; }
@keyframes fade-out { to { opacity:0; } }
@media (prefers-reduced-motion:reduce) {
  :is(.delete-dialog, .edit-message-dialog, .media-viewer)[open], :is(.delete-dialog, .edit-message-dialog, .media-viewer)[open]::backdrop { animation:none; }
}


.message-bubble hr { height:0; margin:var(--space-6) 0; border:0; border-top:1px solid var(--line); }
.message-bubble li > :is(ul, ol) { margin:var(--space-1) 0; }
.message-bubble li > p { margin:var(--space-2) 0 0; }
.message-bubble li > .code-block { margin:10px 0; }
.message-bubble del { color:var(--muted); }
:is(.math-inline, .math-expression) { font-family:inherit; font-variant-numeric:lining-nums; }
.math-inline { color:var(--text); font-size:1.08em; white-space:normal; }
.math-expression { margin:var(--space-4) 0; padding:var(--space-1) 0; border:0; border-radius:0; color:var(--text); background:transparent; text-align:center; font-size:1.18em; line-height:1.7; }

.math-expression .frac { display:inline-flex; flex-direction:column; margin:0 .12em; vertical-align:middle; text-align:center; line-height:1.3; }
.math-expression .frac > span { padding:.06em .18em; }
.math-expression .frac > span + span { border-top:1px solid currentColor; }
.math-expression .frac.binom > span + span { border-top-color:transparent; }
:is(.math-inline, .math-expression) :is(.mathfence, .radical) { position:relative; display:inline-block; line-height:1.3; }
:is(.math-inline, .math-expression) :is(.mathfence, .radical) > svg { position:absolute; top:.06em; left:0; width:.42em; height:calc(100% - .12em); overflow:visible; fill:none; stroke:currentColor; stroke-width:1.25; }
:is(.math-inline, .math-expression) .mathfence { padding:0 .52em; }
:is(.math-inline, .math-expression) .mathfence.noleft { padding-left:.1em; }
:is(.math-inline, .math-expression) .mathfence.noright { padding-right:.1em; }
:is(.math-inline, .math-expression) .mathfence > svg.right { left:auto; right:0; transform:scaleX(-1); }
.math-expression .radical { padding-left:.6em; }
.math-expression .radical > svg { top:0; width:.6em; height:100%; }
.math-expression .radical > span { display:inline-block; padding:.08em .1em 0 .04em; border-top:1.25px solid currentColor; }
:is(.math-inline, .math-expression) .mathgrid { display:inline-grid; justify-items:center; align-items:baseline; gap:.1em 1em; vertical-align:middle; line-height:1.45; }
:is(.math-inline, .math-expression) .mathgrid.cases { justify-items:start; column-gap:1.4em; }
:is(.math-inline, .math-expression) .mathgrid.align { column-gap:.28em; }
.mathgrid > .r { justify-self:end; }
.mathgrid > .l { justify-self:start; }
:is(.math-inline, .math-expression) .scripts { display:inline-flex; flex-direction:column; margin-left:.04em; vertical-align:middle; line-height:1; }
:is(.math-inline, .math-expression) .scripts > :is(sup, sub) { line-height:1.08; vertical-align:baseline; }
.math-expression .bigop { font-size:1.4em; line-height:1; vertical-align:-.16em; }

.code-toolbar button { display:inline-flex; align-items:center; }
.code-toolbar button svg { flex:none; width:16px; height:16px; stroke-width:var(--icon-stroke-small); }


.request-error, .quota-lock, .limit-notice, .media-quote-status, .composer-context, .edit-model-notice { box-sizing:border-box; width:100%; max-width:760px; margin:0 auto var(--space-2); border:1px solid var(--color-border); background:var(--color-surface); color:var(--color-text); overflow-wrap:anywhere; }



:is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions) button { display:inline-flex; flex:none; align-items:center; justify-content:center; gap:var(--space-2); min-width:0; min-height:40px; margin:0; padding:0 var(--space-4); border:1px solid var(--color-border-strong); border-radius:var(--radius-control); background:transparent; color:var(--color-text); font:inherit; font-size:15px; font-weight:500; line-height:20px; white-space:nowrap; cursor:pointer; transition:background var(--motion-hover) ease; }
:is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions) button:hover:not(:disabled) { background:var(--color-hover); }
:is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions) button:disabled { opacity:.45; cursor:default; }
:is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions) button:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }

:is(#retry-request, #send-without-search, #request-upgrade, #request-guest-login, #quota-lock-billing, #limit-upgrade, #retry-media-quote, .edit-model-primary) { border-color:transparent; background:var(--color-action); color:var(--color-on-action); opacity:1; }
:is(#retry-request, #send-without-search, #request-upgrade, #request-guest-login, #quota-lock-billing, #limit-upgrade, #retry-media-quote, .edit-model-primary):hover:not(:disabled) { background:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
@media (pointer:coarse) { :is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions) button { min-height:44px; } }
@media (hover:hover) and (pointer:fine) { :is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions) button { min-height:36px; padding:0 14px; font-size:14px; } }


.request-error { position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2); }
.request-error::before, .media-quote-status::before { flex:none; width:20px; height:20px; background:var(--color-danger); -webkit-mask:var(--mask-alert) center / contain no-repeat; mask:var(--mask-alert) center / contain no-repeat; content:none; }
.request-error::before { position:absolute; top:12px; left:16px; }
.request-error > details { margin-left:auto; color:var(--color-text-secondary); font-size:14px; line-height:20px; }
.request-error > details > summary { display:flex; align-items:center; gap:var(--space-1); width:max-content; max-width:100%; min-height:40px; margin-left:auto; padding:0 var(--space-1); list-style:none; cursor:pointer; color:var(--color-text-secondary); font-size:var(--text-label); font-weight:var(--weight-regular); }
.request-error > details > summary::-webkit-details-marker { display:none; }
.request-error > details > summary:hover { color:var(--color-text); }
.request-error > details > summary::after { content:""; flex:none; width:14px; height:14px; background:currentColor; -webkit-mask:var(--mask-chevron) center / contain no-repeat; mask:var(--mask-chevron) center / contain no-repeat; transition:transform var(--motion-hover) ease; }
.request-error > details[open] > summary::after { transform:rotate(180deg); }
@media (pointer:coarse) { .request-error > details > summary { min-height:44px; } }

@media (max-width:640px) {
  .request-error > #request-error-message { padding-left:var(--space-8); }
}
@media (hover:hover) and (pointer:fine) { .request-error > details > summary { min-height:36px; } }


.media-quote-status { display:flex; align-items:center; gap:var(--space-3); }
.media-quote-status > span { flex:1 1 auto; min-width:0; }


.quota-lock { display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:center; column-gap:var(--space-4); }
.quota-lock > b { grid-column:1; font-weight:600; }
.quota-lock > span { grid-column:1; color:var(--color-text-secondary); }
.quota-lock > button { grid-column:2; grid-row:1 / span 2; }
@media (max-width:640px) {
  .quota-lock { grid-template-columns:minmax(0, 1fr); }
  .quota-lock > button { grid-column:1; grid-row:auto; justify-self:start; }
}


.limit-notice { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; color:var(--color-text-secondary); }
.limit-notice:is([data-kind="plan"], [data-kind="exhausted"]) { color:var(--color-text); }
#limit-notice-text { flex:1 1 260px; min-width:0; }
.limit-notice-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); }
.limit-notice-actions:empty { display:none; }


.composer-context { display:flex; align-items:flex-start; gap:var(--space-3); }
.composer-context > div { flex:1; min-width:0; }
.composer-context strong { display:block; font-size:15px; font-weight:500; line-height:22px; }
.composer-context p { margin:var(--space-half) 0 0; color:var(--color-text-secondary); font-size:15px; line-height:22px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; white-space:pre-wrap; }
.composer-context button { display:grid; flex:none; place-items:center; width:36px; height:36px; min-width:36px; min-height:36px; margin:-3px 0 0; padding:0; border:0; border-radius:50%; background:transparent; color:var(--color-text-secondary); cursor:pointer; }
.composer-context button:hover { background:var(--color-hover); color:var(--color-text); }
.composer-context button:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }
@media (pointer:coarse) { .composer-context button { width:44px; height:44px; min-width:44px; min-height:44px; margin:-7px -4px -7px 0; } }


.edit-model-notice { color:var(--color-text-secondary); }


.composer-model-notice > summary { display:flex; align-items:center; width:max-content; max-width:100%; min-height:40px; list-style:none; cursor:pointer; }
.composer-model-notice > summary::-webkit-details-marker { display:none; }
.composer-model-notice > summary:hover { color:var(--color-text); }
.composer-model-notice > summary::before { content:""; flex:none; background:currentColor; -webkit-mask:var(--mask-alert) center / contain no-repeat; mask:var(--mask-alert) center / contain no-repeat; width:var(--icon-toolbar); height:var(--icon-toolbar); }
.composer-model-notice[data-kind="unavailable"] > summary::before { background:var(--color-danger); }
.composer-model-notice > summary::after { content:""; flex:none; width:14px; height:14px; background:currentColor; -webkit-mask:var(--mask-chevron) center / contain no-repeat; mask:var(--mask-chevron) center / contain no-repeat; transition:transform var(--motion-hover) ease; }
.composer-model-notice[open] > summary::after { transform:rotate(180deg); }
.composer-model-notice > p { margin:0 0 var(--space-2); }
@media (pointer:coarse) { .composer-model-notice > summary { min-height:44px; } }
@media (prefers-reduced-motion:reduce) { .request-error > details > summary::after, .composer-model-notice > summary::after { transition:none; } }


.voice-recorder.is-busy .voice-confirm:disabled { opacity:1; cursor:progress; }
.voice-recorder.is-busy .voice-confirm svg { display:none; }
.voice-recorder.is-busy .voice-confirm::after { content:""; box-sizing:border-box; width:18px; height:18px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:media-wait .9s linear infinite; }
@media (prefers-reduced-motion:reduce) { .voice-recorder.is-busy .voice-confirm::after { animation-duration:2.4s; } }


.media-parameters .media-parameter-warning { position:relative; color:var(--color-text); }
.media-parameters .media-parameter-warning::before { content:""; position:absolute; background:var(--color-danger); -webkit-mask:var(--mask-alert) center / contain no-repeat; mask:var(--mask-alert) center / contain no-repeat; left:var(--space-2); top:var(--space-2); width:var(--icon-toolbar); height:var(--icon-toolbar); }
.media-parameters .media-panel-link[data-media-quote-retry]:hover:not(:disabled) { background:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
@media (pointer:coarse) { .media-parameters .media-panel-link[data-media-quote-retry] { min-height:44px; } }

.composer-wrap:has(> #media-parameters:not([hidden])) > .media-quote-status { visibility:hidden; }

.media-parameters .media-panel-link:is([data-open-usage],[data-buy-credits]) { display:inline-flex; align-items:center; gap:var(--space-half); color:var(--color-text-secondary); justify-self:start; min-height:44px; margin:var(--space-1) 0 0; padding:0 var(--space-2); border-radius:var(--radius-control); font-size:var(--text-label); font-weight:var(--weight-medium); }
.media-parameters .media-panel-link:is([data-open-usage],[data-buy-credits]):hover { color:var(--color-text); background:var(--color-hover); }

.media-parameters .media-panel-link[data-buy-credits] { color:var(--color-text); }
.media-parameters .media-panel-link:is([data-open-usage],[data-buy-credits])::after { content:""; flex:none; width:16px; height:16px; background:currentColor; -webkit-mask:var(--mask-chevron) center / contain no-repeat; mask:var(--mask-chevron) center / contain no-repeat; transform:rotate(-90deg); }


.composer:has(.composer-attachments:not(:empty)) { grid-template-areas:"actions actions actions" "attachments attachments attachments" "input input input" "controls voice send"; }
@media (max-width:440px) {
  .composer:has(.send-button.has-price):has(.composer-attachments:not(:empty)) { grid-template-areas:"actions actions actions" "attachments attachments attachments" "input input input" "controls controls controls" ". voice send"; }
}
.composer-attachments { grid-area:attachments; min-width:0; }
.composer-attachments:empty { display:none; }

.composer-attachment-row { display:flex; align-items:flex-start; gap:var(--space-2); padding:var(--space-2) 6px var(--space-1) var(--space-2); overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; }
.composer-attachment-row::-webkit-scrollbar { display:none; }
.composer-attachment { display:flex; flex:none; flex-direction:column; gap:var(--space-1); width:max-content; max-width:100%; }
.composer-attachment-box { position:relative; display:flex; align-items:center; box-sizing:border-box; height:var(--attach-tile); border:1px solid var(--line); border-radius:var(--radius-panel); background:var(--color-elevated); }
.composer-attachment.error .composer-attachment-box { outline:2px solid var(--color-danger); outline-offset:-2px; }
.composer-attachment.is-photo .composer-attachment-box { width:var(--attach-tile); background:var(--color-hover); }
.composer-attachment.is-photo .composer-attachment-preview { position:absolute; inset:0; overflow:hidden; border-radius:calc(var(--radius-panel) - 1px); }
.composer-attachment-preview img, .composer-attachment-preview video { display:block; width:100%; height:100%; object-fit:cover; }
.composer-attachment.is-pending .composer-attachment-preview img { opacity:.55; }
.composer-attachment:not(.is-photo) .composer-attachment-box { gap:var(--space-3); width:max-content; min-width:152px; max-width:240px; padding:0 var(--space-4) 0 var(--space-3); }
.composer-attachment:not(.is-photo) .composer-attachment-preview { display:grid; flex:none; place-items:center; width:40px; height:40px; overflow:hidden; border-radius:var(--radius-control); color:var(--color-text-secondary); background:var(--color-hover); }
.composer-attachment:not(.is-photo) .composer-attachment-preview svg { width:20px; height:20px; }
.composer-attachment.error .composer-attachment-preview { color:var(--color-danger); }
.composer-attachment-copy { display:flex; flex:1; flex-direction:column; min-width:0; }
.composer-attachment-copy strong { overflow:hidden; color:var(--color-text); font-size:15px; font-weight:500; line-height:20px; text-overflow:ellipsis; white-space:nowrap; }
.composer-attachment-copy small { overflow:hidden; color:var(--color-text-secondary); font-size:var(--text-caption); line-height:var(--leading-caption); text-overflow:ellipsis; white-space:nowrap; }
.attachment-remove { position:absolute; top:-6px; right:-6px; z-index:2; display:grid; place-items:center; width:20px; height:20px; min-width:20px; min-height:20px; padding:0; border:0; border-radius:50%; color:var(--color-on-action); background:var(--color-action); box-shadow:0 0 0 2px var(--color-surface); cursor:pointer; }
.attachment-remove:hover { background:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
.attachment-remove:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }
.attachment-remove svg { width:16px; height:16px; stroke-width:var(--icon-stroke-small); }

.attachment-remove::after { content:""; position:absolute; inset:-3px -8px -13px -8px; }
.composer-attachment-progress { --progress-track:transparent; --progress-fill:color-mix(in srgb, var(--color-text) 14%, transparent); position:absolute; inset:0; width:100%; height:100%; margin:0; border:0; border-radius:inherit; background:var(--progress-track); -webkit-appearance:none; appearance:none; overflow:hidden; pointer-events:none; }
.composer-attachment.is-photo .composer-attachment-progress { --progress-track:color-mix(in srgb, var(--color-scrim) 80%, transparent); --progress-fill:rgb(255 255 255 / .3); }
.composer-attachment-progress::-webkit-progress-bar { background:var(--progress-track); }
.composer-attachment-progress::-webkit-progress-value { background:var(--progress-fill); }
.composer-attachment-progress::-moz-progress-bar { background:var(--progress-fill); }
.composer-attachment-percent { position:absolute; inset:0; display:grid; place-items:center; color:var(--color-on-scrim); font-size:var(--text-caption); font-variant-numeric:tabular-nums; font-weight:600; pointer-events:none; }
.attachment-retry { display:grid; place-items:center; flex:none; width:32px; height:32px; min-width:32px; min-height:32px; padding:0; border:0; border-radius:50%; color:var(--color-text-secondary); background:transparent; cursor:pointer; }
.attachment-retry:hover { color:var(--color-text); background:var(--color-hover); }
.attachment-retry svg { width:20px; height:20px; }
.composer-attachment:not(.is-photo) .attachment-retry { position:relative; z-index:3; }

.composer-attachment.is-photo .attachment-retry { position:absolute; inset:0; z-index:1; width:100%; height:100%; border-radius:inherit; color:var(--color-on-scrim); background:color-mix(in srgb, var(--color-scrim) 80%, transparent); }
.composer-attachment.is-photo .attachment-retry:hover { color:var(--color-on-scrim); background:var(--color-scrim); }
.composer-attachment.is-photo .attachment-retry svg { width:24px; height:24px; }
.composer-attachment-note { margin:0; padding:0 var(--space-2) var(--space-1); color:var(--color-danger); font-size:var(--text-caption); line-height:var(--leading-caption); }
.composer-attachment-note > span { display:block; }
.composer-attachment-note.is-hint { color:var(--color-text-secondary); }


.composer-attachment .attachment-role { display:block; }
.composer-attachment .attachment-role .select-field { width:100%; }
.composer-attachment .attachment-role .select-field::after { right:6px; }
.composer-attachment .attachment-role select { width:100%; min-height:36px; padding:0 22px 0 8px; font-size:14px; }
@media (pointer:coarse) {
  .attachment-remove::after { inset:-3px -12px -21px -12px; }
  .composer-attachment:not(.is-photo) .attachment-retry { width:44px; height:44px; min-width:44px; min-height:44px; }
  .composer-attachment .attachment-role select { min-height:44px; font-size:16px; }
}



.message-actions.response-footer svg, .message-row.user > .user-actions svg { width:20px; height:20px; stroke-width:var(--icon-stroke); }
.message-actions.response-footer button[data-speak-message] { width:44px; min-width:44px; padding:0; }

.message-actions.response-footer .response-model { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (pointer:coarse) { .message-row.failed .message-actions button { min-height:44px; } }
.media-result .media-result-footer button:not(.media-edit), .media-result-details > summary { border-radius:50%; }
.media-result .media-result-footer button:hover, .media-result-details > summary:hover { background:var(--surface-hover); }

@media (max-width:460px) {
  .media-result .media-result-footer button.media-edit { border-radius:50%; color:var(--muted); }
  .media-result .media-result-footer button.media-edit svg { width:20px; height:20px; stroke-width:var(--icon-stroke); }
}
@media (hover:hover) and (pointer:fine) {
  
  .message-actions.response-footer { min-height:36px; margin-left:-10px; }
  .message-actions.response-footer button, .message-actions.response-footer button[data-speak-message] { width:36px; height:36px; min-width:36px; min-height:36px; }
  .message-actions.response-footer svg, .message-row.user > .user-actions svg { width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
  
  .media-result .media-result-footer button, .media-result-details > summary { width:36px; height:36px; min-width:36px; min-height:36px; }
  .media-result .media-result-footer button.media-edit { width:auto; padding:0 var(--space-3); border-radius:var(--radius-pill); }
  .media-result-footer svg, .media-result .media-result-footer button.media-edit svg { width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
  .media-result-footer.response-footer { min-height:36px; }
  .media-actions button, .media-result .media-placeholder button, .media-result .media-ended-actions button, .media-result > button[data-media-action="refresh"] { min-height:36px; }
  
  #messages > .message-row.assistant .response-footer { transition:opacity var(--motion-press) ease; }
  #messages > .message-row.assistant:not(.failed):not(:last-child):not(:hover):not(:focus-within):not(:has([data-continue-message], [data-read-aloud][aria-pressed="true"])) .response-footer { opacity:0; }
}
@media (prefers-reduced-motion:reduce) { #messages > .message-row.assistant .response-footer { transition:none; } }

.message-row.assistant .answer-content > :first-child, .message-row.assistant .pending-answer > :first-child { margin-top:0; }
.message-row.assistant .answer-content > :last-child, .message-row.assistant .pending-answer > :last-child { margin-bottom:0; }


.chat-list-row:has(> .row-more[aria-expanded="true"]) > .chat-item:not(.active),
.chat-list-row:has(> .row-more[aria-expanded="true"]) > .project-item { background:var(--surface); }
.catalog-list .chat-list-row:has(> .row-more[aria-expanded="true"]) { background:var(--color-hover); }
.catalog-list .chat-list-row:has(> .row-more[aria-expanded="true"]) > .chat-item:not(.active) { background:transparent; }
.chat-list-row > .row-more[aria-expanded="true"] { opacity:1; pointer-events:auto; color:var(--text); }
.sidebar-chat-list .chat-list-row:has(> .row-more[aria-expanded="true"]) .chat-item strong {
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent calc(100% - 30px));
  mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent calc(100% - 30px)); }
.more-button[aria-expanded="true"] { color:var(--text); background:var(--surface); }

.sidebar-chat-list .chat-item.active { background:var(--color-active); }
.sidebar-chat-list .chat-list-row:has(> .row-more[aria-expanded="true"]) > .chat-item:not(.active) { background:var(--color-hover); }
@media (hover:hover) {
  .sidebar-chat-list .chat-list-row:hover > .chat-item:not(.active),
  .sidebar-primary-nav button:not(.active):hover { background:var(--color-hover); }
  .sidebar-chat-list .row-more:hover { background:var(--color-hover); }
}

.sidebar-chat-list .pin-mark { display:none; }

.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button:not(.has-price):not(:has(use[href="#new-square"])) { opacity:.35; cursor:default; }
.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button:not(.has-price):not(:has(use[href="#new-square"])):hover { background:var(--color-action); }


:is(.delete-dialog, .edit-message-dialog)::backdrop { background:var(--scrim); }
@media (max-width:899px) { .menu-backdrop { background:var(--scrim); } }

.loading .brand-mark { width:44px; height:44px; border-radius:0; background:var(--color-brand); -webkit-mask:url('/snake.svg') center / contain no-repeat; mask:url('/snake.svg') center / contain no-repeat; }
.loading .brand-mark img { opacity:0; }
.loading-copy h1 { width:4.09em; height:.82em; margin:10px 0 14px; font-size:24px; letter-spacing:0; background-color:currentColor; -webkit-mask:url('/wordmark.svg') left center / contain no-repeat; mask:url('/wordmark.svg') left center / contain no-repeat; text-indent:-999em; overflow:hidden; white-space:nowrap; }
.loading:not(.auth-gate) #loading-message { animation:fade-in .3s ease .5s both; }
@media (prefers-reduced-motion:reduce) { .loading:not(.auth-gate) #loading-message { animation:none; } }

.models-catalog > .model-empty { grid-column:1 / -1; display:grid; justify-items:center; width:100%; max-width:440px; margin:12vh auto 0; padding:var(--space-5) var(--space-3); text-align:center; }

.loading.auth-gate .brand-mark { width:44px; height:44px; border-radius:0; }
.loading.auth-gate .loading-copy :is(a, button) { box-sizing:border-box; min-width:240px; justify-content:center; }
.loading.auth-gate :is(#telegram-entry, #bootstrap-login):not([hidden]) ~ #bootstrap-retry { margin-top:var(--space-2); border:1px solid var(--line-strong); color:var(--text); background:var(--bg); }
@media (hover:hover) { .loading.auth-gate :is(#telegram-entry, #bootstrap-login):not([hidden]) ~ #bootstrap-retry:hover { background:var(--surface-hover); } }

#model-options > .model-empty { display:grid; justify-items:center; padding:var(--space-5) var(--space-3); text-align:center; }
#model-options > .model-empty strong { font-size:17px; font-weight:600; line-height:1.4; }
@media (hover:hover) { #model-options > .model-empty button:hover { background:var(--surface-hover); } }

.context-dialog > p { margin-top:var(--space-2); color:var(--color-text-tertiary); }

.settings-detail-card b > .status-dot { flex:none; }

#chat-selection-toggle { color:var(--text); background:var(--surface-hover); }
@media (hover:hover) { #chat-selection-toggle:hover { background:var(--color-active); } }

.chat-batch-actions button[hidden] { display:none; }
@media (max-width:480px) {
  .chat-batch-actions button { flex-direction:column; gap:var(--space-1); min-height:62px; padding:var(--space-2) var(--space-1); font-size:var(--fs-small); line-height:1.2; }
}

.catalog-list .project-item { padding-right:var(--space-2); }
.history-state.nested { margin:0 0 var(--space-2) 14px; padding:var(--space-3) var(--space-3) var(--space-4); border-left:0; }
.history-state.nested strong { font-size:var(--fs-body); font-weight:600; }
.history-state.nested p { margin:2px 0 var(--space-3); font-size:var(--fs-small); line-height:1.5; }
.history-state.nested button { min-height:36px; padding:0 var(--space-3); font-size:var(--fs-small); }
@media (max-width:899px) { .history-state.nested button { min-height:44px; } }
@media (hover:none) { .history-state button:hover { background:var(--surface); } }

@media (min-width:641px) and (max-width:899px) {
  .catalog-screen { padding-top:var(--space-6); padding-left:var(--space-6); padding-right:var(--space-6); }
  .messages, .composer-wrap { padding-left:var(--space-6); padding-right:var(--space-6); }
  .conversation-header, html[data-telegram-safe="true"] .conversation-header { padding-left:var(--space-3); padding-right:var(--space-3); }
  .settings-screen:is(.active, .is-leaving) { place-items:center; }
  .settings-shell {
    width:min(600px, calc(100vw - 48px)); height:min(720px, calc(var(--app-height, 100dvh) - 96px));
    border-bottom:1px solid var(--line-strong); border-radius:var(--radius-panel);
    animation:settings-in var(--motion-modal) var(--ease-ui) both;
  }
  html[data-telegram-safe="true"] .settings-shell { height:min(720px, calc(var(--content-height) - 96px)); }
  .settings-grip { display:none; }
  .menu-backdrop { background:transparent; }
  .row-menu button { white-space:nowrap; }
  
  .attach-menu { grid-template-columns:minmax(0,1fr); gap:0; border-radius:var(--radius-control); }
  .attach-menu button { min-height:46px; flex-direction:row; justify-content:flex-start; gap:10px; padding:0 11px; border-radius:var(--radius-control); font-size:var(--fs-body); font-weight:400; background:transparent; }
}
@media (min-width:700px) and (max-width:899px) {
  .models-catalog { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); align-content:start; align-items:stretch; gap:var(--space-3); }
  .models-catalog .company-disclosure { margin:0; }
  .catalog-company[open] { grid-column:1 / -1; }
  .models-catalog .catalog-company:not([open]) > summary { box-sizing:border-box; min-height:100%; }
}

.catalog-company .catalog-model-actions { width:188px; }
.catalog-company .catalog-details > summary { width:calc(100% - 198px); }
.catalog-company .catalog-model-actions button:disabled { color:var(--color-text-tertiary); cursor:default; }
@media (min-width:1100px) { .catalog-company[open] .model-family-grid > .catalog-model:nth-child(2) { border-top:0; } }

.chat-item mark { color:var(--text); font-weight:600; background:transparent; }

.chat-item:focus-visible, .project-item:focus-visible, .row-more:focus-visible { outline-offset:-2px; }
.company-disclosure > summary:focus-visible { outline-offset:-2px; border-radius:calc(var(--radius-panel) - 1px); }
.code-block pre:focus-visible { outline-offset:-2px; border-radius:0 0 calc(var(--radius-panel) - 1px) calc(var(--radius-panel) - 1px); }
.settings-detail-card > :is(button, a):focus-visible { outline-offset:-2px; }


.project-choices button { padding:var(--space-2) var(--space-3); }
.project-choices button > span { flex:1 1 auto; min-width:0; display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:1.35; }
.project-choices small { flex:none; padding-left:var(--space-2); white-space:nowrap; font-variant-numeric:tabular-nums; }
.catalog-list .chat-list-row > .project-item:hover,
.catalog-list .chat-list-row:has(> .row-more[aria-expanded="true"]) > .project-item { background:transparent; }
@media (max-width:359px) { .catalog-heading h1 { font-size:var(--text-screen); } }
#projects-list .chat-list-row.nested, #projects-list .history-state.nested { margin-left:23px; }
#projects-list .history-state.nested { margin-bottom:0; border-bottom:1px solid var(--line); }
#projects-list .history-state.nested strong { font-weight:500; }


#screen-chat .empty-conversation { transition:opacity var(--motion-hover) ease; }
#screen-chat.is-empty:has(.composer-wrap > [data-cover="hero"]:not([hidden])) .empty-conversation { opacity:0; }
.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button.has-price { opacity:.35; cursor:default; }
.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button.has-price:hover { background:var(--color-action); }


:root[data-theme="light"] { --code-keyword:#cf222e; --code-string:#0a3069; --code-comment:#59636e; --code-number:#0550ae; --code-function:#6639ba; --code-type:#953800; --code-tag:#116329; }
@media (prefers-color-scheme:light) { :root:not([data-theme="dark"]) { --code-keyword:#cf222e; --code-string:#0a3069; --code-comment:#59636e; --code-number:#0550ae; --code-function:#6639ba; --code-type:#953800; --code-tag:#116329; } }
.code-block .tk-k { color:var(--code-keyword); }
.code-block .tk-s { color:var(--code-string); }
.code-block .tk-c { color:var(--code-comment); }
.code-block .tk-n, .code-block .tk-p { color:var(--code-number); }
.code-block .tk-f { color:var(--code-function); }
.code-block .tk-t, .code-block .tk-v { color:var(--code-type); }
.code-block .tk-g { color:var(--code-tag); }


#rename-submit:disabled { cursor:default; }




@media (max-width:640px) {
  .messages, .composer-wrap { padding-left:var(--space-4); padding-right:var(--space-4); }
}



.composer-actions {
  grid-area:actions; justify-self:start; display:flex; align-items:center; gap:0;
  min-width:0; max-width:100%; margin:0 0 0 calc(-1 * var(--space-1)); padding:0;
}
.composer-actions[hidden] { display:none; }
.composer-actions button {
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-width:0; min-height:44px; margin:0; padding:0 10px;
  border:4px solid transparent; border-radius:var(--radius-pill); background-clip:padding-box;
  background-color:transparent; box-shadow:none;
  color:var(--color-text-secondary); font:inherit; font-size:var(--text-label); font-weight:var(--weight-medium);
  line-height:var(--leading-label); white-space:nowrap; cursor:pointer;
  transition:background-color var(--motion-hover) var(--ease-ui), color var(--motion-hover) var(--ease-ui);
}

@media (hover:hover) { .composer-actions button:hover:not([aria-pressed="true"], [aria-disabled="true"]) { background-color:var(--color-hover); color:var(--color-text); } }
.composer-actions button[aria-pressed="true"] { background-color:var(--color-active); color:var(--color-text); }
.composer-actions button[aria-disabled="true"] { color:var(--color-text-tertiary); cursor:default; }
.composer-actions button svg { width:16px; height:16px; flex:none; stroke-width:var(--icon-stroke-small); }
.composer-actions button:focus-visible { outline:2px solid var(--color-accent); outline-offset:-4px; }
@media (max-width:640px) {
  .composer-actions button svg { display:none; }
}

.composer-disclaimer {
  max-width:760px; margin:var(--space-2) auto 0; color:var(--color-text-tertiary);
  font-size:var(--text-footnote); line-height:var(--leading-footnote); text-align:center;
}
@media (max-width:640px) { .composer-disclaimer { display:none; } }


.composer .composer-control.icon-only,
.composer .voice-button {
  width:44px; height:44px; min-width:44px; min-height:44px; padding:0;
  border:4px solid transparent; border-radius:50%; background-clip:padding-box;
  background-color:transparent; color:var(--color-text-secondary);
  transition:background-color var(--motion-hover) var(--ease-ui), color var(--motion-hover) var(--ease-ui);
}
.composer .composer-control.icon-only svg, .composer .voice-button svg { width:var(--icon-toolbar); height:var(--icon-toolbar); }
.composer .composer-control.icon-only:hover:not(:disabled),
.composer .voice-button:hover:not(:disabled) { background-clip:padding-box; background-color:var(--color-hover); color:var(--color-text); }
.composer .composer-control.icon-only:active:not(:disabled), .composer .composer-control.icon-only[aria-expanded="true"],
.composer .voice-button:active:not(:disabled) { background-clip:padding-box; background-color:var(--color-active); color:var(--color-text); }
.composer .composer-control.icon-only:disabled, .composer .voice-button:disabled { opacity:1; color:var(--color-text-tertiary); cursor:default; }

#thinking-control, #media-settings {
  flex-direction:row; align-items:center; gap:var(--space-1);
  min-height:44px; padding:0 var(--space-2) 0 var(--space-3);
  border:4px solid transparent; border-radius:var(--radius-pill); background-clip:padding-box;
  background-color:transparent; box-shadow:inset 0 0 0 1px var(--color-border-strong);
  color:var(--color-text-secondary); font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
  transition:background-color var(--motion-hover) var(--ease-ui), color var(--motion-hover) var(--ease-ui);
}
#thinking-control::after, #media-settings::after {
  content:""; flex:none; width:var(--icon-small); height:var(--icon-small); background:currentColor;
  -webkit-mask:var(--icon-chevron-mask) center / contain no-repeat; mask:var(--icon-chevron-mask) center / contain no-repeat;
  transition:transform var(--motion-popover) var(--ease-ui);
}
#thinking-control:hover:not(:disabled), #media-settings:hover:not(:disabled) { background-clip:padding-box; background-color:var(--color-hover); color:var(--color-text); }
#thinking-control:active:not(:disabled), #media-settings:active:not(:disabled),
#thinking-control[aria-expanded="true"], #media-settings[aria-expanded="true"] { background-clip:padding-box; background-color:var(--color-active); color:var(--color-text); }
#thinking-control[aria-expanded="true"]::after, #media-settings[aria-expanded="true"]::after { transform:rotate(180deg); }
#thinking-control:disabled, #media-settings:disabled { opacity:1; color:var(--color-text-tertiary); cursor:default; }
#thinking-control .reply-effort, #media-settings .media-settings-copy { line-height:var(--leading-label); }
#media-settings .media-settings-icon svg { width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); }
#media-settings-label { font-size:var(--text-label); }
@media (max-width:640px) {
  #thinking-control, #media-settings { flex-direction:row; gap:var(--space-1); padding:0 var(--space-1) 0 var(--space-3); }
  #media-settings { padding-left:var(--space-2); min-width:44px; justify-content:center; }
}

@media (max-width:430px) {
  #thinking-control, #media-settings { border-inline-width:0; padding-left:var(--space-2); }
}


.composer .send-button {
  grid-area: send;
  width:44px; height:44px; min-width:44px; min-height:44px; padding:0;
  border:4px solid transparent; border-radius:var(--radius-pill); background-clip:padding-box;
  background-color:var(--color-action); color:var(--color-on-action); opacity:1;
  transition:background-color var(--motion-hover) var(--ease-ui), color var(--motion-hover) var(--ease-ui), transform var(--motion-press) var(--ease-ui);
}
.composer .send-button svg { width:var(--icon-toolbar); height:var(--icon-toolbar); }
.composer .send-button:hover:not(:disabled) { background-clip:padding-box; background-color:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
.composer .send-button:active:not(:disabled) { transform:scale(var(--press-scale)); }
.composer .send-button:disabled,
.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button:not(.has-price):not(:has(use[href="#new-square"])),
.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button.has-price {
  opacity:1; background-clip:padding-box; background-color:var(--color-disabled-fill); color:var(--color-on-disabled); cursor:default; transform:none;
}
.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button:not(.has-price):not(:has(use[href="#new-square"])):hover,
.composer:has(#composer-input:placeholder-shown):not(:has(.composer-attachments > *)) .send-button.has-price:hover { background-clip:padding-box; background-color:var(--color-disabled-fill); }

.composer .send-button.is-busy svg { display:none; }
.composer .send-button.is-busy::before {
  content:""; box-sizing:border-box; flex:none; width:18px; height:18px;
  border:2px solid currentColor; border-right-color:transparent; border-radius:50%;
  animation:media-wait .9s linear infinite;
}
@media (prefers-reduced-motion:reduce) {
  .composer .send-button.is-busy::before { animation-duration:2.4s; }
  .composer-actions button, #thinking-control, #media-settings, .composer .send-button,
  .composer .composer-control.icon-only, .composer .voice-button { transition:none; }
}


.composer-wrap .thinking-menu,
.composer-wrap .media-parameters {
  padding:var(--space-2); border:0; border-radius:var(--radius-panel);
  background:var(--color-elevated); box-shadow:var(--shadow-popover); color:var(--color-text);
}
.media-parameters .media-panel-heading {
  display:grid; gap:var(--space-half); margin:0; padding:var(--space-2) var(--space-2) var(--space-3);
  border-bottom:1px solid var(--color-border);
}
.media-parameters .media-panel-heading strong { color:var(--color-text); font-size:var(--text-body); font-weight:var(--weight-semibold); line-height:var(--leading-body); }
.media-parameters .media-panel-heading span { color:var(--color-text-secondary); font-size:var(--text-label); line-height:var(--leading-label); }


.media-parameters .media-parameter-list { display:grid; gap:0; margin:0; overflow:visible; border:0; border-radius:0; background:transparent; }
.media-parameters .media-parameter-list > div,
.media-parameters .media-parameter-list > .media-choice-row.media-select-row {
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-3);
  min-height:44px; padding:var(--space-1) var(--space-2); border-bottom:1px solid var(--color-border);
}
.media-parameters .media-parameter-list > div + div { border-top:0; }
.media-parameters .media-parameter-list > .media-choice-row:not(.media-select-row) { display:grid; justify-content:stretch; gap:var(--space-2); padding:var(--space-2); }
.media-parameters dt { color:var(--color-text-secondary); font-size:var(--text-label); line-height:var(--leading-label); }
.media-parameters dd { margin:0; color:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.media-parameters .media-choice-row:not(.media-select-row) dd { text-align:left; white-space:normal; }

.media-parameters .media-choice {
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); gap:0;
  border-radius:var(--radius-control); background:var(--color-surface); box-shadow:inset 0 0 0 1px var(--color-border);
}

@media (max-width:360px) {
  .media-parameters .media-choice:has(> :nth-child(5)) { grid-auto-flow:row; grid-template-columns:repeat(6, minmax(0, 1fr)); }
  .media-parameters .media-choice:has(> :nth-child(5)) > * { grid-column:span 2; }
  .media-parameters .media-choice:has(> :nth-child(5)) > :nth-child(n+4) { grid-column:span 3; }
}
.media-parameters .media-choice button {
  min-width:0; min-height:44px; margin:0; padding:0 var(--space-2);
  border:4px solid transparent; border-radius:var(--radius-control); background-clip:padding-box; background-color:transparent;
  color:var(--color-text-secondary); font:inherit; font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
  font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer;
}
.media-parameters .media-choice button:hover:not([aria-checked="true"]) { background-clip:padding-box; background-color:var(--color-hover); color:var(--color-text); }
.media-parameters .media-choice button[aria-checked="true"] { background-clip:padding-box; background-color:var(--color-thumb); box-shadow:inset 0 0 0 1px var(--color-border); color:var(--color-text); font-weight:var(--weight-medium); }
.media-parameters .media-choice button:focus-visible { outline:2px solid var(--color-accent); outline-offset:-4px; }

.media-parameters .media-select select,
.media-parameters .media-sound-toggle {
  min-height:44px; border:4px solid transparent; border-radius:var(--radius-pill); background-clip:padding-box;
  background-color:transparent; box-shadow:inset 0 0 0 1px var(--color-border-strong);
  color:var(--color-text); font:inherit; font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
}
.media-parameters .media-select select { padding:0 var(--space-8) 0 var(--space-3); font-size:16px; } 
.media-parameters .media-select::after { right:var(--space-4); width:var(--icon-small); height:var(--icon-small); }
.media-parameters .media-select select:hover, .media-parameters .media-sound-toggle:hover { background-clip:padding-box; background-color:var(--color-hover); }
.media-parameters .media-sound-toggle { gap:var(--space-2); padding:0 var(--space-3); }
.media-parameters .media-sound-toggle[aria-checked="true"] { background-clip:padding-box; background-color:var(--color-active); box-shadow:inset 0 0 0 1px var(--color-border-strong); color:var(--color-text); font-weight:var(--weight-medium); }
.media-parameters .media-sound-control { padding:var(--space-2); border-bottom:1px solid var(--color-border); }
.media-parameters .media-sound-control > span { font-size:var(--text-label); }

.media-parameters .media-parameter-note,
.media-parameters .media-parameter-warning { margin:0; padding:var(--space-2) var(--space-2) 0; font-size:var(--text-label); line-height:var(--leading-label); }
.media-parameters .media-panel-link[data-media-quote-retry] { margin:var(--space-3) 0 var(--space-1) calc(var(--space-2) + 26px); }


@media (max-width:374px) {
  .composer:has(.send-button.has-price) #media-settings::after { display:none; }
  .composer:has(.send-button.has-price) #media-settings { padding-right:var(--space-3); }
}

#media-settings .media-settings-copy { white-space:nowrap; }


.message-row.assistant .answer-content > * { margin-block:0; }
.message-row.assistant .answer-content > * + * { margin-top:var(--space-4); }
.message-row.assistant .answer-content > * + :is(h1, h2, h3, h4, h5, h6) { margin-top:var(--space-6); }
.message-row.assistant .answer-content > :is(h1, h2, h3, h4, h5, h6) + * { margin-top:var(--space-2); }
.message-row.assistant .answer-content :is(h1, h2) { font-size:var(--text-section); line-height:var(--leading-section); letter-spacing:-.015em; font-weight:var(--weight-semibold); }
.message-row.assistant .answer-content h3 { font-size:var(--text-heading); line-height:var(--leading-heading); font-weight:var(--weight-semibold); }
.message-row.assistant .answer-content :is(h4, h5, h6) { font-size:var(--text-message); line-height:var(--leading-message); font-weight:var(--weight-semibold); }
.message-row.assistant .answer-content :is(ul, ol) { padding-left:22px; }
.message-row.assistant .answer-content li { margin:0; padding-left:var(--space-1); }
.message-row.assistant .answer-content li + li { margin-top:var(--space-2); }
.message-row.assistant .answer-content li > :is(ul, ol) { margin:var(--space-1) 0 0; }
.message-row.assistant .answer-content li > :is(p, .code-block, .table-scroll) { margin:var(--space-2) 0 0; }
.message-row.assistant .answer-content blockquote { padding:0 0 0 var(--space-4); color:var(--color-text-secondary); }
.message-row.assistant .answer-content blockquote > * + * { margin-top:var(--space-2); }


.table-scroll { display:flex; }
.table-scroll table { flex:none; }

.answer-table { margin:var(--space-3) 0; }
.answer-table > .table-scroll { margin:0; }
.message-row.assistant .answer-content li > .answer-table { margin:var(--space-2) 0 0; }
.table-tools { display:flex; justify-content:flex-end; margin-top:var(--space-1); }
.table-tools button { display:inline-flex; align-items:center; gap:var(--space-1); min-height:28px; height:28px; padding:0 var(--space-2); border-radius:var(--radius-control); color:var(--color-text-tertiary); background:transparent; font-size:var(--text-secondary); line-height:var(--leading-secondary); }
.table-tools button svg { width:16px; height:16px; flex:none; }
.table-tools button:hover, .table-tools button.is-done { color:var(--color-text); background:var(--color-hover); }
@media (max-width:767px) { .table-tools button { min-height:44px; height:44px; margin-block:-8px; } }
.table-scroll th, .table-scroll td { min-width:var(--space-16); padding:var(--space-2) var(--space-3); font-variant-numeric:tabular-nums; }
.table-scroll td:first-child { background:var(--color-surface); }

.table-scroll table { flex:1 1 auto; width:auto; }
.table-scroll th { white-space:normal; vertical-align:bottom; }
.table-scroll :is(th, td).is-num { min-width:0; }
.table-scroll td:not(.is-long) { white-space:nowrap; }
.table-scroll :is(th, td).is-long { min-width:11em; }
.table-scroll[data-scrolled] :is(th, td):first-child { box-shadow:inset -1px 0 0 var(--color-border); }
@supports (animation-timeline:scroll()) {
  .table-scroll::after { opacity:0; animation:table-more linear both; animation-timeline:scroll(nearest inline); }
}
@keyframes table-more { 0%, 92% { opacity:1; } 100% { opacity:0; } }

[data-read-aloud][aria-pressed="true"] { color:var(--color-text) !important; }
[data-read-aloud][data-loading] svg { animation:read-aloud-wait .8s ease-in-out infinite alternate; }
@keyframes read-aloud-wait { from { opacity:1; } to { opacity:.35; } }
@media (prefers-reduced-motion:reduce) { [data-read-aloud][data-loading] svg { animation:none; opacity:.5; } }

.code-block pre { display:flex; padding:var(--space-3) var(--space-4); font-size:var(--text-label); }
.code-block pre > code { flex:none; }
.code-block pre::after {
  content:""; position:sticky; right:calc(-1 * var(--space-4)); flex:none;
  width:var(--space-8); margin:0 calc(-1 * var(--space-4)) 0 calc(-1 * var(--space-8));
  background:linear-gradient(90deg, transparent, var(--color-surface) 85%); pointer-events:none;
}
@supports (animation-timeline:scroll()) {
  .code-block pre::after { opacity:0; animation:table-more linear both; animation-timeline:scroll(nearest inline); }
}


.code-toolbar button { min-height:var(--control-min); padding:0 var(--space-2); gap:var(--space-1); border-radius:var(--radius-control); font-size:var(--text-secondary); }
@media (max-width:640px) {
  .code-toolbar { min-height:44px; }
  .code-toolbar button { min-height:44px; }
}


.message-actions.response-footer { margin-top:var(--space-2); }
.message-actions.response-footer .response-model {
  order:3; flex:0 1 auto; margin-left:auto; padding-left:var(--space-3);
  color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption);
}


.conversation-header .limit-line,
.conversation-header .limit-line.has-credits {
  width:auto; min-width:0; max-width:none; height:44px; min-height:44px; margin:0;
  justify-content:center; gap:var(--space-2); padding:0 var(--space-3) 0 var(--space-2);
  border:4px solid transparent; border-radius:var(--radius-pill);
  background:transparent; background-clip:padding-box;
  box-shadow:inset 0 0 0 1px var(--color-border-strong);
  color:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
  white-space:nowrap; font-variant-numeric:tabular-nums;
}
.conversation-header .limit-line:hover { background-color:var(--color-hover); background-clip:padding-box; color:var(--color-text); }
.conversation-header .limit-line:active { background-color:var(--color-active); background-clip:padding-box; }
.conversation-header .limit-line:focus-visible { outline:2px solid var(--color-accent); outline-offset:-2px; }
.conversation-header .limit-line:not(.has-credits) .limit-caption { display:inline; font-size:inherit; font-weight:inherit; }

@media (max-width:640px) {
  .conversation-header { column-gap:var(--space-1); }
}
@media (max-width:400px) {
  .conversation-header .limit-line:not(.has-credits) { width:auto; min-width:44px; padding:0 var(--space-3); }
  .conversation-header .limit-line:not(.has-credits) .limit-caption { display:none; }
}


.sidebar { padding:var(--space-3) var(--space-2) var(--space-2); }

.sidebar .brand, .sidebar .brand-lockup { height:var(--control-size); padding:0 var(--space-2); }

.sidebar .new-chat-button { margin-top:var(--space-3); background-color:var(--color-surface); box-shadow:inset 0 0 0 1px var(--color-border); font-weight:var(--weight-semibold); }
.sidebar .new-chat-button:hover { background-color:var(--color-surface); background-image:linear-gradient(var(--color-hover), var(--color-hover)); }
.sidebar .new-chat-button, .sidebar-primary-nav button {
  min-height:var(--row-height); gap:var(--space-3); padding:0 var(--space-3);
  font-size:var(--text-nav); line-height:var(--leading-nav);
}
.sidebar-chat-list .chat-day:first-child { margin-top:var(--space-1); }
.sidebar-chat-list .chat-item strong { font-size:var(--text-nav); line-height:var(--leading-nav); }

.sidebar-chat-list .row-more { right:0; width:44px; height:44px; top:0; bottom:0; margin-block:auto; transform:none; }
.sidebar-chat-list .row-more:active { background:var(--color-active); }
:is(.sidebar, .catalog-list) button:active:not(:disabled) { transform:none; scale:none; }

@media (hover:hover) and (pointer:fine) {
  .sidebar-chat-list .row-more { right:var(--space-1); width:var(--control-min); height:var(--control-min); min-width:0; min-height:0; border-radius:var(--radius-small); }
}

.settings-shortcut, .settings-shortcut.has-account { gap:var(--space-3); padding:0 calc(var(--space-3) - 1px); }
@media (max-width:899px) {
  .sidebar .new-chat-button, .sidebar-primary-nav button, .sidebar-chat-list .chat-item { min-height:var(--control-size); }
  .sidebar-chat-list .chat-list-row .chat-item { min-height:var(--control-size); padding:0 var(--space-3); }
  .drawer-close { top:max(var(--space-3), env(safe-area-inset-top)); right:var(--space-2); width:var(--control-size); height:var(--control-size); }
}

@media (max-width:899px), (hover:none) {
  .sidebar-chat-list .chat-list-row { --more-min:var(--control-size); }
  .sidebar-chat-list .row-more { opacity:1; pointer-events:auto; }
}

.sidebar-section-head { display:flex; align-items:center; justify-content:space-between; min-height:calc(var(--control-min) + var(--space-1)); padding-left:var(--space-3); }
.sidebar-search { display:grid; place-items:center; flex:none; width:var(--control-size); height:var(--control-size); border:0; border-radius:var(--radius-control); background:transparent; color:var(--color-text-tertiary); }
.sidebar-search svg { width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); }
.sidebar-search:active { background:var(--color-active); }
@media (hover:hover) and (pointer:fine) {
  .sidebar-search { width:var(--control-min); height:var(--control-min); margin-right:var(--space-1); border-radius:var(--radius-small); }
  .sidebar-search:hover { background:var(--color-hover); color:var(--color-text); }
}


.model-sheet { padding:var(--space-4) var(--space-3) var(--space-3); border-color:var(--color-border); box-shadow:var(--shadow-popover); }
.model-sheet header { min-height:44px; margin:0 0 var(--space-2); padding-left:var(--space-3); }
.model-sheet header button:hover { background:var(--color-hover); color:var(--color-text); }
.model-sheet > .catalog-search { gap:var(--space-2); margin:0 0 var(--space-2); padding:0 calc(var(--space-3) - 1px); background:var(--color-surface); }
.model-sheet .model-options { gap:0; padding:0; }


.model-sheet .model-select { min-height:64px; gap:var(--space-3); padding:var(--space-2) var(--space-12) var(--space-2) var(--space-3); }
@media (max-width:760px) { .model-sheet .model-select { min-height:68px; } }
.model-sheet .model-option:hover { background:var(--color-hover); }
.model-sheet .model-select:focus-visible { outline:2px solid var(--color-accent); outline-offset:-2px; }
.model-sheet .model-brand {
  width:var(--mark-tile); height:var(--mark-tile); min-width:var(--mark-tile); border-radius:var(--radius-control);
  background:var(--color-surface); box-shadow:inset 0 0 0 1px var(--color-border);
}
.model-sheet .model-brand svg, .model-sheet .model-brand img { width:var(--icon-mark); height:var(--icon-mark); }
.model-sheet .model-selection { right:var(--space-4); width:var(--icon-toolbar); height:var(--icon-toolbar); color:var(--color-accent); }
.model-sheet .model-selection svg { width:var(--icon-toolbar); height:var(--icon-toolbar); stroke-width:var(--icon-stroke); }
.model-sheet .model-copy strong { font-size:var(--text-body); line-height:var(--leading-body); font-weight:var(--weight-medium); }

.model-sheet .model-options::after {
  content:""; position:sticky; bottom:0; flex:none; height:var(--space-6); margin-top:calc(-1 * var(--space-6));
  background:linear-gradient(transparent, var(--color-elevated)); pointer-events:none;
}
@supports (animation-timeline:scroll()) {
  .model-sheet .model-options::after { opacity:0; animation:table-more linear both; animation-timeline:scroll(nearest block); }
}



.catalog-company {
  
  --company-row:calc(2 * var(--space-3) + var(--leading-body) + var(--space-half) + 2 * var(--leading-secondary));
}
.catalog-company > summary { min-height:calc(var(--mark-tile) + 2 * var(--space-4)); gap:var(--space-3); padding:var(--space-3) var(--space-4); }
.catalog-company > summary > .model-brand {
  width:var(--mark-tile); height:var(--mark-tile); min-width:var(--mark-tile); margin:0; border-radius:var(--radius-control);
  background:var(--color-surface); box-shadow:inset 0 0 0 1px var(--color-border);
}
.catalog-company > summary > .model-brand :is(svg, img) { width:var(--icon-mark); height:var(--icon-mark); }
.catalog-company .company-heading { gap:var(--space-half); }
.catalog-company .company-heading strong { font-size:var(--text-body); line-height:var(--leading-body); font-weight:var(--weight-semibold); }

.catalog-company .company-heading small { color:var(--color-text-secondary); font-size:var(--text-secondary); line-height:var(--leading-secondary); }
.catalog-company .company-count { flex:none; min-width:var(--space-6); text-align:right; font-size:var(--text-secondary); line-height:var(--leading-secondary); font-variant-numeric:tabular-nums; }
.catalog-company .company-count b { color:var(--color-text-secondary); font-weight:var(--weight-medium); }

.catalog-company .company-chevron { flex:none; width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); margin-left:calc(var(--space-2) - var(--space-3)); color:var(--color-text-secondary); }

.company-disclosure > summary:hover { background:transparent; }
@media (hover:hover) { .company-disclosure > summary:hover { background:var(--color-hover); } }
@media (max-width:699px) { .models-catalog { gap:var(--space-2); } }
@media (min-width:700px) and (max-width:899px), (min-width:1100px) {
  .models-catalog .catalog-company:not([open]) > summary { min-height:max(100%, var(--company-row)); }
}

.catalog-company .catalog-model-actions button { justify-content:flex-end; gap:var(--space-1); }
.catalog-company .catalog-model-actions button svg { margin-left:0; }


.catalog-action { flex:none; font-size:var(--text-label); font-weight:500; white-space:nowrap; gap:var(--space-2); padding:0 var(--space-4); }
.catalog-action svg { width:var(--icon-toolbar); height:var(--icon-toolbar); }
.catalog-list .chat-item strong { line-height:var(--leading-body); }
.catalog-list .chat-item small { margin-top:var(--space-half); font-size:var(--text-secondary); line-height:var(--leading-secondary); }
.catalog-list .item-meta { margin-top:var(--space-1); color:var(--color-text-tertiary); font-size:var(--text-secondary); line-height:var(--leading-secondary); font-variant-numeric:tabular-nums; }
.catalog-list .chat-day { line-height:var(--leading-caption); }
@media (max-width:899px) { .catalog-heading { margin-bottom:var(--space-4); } }


.history-state-icon svg { width:var(--icon-action); height:var(--icon-action); }
.history-state:not(.nested):not(.loading) strong,
.models-catalog > .model-empty strong { font-size:var(--text-heading); line-height:var(--leading-heading); font-weight:var(--weight-semibold); }
.history-state:not(.nested):not(.loading) p,
.models-catalog > .model-empty p { margin:var(--space-1) 0 0; color:var(--color-text-secondary); font-size:var(--text-body); line-height:var(--leading-body); }
.history-state:not(.nested):not(.loading) button,
.models-catalog > .model-empty button {
  min-height:var(--control-size); margin-top:var(--space-5); padding:0 var(--space-4); border:1px solid var(--color-border-strong);
  border-radius:var(--radius-control); color:var(--color-text); background:transparent; font-size:var(--text-label); font-weight:var(--weight-medium);
}
.models-catalog > .model-empty button + button { margin-top:var(--space-2); }
@media (hover:hover) {
  .history-state:not(.nested):not(.loading) button:hover,
  .models-catalog > .model-empty button:hover { background:var(--color-hover); }
}


.settings-view-title h2 { font-size:var(--text-display); line-height:var(--leading-display); letter-spacing:-.02em; }
.settings-detail-card button,
.settings-detail-card .settings-row,
.settings-row-link,
.settings-row { min-height:var(--row-settings); }
.settings-detail-card span, .settings-detail-card b { gap:var(--space-2); }
.settings-shell .plan-stats span,
.settings-shell .profile-periods > div { min-height:var(--row-settings); padding:var(--space-3) var(--space-4); font-size:var(--text-body); line-height:var(--leading-body); }
.settings-shell .plan-stats span { color:var(--color-text); }
.settings-shell .profile-periods span { color:var(--color-text); }
.settings-shell .plan-stats b,
.settings-shell .profile-periods b { color:var(--color-text-secondary); font-weight:var(--weight-medium); font-variant-numeric:tabular-nums; }
[data-settings-view="usage"] .profile-periods { margin-bottom:var(--space-5); }

.settings-shell .profile-periods { gap:0; background:var(--settings-card); }
.settings-shell .profile-periods > div + div { border-top:1px solid var(--color-border); }


.usage-sheet > .usage-bars,
.usage-sheet > .credit-wallet,
.usage-sheet > .usage-model-details {
  overflow:hidden; margin:0 0 var(--space-5); padding:0; border:1px solid var(--color-border); background:var(--settings-card, transparent);
}

.usage-sheet .usage-bars { gap:0; }
.usage-sheet .usage-row { row-gap:var(--space-2); padding:var(--space-3) var(--space-4); }
.usage-sheet .usage-row + .usage-row { border-top:1px solid var(--color-border); }
.usage-sheet .usage-row .usage-title { font-size:var(--text-body); line-height:var(--leading-body); font-weight:400; }
.usage-sheet .usage-row b { font-size:var(--text-body); line-height:var(--leading-body); font-weight:var(--weight-medium); color:var(--color-text-secondary); }
.usage-sheet .usage-row .usage-track { height:var(--track-height); background:var(--color-active); }
.usage-sheet .usage-row[data-level="mint"] .usage-track i { background:var(--color-text-secondary); }
.usage-sheet .usage-row .usage-note { margin-top:calc(-1 * var(--space-1)); color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption); }

.usage-sheet .credit-wallet > * { grid-column:1 / -1; margin:0; }
.usage-sheet .credit-wallet > h3 {
  grid-column:1; grid-row:1; padding:var(--space-3) 0 0 var(--space-4);
  font-size:var(--text-body); line-height:var(--leading-body); font-weight:400; color:var(--color-text);
}
.usage-sheet .credit-wallet > .credit-total { grid-column:2; grid-row:1; padding:var(--space-3) var(--space-4) 0 var(--space-3); }
.usage-sheet .credit-total b {
  display:inline; margin:0; color:var(--color-text); font-size:var(--text-body); line-height:var(--leading-body);
  font-weight:var(--weight-semibold); letter-spacing:0; white-space:nowrap;
}
.usage-sheet .credit-wallet > .credit-expiry { padding:var(--space-half) var(--space-4) 0; color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption); }
.usage-sheet .credit-wallet > .credit-expiry:last-of-type { padding-bottom:var(--space-3); }
.usage-sheet .credit-wallet > details { margin:0; border-top:1px solid var(--color-border); }
.usage-sheet .credit-wallet summary,
.usage-sheet .usage-model-details > summary { min-height:var(--row-settings); padding:0 var(--space-4); font-size:var(--text-body); line-height:var(--leading-body); }
.usage-sheet .credit-wallet details > p { padding:0 var(--space-4) var(--space-2); font-size:var(--text-secondary); line-height:var(--leading-secondary); }
.usage-sheet .credit-wallet details > p:last-child { padding-bottom:var(--space-3); }

:is(.usage-sheet .credit-wallet :is([data-open-plans], [data-credit-history]), .profile-periods .plan-manage) {
  display:flex; align-items:center; justify-content:space-between; width:100%; min-height:var(--row-settings); margin:0;
  padding:0 var(--space-4); border:0; border-top:1px solid var(--color-border); border-radius:0; color:var(--color-text);
  background:transparent; box-shadow:none; font-size:var(--text-body); font-weight:400; text-align:left;
}
:is(.usage-sheet .credit-wallet :is([data-open-plans], [data-credit-history]), .profile-periods .plan-manage)::after {
  content:""; flex:none; width:8px; height:8px; margin-right:var(--space-1);
  border-right:1.6px solid var(--color-text-tertiary); border-bottom:1.6px solid var(--color-text-tertiary); transform:rotate(-45deg);
}
@media (hover:hover) {
  :is(.usage-sheet .credit-wallet :is([data-open-plans], [data-credit-history]), .profile-periods .plan-manage):hover,
  .usage-sheet .credit-wallet summary:hover,
  .usage-sheet .usage-model-details > summary:hover { background:var(--color-hover); }
}
:is(.usage-sheet .credit-wallet :is([data-open-plans], [data-credit-history]), .profile-periods .plan-manage):focus-visible,
.usage-sheet summary:focus-visible { outline-offset:-2px; }

.usage-sheet .usage-model-details .usage-model-limits dl { font-size:var(--text-body); line-height:var(--leading-body); }
.usage-sheet .usage-model-details .usage-model-limits dl > div { padding:var(--space-3) var(--space-4); }
.usage-sheet .usage-model-details[open] .usage-model-limits dl > div:first-child { border-top:1px solid var(--color-border); }

.usage-sheet > :is(.usage-how, .usage-extra, .usage-empty) {
  margin:calc(-1 * var(--space-2)) 0 var(--space-5); color:var(--color-text-secondary); font-size:var(--text-secondary); line-height:var(--leading-secondary);
}
.usage-sheet > :last-child { margin-bottom:0; }

@media (max-width:899px) {
  
  .settings-home { gap:var(--space-5); padding-left:var(--space-4); padding-right:var(--space-4); }
  .settings-group > button { min-height:var(--row-settings); grid-template-columns:var(--icon-toolbar) minmax(0,1fr) var(--icon-small); padding:var(--space-2) var(--space-4); }
  .settings-group > button > .row-end, .settings-group > button > .row-end.is-external { width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); }
}



.empty-conversation .welcome-mark { --brand-size:.74em; display:inline-block; vertical-align:baseline; width:.74em; height:.74em; margin-right:.32em; }
.empty-conversation .welcome-greeting { animation:welcome-in 200ms ease-out; }
@keyframes welcome-in { from { opacity:0; } to { opacity:1; } }
@media (prefers-reduced-motion:reduce) { .empty-conversation .welcome-greeting { animation:none; } }
.empty-conversation h1 {
  margin:var(--space-5) 0 var(--space-3); font-size:var(--text-screen); line-height:var(--leading-screen);
  font-weight:var(--weight-semibold); letter-spacing:var(--tracking-heading);
}
@media (min-width:900px) {
  .is-empty .composer-wrap { padding-bottom:12vh; }
}
@media (max-width:899px) {
  .empty-conversation h1 { margin-top:var(--space-4); font-size:var(--text-screen); line-height:var(--leading-screen); letter-spacing:var(--tracking-heading); }
  .is-empty .messages { padding-bottom:calc(var(--space-4) + 12vh); }
}

@media (max-height:540px) {
  .empty-conversation h1 { margin:0 0 var(--space-2); font-size:var(--text-screen); line-height:var(--leading-screen); }
  .is-empty .composer-wrap { padding-bottom:0; }
  .is-empty .messages { padding-bottom:var(--space-4); }
}



.request-error, .quota-lock, .limit-notice, .media-quote-status, .composer-context, .edit-model-notice, .chat-batch-notice, .entitlement-warning {
  padding:calc(var(--space-3) - 1px) var(--space-3) calc(var(--space-3) - 1px) var(--space-4);
}

.request-error, .quota-lock, .limit-notice, .media-quote-status, .chat-batch-notice, .entitlement-warning { --notice-icon-x:calc(-1 * var(--space-8)); padding-left:var(--space-12); }
:is(#request-error-message, .quota-lock > b, #limit-notice-text, .media-quote-status > span, .chat-batch-notice > p, .entitlement-warning > span) { position:relative; }
:where(#request-error-message, .quota-lock > b, #limit-notice-text, .media-quote-status > span, .chat-batch-notice > p, .entitlement-warning > span)::before {
  content:""; position:absolute; left:var(--notice-icon-x); width:var(--icon-toolbar); height:var(--icon-toolbar);
  top:calc((var(--leading-label) - var(--icon-toolbar)) / 2);
  background:var(--color-danger); -webkit-mask:var(--mask-alert) center / contain no-repeat; mask:var(--mask-alert) center / contain no-repeat;
}

:where(#request-error-message, .quota-lock > b, #limit-notice-text, .media-quote-status > span)::before { top:1px; }
:is(.quota-lock > b, .entitlement-warning > span)::before { background:var(--color-warning); }
:is(#limit-notice-text, .chat-batch-notice > p)::before { background:var(--color-text-secondary); -webkit-mask-image:var(--mask-info); mask-image:var(--mask-info); }
.limit-notice:is([data-kind="plan"], [data-kind="exhausted"]) > #limit-notice-text::before { background:var(--color-warning); -webkit-mask-image:var(--mask-alert); mask-image:var(--mask-alert); }

.request-error[data-kind="info"] > #request-error-message::before { background:var(--color-text-secondary); -webkit-mask-image:var(--mask-info); mask-image:var(--mask-info); }

.request-error > #request-error-message { flex:1 1 100%; padding-right:var(--space-8); font-size:14px; line-height:23px; }
.request-error > .notice-dismiss { position:absolute; top:var(--space-1); right:var(--space-1); width:36px; min-width:0; height:36px; min-height:0; padding:0; border:0; border-radius:var(--radius-control); background:transparent; color:var(--color-text-secondary); }
.request-error > .notice-dismiss svg { width:20px; height:20px; }
@media (hover:hover) { .request-error > .notice-dismiss:hover { background:var(--color-hover); color:var(--color-text); } }
@media (pointer:coarse) { .request-error > .notice-dismiss { top:0; right:0; width:44px; height:44px; } }

.request-error > #retry-request.is-secondary { border-color:var(--color-border-strong); background:transparent; color:var(--color-text); }
.request-error > #retry-request.is-secondary:hover:not(:disabled) { background:var(--color-hover); }

@media (max-width:640px) {
  .request-error, .quota-lock, .limit-notice, .media-quote-status, .chat-batch-notice, .entitlement-warning { --notice-icon-x:0px; padding-left:var(--space-4); }
  #request-error-message, .quota-lock > :is(b, span), #limit-notice-text, .media-quote-status > span, .chat-batch-notice > p, .entitlement-warning > span { padding-left:var(--space-8); }
  .quota-lock > button { margin-top:var(--space-3); }
}

:is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions, .chat-batch-notice, .entitlement-warning) button {
  min-height:var(--control-size); padding:0 var(--space-4); border:1px solid var(--color-border-strong); border-radius:var(--radius-control);
  font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
}
@media (pointer:coarse) { :is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions) button { padding:0 var(--space-4); } }
@media (hover:hover) and (pointer:fine) {
  :is(.request-error, .quota-lock, .limit-notice-actions, .media-quote-status, .edit-model-actions, .chat-batch-notice, .entitlement-warning) button { min-height:var(--control-compact); padding:0 var(--space-4); font-size:var(--text-label); }
}


.chat-batch-notice { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2) var(--space-4); margin:0 0 var(--space-4); border-color:var(--color-border); background:var(--color-surface); }
.chat-batch-notice[hidden] { display:none; }
.chat-batch-notice > p { flex:1 1 200px; min-width:0; margin:0; color:var(--color-text); font-size:var(--text-label); line-height:var(--leading-label); }
.chat-batch-notice > button { flex:none; background:transparent; color:var(--color-text); cursor:pointer; }
.chat-batch-notice > button:disabled { opacity:.45; cursor:default; }
@media (hover:hover) { .chat-batch-notice > button:hover:not(:disabled) { background:var(--color-hover); } }


.entitlement-warning { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-start; gap:var(--space-2) var(--space-4); margin:var(--space-2) 0; border:1px solid var(--color-border); background:var(--settings-card, var(--color-surface)); color:var(--color-text); }
.entitlement-warning[hidden] { display:none; }
.entitlement-warning > span { flex:1 1 200px; min-width:0; font-size:var(--text-label); line-height:var(--leading-label); }
.entitlement-warning > span[hidden] { display:none; }
.entitlement-warning button { flex:none; width:auto; background:transparent; color:var(--color-text); }
@media (hover:hover) { .entitlement-warning button:hover:not(:disabled) { background:var(--color-hover); } }


.composer-model-notice > summary { gap:var(--space-3); padding:0 var(--space-4) 0 calc(var(--space-4) + 1px); }
.composer-model-notice > p { padding:0 var(--space-4) 0 calc(var(--space-12) + 1px); }


.media-parameters .media-parameter-warning { padding-left:calc(var(--space-2) + var(--space-8)); }
.media-parameters .media-panel-link[data-media-quote-retry] { margin-left:calc(var(--space-2) + var(--space-8)); padding:0 var(--space-4); font-size:var(--text-label); }


.toast:has(button) { gap:var(--space-2); padding-block:0; padding-right:var(--space-1); }
.toast button { min-height:var(--control-size); margin:0; padding:0 var(--space-3); border-radius:var(--radius-control); color:var(--color-accent-text); font-weight:var(--weight-semibold); }
.toast:has(button) button { margin-left:0; }
.toast .undo-progress { height:var(--space-half); border-radius:0 0 var(--radius-control) var(--radius-control); background:var(--color-accent-text); }
@media (hover:hover) {
  .toast button:hover { background:var(--color-hover); }
}


.temporary-chat-warning, .temporary-chat-about { font-size:var(--text-secondary); line-height:var(--leading-secondary); }
@media (pointer:coarse) {
  .temporary-chat-leave::after { content:""; position:absolute; inset:calc((var(--control-compact) - var(--control-size)) / 2) 0; }
}


.voice-recorder time { display: inline-flex; align-items: center; color: var(--color-text-secondary); font: 500 14px var(--font-ui); font-variant-numeric: tabular-nums; gap:var(--space-2); font-size:var(--text-label); }
.voice-recorder time::before { background:var(--color-danger); }
@media (pointer:coarse) {
  .composer-stage > .voice-recorder { grid-template-columns:var(--control-size) minmax(0, 1fr) auto var(--control-size); gap:var(--space-2); padding:0 var(--space-2); }
  .voice-recorder .voice-icon-button { width:var(--control-size); height:var(--control-size); min-width:var(--control-size); min-height:var(--control-size); }
}


.model-tier {
  display:inline-flex; flex:none; align-items:center; gap:var(--space-1); height:var(--space-5); padding:0 var(--space-2);
  border-radius:var(--radius-pill); background:var(--color-active); color:var(--color-text);
  font-size:var(--text-caption); font-weight:var(--weight-semibold); line-height:var(--leading-caption); letter-spacing:.02em; white-space:nowrap;
}
.model-tier:has(svg) { padding-left:calc(var(--space-2) - var(--space-half)); }
.model-tier svg { width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); }
.catalog-model h3 .model-tier { margin-block:0; vertical-align:-3px; line-height:var(--leading-caption); } 


:root[data-theme="dark"] { --color-border:rgba(255, 255, 255, .10); --color-border-strong:rgba(255, 255, 255, .16); }
@media not all and (prefers-color-scheme: light) {
  :root:not([data-theme="light"]) { --color-border:rgba(255, 255, 255, .10); --color-border-strong:rgba(255, 255, 255, .16); }
}

.settings-shortcut .account-copy small { color:var(--color-text-secondary); }


.settings-shell .language-options {
  display:grid; grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); gap:0;
  padding:0; border-radius:var(--radius-control);
  background:var(--color-surface); box-shadow:inset 0 0 0 1px var(--color-border);
}
.settings-shell .language-option,
.settings-shell .language-option[aria-checked="true"] {
  display:inline-flex; align-items:center; justify-content:center; min-width:0; min-height:var(--control-size); margin:0;
  padding:0 var(--space-3); border:4px solid transparent; border-radius:var(--radius-control);
  background-clip:padding-box; background-color:transparent; box-shadow:none;
  color:var(--color-text-secondary); font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
  text-align:center; white-space:nowrap; opacity:1;
  transition:background-color var(--motion-hover) var(--ease-ui), color var(--motion-hover) var(--ease-ui);
}
.settings-shell .language-option:hover:not([aria-checked="true"]) { background-clip:padding-box; background-color:var(--color-hover); color:var(--color-text); }
.settings-shell .language-option[aria-checked="true"] { background-color:var(--color-thumb); box-shadow:inset 0 0 0 1px var(--color-border); color:var(--color-text); }
.settings-shell .language-option:focus-visible { outline:2px solid var(--color-accent); outline-offset:-4px; }
@media (prefers-reduced-motion:reduce) { .settings-shell .language-option { transition:none; } }
.settings-shell .web-logout { min-height:var(--row-settings); padding:0 var(--space-4); font-size:var(--text-body); line-height:var(--leading-body); }

.catalog-search input { min-height:var(--control-size); }

#all-chats-search, .catalog-search input, .voice-search-field input { text-overflow:ellipsis; }




:where(b, strong, th) { font-weight:var(--weight-semibold); }


.model-sheet .model-option.is-selected { background:transparent; box-shadow:inset 0 0 0 var(--border-selected) var(--color-accent); }
.model-sheet .model-option.is-selected:hover { background:var(--color-hover); }

.model-sheet .model-option:active, .model-sheet .model-option.is-selected:active { background:var(--color-active); }

#all-chats-list .chat-item[aria-checked="true"] { border-radius:var(--radius-control); background:transparent; }


.settings-detail-card,
.profile-periods,
.tariff-option,
.company-disclosure,
.answer-content .code-block,
.answer-content .table-scroll,
.usage-sheet > .usage-bars,
.usage-sheet > .credit-wallet,
.usage-sheet > .usage-model-details { border-radius:var(--radius-panel); }
.settings-detail-card > :is(button, a):first-child { border-top-left-radius:calc(var(--radius-panel) - 1px); border-top-right-radius:calc(var(--radius-panel) - 1px); }
.settings-detail-card > :is(button, a):last-child { border-bottom-left-radius:calc(var(--radius-panel) - 1px); border-bottom-right-radius:calc(var(--radius-panel) - 1px); }
.company-disclosure[open] > summary:focus-visible { border-radius:calc(var(--radius-panel) - 1px) calc(var(--radius-panel) - 1px) 0 0; }
@media (max-width:899px) {
  
  .settings-group > button:first-child { border-radius:var(--radius-panel) var(--radius-panel) 0 0; }
  .settings-group > button:last-child { border-radius:0 0 var(--radius-panel) var(--radius-panel); }
  .settings-group > button:first-child:last-child { border-radius:var(--radius-panel); }
}


.request-error, .quota-lock, .limit-notice, .media-quote-status, .composer-context, .edit-model-notice, .chat-batch-notice, .entitlement-warning {
  border-radius:var(--radius-panel); font-size:var(--text-notice); line-height:var(--leading-notice);
}
.composer-context :is(strong, p) { font-size:var(--text-notice); line-height:var(--leading-notice); }

.request-error:has(> details[open]) { align-items:flex-start; }
.request-error > details[open] { flex:0 1 auto; max-width:100%; }
#copy-request-code {
  display:flex; align-items:center; gap:var(--space-2); width:max-content; max-width:100%; min-height:var(--control-compact);
  margin:0 0 0 auto; padding:var(--space-2) var(--space-3); border:0; border-radius:var(--radius-control);
  background:var(--color-hover); color:var(--color-text-secondary); text-align:left; white-space:normal; cursor:copy;
}
#copy-request-code > svg { flex:none; width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); }
#request-support-code { display:inline; margin:0; padding:0; border-radius:0; background:none; color:inherit; font-family:var(--font-code); font-size:var(--text-meta); line-height:var(--leading-meta); overflow-wrap:anywhere; }
@media (hover:hover) { #copy-request-code:hover { background:var(--color-active); color:var(--color-text); } }
#copy-request-code:active { background:var(--color-active); }
@media (pointer:coarse) { #copy-request-code { min-height:var(--control-size); } }


.toast:not(.settings-status) {
  position-anchor:--composer; position-visibility:always;
  top:auto; bottom:calc(anchor(top, calc(env(safe-area-inset-bottom) + var(--space-4))) + var(--space-2));
  left:anchor(center, 50%); max-width:min(520px, calc(100vw - var(--space-8)));
  text-wrap:pretty;
}
html[data-telegram-safe="true"] .toast:not(.settings-status) { top:auto; }

@supports not (anchor-name:--composer) {
  .toast:not(.settings-status) { bottom:calc(env(safe-area-inset-bottom) + 178px); left:50%; }
  @media (min-width:900px) { .toast:not(.settings-status) { bottom:193px; left:calc(50% + 126px); } }
  @media (min-width:1280px) { .toast:not(.settings-status) { left:calc(50% + 136px); } }
}


:is(.delete-dialog, .edit-message-dialog) { width:min(var(--dialog-confirm-width), calc(100vw - var(--space-8))); }
:is(.context-dialog, #project-dialog, .edit-message-dialog) { width:min(var(--dialog-width), calc(100vw - var(--space-8))); }
:is(.delete-dialog, .edit-message-dialog) p { font-size:var(--text-notice); line-height:var(--leading-notice); }
:is(.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions) > button {
  min-height:var(--control-compact); padding:0 var(--space-4); border:0; border-radius:var(--radius-control);
  background:transparent; color:var(--color-text);
  font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
  transition:background-color var(--motion-hover) var(--ease-ui);
}
@media (hover:hover) {
  :is(.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions) > button:hover:not(:disabled) { background:var(--color-hover); }
}
:is(.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions) > button:active:not(:disabled) { background:var(--color-active); }

:is(.delete-dialog > div:last-child, .delete-dialog form > div) > button.primary, .edit-message-dialog #save-message-branch { background:var(--color-action); color:var(--color-on-action); }
:is(.delete-dialog > div:last-child, .delete-dialog form > div) > button.primary:is(:hover, :active):not(:disabled), .edit-message-dialog #save-message-branch:is(:hover, :active):not(:disabled) { background:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
.delete-dialog #confirm-delete, .delete-dialog #history-erase-confirm, .delete-dialog #account-delete-confirm, .delete-dialog #logout-confirm, .delete-dialog #studio-confirm-ok, .delete-dialog #chat-batch-confirm.danger { background:var(--color-danger-fill); color:var(--color-on-danger); }
.delete-dialog #confirm-delete:is(:hover, :active):not(:disabled), .delete-dialog #history-erase-confirm:is(:hover, :active):not(:disabled), .delete-dialog #account-delete-confirm:is(:hover, :active):not(:disabled), .delete-dialog #logout-confirm:is(:hover, :active):not(:disabled), .delete-dialog #studio-confirm-ok:is(:hover, :active):not(:disabled), .delete-dialog #chat-batch-confirm.danger:is(:hover, :active):not(:disabled) { background:color-mix(in srgb, var(--color-danger-fill) 86%, var(--color-bg)); }
@media (pointer:coarse), (max-width:899px) {
  :is(.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions) > button { min-height:var(--control-size); }
}
@media (prefers-reduced-motion:reduce) {
  :is(.delete-dialog > div:last-child, .delete-dialog form > div, .edit-message-dialog .dialog-actions) > button { transition:none; }
}

.context-dialog .context-mode.active { background:transparent; box-shadow:inset 0 0 0 var(--border-selected) var(--color-accent); }
.context-dialog .context-mode strong { font-size:var(--text-notice); }
.context-dialog .context-mode small { font-size:var(--text-meta); line-height:var(--leading-meta); }
.context-dialog > p { font-size:var(--text-meta); line-height:var(--leading-meta); }


@media (max-width:760px) {
  :is(.context-dialog, #project-dialog) {
    
    top:auto; right:0; bottom:var(--below); left:0; width:100%; max-width:none; max-height:calc(var(--app-height, 100dvh) - var(--space-12));
    margin:0; transform:none; overflow-y:auto; border-width:1px 0 0; border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;
    padding:var(--space-6) calc(var(--space-4) + var(--edge-right)) calc(var(--space-4) + var(--edge-bottom)) calc(var(--space-4) + var(--edge-left));
  }
  html[data-telegram-safe="true"] :is(.context-dialog, #project-dialog) { top:auto; }
  :is(.context-dialog, #project-dialog)::before {
    content:""; position:absolute; top:var(--space-2); left:50%; width:var(--sheet-handle-width); height:var(--sheet-handle-height);
    border-radius:var(--radius-pill); background:var(--color-border-strong); transform:translateX(-50%);
  }
  :is(.context-dialog, #project-dialog)[open] { animation:sheet-up var(--motion-modal) var(--ease-ui) both; }
}


.row-menu, .composer-wrap :is(.attach-menu, .thinking-menu, .media-parameters) {
  border:0; border-radius:var(--radius-control); background:var(--color-elevated); box-shadow:var(--shadow-popover);
}
.row-menu button {
  min-height:var(--menu-item-height); gap:var(--space-3); padding:0 var(--space-3);
  border-radius:var(--radius-control); color:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-regular); line-height:var(--leading-label);
}
.row-menu button svg { flex:none; width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); color:var(--color-text-secondary); }
.row-menu button.danger, .row-menu button.danger svg { color:var(--color-danger); }

.row-menu button.danger:not(:first-of-type) { position:relative; margin-top:calc(var(--space-2) + 1px); }
.row-menu button.danger:not(:first-of-type)::before {
  content:""; position:absolute; top:calc(-1 * var(--space-1) - 1px); right:calc(-1 * var(--menu-pad)); left:calc(-1 * var(--menu-pad));
  height:1px; background:var(--color-border); pointer-events:none;
}
@media (hover:hover) {
  .row-menu button:hover, .row-menu button.danger:hover { background:var(--color-hover); }
  .row-menu button:hover { color:var(--color-text); }
}
.row-menu button:active { background:var(--color-active); }

@media (min-width:641px) {
  .composer-wrap .attach-menu { gap:0; padding:var(--space-1); }
  
  .composer-wrap .attach-menu button {
    min-height:max(var(--menu-item-height), 44px); gap:var(--space-3); padding:0 var(--space-3);
    border-radius:var(--radius-control); color:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-regular); line-height:var(--leading-label);
  }
  .composer-wrap .attach-menu button svg { flex:none; width:var(--icon-small); height:var(--icon-small); stroke-width:var(--icon-stroke-small); color:var(--color-text-secondary); }
}
@media (hover:hover) { .composer-wrap .attach-menu button:hover:not(:disabled) { background:var(--color-hover); } }
.composer-wrap .attach-menu button:active:not(:disabled) { background:var(--color-active); }
.composer-wrap .attach-menu svg { color:var(--color-text-secondary); }
@media (pointer:coarse) {
  .row-menu button { min-height:var(--control-size); }
  @media (min-width:641px) { .composer-wrap .attach-menu button { min-height:var(--control-size); } }
}


.row-menu.as-sheet {
  right:var(--edge-right, 0px); bottom:var(--below); left:var(--edge-left, 0px); width:auto; max-height:calc(var(--app-height, 100dvh) - var(--space-12));
  --menu-pad:var(--space-2); padding:var(--space-6) var(--menu-pad) calc(var(--space-2) + var(--edge-bottom));
  border-radius:var(--radius-sheet) var(--radius-sheet) 0 0; box-shadow:var(--shadow-popover);
}
html[data-telegram-safe="true"] .row-menu.as-sheet {
  right:var(--edge-right); bottom:var(--below); left:var(--edge-left); max-height:calc(var(--content-height) - var(--space-6));
}
.row-menu.as-sheet .sheet-grip {
  position:absolute; top:var(--space-2); left:50%; width:var(--sheet-handle-width); height:var(--sheet-handle-height);
  margin:0; border-radius:var(--radius-pill); background:var(--color-border-strong); transform:translateX(-50%);
}
.row-menu.as-sheet button { min-height:52px; padding:0 var(--space-3); font-size:var(--text-body); line-height:var(--leading-body); }
.row-menu.as-sheet button svg { width:var(--icon-toolbar); height:var(--icon-toolbar); stroke-width:var(--icon-stroke); }

.row-menu .row-menu-head { display:flex; align-items:center; gap:var(--space-2); margin:0 calc(-1 * var(--menu-pad)) var(--space-1); padding:var(--space-2) calc(var(--space-3) + var(--menu-pad)) var(--space-3); border-bottom:1px solid var(--color-border); }
.row-menu-title { display:grid; flex:1 1 auto; min-width:0; gap:var(--space-half); }
.row-menu-title strong, .row-menu-title small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.row-menu-title strong { color:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-semibold); line-height:var(--leading-label); }
.row-menu-title small { color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption); }
.row-menu .row-menu-head .menu-close { display:none; }
.row-menu.as-sheet .row-menu-head { padding:0 calc(var(--space-3) + var(--menu-pad)) var(--space-2); }
.row-menu.as-sheet .row-menu-title strong { font-size:var(--text-body); font-weight:var(--weight-medium); line-height:var(--leading-body); }
.row-menu.as-sheet .row-menu-title small { font-size:var(--text-secondary); line-height:var(--leading-secondary); }
.row-menu.as-sheet .row-menu-head .menu-close { display:grid; place-items:center; flex:none; width:var(--control-size); height:var(--control-size); min-height:0; margin-right:calc(-1 * var(--space-3)); padding:0; color:var(--color-text-secondary); }


@media (max-width:760px) {
  
  .composer-wrap:has(> :is(#attach-menu, #thinking-menu, #media-parameters):not([hidden])) { z-index:40; }
  .composer-wrap :is(.attach-menu, .media-parameters) {
    z-index:40; top:auto !important; right:0; bottom:var(--below); left:0 !important; width:auto !important;
    max-height:calc(var(--app-height, 100dvh) - var(--space-12)) !important;
    padding:var(--space-6) calc(var(--space-2) + var(--edge-right)) calc(var(--space-2) + var(--edge-bottom)) calc(var(--space-2) + var(--edge-left));
    border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;
    box-shadow:0 0 0 1px var(--color-border), 0 0 0 100vmax var(--color-scrim);
    animation:sheet-up var(--motion-modal) var(--ease-ui) both;
  }
  .composer-wrap :is(.attach-menu, .media-parameters)::before {
    content:""; position:absolute; top:var(--space-2); left:50%; width:var(--sheet-handle-width); height:var(--sheet-handle-height);
    border-radius:var(--radius-pill); background:var(--color-border-strong); transform:translateX(-50%);
  }
  .composer-wrap .attach-menu { gap:var(--space-2); }
}


@media (max-width:760px) {
  
  .model-sheet {
    right:0; left:0 !important; width:auto !important; max-width:none; margin-bottom:calc(-1 * var(--space-3));
    padding:var(--space-6) calc(var(--space-3) + var(--edge-right)) calc(var(--space-3) + var(--edge-bottom)) calc(var(--space-3) + var(--edge-left));
    border-width:1px 0 0; border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;
    animation:sheet-up var(--motion-modal) var(--ease-ui) both;
  }
  .model-sheet::before {
    content:""; position:absolute; top:var(--space-2); left:50%; width:var(--sheet-handle-width); height:var(--sheet-handle-height);
    border-radius:var(--radius-pill); background:var(--color-border-strong); transform:translateX(-50%);
  }
}


@media (max-width:760px) and (prefers-reduced-motion:no-preference) {
  .model-sheet, .sheet-backdrop, .composer-wrap :is(.attach-menu, .thinking-menu, .media-parameters) { transition:opacity 180ms var(--ease-ui), transform 180ms var(--ease-ui), display 180ms allow-discrete; }
  .model-sheet[hidden], .composer-wrap :is(.attach-menu, .thinking-menu, .media-parameters)[hidden] { opacity:0; transform:translateY(16px); pointer-events:none; }
  .sheet-backdrop[hidden] { opacity:0; pointer-events:none; }
}


.model-sheet h2 { font-size:var(--text-headline); line-height:var(--leading-headline); }
.model-sheet-heading { min-width:0; }
.model-sheet-current { margin:0; color:var(--color-text-secondary); font-size:var(--text-caption); line-height:var(--leading-label); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (hover:hover) and (pointer:fine) {
  .model-sheet header button { width:var(--dialog-close); height:var(--dialog-close); margin-right:0; border-radius:var(--radius-control); }
  :is(.model-sheet header button, .settings-close):hover { background:var(--color-hover); color:var(--color-text); }
  :is(.model-sheet header button, .settings-close):active { background:var(--color-active); }
}
@media (max-width:899px) and (hover:hover) and (pointer:fine) {
  .settings-close { top:calc(16px + (var(--control-size) - var(--dialog-close)) / 2); right:calc(17px + (var(--control-size) - var(--dialog-close)) / 2); width:var(--dialog-close); height:var(--dialog-close); }
}


.conversation-header .limit-line .credit-ring-count:not([hidden]) { gap:var(--space-1); }
.conversation-header .limit-line .credit-ring-count:not([hidden])::after {
  content:attr(data-unit); margin-left:0; color:var(--color-text-secondary); font-weight:var(--weight-medium);
}

@media (max-width:640px) {
  .conversation-header .limit-line.has-credits { padding:0 var(--space-2); gap:0; font-size:var(--text-meta); }
  .conversation-header .limit-line .credit-ring-count:not([hidden])::before { content:""; width:16px; height:16px; }
  .conversation-header .limit-line .credit-ring-count:not([hidden])::after { content:none; }
  .conversation-header .limit-line.has-credits.is-empty { box-shadow:inset 0 0 0 1px var(--color-danger); }
}



.media-result .media-ended-mark { width:var(--icon-toolbar); height:var(--icon-toolbar); margin-top:calc((var(--leading-notice) - var(--icon-toolbar)) / 2); }
.media-result .media-ended.is-failed .media-ended-mark { color:var(--color-danger); }
.media-ended .media-ended-title { font-size:var(--text-notice); line-height:var(--leading-notice); font-weight:var(--weight-semibold); }
.media-ended .media-status-note { margin:var(--space-half) 0 0!important; color:var(--color-text-secondary); font-size:var(--text-label); line-height:var(--leading-label); }


@media (min-width:900px) {
  .settings-shell .web-logout {
    width:max-content; min-height:var(--control-compact); margin:var(--space-4) 0 0 calc(-1 * var(--space-3)); padding:0 var(--space-3);
    justify-content:flex-start; border:0; border-radius:var(--radius-control); background:transparent;
    color:var(--color-danger); font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label);
  }
  @media (hover:hover) { .settings-shell .web-logout:hover { background:var(--color-hover); } }
  .settings-shell .web-logout:active { background:var(--color-active); }
  @media (pointer:coarse) { .settings-shell .web-logout { min-height:var(--control-size); } }
}


:is(.delete-dialog, .edit-message-dialog, .context-dialog) h2, .model-sheet h2 { letter-spacing:var(--tracking-heading); }


.composer-wrap #thinking-menu.thinking-menu {
  --effort-off:#3A3A3C; --effort-off-hover:#545456; --effort-g0:#22684B; --effort-g1:#4BE3A0;
  width:max-content; min-width:272px; max-width:calc(100vw - 32px); padding:14px 14px 16px; overflow:visible;
  border:1px solid rgba(255, 255, 255, .08); border-radius:20px; background:#1C1C1E; box-shadow:0 16px 40px rgba(0, 0, 0, .6);
}
:root[data-theme="light"] .composer-wrap #thinking-menu.thinking-menu {
  --effort-off:#D6D6DC; --effort-off-hover:#C4C4CA; --effort-g0:#B9EBD4; --effort-g1:#15965F;
  border-color:rgba(0, 0, 0, .08); background:#FFFFFF; box-shadow:0 10px 30px rgba(0, 0, 0, .12), 0 1px 3px rgba(0, 0, 0, .06);
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .composer-wrap #thinking-menu.thinking-menu {
    --effort-off:#D6D6DC; --effort-off-hover:#C4C4CA; --effort-g0:#B9EBD4; --effort-g1:#15965F;
    border-color:rgba(0, 0, 0, .08); background:#FFFFFF; box-shadow:0 10px 30px rgba(0, 0, 0, .12), 0 1px 3px rgba(0, 0, 0, .06);
  }
}
.thinking-menu .effort-head { display:flex; align-items:flex-start; gap:8px; margin:0 0 12px; }
.thinking-menu .effort-titles { flex:1; min-width:0; display:grid; justify-items:start; }

.thinking-menu .effort-level {
  display:grid; margin:0; overflow:hidden; color:var(--color-text); white-space:nowrap;
  font-size:17px; line-height:22px; font-weight:var(--weight-semibold); letter-spacing:-.02em;
}
.thinking-menu .effort-level > span { grid-area:1 / 1; visibility:hidden; }
.thinking-menu .effort-level > .is-on { visibility:visible; }
.thinking-menu .effort-model {
  display:inline-flex; align-items:center; gap:2px; min-height:0; margin:1px 0 0; padding:0; border:0; border-radius:4px;
  background:none; color:var(--color-text-secondary); font:inherit; font-size:var(--text-footnote); line-height:var(--leading-footnote);
  white-space:nowrap; cursor:pointer;
}
.thinking-menu .effort-model svg { flex:none; width:10px; height:10px; stroke-width:1.4; }
.thinking-menu .effort-reset {
  flex:none; display:grid; place-items:center; width:28px; height:28px; min-height:0; margin:-3px -4px 0 0; padding:0;
  border:0; border-radius:9px; background:transparent; color:var(--color-text-secondary); cursor:pointer;
}
.thinking-menu .effort-reset svg { width:15px; height:15px; stroke-width:1.5; }
@media (hover:hover) {
  .thinking-menu .effort-model:hover { color:var(--color-text); }
  .thinking-menu .effort-reset:hover { background:var(--color-hover); color:var(--color-text); }
}
.thinking-menu .effort-reset:active { background:var(--color-active); }
.thinking-menu :is(.effort-model, .effort-reset):focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }

.thinking-menu .effort-wedge:focus { outline:none; }
.thinking-menu:not([data-pointer]) .effort-wedge:focus-visible::after {
  content:""; position:absolute; inset:-4px; border-radius:10px; pointer-events:none;
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--effort-g1) 55%, transparent);
}

.thinking-menu .effort-wedge {
  position:relative; height:32px; border-radius:6px; cursor:pointer;
  touch-action:none; -webkit-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent;
}
.thinking-menu .effort-wedge svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.thinking-menu .effort-wedge path {
  fill:var(--effort-off); stroke:var(--effort-off); stroke-width:3; stroke-linejoin:round;
  transition:fill 220ms var(--ease-ui), stroke 220ms var(--ease-ui);
}
.thinking-menu .effort-wedge path.is-on { --c:color-mix(in srgb, var(--effort-g1) calc(var(--t) * 100%), var(--effort-g0)); fill:var(--c); stroke:var(--c); }
.thinking-menu .effort-wedge path.is-hover { fill:var(--effort-off-hover); stroke:var(--effort-off-hover); }

@media (max-width:480px) {
  .composer-wrap #thinking-menu.thinking-menu { min-width:0; padding:16px 16px 18px; }
  .thinking-menu .effort-wedge { height:40px; }
}
@media (prefers-reduced-motion:reduce) { .thinking-menu .effort-wedge path { transition:none; } }


html:root .composer-wrap .composer #thinking-control.thinking-control {
  container-type:normal; position:static; justify-self:end; width:max-content; max-width:100%; min-width:0;
  gap:7px; height:32px; min-height:32px; padding:0 12px 0 11px; border:0; border-radius:16px;
  background-color:var(--color-hover); box-shadow:none; color:var(--color-text);
  font-size:var(--text-meta); font-weight:var(--weight-medium); line-height:var(--leading-meta);
}
html:root .composer-wrap .composer #thinking-control.thinking-control:is(:hover:not(:disabled), [aria-expanded="true"]) { background-color:var(--color-active); }
html:root .composer-wrap .composer #thinking-control.thinking-control::after {
  --effort-up:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7.5 3-3 3 3'/%3E%3C/svg%3E");
  content:""; display:block; flex:none; width:12px; height:12px; background:var(--color-text-secondary); transform:none;
  -webkit-mask:var(--effort-up) center / 12px 12px no-repeat; mask:var(--effort-up) center / 12px 12px no-repeat;
}
html:root .composer-wrap .composer #thinking-control.thinking-control > .reply-effort { position:static; width:auto; height:auto; clip-path:none; }
html:root .composer-wrap .composer #thinking-control.thinking-control.is-compact > .reply-effort { display:none; }

html:root .composer-wrap .composer { container:composer / inline-size; }
@container composer (max-width:520px) {
  html:root .composer-wrap .composer #thinking-control.thinking-control > .reply-effort { display:none; }
}
@media (min-width:641px) {
  @container composer (max-width:380px) {
    html[data-design="leaders"] .composer .composer-controls .model-pill > .model-pill-mark { display:none; }
  }
  @container composer (max-width:350px) {
    html[data-design="leaders"] .composer .composer-controls .model-pill > svg:last-child { display:none; }
    html:root .composer-wrap .composer #thinking-control.thinking-control { padding:0 10px; }
    html:root .composer-wrap .composer #thinking-control.thinking-control::after { display:none; }
  }
}
#thinking-control .effort-glyph { display:inline-flex; flex:none; align-items:flex-end; gap:1.5px; height:12px; }
#thinking-control .effort-glyph b { width:3px; height:calc(3px + 9px * var(--i)); border-radius:1px; background:var(--color-text-secondary); opacity:.35; }
#thinking-control .effort-glyph b.is-on { background:currentColor; opacity:1; }


:is(.media-result-footer button, #edit-model-notice button) { position:relative; }
:is(.media-result-footer button, #edit-model-notice button)::after { content:""; position:absolute; inset:min(0px, calc(50% - 22px)) 0; }


.guest-login { display: none; }
.guest-code { display: none; }
.guest-mode .guest-login { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 var(--space-4); border-radius: var(--radius-pill); color: var(--color-on-action); background: var(--color-action); font-size: 15px; font-weight: 600; white-space: nowrap; }
.guest-mode .guest-login:hover { background: color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
.guest-mode #limit-line, .guest-mode #chat-more, .guest-mode #temporary-chat-toggle, .guest-mode #composer-quick-actions,
.guest-mode #attach-control, .guest-mode #thinking-control, .guest-mode #media-settings, .guest-mode #voice-control,
.guest-mode #web-toggle, .guest-mode .settings-shortcut { display: none !important; }
.guest-mode .conversation-header { grid-template-columns: minmax(0, 1fr) auto var(--navigation-size); gap: var(--space-2); }
.guest-mode .conversation-header > .conversation-title { grid-column: 1; }
.guest-mode .conversation-header > .guest-login { grid-column: 2; grid-row: 1; }
.guest-mode .conversation-header > .header-new-chat { display: grid; grid-column: 3; grid-row: 1; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--color-text-secondary); background: transparent; }
.guest-mode .conversation-header > .header-new-chat svg { width: 20px; height: 20px; }
.guest-mode .conversation-header > .header-new-chat:hover { background: var(--color-hover); }

@media (max-width:899px) {
  .guest-mode .conversation-header { grid-template-columns: var(--navigation-size) minmax(0, 1fr) auto var(--navigation-size); }
  .guest-mode .conversation-header > .conversation-title { grid-column: 2; }
  .guest-mode .conversation-header > .guest-login { grid-column: 3; }
  .guest-mode .conversation-header > .header-new-chat { grid-column: 4; }
}

.guest-mode .composer-controls .model-pill { grid-column: 1 / -1; }

.sidebar-guest[hidden] { display:none; }
.guest-mode .sidebar-guest { display:grid; gap:var(--space-2); }
.sidebar-guest p { margin:0; padding:0 var(--space-3); color:var(--color-text-secondary); font-size:var(--text-caption); line-height:var(--leading-caption); }
.sidebar-guest button { min-height:40px; border-radius:var(--radius-pill); color:var(--color-on-action); background:var(--color-action); font-size:15px; font-weight:600; }
.sidebar-guest button:hover { background:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }
.sidebar-guest-about { display:flex; align-items:center; gap:var(--space-3); min-height:var(--row-height); padding:0 var(--space-3); border-radius:var(--radius-control); color:var(--text-soft); font-size:var(--text-nav); line-height:var(--leading-nav); font-weight:500; text-decoration:none; }
.sidebar-guest-about svg { width:var(--icon-toolbar); height:var(--icon-toolbar); color:var(--muted); }
.sidebar-guest-about:hover { color:var(--text); background:var(--surface); }
@media (max-width:899px) { .sidebar-guest button { min-height:44px; } .sidebar-guest-about { min-height:var(--control-size); } }

.guest-locked { display:grid; flex:1; min-height:0; align-content:center; justify-items:center; gap:var(--space-3); padding:0 0 15vh; text-align:center; }
.guest-locked-mark { width:40px; height:40px; color:var(--color-text-tertiary); }

.guest-locked-examples { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--space-3); width:min(100%, 520px); margin-bottom:var(--space-2); }
.guest-locked-examples[hidden], .guest-locked-mark[hidden] { display:none; }
.guest-locked-examples figure { display:grid; gap:var(--space-2); margin:0; }
.guest-locked-examples img { width:100%; aspect-ratio:4 / 3; object-fit:cover; border-radius:var(--radius-panel); background:var(--color-surface); }
.guest-locked-examples figcaption { color:var(--color-text-secondary); font-size:var(--text-caption); line-height:1.3; }

@media (min-width:1100px) { .guest-locked-examples { grid-template-columns:repeat(4, minmax(0, 1fr)); width:100%; } }
.guest-locked p { max-width:320px; margin:0; color:var(--color-text-secondary); font-size:var(--text-body); line-height:1.5; }
.guest-locked button { min-height:44px; margin-top:var(--space-2); padding:0 var(--space-6); border-radius:var(--radius-pill); color:var(--color-on-action); background:var(--color-action); font-size:15px; font-weight:600; }
.guest-locked button:hover { background:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }

.composer-guest-lock[hidden] { display:none; }
.composer-guest-lock { grid-area:input; display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); min-height:44px; padding-left:var(--space-1); color:var(--color-text-secondary); font-size:var(--text-input); line-height:1.4; }
.composer-guest-lock button { flex:none; min-height:44px; padding:0 var(--space-4); border-radius:var(--radius-pill); color:var(--color-on-action); background:var(--color-action); font-size:15px; font-weight:600; }
.composer-guest-lock button:hover { background:color-mix(in srgb, var(--color-action) 86%, var(--color-bg)); }

.composer.is-guest-locked .composer-controls > * { visibility:hidden; }

.composer.is-guest-locked { grid-template-areas:"actions actions actions" "input input input" "controls controls controls"; }
.composer.is-guest-locked > :is(textarea, .composer-attachments, .voice-button, .send-button), .composer.is-guest-locked .composer-controls > :not(.model-pill) { display:none; }
.model-option.is-locked strong { color: var(--muted); }
.model-option.is-locked .model-brand { opacity: .5; }
.model-locked { display: block; grid-column: 1 / -1; margin-top: 2px; color: var(--muted); font-size: var(--fs-small); line-height: 1.3; }
.guest-model-hint { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin: var(--space-1) 0 var(--space-2); padding: var(--space-1) var(--space-1) var(--space-1) var(--space-3); border-radius: var(--radius-control); background: var(--color-hover); color: var(--color-text-secondary); font-size: 15px; line-height: 1.4; }
.guest-model-hint button { flex: none; min-height: 44px; padding: 0 var(--space-4); border-radius: var(--radius-pill); color: var(--color-on-action); background: var(--color-action); font-size: 15px; font-weight: 600; }
.delete-dialog #guest-new-confirm { color: var(--color-on-danger); background: var(--color-danger-fill); }

.guest-mode .composer-disclaimer:not(.guest-links) { display:none; }
html[data-design="leaders"] body.guest-mode :is(#attach-control, #voice-control) { display:inline-flex !important; opacity:.45; }

html[data-design="leaders"] body.guest-mode .composer.is-guest-locked #voice-control { display:none !important; }
html[data-design="leaders"] body.guest-mode :is(#attach-control, #voice-control):hover { opacity:.7; }

html[data-design="leaders"] body.guest-mode .composer-controls .model-pill { grid-column:auto; }
.guest-links[hidden] { display:none; }
.guest-mode .guest-links { display:flex; justify-content:center; gap:var(--space-4); }
.guest-links a { position:relative; color:inherit; text-decoration:none; }
.guest-links a::after { content:""; position:absolute; inset:calc(50% - 22px) -4px; }
@media (hover:hover) { .guest-links a:hover { color:var(--color-text); } }


.settings-group-title { margin:var(--space-6) 0 var(--space-2); color:var(--color-text); font-size:var(--text-label); line-height:var(--leading-label); font-weight:var(--weight-semibold); }
.settings-view-title + .settings-group-title { margin-top:var(--space-6); }
#profile-sub { margin:var(--space-1) 0 0; color:var(--color-text-secondary); font-size:var(--text-label); line-height:var(--leading-label); }
.text-link {
  position:relative; display:inline; min-width:0; min-height:0; padding:0; border:0; background:none; color:var(--color-text); font:inherit;
  text-decoration:underline; text-underline-offset:3px; cursor:pointer;
}

.text-link::after { content:""; position:absolute; inset:-14px -10px; }
.settings-detail-card .row-copy { display:grid; justify-items:start; gap:var(--space-half); min-width:0; text-align:left; }
.row-copy strong { color:var(--color-text); font-size:var(--text-body); line-height:var(--leading-body); font-weight:var(--weight-regular); }
.row-copy small { color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption); }
.settings-detail-card .row-value { display:flex; flex:none; align-items:center; gap:var(--space-1); }
.settings-detail-card .row-value b, .settings-detail-card .settings-row > b { flex:none; white-space:nowrap; }
.settings-detail-card .row-icon-button {
  display:grid; flex:none; place-items:center; justify-content:center; width:var(--control-size); height:var(--control-size); min-height:0; margin:0 calc(-1 * var(--space-3)) 0 0; padding:0;
  border:0; border-radius:var(--radius-control); color:var(--color-text-secondary); background:transparent;
}
.settings-detail-card .row-icon-button svg { width:var(--icon-toolbar); height:var(--icon-toolbar); stroke-width:var(--icon-stroke); }
@media (hover:hover) { .settings-detail-card .row-icon-button:hover { color:var(--color-text); background:var(--color-hover); } }
.settings-detail-card .row-icon-button:active { background:var(--color-active); }
.settings-device-title:has(+ .web-logout[hidden]) { display:none; }

.credit-history-head { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); margin:0 0 var(--space-2); }
.credit-history-head h2 { min-width:0; margin:0; }
.credit-history-head .dialog-close {
  display:grid; flex:none; place-items:center; justify-content:center; width:var(--control-size); height:var(--control-size); margin:calc(-1 * var(--space-2)) calc(-1 * var(--space-2)) 0 0; padding:0;
  border:0; border-radius:var(--radius-control); color:var(--color-text-secondary); background:transparent;
}
.credit-history-head .dialog-close svg { width:var(--icon-toolbar); height:var(--icon-toolbar); }
@media (hover:hover) and (pointer:fine) {
  .credit-history-head .dialog-close { width:var(--dialog-close); height:var(--dialog-close); min-width:0; min-height:0; margin:calc(-1 * var(--space-half)) calc(-1 * var(--space-2)) 0 0; }
  .credit-history-head .dialog-close:hover { color:var(--color-text); background:var(--color-hover); }
}
.credit-history-head .dialog-close:active { background:var(--color-active); }
.credit-history-list { max-height:min(60dvh, 440px); margin-top:var(--space-2); overflow-y:auto; overscroll-behavior:contain; }
.credit-history-list.is-fading { -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - 40px), transparent); mask-image:linear-gradient(to bottom, #000 calc(100% - 40px), transparent); }
.credit-op { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); min-height:var(--row-settings); padding:var(--space-3) 0; border-top:1px solid var(--color-border); }
.credit-op:first-child { border-top:0; }
.credit-op-copy { display:grid; gap:var(--space-half); min-width:0; }
.credit-op-copy strong { font-size:var(--text-notice); line-height:var(--leading-notice); font-weight:var(--weight-medium); }
.credit-op-copy small { color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); }
.credit-op-sum { flex:none; font-size:var(--text-notice); line-height:var(--leading-notice); font-weight:var(--weight-semibold); font-variant-numeric:tabular-nums; white-space:nowrap; }
.credit-op-sum.is-settled { color:var(--color-text-secondary); font-weight:var(--weight-medium); }
.credit-history-empty { margin:0; padding:var(--space-8) 0; color:var(--color-text-secondary); text-align:center; }


@media (min-width:900px) {
  .settings-close { align-self:start; margin-right:calc(-1 * var(--space-3)); }
  .settings-view-title { margin-bottom:var(--space-6); }
  .settings-view-title h2 { font-size:var(--text-section); line-height:var(--leading-section); }
  .settings-view[data-settings-view="profile"] .settings-view-title h2 { font-size:var(--text-screen); line-height:var(--leading-screen); }
  .settings-shell :is(.settings-detail-card, .plan-stats, .profile-periods, .usage-sheet > .usage-bars, .usage-sheet > .credit-wallet, .usage-sheet > .usage-model-details) {
    border:0; border-radius:0; background:transparent;
  }
  .settings-shell :is(.settings-detail-card > :is(.settings-row, button), .plan-stats > span, .profile-periods > :is(div, button), .usage-sheet .usage-row,
    .usage-sheet .credit-wallet > :is(h3, .credit-total, .credit-expiry, button, details > summary), .usage-sheet .usage-model-details > summary,
    .usage-sheet .usage-model-details .usage-model-limits dl > div) { padding-inline:0; }
  .settings-shell .usage-sheet .credit-wallet > .credit-total { padding-left:var(--space-3); }
  
  .settings-shell [data-settings-view="usage"] :is(.profile-periods, .usage-sheet > :is(.usage-bars, .credit-wallet, .usage-model-details)) { margin:0; border-top:1px solid var(--color-border); }
  .settings-shell .usage-sheet .usage-bars { padding-block:var(--space-1); }
  .settings-shell .usage-sheet .credit-wallet > h3 { padding-left:0; }
  .settings-shell .usage-sheet > :is(.usage-how, .usage-extra, .usage-empty) { margin:var(--space-4) 0 0; }
  .settings-shell .settings-detail-card > :is(.settings-row, button):last-child { border-bottom:0; }
  .settings-shell :is(.settings-detail-card > button, .usage-sheet .credit-wallet button, .usage-sheet summary, .profile-periods .plan-manage):hover { background:transparent; }
}


@media (min-width:900px) {
  .settings-shell .tariff-catalog { gap:0; border-top:1px solid var(--color-border); }
  .settings-shell .tariff-option { padding:0 var(--space-3); border:0; border-bottom:1px solid var(--color-border); border-radius:0; background:transparent; }
  .settings-shell .tariff-option.is-current { background:var(--color-hover); }
  .settings-shell .tariff-option summary { grid-template-columns:104px minmax(0,1fr) auto var(--icon-small); gap:0 var(--space-4); min-height:64px; }
  .settings-shell .tariff-option .tariff-option-name { grid-column:1; grid-row:1; flex-direction:column; align-items:flex-start; gap:var(--space-half); }
  .settings-shell .tariff-option .tariff-credit-summary { grid-column:2; grid-row:1; }
  .settings-shell .tariff-option summary > b { grid-column:3; grid-row:1; font-weight:var(--weight-semibold); }
  .settings-shell .tariff-option summary::after { grid-column:4; }
  .settings-shell .tariff-option .tariff-current { height:auto; padding:0; border-radius:0; background:none; color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); font-weight:var(--weight-regular); }
  .settings-shell .tariff-option > ul { margin:0 0 var(--space-3) calc(104px + var(--space-4)); }
  .settings-shell .tariff-option .tariff-pay { display:inline-flex; margin:0 0 var(--space-4) calc(104px + var(--space-4)); padding:0 var(--space-6); }
  .settings-view[data-settings-view="billing"] .settings-back { display:inline-flex; }
  .settings-shell #billing-open { margin-top:var(--space-6); }
  .settings-shell #plan-credit-packs { margin-top:var(--space-8); }
  .settings-shell #plan-credit-packs .credit-packs { grid-template-columns:repeat(2, minmax(0, 1fr)); column-gap:var(--space-8); border:0; border-bottom:1px solid var(--color-border); border-radius:0; background:transparent; }
  .settings-shell #plan-credit-packs .credit-packs button { padding-inline:0; border-top:1px solid var(--color-border); }
}


@media (max-width:640px) { .media-stage { border-radius:12px; } }
@media (hover:hover) and (pointer:fine) { .request-error button:not(.notice-dismiss) { min-height:44px; } }


@media (max-width:640px) {
  .composer { column-gap:0; }
  .composer .composer-controls { grid-template-columns:36px minmax(0,1fr) max-content; }
  #attach-control { width:44px; margin-left:calc(-1 * var(--space-2)); }
}
@media (max-width:430px) {
  .composer-controls .model-pill > .model-pill-mark { display:none; }
  #thinking-control::after { display:none; }
  
  #thinking-control { padding:0 var(--space-1); font-size:var(--text-meta); }
  .composer-controls .model-pill { gap:var(--space-1); padding-right:0; }
}
@media (min-width:360px) and (max-width:640px) {
  .composer:has(.send-button.has-price) { grid-template-areas:"actions actions actions" "input input input" "controls voice send"; }
  .composer:has(.send-button.has-price):has(.composer-attachments:not(:empty)) { grid-template-areas:"actions actions actions" "attachments attachments attachments" "input input input" "controls voice send"; }
}

@media (max-width:640px) {
  .composer-actions:has(> #media-settings:not([hidden])) { justify-self:stretch; max-width:calc(100% + var(--space-1)); }
  .composer-actions:has(> #media-settings:not([hidden])) > button { flex:none; }
  .composer-actions > #media-settings { margin-left:auto; }
  .composer-actions > #media-settings svg { display:block; }
  .composer-actions.is-tight > button:not(#media-settings) { padding:0 6px; }
  .composer-actions.is-tight > #media-settings { padding-right:var(--space-2); }
  .composer-actions.is-tight > #media-settings::after { display:none; }
  .composer-actions.is-compact > #media-settings .media-settings-copy { display:none; }
  .composer-actions.is-crowded > #action-tools { width:32px; min-width:32px; }
  .composer-actions.is-crowded.is-compact > button:not(#media-settings) { padding:0 4px; }
}


@media (max-width:899px) { html[data-telegram-safe="true"] .settings-status { top:auto; } }


.composer-wrap .attach-menu button:disabled { display:none; }


.attachment-chip.inline-photo:has(> img[hidden]) { display:grid; place-items:center; width:160px; height:120px; margin-top:var(--space-2); padding:0; border:0; border-radius:var(--radius-panel); background:var(--color-hover); }
.attachment-chip.inline-photo:has(> img[hidden]) > :is(span, b) { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.attachment-chip.inline-photo .photo-wait { width:24px; height:24px; color:var(--color-text-tertiary); }


.photo-actions { padding:var(--space-2) 0 0; }
.media-result .media-actions-note { margin:0; padding:0 0 var(--space-1); color:var(--color-text-secondary); font-size:var(--text-caption); line-height:var(--leading-caption); }


@media (max-width:640px) {
  .composer-actions > .action-tools { padding:0 8px; }
  .composer-actions > .action-tools svg { display:block; }
  .composer-actions > .action-tools span { display:none; }
}
.tools-list { display:flex; flex-direction:column; }
.tools-group { margin:var(--space-5) 0 var(--space-2); color:var(--color-text-secondary); font-size:var(--text-label); font-weight:var(--weight-medium); line-height:var(--leading-label); }
.tools-group:first-child { margin-top:0; }
.tools-row, .composition-row {
  display:flex; width:100%; min-height:56px; align-items:center; gap:var(--space-3); margin:0; padding:var(--space-2) var(--space-3);
  border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; color:var(--text); font:inherit; text-align:left; cursor:pointer;
}
.tools-row:last-child, .composition-row:last-child { border-bottom:0; }
.tools-row:hover, .composition-row:hover:not(:disabled) { background:var(--color-hover); }
.tools-row-static, .tools-row-static:hover { background:transparent; cursor:default; }
.tools-row > svg, .composition-row-index { display:grid; flex:none; width:36px; height:36px; place-items:center; border-radius:var(--radius-control); color:var(--color-accent-text); background:var(--color-accent-subtle); }
.tools-row > svg { padding:8px; }
.composition-row-index { font-size:var(--text-label); font-weight:var(--weight-semibold); }
.composition-row-index svg { width:20px; height:20px; }
.tools-row > span, .composition-row-body { display:flex; min-width:0; flex:1; flex-direction:column; gap:2px; }
.tools-row b, .composition-row-body b { overflow:hidden; font-weight:var(--weight-medium); text-overflow:ellipsis; white-space:nowrap; }
.tools-row small, .composition-row-body small { overflow:hidden; color:var(--color-text-secondary); font-size:var(--fs-small); text-overflow:ellipsis; white-space:nowrap; }
.tools-row-chevron, .composition-row-chevron { flex:none; width:18px; height:18px; color:var(--color-text-tertiary); }
.composition-row:disabled { color:var(--color-text-tertiary); cursor:default; }
.composition-row:disabled .composition-row-index { color:var(--color-text-tertiary); background:var(--color-hover); }
.composition-row-static { cursor:default; }
.composition-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:var(--space-6); align-items:start; padding-bottom:var(--space-8); }
.composition-name input, .composition-input { width:100%; min-height:44px; padding:0 var(--space-3); border:1px solid var(--line); border-radius:var(--radius-control); background:var(--panel); color:var(--text); font:inherit; font-size:var(--text-input); }

.composition-name-row { display:flex; align-items:center; gap:var(--space-2); }
.composition-name-row .composition-name { flex:1 1 auto; min-width:0; }
.composition-more { position:relative; flex:none; }
.composition-more > summary { display:grid; width:44px; height:44px; place-items:center; border-radius:50%; color:var(--color-text-secondary); cursor:pointer; list-style:none; }
.composition-more > summary::-webkit-details-marker { display:none; }
.composition-more > summary:hover, .composition-more[open] > summary { background:var(--color-hover); color:var(--text); }
.composition-more > summary svg { width:20px; height:20px; }

.composition-more-menu { position:absolute; z-index:5; top:calc(100% + 4px); right:0; min-width:200px; padding:var(--space-1); border-radius:var(--radius-control); background:var(--color-elevated); box-shadow:var(--shadow-popover); }
.composition-more-menu button { display:flex; width:100%; min-height:var(--menu-item-height); align-items:center; gap:var(--space-3); padding:0 var(--space-3); border-radius:var(--radius-control); color:var(--color-text); background:transparent; font-size:var(--text-label); text-align:left; }
.composition-more-menu button:hover { background:var(--color-hover); }
.composition-more-menu button.danger, .composition-more-menu button.danger svg { color:var(--color-danger); }
.composition-more-menu svg { flex:none; width:var(--icon-small); height:var(--icon-small); }
.composition-name input { padding:0; border-color:var(--line); border-radius:0; border-width:0 0 1px; background:transparent; font-size:var(--text-body); font-weight:var(--weight-semibold); letter-spacing:var(--tracking-heading); }
.composition-name input::placeholder { color:var(--color-text-tertiary); font-weight:var(--weight-regular); }
.composition-name input:hover { border-color:var(--color-text-tertiary); }
.composition-name input:focus-visible, .composition-input:focus-visible { outline:none; border-color:var(--color-focus-border); }
.composition-main { display:flex; min-width:0; flex-direction:column; gap:var(--space-4); }
.composition-card { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius-control); background:var(--panel); }
.composition-card-head { display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-3); padding:var(--space-3) var(--space-3) var(--space-2); }
.composition-card-head h2 { margin:0; font-size:var(--text-body); font-weight:var(--weight-semibold); }
.composition-card-head span { color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-card .composition-row:first-of-type { border-top:1px solid var(--line); }

.composition-starters .composition-row:first-of-type { border-top:0; }

.composition-script > .composition-field, .composition-script > .composition-issue, .composition-script > .composition-script-idea,
.composition-script > .composition-script-check, .composition-script > .composition-script-actions { margin:0 var(--space-3) var(--space-3); }
.composition-script > .composition-note { padding:0 var(--space-3) var(--space-3); }
.composition-script-idea { margin:0; color:var(--color-text-secondary); font-size:var(--fs-small); line-height:1.45; }
.composition-script-actions { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2); }
.composition-script-actions .composition-link { margin-left:auto; }
.composition-script-wait { height:3px; margin:0 var(--space-3) var(--space-3); overflow:hidden; border-radius:2px; background:var(--line); }
.composition-script-wait span { display:block; width:35%; height:100%; border-radius:inherit; background:var(--color-text-secondary); animation:composition-script-wait 1.4s ease-in-out infinite; }
@keyframes composition-script-wait { 0% { transform:translateX(-100%); } 100% { transform:translateX(300%); } }
@media (prefers-reduced-motion: reduce) { .composition-script-wait span { width:100%; animation:none; opacity:.4; } }
.composition-script-scenes { margin:0 0 var(--space-3); padding:0; list-style:none; border-top:1px solid var(--line); }
.composition-script-scene { display:grid; grid-template-columns:24px minmax(0,1fr) auto; gap:var(--space-2); padding:var(--space-3); border-bottom:1px solid var(--line); }
.composition-script-n { color:var(--color-text-tertiary); font-size:var(--fs-small); font-variant-numeric:tabular-nums; line-height:1.5; }
.composition-script-sec { color:var(--color-text-tertiary); font-size:var(--fs-small); font-variant-numeric:tabular-nums; white-space:nowrap; line-height:1.5; }
.composition-script-words { margin:0 0 var(--space-1); font-size:var(--text-body); line-height:1.45; }
.composition-script-shot { margin:0; color:var(--color-text-secondary); font-size:var(--fs-small); line-height:1.45; }
.composition-script-shot span { margin-right:var(--space-1); color:var(--color-text-tertiary); }
.composition-script-scene small { display:block; margin-top:var(--space-1); color:var(--color-accent-text); font-size:var(--fs-small); }
.composition-script-check { padding:var(--space-3); border-radius:var(--radius-control); background:color-mix(in srgb, var(--color-text) 5%, transparent); font-size:var(--fs-small); line-height:1.45; }
.composition-script-check ul { margin:var(--space-1) 0 0; padding-left:1.2em; color:var(--color-text-secondary); }
.composition-script[data-state="approved"] .composition-row:first-of-type { border-top:0; }
.composition-starters > .composition-note { padding:var(--space-3) var(--space-4) var(--space-4); }
.composition-parts .composition-row { min-height:52px; }
.composition-parts .composition-row:first-of-type { border-top:0; }
.composition-parts .composition-row-index { color:var(--color-text-secondary); background:transparent; }
.composition-parts .composition-row:disabled .composition-row-index { background:transparent; }
.composition-parts .composition-row[data-state="empty"] .composition-row-body small { color:var(--color-text-tertiary); }
.composition-issue { margin:0; padding:var(--space-3); border-radius:var(--radius-control); color:var(--color-danger); background:color-mix(in srgb, var(--color-danger) 10%, transparent); font-size:var(--fs-small); line-height:1.45; }
.composition-note { margin:0; color:var(--color-text-secondary); font-size:var(--fs-small); line-height:1.45; }
.composition-note:empty { display:none; }
.composition-actions { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); }
.composition-actions > .composition-primary { gap:8px; }
.composition-actions > .composition-primary svg { width:20px; height:20px; }
.composition-actions-note { flex:1 1 100%; text-align:center; }
.composition-primary { display:flex; min-height:48px; flex:1; align-items:center; justify-content:center; border-radius:var(--radius-control); color:var(--on-accent); background:var(--green); font-size:var(--fs-body); font-weight:var(--weight-semibold); }
.composition-primary:hover:not(:disabled) { background:var(--green-strong); }
.composition-primary:disabled { color:var(--color-text-tertiary); background:var(--color-active); cursor:default; }
.composition-secondary { display:inline-flex; min-height:44px; align-items:center; gap:var(--space-2); padding:0 var(--space-3); border:1px solid var(--line); border-radius:var(--radius-control); background:transparent; color:var(--text); font-size:var(--fs-small); font-weight:var(--weight-medium); }
.composition-secondary:hover:not(:disabled) { background:var(--color-hover); }
.composition-secondary svg { width:18px; height:18px; }
.composition-secondary[data-danger] { color:var(--color-danger); }
.composition-secondary[data-composition-action="move-down"] svg { transform:rotate(-90deg); }
.composition-secondary[data-composition-action="move-up"] svg { transform:rotate(90deg); }
.composition-result-meta { margin:0; padding:0 var(--space-3); color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-result .composition-issue, .composition-result .composition-note { margin:var(--space-2) var(--space-3) 0; }
.composition-result-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); padding:var(--space-3); }
.composition-result-actions:empty { padding:var(--space-2); }
.composition-result[data-status="running"] .composition-card-head span, .composition-result[data-status="queued"] .composition-card-head span { color:var(--color-accent-text); }
.composition-delete { align-self:flex-start; min-height:44px; padding:0 var(--space-2); background:transparent; color:var(--color-text-tertiary); font-size:var(--fs-small); }
.composition-delete:hover { color:var(--color-danger); }

.composition-link { align-self:center; min-height:44px; padding:0 var(--space-3); background:transparent; color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-link:hover { color:var(--color-text); }
.composition-detail { display:flex; min-width:0; flex-direction:column; gap:var(--space-4); }
.composition-detail-head { display:flex; align-items:center; gap:var(--space-2); }
.composition-detail-head h2 { margin:0; font-size:var(--text-body); font-weight:var(--weight-semibold); }
.composition-detail-back { display:none; min-height:44px; align-items:center; gap:4px; padding:0 var(--space-2) 0 0; background:transparent; color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-detail-back svg { width:20px; height:20px; }
.composition-detail-body { display:flex; flex-direction:column; gap:var(--space-4); padding:var(--space-4); border:1px solid var(--line); border-radius:var(--radius-control); background:var(--panel); }
.composition-detail-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); padding-top:var(--space-2); }
.composition-detail-actions > button { white-space:nowrap; }

.composition-why { flex:1 1 100%; margin:0; color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-detail-actions:not(:has(> .composition-primary:disabled)) > .composition-why { display:none; }
.composition-detail-actions > .composition-primary { min-width:max-content; padding-inline:var(--space-4, 16px); }
.composition-field { display:flex; flex-direction:column; gap:var(--space-2); }
.composition-field-label { display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-3); font-size:var(--fs-small); color:var(--color-text-secondary); }
.composition-field-label output { color:var(--text); font-weight:var(--weight-medium); font-variant-numeric:tabular-nums; }
.composition-field input[type="range"] { width:100%; height:44px; margin:0; accent-color:var(--color-accent); background:transparent; }
.composition-switch { padding:0; min-height:44px; }
.composition-choice { gap:var(--space-2); }
.composition-choice.is-grid { display:grid; grid-template-columns:repeat(var(--cols), minmax(0, 1fr)); }
@media (min-width:768px) { .composition-choice.is-grid { grid-template-columns:repeat(var(--cols-wide), minmax(0, 1fr)); } }

.composition-choice button { min-height:44px; border:1px solid var(--line); font-size:var(--fs-small); }
.composition-choice button[aria-pressed="true"] { border-color:transparent; }

.composition-chips { display:flex; flex-wrap:wrap; gap:var(--space-2); }
.composition-chip { min-height:44px; margin:0; padding:0 var(--space-4); border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--text); font:inherit; font-size:var(--fs-small); cursor:pointer; }
.composition-chip[aria-pressed="true"] { border-color:var(--text); background:var(--color-active); font-weight:var(--weight-medium); }
.composition-chip:disabled { opacity:.5; cursor:default; }
.composition-music-takes { display:flex; flex-direction:column; gap:var(--space-4); }
.composition-music-take { display:flex; min-width:0; flex-direction:column; gap:var(--space-2); padding-top:var(--space-4); border-top:1px solid var(--line); }
.composition-music-take:first-child { padding-top:0; border-top:0; }
.composition-music-take .composition-detail-actions { padding-top:0; }
.composition-music-cover { width:96px; aspect-ratio:1; object-fit:cover; border-radius:var(--radius-control); background:var(--line); }
.composition-music-take .composition-primary, .composition-music-take .composition-secondary { white-space:nowrap; display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2); }
@media (min-width:900px) { .composition-music-takes { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-5); } .composition-music-take, .composition-music-take:first-child { padding-top:0; border-top:0; } }

.studio-voices { display:flex; flex-direction:column; margin:0; padding:0; gap:2px; list-style:none; }
.studio-voice { display:flex; align-items:center; gap:var(--space-2); min-height:56px; padding:0 var(--space-3) 0 var(--space-2); border-radius:var(--radius-control); }
.studio-voice-play { flex:none; display:grid; width:44px; height:44px; margin:0; padding:0; place-items:center; border:0; border-radius:50%; background:var(--color-field, transparent); color:var(--text); cursor:pointer; }
.studio-voice-play[hidden] { display:none; }
.studio-voice-play svg { width:18px; height:18px; }
.studio-voice-play[aria-pressed="true"] { background:var(--color-pick, var(--color-active)); color:var(--color-brand, var(--text)); }
.studio-voice-pick { display:flex; flex:1 1 auto; min-width:0; min-height:44px; flex-direction:column; justify-content:center; gap:2px; margin:0; padding:var(--space-2) 0; border:0; background:transparent; color:var(--text); font:inherit; text-align:left; cursor:pointer; }
.studio-voice-pick b { overflow:hidden; font-size:var(--text-body); font-weight:var(--weight-medium); text-overflow:ellipsis; white-space:nowrap; }

.studio-voice-pick small { color:var(--color-text-secondary); font-size:var(--fs-small); overflow-wrap:anywhere; }
.studio-voice-check { flex:none; width:20px; height:20px; color:var(--color-brand, var(--text)); opacity:0; }
.studio-voice:has([aria-checked="true"]) .studio-voice-check { opacity:1; }
.studio-voice:has([aria-checked="true"]) { background:var(--color-pick, var(--color-active)); }

.composition-photo-list { display:flex; flex-direction:column; gap:var(--space-2); margin:0; padding:0; list-style:none; }
.composition-photo { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2) var(--space-3); padding:var(--space-2); border:1px solid var(--line); border-radius:var(--radius-control); }
.composition-photo img { flex:none; width:56px; height:56px; object-fit:cover; border-radius:8px; background:var(--color-active); opacity:0; transition:opacity .2s; }
.composition-photo img[data-ready], .composition-photo img:not([data-photo]) { opacity:1; }

.composition-photo-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); margin-left:auto; }
.composition-photo-actions button { white-space:nowrap; }
.composition-photo-meta { display:flex; flex:1 1 140px; min-width:0; flex-direction:column; gap:var(--space-1); font-size:var(--fs-small); }
.composition-photo-meta b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:var(--weight-medium); }
.composition-photo-meta small { color:var(--color-text-secondary); }

.composition-portraits { display:grid; grid-template-columns:repeat(auto-fill, minmax(72px, 1fr)); gap:var(--space-2); margin:0; padding:var(--space-2) var(--space-2) 0 0; list-style:none; }
.composition-portrait, .composition-portrait-add { position:relative; display:grid; aspect-ratio:1; min-height:72px; place-items:center; overflow:visible; border-radius:var(--radius-control); background:var(--color-active); }
.composition-portrait img { width:100%; height:100%; object-fit:cover; border-radius:var(--radius-control); opacity:0; transition:opacity .2s; }
.composition-portrait img[data-ready] { opacity:1; }
.composition-portrait[data-refused] { outline:2px solid var(--color-danger); outline-offset:-2px; }
.composition-portrait-remove { position:absolute; top:-12px; right:-12px; display:grid; width:44px; height:44px; place-items:center; padding:0; background:transparent; color:var(--text); }
.composition-portrait-remove svg { width:24px; height:24px; padding:5px; border:1px solid var(--line); border-radius:50%; background:var(--panel); }
.composition-portrait-remove:hover svg { color:var(--color-danger); border-color:var(--color-danger); }
.composition-portrait-add { width:100%; margin:0; padding:0; border:1px dashed var(--line); background:transparent; color:var(--color-text-secondary); cursor:pointer; }
.composition-portrait-add:hover:not(:disabled) { color:var(--text); background:var(--color-hover); }
.composition-portrait-add:disabled { color:var(--color-text-tertiary); cursor:default; }
.composition-portrait-add svg { width:24px; height:24px; }
.composition-photo-meta select { width:100%; min-width:0; min-height:40px; padding-inline:var(--space-2); font-size:var(--fs-small); }

.composition-music-source { display:flex; flex-direction:column; gap:var(--space-3); padding-top:var(--space-3); border-top:1px solid var(--line); }
.composition-music-source:first-child { padding-top:0; border-top:0; }
.composition-subhead { margin:0; font-size:var(--fs-small); font-weight:var(--weight-semibold); color:var(--color-text-secondary); }
.composition-music-tracks { display:flex; flex-direction:column; }
.composition-music-track { display:flex; width:100%; min-height:48px; flex-direction:column; justify-content:center; gap:2px; margin:0; padding:var(--space-2) 0; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; color:var(--text); font:inherit; text-align:left; cursor:pointer; }
.composition-music-track:last-child { border-bottom:0; }
.composition-music-track:hover:not(:disabled) { color:var(--color-accent-text); }
.composition-music-track:disabled { color:var(--color-text-tertiary); cursor:default; }
.composition-music-track b { font-weight:var(--weight-medium); }
.composition-music-track small { color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-title-list { display:flex; flex-direction:column; gap:var(--space-3); margin:0; padding:0; list-style:none; }
.composition-title { display:flex; flex-direction:column; gap:var(--space-2); padding:var(--space-3); border:1px solid var(--line); border-radius:var(--radius-control); }
.composition-title-times { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-2); }

.composition-trim img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .2s; }
.composition-trim img[data-ready] { opacity:1; }
.composition-row[data-state="draft"] .composition-row-body small { color:var(--color-accent-text); }
.composition-head-remove { display:inline-flex; min-height:44px; align-items:center; gap:4px; margin-left:auto; padding:0 var(--space-2); background:transparent; color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-head-remove svg { width:18px; height:18px; }
.composition-head-remove:hover { color:var(--color-danger); }

.composition-stage { display:flex; flex-direction:column; gap:var(--space-2); }
.composition-stage-frame { position:relative; display:grid; width:min(100%, calc(300px * (var(--ratio)))); max-width:100%; aspect-ratio:var(--ratio); margin:0 auto; overflow:hidden; place-items:center; border-radius:var(--radius-control); background:var(--color-active); }
.composition-stage-frame img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .15s; }
.composition-stage-frame img[data-ready] { opacity:1; }
.composition-stage-note { color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-scrub { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:var(--space-2); color:var(--color-text-secondary); font-size:var(--fs-micro); font-variant-numeric:tabular-nums; }
.composition-scrub input { width:100%; height:24px; margin:0; background:transparent; accent-color:var(--green); -webkit-appearance:none; appearance:none; }
.composition-scrub input::-webkit-slider-runnable-track { height:4px; border-radius:2px; background:linear-gradient(to right, var(--green) var(--scrub-fill, 0%), var(--color-active) var(--scrub-fill, 0%)); }
.composition-scrub input::-webkit-slider-thumb { width:14px; height:14px; margin-top:-5px; border-radius:50%; background:var(--color-text); -webkit-appearance:none; appearance:none; }
.composition-scrub input::-moz-range-track { height:4px; border-radius:2px; background:var(--color-active); }
.composition-scrub input::-moz-range-progress { height:4px; border-radius:2px; background:var(--green); }
.composition-scrub input::-moz-range-thumb { width:14px; height:14px; border:0; border-radius:50%; background:var(--color-text); }
.composition-strip { display:flex; flex-direction:column; gap:var(--space-2); }
.composition-strip-head { display:flex; align-items:baseline; justify-content:space-between; }
.composition-strip-head h2 { margin:0; font-size:var(--fs-body); font-weight:var(--weight-semibold); }
.composition-strip-head span { color:var(--color-text-secondary); font-size:var(--fs-small); font-variant-numeric:tabular-nums; }
.strip-scenes { display:flex; gap:var(--space-2); margin:0 calc(-1 * var(--space-1)); padding:2px var(--space-1) var(--space-1); overflow-x:auto; scrollbar-width:none; }
.strip-scenes::-webkit-scrollbar { display:none; }
.strip-scene { display:flex; flex:none; flex-direction:column; align-items:center; gap:4px; padding:0; border:0; background:transparent; color:var(--color-text-secondary); font-size:var(--fs-micro); font-variant-numeric:tabular-nums; cursor:pointer; }
.strip-thumb { position:relative; display:grid; width:58px; height:88px; overflow:hidden; place-items:center; border-radius:10px; background:var(--color-active); color:var(--color-text-secondary); }
.strip-thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .2s; }
.strip-thumb img[data-ready] { opacity:1; }
.strip-thumb svg { width:20px; height:20px; }
.strip-scene[aria-current="true"] .strip-thumb { box-shadow:0 0 0 2px var(--color-surface), 0 0 0 4px var(--color-text); }
.strip-scene[aria-current="true"] small { color:var(--color-text); }
.strip-scene[data-state="draft"] .strip-thumb { background:repeating-linear-gradient(135deg, var(--color-active) 0 6px, var(--color-hover) 6px 12px); color:var(--color-accent-text); }
.strip-scene:is([data-state="failed"], [data-state="stopped"], [data-state="expired"], [data-state="missing"]) .strip-thumb { background:color-mix(in srgb, var(--color-danger) 14%, transparent); color:var(--color-danger); }
.strip-add .strip-thumb { border:1px dashed var(--line); background:transparent; }
.strip-add:disabled { opacity:.45; cursor:default; }
.strip-scene:focus-visible { outline:none; }

.strip-scene[data-id] { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.strip-scene[data-id] img { -webkit-user-drag:none; }
.strip-scene.is-dragging { opacity:.9; transform:translateY(-4px) scale(1.04); transition:transform .12s; cursor:grabbing; }
.strip-scene.is-dragging .strip-thumb { box-shadow:0 8px 20px rgb(0 0 0 / .35); }
.strip-scene:focus-visible .strip-thumb { outline:2px solid var(--color-focus-border); outline-offset:2px; }
.composition-part { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); padding:var(--space-2) var(--space-3); border-top:1px solid var(--line); }
.composition-part > span { display:flex; min-width:0; flex-direction:column; gap:2px; }
.composition-part b { font-weight:var(--weight-medium); }
.composition-part small { color:var(--color-text-secondary); font-size:var(--fs-small); }
.composition-part-price { flex:none; align-items:flex-end; text-align:right; font-variant-numeric:tabular-nums; }
.composition-part[data-money="paid"] .composition-part-price small { color:var(--color-accent-text); }
.composition-part-total { background:var(--color-hover); }
.composition-estimate .composition-note { padding:var(--space-2) var(--space-3) var(--space-3); }
.composition-player-box { position:relative; overflow:hidden; aspect-ratio:var(--ratio, 16/9); max-height:min(60vh, 520px); border-radius:var(--radius-control); background:#000; }
.composition-making { position:relative; overflow:hidden; aspect-ratio:var(--ratio, 16/9); max-height:min(60vh, 520px); border-radius:var(--radius-control); background:var(--color-active); }
.composition-making img { display:block; width:100%; height:100%; object-fit:cover; opacity:.55; filter:saturate(.7); }
.composition-making-shine { position:absolute; inset:0; background:linear-gradient(100deg, transparent 30%, color-mix(in srgb, var(--panel) 55%, transparent) 50%, transparent 70%); background-size:250% 100%; animation:making-shine 1.8s linear infinite; }
@keyframes making-shine { from { background-position:120% 0; } to { background-position:-120% 0; } }

@keyframes agent-quiet { from { max-height:0; opacity:0; } to { max-height:2em; opacity:1; } }
@media (prefers-reduced-motion: reduce) { .composition-making-shine { animation:none; } }
.composition-making-text { display:flex; flex-direction:column; gap:2px; margin:0; font-size:var(--fs-small); color:var(--color-text-secondary); }
.composition-making-text b { color:var(--color-text); font-weight:600; font-size:var(--fs-body, inherit); }
.composition-player { display:block; width:100%; height:100%; object-fit:contain; }
.composition-audio { display:block; width:100%; }
.composition-result .mp { margin:0 var(--space-3); }
.mp { display:flex; flex-direction:column; gap:var(--space-2); }
.mp[data-missing] { opacity:.4; }
.mp-bar { display:flex; align-items:center; gap:12px; min-height:48px; padding:6px 14px 6px 6px; border-radius:var(--radius-control); background:var(--color-field); }
.mp-play, .mp-full { display:grid; place-items:center; flex:none; width:36px; height:36px; padding:0; border:0; cursor:pointer; }
.mp-play { border-radius:50%; background:var(--text); color:var(--panel); }
.mp-full { margin-right:-6px; border-radius:var(--radius-control); background:transparent; color:var(--color-text-secondary); }
.mp-play svg, .mp-full svg { width:20px; height:20px; fill:currentColor; }
.mp-full svg { width:18px; height:18px; fill:none; }
.mp-seek { flex:1; min-width:0; height:20px; margin:0; background:transparent; cursor:pointer; -webkit-appearance:none; appearance:none; --mp-fill:0%; }
.mp-seek::-webkit-slider-runnable-track { height:4px; border-radius:2px; background:linear-gradient(to right, var(--text) var(--mp-fill), color-mix(in srgb, var(--text) 18%, transparent) var(--mp-fill)); }
.mp-seek::-moz-range-track { height:4px; border-radius:2px; background:color-mix(in srgb, var(--text) 18%, transparent); }
.mp-seek::-moz-range-progress { height:4px; border-radius:2px; background:var(--text); }
.mp-seek::-webkit-slider-thumb { -webkit-appearance:none; width:12px; height:12px; margin-top:-4px; border:0; border-radius:50%; background:var(--text); }
.mp-seek::-moz-range-thumb { width:12px; height:12px; border:0; border-radius:50%; background:var(--text); }
.mp-seek:focus-visible, .mp-play:focus-visible, .mp-full:focus-visible { outline:2px solid color-mix(in srgb, var(--text) 40%, transparent); outline-offset:2px; }
.mp-time { flex:none; font-size:var(--fs-small, 14px); font-variant-numeric:tabular-nums; color:var(--color-text-secondary); }
.composition-trim-field { gap:var(--space-2); }
.composition-trim { position:relative; height:72px; overflow:hidden; border-radius:var(--radius-control); background:var(--color-active); --start:0%; --end:100%; }
.composition-trim-shade { position:absolute; top:0; bottom:0; background:color-mix(in srgb, var(--color-surface) 72%, transparent); pointer-events:none; }
.composition-trim-shade[data-side="left"] { left:0; width:var(--start); }
.composition-trim-shade[data-side="right"] { left:var(--end); right:0; }
.composition-trim::after { content:""; position:absolute; top:0; bottom:0; left:var(--start); width:calc(var(--end) - var(--start)); box-sizing:border-box; border:2px solid var(--color-accent); border-radius:8px; pointer-events:none; }
.composition-trim input[type="range"] { position:absolute; inset:0; width:100%; height:72px; margin:0; background:transparent; pointer-events:none; -webkit-appearance:none; appearance:none; touch-action:pan-y; }
.composition-trim input[type="range"]::-webkit-slider-runnable-track { height:72px; background:transparent; }
.composition-trim input[type="range"]::-webkit-slider-thumb { -webkit-appearance:none; width:18px; height:72px; border:0; border-radius:6px; background:var(--color-accent); box-shadow:inset 0 0 0 2px var(--color-surface); cursor:ew-resize; pointer-events:auto; }
.composition-trim input[type="range"]::-moz-range-track { height:72px; background:transparent; }
.composition-trim input[type="range"]::-moz-range-thumb { width:18px; height:72px; border:0; border-radius:6px; background:var(--color-accent); box-shadow:inset 0 0 0 2px var(--color-surface); cursor:ew-resize; pointer-events:auto; }
.composition-trim input[type="range"]:focus-visible { outline:none; }
.composition-trim input[type="range"]:focus-visible::-webkit-slider-thumb { box-shadow:inset 0 0 0 2px var(--color-surface), 0 0 0 2px var(--color-focus-border); }
.composition-trim-times { display:flex; justify-content:space-between; margin:0; color:var(--color-text-secondary); font-size:var(--fs-small); font-variant-numeric:tabular-nums; }
.composition-prompt { min-height:96px; padding:var(--space-2) var(--space-3); resize:vertical; line-height:1.4; }
.composition-state { margin:0; padding:var(--space-2) var(--space-3); border-radius:var(--radius-control); color:var(--color-accent-text); background:var(--color-accent-subtle); font-size:var(--fs-small); }
.composition-state:is([data-state="failed"], [data-state="stopped"], [data-state="expired"]) { color:var(--color-danger); background:color-mix(in srgb, var(--color-danger) 10%, transparent); }
.composition-voice-mode { margin-bottom:var(--space-1); }
@media (min-width:900px) {
  .composition-layout { grid-template-columns:minmax(0,1fr) minmax(300px,380px); }
  .composition-detail { position:sticky; top:0; }
}

.composition-layout.is-tool { grid-template-columns:minmax(0,560px); justify-content:center; }
.composition-layout.is-tool .composition-detail { position:static; display:block; }
.composition-layout.is-tool .composition-detail-back { display:inline-flex; }
.composition-tool-actions .composition-primary { flex:1 1 100%; gap:8px; }
.composition-talk-photo { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.composition-talk-photo > button { white-space:nowrap; }
.composition-talk-photo img { width:72px; height:72px; border-radius:var(--radius-control); object-fit:cover; background:var(--color-field); }
@media (max-width:899px) {
  .composition-layout[data-view="detail"] .composition-main { display:none; }
  .composition-layout[data-view="overview"] .composition-detail { display:none; }
  .composition-detail-back { display:inline-flex; }
}



.toast:has(> .toast-meter) { display:flex; align-items:flex-start; gap:var(--space-2); }
.toast-meter { position:relative; display:block; flex:none; width:32px; height:4px; margin-top:calc((1lh - 4px) / 2); overflow:hidden; border-radius:2px; background:color-mix(in srgb, currentColor 24%, transparent); }
.toast-meter > i { position:absolute; inset:0 auto 0 0; border-radius:inherit; background:var(--color-accent); }
.toast-meter[data-level="amber"] > i { background:var(--color-warning); }
.toast-meter[data-level="red"] > i { background:var(--color-danger); }

.limit-notice-meter { position:relative; display:block; flex:1 0 100%; order:3; height:6px; margin-block:var(--space-1); border-radius:var(--radius-pill); background:var(--color-active); }
.limit-notice-meter[hidden] { display:none; }
.limit-notice-meter > i { position:absolute; inset:0 auto 0 0; width:var(--limit-used, 0%); border-radius:inherit; background:var(--color-accent); }
.limit-notice-meter[data-level="amber"] > i { background:var(--color-warning); }
.limit-notice-meter[data-level="red"] > i { background:var(--color-danger); }
@media (max-width:640px) {
  .limit-notice-meter { order:1; flex-basis:calc(100% - var(--space-8)); margin-left:var(--space-8); }
  .limit-notice-actions { order:2; }
}
.limit-notice-meter > b { position:absolute; top:calc(-1 * var(--space-1)); bottom:calc(-1 * var(--space-1)); left:clamp(0px, calc(var(--limit-after, 0%) - 1px), calc(100% - 2px)); width:2px; border-radius:1px; background:var(--color-text); }


.sidebar-search-label { display:none; }


.media-settings-params { display:none; }

.limit-percent { display:none; }

.sidebar-limit { display:none; }

html:not([data-design="leaders"]) .sidebar-limit:not([hidden]) { display:flex; align-items:center; gap:10px; width:100%; min-height:44px; margin:-4px 0; padding:0 12px; border-radius:10px; color:var(--color-text-secondary); background:transparent; font-size:14px; line-height:20px; font-weight:var(--weight-medium); text-align:left; }
@media (hover:hover) { html:not([data-design="leaders"]) .sidebar-limit:hover { color:var(--color-text); background:var(--color-hover); } }
html:not([data-design="leaders"]) .sidebar-limit-label { flex:none; font-weight:var(--weight-regular); }
html:not([data-design="leaders"]) .sidebar-limit-bar { position:relative; flex:1; min-width:0; height:6px; overflow:hidden; border-radius:3px; background:var(--color-track); }
html:not([data-design="leaders"]) .sidebar-limit-fill { position:absolute; inset:0 auto 0 0; border-radius:3px; background:var(--color-brand); transition:width 200ms var(--ease-ui); }
html:not([data-design="leaders"]) .sidebar-limit[data-level="amber"] .sidebar-limit-fill { background:var(--color-warning); }
html:not([data-design="leaders"]) .sidebar-limit[data-level="red"] .sidebar-limit-fill { background:var(--color-danger); }
html:not([data-design="leaders"]) .sidebar-limit-percent { flex:none; min-width:36px; text-align:right; font-variant-numeric:tabular-nums; font-weight:var(--weight-regular); }
html:not([data-design="leaders"]) .sidebar-limit[data-level="red"] .sidebar-limit-percent { color:var(--color-danger); }
html:not([data-design="leaders"]) body.guest-mode .sidebar-limit { display:none; }
@media (min-width:900px) { html:not([data-design="leaders"]) .conversation-header .limit-row:not(:has(.limit-line.has-credits)) { display:none; } }
.studio-header, .limit-quiet { display:none; }


html[data-design="leaders"] :is(#retry-request, #send-without-search, #request-upgrade, #request-guest-login, #quota-lock-billing, #limit-upgrade, #retry-media-quote, .edit-model-primary) { border-radius:var(--radius-pill); }

html[data-design="leaders"] .empty-conversation h1 { font-weight:var(--weight-regular); }
html[data-design="leaders"] .empty-conversation .welcome-invite { margin:var(--space-2) 0 0; color:var(--color-text-secondary); font-size:var(--text-body); line-height:var(--leading-body); text-align:center; }

html[data-design="leaders"] .composer { border-color:transparent; box-shadow:var(--shadow-composer); }

html[data-design="leaders"] .model-sheet .model-select { min-height:56px; }
html[data-design="leaders"] .model-sheet .model-option.is-selected { box-shadow:none; background:var(--color-active); }
html[data-design="leaders"] .model-sheet .model-option.is-selected:hover { background:var(--color-active); }

html[data-design="leaders"] .model-sheet :is(.model-cost, .model-cost-hint) { color:var(--color-text-secondary); }

html[data-design="leaders"] .quota-lock { grid-template-columns:minmax(0, 1fr); row-gap:var(--space-1); padding:var(--space-5); border:0; border-radius:var(--radius-composer); box-shadow:var(--shadow-composer); }
html[data-design="leaders"] .quota-lock > b { padding-left:0; font-size:var(--text-heading); line-height:var(--leading-heading); }
html[data-design="leaders"] .quota-lock > b::before { display:none; }
html[data-design="leaders"] .quota-lock > span { padding-left:0; font-size:var(--text-secondary); line-height:var(--leading-secondary); }

html[data-design="leaders"] body.guest-mode #quota-lock:not([hidden]) ~ .composer-stage { display:none; }
html[data-design="leaders"] .quota-lock > button { grid-column:1; grid-row:auto; width:100%; min-height:44px; margin-top:var(--space-3); border-radius:var(--radius-pill); }


html[data-design="leaders"] .composer textarea { min-height:44px; max-height:196px; padding:10px 6px; line-height:24px; }

@media (max-width:640px) {
  html[data-design="leaders"] .composer-wrap .attach-menu { grid-template-columns:minmax(0, 1fr); gap:0; }
  html[data-design="leaders"] .composer-wrap .attach-menu button { min-height:48px; flex-direction:row; justify-content:flex-start; gap:var(--space-3); padding:0 var(--space-3); border-radius:var(--radius-control); font-size:var(--text-body); font-weight:var(--weight-regular); background:transparent; }
  html[data-design="leaders"] .composer-wrap .attach-menu button svg { width:20px; height:20px; }
}

@media (max-width:899px) {
  html[data-design="leaders"] .conversation-header { grid-template-columns:44px minmax(0, 1fr) auto 44px 44px; }
  html[data-design="leaders"] body:not(.guest-mode) .conversation-header .conversation-title { display:block; grid-column:2; grid-row:1; }
  html[data-design="leaders"] .conversation-header .limit-row { grid-column:3; grid-row:1; }
  html[data-design="leaders"] .conversation-header .limit-line .credit-ring-count { display:none !important; }
  html[data-design="leaders"] .conversation-header .limit-line.has-credits #limit-line-text { position:static !important; width:auto !important; height:auto !important; margin:0; overflow:visible !important; clip:auto !important; clip-path:none !important; white-space:nowrap !important; font-variant-numeric:tabular-nums; }
  html[data-design="leaders"] .conversation-header > .more-button { display:grid; grid-column:4; grid-row:1; }
  html[data-design="leaders"] .conversation-header > .header-new-chat { display:grid; grid-column:5; grid-row:1; place-items:center; width:44px; height:44px; border-radius:50%; color:var(--color-text-secondary); background:transparent; }
  html[data-design="leaders"] .conversation-header > .header-new-chat svg { width:20px; height:20px; }
  html[data-design="leaders"] .conversation-header > .header-new-chat:active { background:var(--color-active); }
  
  
  html[data-design="leaders"] .guest-mode .conversation-header { grid-template-columns:minmax(44px, 1fr) minmax(0, max-content) minmax(max-content, 1fr); }
  html[data-design="leaders"] .guest-mode .conversation-header > .back-button { grid-column:1; justify-self:start; }
  html[data-design="leaders"] .guest-mode .conversation-header > .header-new-chat { display:none; }
  html[data-design="leaders"] .guest-mode .conversation-header > .guest-login { position:relative; grid-column:3; grid-row:1; justify-self:end; min-height:36px; height:36px; margin-right:10px; padding:0 var(--space-4); font-size:var(--text-secondary); font-weight:var(--weight-medium); }
  html[data-design="leaders"] .guest-mode .conversation-header > .guest-login::after { content:""; position:absolute; inset:-4px 0; }
}

html[data-design="leaders"] .conversation-header .limit-line,
html[data-design="leaders"] .conversation-header .limit-line.has-credits { padding:0 var(--space-2); box-shadow:none; color:var(--color-text-secondary); font-weight:var(--weight-regular); }
html[data-design="leaders"] .conversation-header .limit-line.is-empty,
html[data-design="leaders"] .conversation-header .limit-line.has-credits.is-empty { box-shadow:none; color:var(--color-danger); }
html[data-design="leaders"] .conversation-header > .more-button { color:var(--color-text); }
html[data-design="leaders"] .conversation-header > .more-button svg { width:20px; height:20px; }

html[data-design="leaders"] .conversation-header :is(button, a):focus-visible { outline:1.5px solid color-mix(in srgb, var(--color-brand) 64%, transparent); outline-offset:2px; }
html[data-design="leaders"]:not([data-input="keyboard"]) .conversation-header :is(button, a):focus { outline:none; }
html[data-design="leaders"] .conversation-header .limit-line .credit-ring-count:not([hidden]) { font-weight:var(--weight-regular); }

html[data-design="leaders"] .conversation-header .limit-line:not(.has-credits) { gap:var(--space-2); }
html[data-design="leaders"] .conversation-header .limit-line:not(.has-credits) .limit-caption { display:none !important; }
html[data-design="leaders"] .conversation-header .limit-line:not(.has-credits) .limit-bar { display:block; width:96px; height:6px; border-radius:3px; background:color-mix(in srgb, var(--color-text) 12%, transparent); }
html[data-design="leaders"] .conversation-header .limit-line .limit-bar-fill { border-radius:3px; background:var(--color-brand); }
html[data-design="leaders"] .conversation-header .limit-line[data-level="amber"] .limit-bar-fill { background:var(--color-warning); }
html[data-design="leaders"] .conversation-header .limit-line[data-level="red"] .limit-bar-fill { background:var(--color-danger); }
html[data-design="leaders"] .conversation-header .limit-line:not(.has-credits) .limit-percent { display:inline; font-variant-numeric:tabular-nums; }
html[data-design="leaders"] .conversation-header .limit-line[data-level="red"] .limit-percent { color:var(--color-danger); }

@media (min-width:900px) {
  html[data-design="leaders"] .conversation-header { grid-template-columns:minmax(0, 1fr) auto auto auto; }
  html[data-design="leaders"] .conversation-header .conversation-title { display:none; }
  html[data-design="leaders"] .conversation-header .limit-row { grid-column:2; grid-row:1; }
  html[data-design="leaders"] .conversation-header .limit-line:not(.has-credits) .limit-bar { width:64px; }
  html[data-design="leaders"] .conversation-header > .more-button { grid-column:3; grid-row:1; }
  html[data-design="leaders"] .conversation-header > .header-new-chat { grid-column:4; grid-row:1; }
  html[data-design="leaders"] .guest-mode .conversation-header > .header-new-chat { display:none; }
  html[data-design="leaders"] .guest-mode .conversation-header > .guest-login { grid-column:4; min-height:36px; height:36px; font-size:var(--text-secondary); font-weight:var(--weight-medium); }
  
  html[data-design="leaders"] .guest-mode .conversation-header > .guest-code:not([hidden]) { display:inline-flex; grid-column:3; grid-row:1; align-items:center; min-height:36px; height:36px; margin-right:var(--space-2); padding:0 var(--space-3); border-radius:var(--radius-pill); color:var(--color-text-secondary); font-size:var(--text-secondary); font-weight:var(--weight-medium); text-decoration:none; }
  html[data-design="leaders"] .guest-mode .conversation-header > .guest-code:hover { color:var(--color-text); background:var(--color-hover); }
}

html[data-design="leaders"] .table-scroll { border:0; border-radius:0; background:transparent; }
html[data-design="leaders"] .table-scroll th, html[data-design="leaders"] .table-scroll td { border-right:0; border-bottom:1px solid var(--color-border); }
html[data-design="leaders"] .table-scroll th { background:transparent; border-bottom-color:var(--color-border-strong); }
html[data-design="leaders"] .table-scroll th:first-child, html[data-design="leaders"] .table-scroll td:first-child { background:var(--color-bg); }
html[data-design="leaders"] .table-scroll::after { background:linear-gradient(90deg, transparent, var(--color-bg) 85%); }   
html[data-design="leaders"] .table-scroll tbody tr:last-child td { border-bottom:1px solid var(--color-border); }

html[data-design="leaders"] .table-scroll :is(th, td):first-child { padding-left:0; }
html[data-design="leaders"] .table-scroll :is(th, td):last-child { padding-right:0; }
html[data-design="leaders"] .composer-wrap { padding-top:var(--space-6); background:linear-gradient(to bottom, transparent, var(--workspace) var(--space-6)); }

html[data-design="leaders"] .jump-latest { position:absolute; top:-24px; left:50%; z-index:2; display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid var(--color-border); border-radius:999px; background:var(--color-surface); color:var(--color-text-secondary); box-shadow:var(--shadow-overlay); transform:translateX(-50%); cursor:pointer; }
html[data-design="leaders"] .jump-latest[hidden] { display:none; }
html[data-design="leaders"] .jump-latest:hover { color:var(--color-text); }
html[data-design="leaders"] .jump-latest svg { width:18px; height:18px; }
@media (max-width:640px) { html[data-design="leaders"] .jump-latest { width:40px; height:40px; top:-28px; } }
html[data-design="leaders"] .messages { padding-bottom:var(--space-6); }



html[data-design="leaders"] .sidebar .new-chat-button { background:var(--color-elevated); background-image:none; color:var(--color-text); box-shadow:inset 0 0 0 1px var(--color-border); font-weight:var(--weight-medium); }
html[data-design="leaders"] .sidebar-section-head { min-height:0; margin:0 0 var(--space-2); padding:0; }
html[data-design="leaders"] .sidebar-section-label { display:none; }
html[data-design="leaders"] .sidebar-search { display:flex; width:100%; height:40px; align-items:center; justify-content:flex-start; gap:var(--space-2); padding:0 var(--space-3); border-radius:var(--radius-pill); color:var(--color-text-tertiary); background:var(--color-surface); }

html[data-design="leaders"] .sidebar-search:focus-visible { outline:none; box-shadow:inset 0 0 0 1px var(--color-border-strong); }
html[data-design="leaders"] .sidebar-search-label { display:block; font-size:var(--text-label); line-height:var(--leading-label); }
html[data-design="leaders"] .sidebar-chat-list .chat-item.active { background:var(--color-active); }
html[data-design="leaders"] .sidebar-chat-list .sidebar-empty { margin:var(--space-6) 0; padding:0 var(--space-3); color:var(--color-text-tertiary); font-size:var(--text-secondary); line-height:var(--leading-secondary); text-align:center; text-wrap:balance; }
@media (pointer:coarse) { html[data-design="leaders"] .sidebar-chat-list .row-more { display:none; } }

html[data-design="leaders"] :is(.settings-shell, .settings-home, .settings-content) { background:var(--color-bg); }
html[data-design="leaders"] .settings-group > button { border:0; background:var(--color-surface); }
html[data-design="leaders"] .settings-group > button + button { box-shadow:inset 0 1px 0 var(--color-border); }
html[data-design="leaders"] .settings-group + .settings-group { padding-top:0; border-top:0; }
html[data-design="leaders"] .settings-detail-card { border:0; border-radius:var(--radius-panel); background:var(--color-surface); }
html[data-design="leaders"] .settings-detail-card :is(button, .settings-row, .settings-row-link) { border-bottom-color:var(--color-border); }
html[data-design="leaders"] .web-logout { border:0; border-radius:var(--radius-panel); background:var(--color-surface); }

html[data-design="leaders"] .toast { border:0; border-radius:var(--radius-pill); color:var(--color-bg); background:var(--color-text); box-shadow:var(--shadow-popover); }
html[data-design="leaders"] .toast button { color:inherit; }
html[data-design="leaders"] .toast .undo-progress { background:var(--color-bg); opacity:.6; }

html[data-design="leaders"] .tools-row > svg { width:28px; height:28px; padding:2px; color:var(--color-text-secondary); background:transparent; }
html[data-design="leaders"] .tools-row { padding-left:var(--space-2); padding-right:var(--space-2); border-bottom-color:var(--color-border); }
html[data-design="leaders"] .catalog-heading h1 { font-weight:var(--weight-semibold); }

html[data-design="leaders"] .composer-wrap .attach-menu button svg { width:20px; height:20px; }
html[data-design="leaders"] .conversation-header > .header-new-chat svg { width:20px; height:20px; }

html[data-design="leaders"] .model-sheet .model-brand { box-shadow:none; background:color-mix(in srgb, var(--family-color, var(--color-text)) 9%, var(--color-surface)); }
html[data-design="leaders"] .model-sheet .model-option.is-selected .model-brand { background:color-mix(in srgb, var(--family-color, var(--color-text)) 12%, var(--color-bg)); }

html[data-design="leaders"] :is(.catalog-search, #rename-input, .edit-message-dialog textarea, .media-select select, .select-field select, .voice-search-field, .media-voice-search input, .composer-control) { border-color:transparent; background:var(--color-surface); }
html[data-design="leaders"] :is(#rename-input, .edit-message-dialog textarea, .media-select select, .select-field select, .media-voice-search input):focus { border-color:transparent; outline:none; box-shadow:0 0 0 1.5px var(--color-brand); }

html[data-design="leaders"] :is(.catalog-search, .voice-search-field):focus-within { border-color:transparent; box-shadow:0 0 0 1px var(--color-border-strong); }
html[data-design="leaders"] .sidebar-footer { border-top-color:transparent; }


html[data-design="leaders"] .composer textarea { grid-area:input; min-height:44px; padding:var(--space-2) var(--space-2) 0; }

html[data-design="leaders"] .limit-quiet:not([hidden]) { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:0 var(--space-2); max-width:760px; margin:0 calc(-1 * var(--space-2)) var(--space-2); color:var(--color-text-secondary); font-size:var(--text-caption); line-height:var(--leading-caption); text-align:center; }
html[data-design="leaders"] .limit-quiet button { position:relative; min-height:0; padding:0; border:0; background:none; color:var(--color-accent-text); font:inherit; font-weight:var(--weight-medium); }
html[data-design="leaders"] .limit-quiet button::before { content:"·"; margin-right:var(--space-2); color:var(--color-text-secondary); font-weight:var(--weight-regular); }
html[data-design="leaders"] .limit-quiet button::after { content:""; position:absolute; inset:-14px -8px; }

html[data-design="leaders"] :is(.request-error, .limit-notice, .media-quote-status, .composer-context, .edit-model-notice) { border-color:transparent; background:var(--color-surface); }

html[data-design="leaders"] .code-block { border-color:transparent; --code-bg:color-mix(in srgb, var(--color-text) 5%, var(--color-bg)); background:var(--code-bg); }
html[data-design="leaders"] .code-toolbar { border-bottom-color:transparent; }

html[data-design="leaders"] .message-actions.response-footer button.is-done { color:var(--color-text); }


html[data-design="leaders"] :is(.model-sheet > #model-search-box, #rename-dialog #rename-input, .edit-message-dialog textarea, #chat-batch-dialog #chat-batch-project) { background:var(--color-field); }
html[data-design="leaders"] .model-sheet .model-copy small { color:var(--color-text-secondary); }

html[data-design="leaders"] :is(.settings-group-title, .model-group, .tools-group) { margin:var(--space-6) 0 var(--space-2); padding:0 var(--space-4); color:var(--color-text-secondary); font-size:var(--text-label); font-weight:var(--weight-regular); line-height:var(--leading-label); letter-spacing:0; text-transform:none; }

html[data-design="leaders"] .settings-account:not([hidden]) { display:flex; width:100%; min-height:72px; align-items:center; gap:var(--space-3); padding:var(--space-3) var(--space-4); border:0; border-radius:var(--radius-panel); color:var(--color-text); background:var(--color-surface); text-align:left; }
html[data-design="leaders"] .settings-shortcut .account-avatar { background:var(--color-text); color:var(--color-bg); }
html[data-design="leaders"] .settings-account-avatar { display:grid; flex:none; width:44px; height:44px; place-items:center; border-radius:50%; color:var(--color-bg); background:var(--color-text); font-size:var(--text-body); font-weight:var(--weight-semibold); }
html[data-design="leaders"] .settings-account-copy { display:flex; flex:1; min-width:0; flex-direction:column; gap:2px; }
html[data-design="leaders"] .settings-account-copy b { overflow:hidden; font-size:var(--text-heading); font-weight:var(--weight-regular); text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"] .settings-account-copy small { color:var(--color-text-secondary); font-size:var(--text-caption); }
html[data-design="leaders"] .settings-account .row-end { flex:none; width:16px; height:16px; color:var(--color-text-tertiary); }
html[data-design="leaders"] .settings-home .settings-group > button[data-settings-panel="profile"] { display:none; }
html[data-design="leaders"] .settings-home .settings-group > button { grid-template-columns:25px minmax(0, 1fr) auto auto; }
html[data-design="leaders"] .settings-group > button > .settings-row-value:not([hidden]) { display:block; color:var(--color-text-secondary); font-size:var(--text-label); font-style:normal; font-variant-numeric:tabular-nums; }
html[data-design="leaders"] .settings-group > button > .settings-row-value[hidden] { display:none; }

html[data-design="leaders"] [data-settings-view="profile"] .settings-view-title { flex-direction:column; justify-content:center; gap:var(--space-3); margin:var(--space-4) 0 var(--space-2); text-align:center; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-view-title .avatar { flex-basis:auto; width:72px; height:72px; font-size:28px; }
html[data-design="leaders"] [data-settings-view="profile"] #profile-sub { display:none; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card small { display:none; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card :is(button, .settings-row) { min-height:52px; padding-top:var(--space-2); padding-bottom:var(--space-2); }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card strong { font-weight:var(--weight-regular); }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card b { font-weight:var(--weight-regular); color:var(--color-text-secondary); white-space:nowrap; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card b svg { width:16px; height:16px; margin-left:var(--space-1); color:var(--color-text-tertiary); }
html[data-design="leaders"] .profile-plan-row:not([hidden]) { display:flex; }
html[data-design="leaders"] .profile-plan-row[hidden] { display:none; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-device-title { display:none; }
html[data-design="leaders"] [data-settings-view="profile"] .web-logout { width:100%; min-height:52px; margin-top:var(--space-6); }

html[data-design="leaders"] body[data-view="studio"] .mobile-header { display:none; }
html[data-design="leaders"] .studio-header { display:grid; grid-template-columns:44px minmax(0, 1fr) auto; align-items:center; gap:var(--space-1); width:100%; max-width:1120px; min-height:56px; margin:0 auto; padding:6px 0; }
html[data-design="leaders"] .studio-header-menu { display:grid; margin-left:-11px; width:44px; height:44px; place-items:center; padding:0; border:0; border-radius:50%; color:var(--color-text-secondary); background:transparent; }
html[data-design="leaders"] .studio-header-menu:active { background:var(--color-active); }
html[data-design="leaders"] .studio-header svg { width:20px; height:20px; }
html[data-design="leaders"] .studio-header-title { margin:0; overflow:hidden; color:var(--color-text); font-size:var(--text-heading); line-height:var(--leading-heading); text-align:left; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"] .studio-header-new { display:inline-flex; height:40px; min-height:40px; align-items:center; gap:6px; padding:0 var(--space-4) 0 var(--space-3); border:0; border-radius:var(--radius-pill); color:var(--color-bg); background:var(--color-text); font-size:var(--text-label); font-weight:var(--weight-medium); white-space:nowrap; transition:opacity var(--motion-hover) var(--ease-ui); }
html[data-design="leaders"] .studio-header-new svg { width:18px; height:18px; }
html[data-design="leaders"] .studio-header-new:active { transform:scale(var(--press-scale)); }
@media (hover:hover) { html[data-design="leaders"] .studio-header-new:hover { opacity:.86; } }
@media (min-width:900px) {
  html[data-design="leaders"] .studio-header { grid-template-columns:minmax(0, 1fr) auto; min-height:72px; padding:var(--space-4) 0 var(--space-2); }
  html[data-design="leaders"] .studio-header-menu { display:none; }
  
  html[data-design="leaders"] .studio-header-new { display:none; }
  html[data-design="leaders"] .studio-header-title { font-size:var(--text-display); line-height:var(--leading-display); }
}
html[data-design="leaders"] .studio-screen .catalog-heading { display:none; }

html[data-design="leaders"] .catalog-menu { display:none; }
@media (max-width:899px) {
  html[data-design="leaders"] body:is([data-view="chats"], [data-view="projects"], [data-view="models"], [data-view="composition"]) .mobile-header { display:none; }
  html[data-design="leaders"] body[data-view="studio"] #screen-studio,
  html[data-design="leaders"] :is(#screen-chats, #screen-projects, #screen-models, #screen-composition) { height:100%; padding-top:0; }
  html[data-design="leaders"] :is(#screen-chats, #screen-projects, #screen-models, #screen-composition) .catalog-heading { display:grid; grid-template-columns:44px minmax(0, 1fr) auto; align-items:center; gap:var(--space-1); min-height:56px; margin:0 0 var(--space-2); padding:6px 0; }
  html[data-design="leaders"] .catalog-menu { display:grid; width:44px; height:44px; margin-left:-11px; place-items:center; padding:0; border:0; border-radius:50%; color:var(--color-text-secondary); background:transparent; }
  html[data-design="leaders"] .catalog-menu:active { background:var(--color-active); }
  html[data-design="leaders"] .catalog-menu svg { width:24px; height:24px; }
  
  html[data-design="leaders"] #composition-back { order:-1; display:flex; width:44px; height:44px; margin-left:-11px; align-items:center; justify-content:center; gap:0; padding:0; border:0; border-radius:50%; font-size:0; color:var(--color-text-secondary); background:transparent; }
  html[data-design="leaders"] #composition-back:active { background:var(--color-active); }
  html[data-design="leaders"] #composition-back svg { width:24px; height:24px; }
  html[data-design="leaders"] :is(#screen-chats, #screen-projects, #screen-models, #screen-composition) .catalog-heading h1 { overflow:hidden; font-size:var(--text-heading); line-height:var(--leading-heading); font-weight:var(--weight-medium); letter-spacing:var(--tracking-heading); text-overflow:ellipsis; white-space:nowrap; }
}
html[data-design="leaders"] .studio-screen .catalog-shell { max-width:1120px; height:calc(100% - 56px); padding-top:var(--space-2); }
@media (min-width:900px) { html[data-design="leaders"] .studio-screen .catalog-shell { height:calc(100% - 72px); } }

html[data-design="leaders"] #studio-list > :is(.studio-filters) { flex:none; }
html[data-design="leaders"] #studio-list > :last-child { margin-bottom:var(--space-12); }

html[data-design="leaders"] #studio-list { padding:var(--space-2); margin:calc(-1 * var(--space-2)); }















html[data-design="leaders"] .billing-host :is(.billing-route-link,.billing-help a){text-decoration:none;color:var(--color-accent-text)}
html[data-design="leaders"] .billing-host .billing-secondary{border-color:transparent;background:var(--color-surface);font-weight:var(--weight-medium)}
html[data-design="leaders"] .billing-host :is(.billing-plan-choice button,.billing-segment,.billing-methods button){border-color:transparent;box-shadow:none;background:var(--color-surface)}
html[data-design="leaders"] .billing-host :is(.billing-plan-choice button,.billing-segment,.billing-methods button)[aria-pressed=true]{border-color:transparent;box-shadow:none;background:var(--color-pick)}
html[data-design="leaders"] .billing-host :is(.billing-plan-choice button,.billing-segment,.billing-methods button)[aria-pressed=true]::after{background:var(--color-brand)}
html[data-design="leaders"] .billing-host :is(.billing-bonus,.billing-invite,.billing-key){border-color:transparent}
html[data-design="leaders"] .billing-host :is(.billing-action,.billing-secondary){border-radius:var(--radius-pill)}
html[data-design="leaders"] .billing-host .paywall-marks{display:flex;flex-direction:column;gap:var(--space-2);margin:0 0 var(--space-6)}
html[data-design="leaders"] .billing-host .paywall-marks-row{display:flex;align-items:center;gap:var(--space-4)}
html[data-design="leaders"] .billing-host .paywall-marks-row svg{width:24px;height:24px;color:var(--color-text);fill:currentColor;stroke:none}
html[data-design="leaders"] .billing-host .paywall-marks p{margin:0;color:var(--color-text-secondary);font-size:var(--text-secondary);line-height:1.5}

html[data-design="leaders"] .model-sheet .model-copy :is(b, strong) { font-weight:var(--weight-regular); }

@media (min-width:900px) { html[data-design="leaders"] .settings-group > button > .settings-row-value:not([hidden]) { display:none; } html[data-design="leaders"] .settings-home .settings-group > button { grid-template-columns:25px minmax(0, 1fr) auto; } html[data-design="leaders"] .catalog-screen.studio-screen { padding-top:0; } }
html[data-design="leaders"] .settings-group > button b { font-weight:var(--weight-regular); }

@media (max-width:899px) { html[data-design="leaders"] .settings-home .settings-group > button > .row-end { grid-column:4; } }
html[data-design="leaders"] .settings-heading { border-bottom-color:transparent; }

html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card { overflow:hidden; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card > :is(button, .settings-row) { width:100%; margin:0; border-radius:0; background:transparent; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card > .settings-row:has(.row-icon-button) { padding-top:4px; padding-bottom:4px; }
html[data-design="leaders"] [data-settings-view="profile"] .settings-detail-card .row-icon-button { margin-right:-10px; }


html[data-design="leaders"] :where(h1, h2, h3, h4, b, strong) { font-weight:var(--weight-medium); }
html[data-design="leaders"] .message-row.assistant .answer-content :is(b, strong, th, h1, h2, h3, h4, h5, h6) { font-weight:var(--weight-semibold); }
html[data-design="leaders"] .message-row.assistant .answer-content :is(h1, h2, h3) { letter-spacing:var(--tracking-heading); }
html[data-design="leaders"] .empty-conversation h1 { font-weight:var(--weight-medium); letter-spacing:var(--tracking-display); }
html[data-design="leaders"] :is(.catalog-heading h1, .settings-heading h1, .settings-view-title h2) { font-weight:var(--weight-medium); letter-spacing:var(--tracking-display); }
html[data-design="leaders"] :is(.model-sheet h2, .studio-header-title, .conversation-title h2, .usage-sheet h3, .row-menu-title strong) { font-weight:var(--weight-medium); letter-spacing:var(--tracking-heading); }
html[data-design="leaders"] #temporary-chat-title { font-weight:var(--weight-medium); }
html[data-design="leaders"] .model-sheet .model-option.is-selected .model-copy :is(b, strong) { font-weight:var(--weight-medium); }
html[data-design="leaders"] :is(.tool-tabs button strong, .theme-option > b, .settings-account-avatar) { font-weight:var(--weight-medium); }
html[data-design="leaders"] :is(.settings-primary-action, .tariff-pay, .toast button, .guest-mode .guest-login, .sidebar-guest button, .guest-locked button, .composer-guest-lock button, .guest-model-hint button, .loading-copy :is(a, button), .quota-lock > b) { font-weight:var(--weight-medium); }
html[data-design="leaders"] :is(#retry-request, #send-without-search, #request-upgrade, #request-guest-login, #quota-lock-billing, #limit-upgrade, #retry-media-quote, .edit-model-primary) { font-weight:var(--weight-medium); }
html[data-design="leaders"] :is(.media-choice button[aria-checked="true"], .media-sound-toggle[aria-checked="true"]) { font-weight:var(--weight-medium); }

html[data-design="leaders"] .billing-host :is(.billing-action, .billing-segment span, .billing-plan-choice b, .billing-method-copy b, .billing-currency [aria-pressed="true"], .billing-route-link) { font-weight:var(--weight-medium); }
html[data-design="leaders"] .billing-host :is(.billing-widget h3, .billing-price) { font-weight:var(--weight-medium); letter-spacing:var(--tracking-display); }

html[data-design="leaders"] :is(.limit-quiet, .credit-ring-count, .settings-row-value, .billing-price, .billing-plan-choice small, .billing-segment small, .credit-op-sum) { font-variant-numeric:tabular-nums; }



html[data-design="leaders"] .code-block pre[data-more] { -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 40px), transparent); mask-image:linear-gradient(to right, #000 calc(100% - 40px), transparent); }

html[data-design="leaders"] .settings-heading { border-bottom-color:transparent; background:transparent; }
html[data-design="leaders"] .settings-close:not(:hover) { background:transparent; }

html[data-design="leaders"] .billing-host .billing-pay-dock { position:sticky; bottom:0; z-index:2; margin-top:var(--space-6); padding:var(--space-8) 0 max(var(--space-4), env(safe-area-inset-bottom)); border-top:0; background:linear-gradient(to bottom, transparent, var(--color-bg) var(--space-8)); }


html[data-design="leaders"] :is(.plan-stats, .profile-periods, .usage-sheet > .usage-bars, .usage-sheet > .credit-wallet, .usage-sheet > .usage-model-details) { border-color:transparent; background:var(--color-surface); }
html[data-design="leaders"] .settings-shell .profile-periods > div { background:transparent; }
html[data-design="leaders"] [data-settings-view="usage"] .plan-stats { border-top-left-radius:var(--radius-panel); border-top-right-radius:var(--radius-panel); }
html[data-design="leaders"] [data-settings-view="usage"] .plan-stats:not(:empty) + .entitlement-warning[hidden] + .profile-periods:not(:empty) { border-top-color:var(--color-border); }

html[data-design="leaders"] :is(.settings-shortcut .account-avatar, .settings-view-title .avatar, .brand-name, .usage-sheet .credit-total b) { font-weight:var(--weight-medium); }
html[data-design="leaders"] .usage-sheet .credit-total b { font-variant-numeric:tabular-nums; }

html[data-design="leaders"] :is(#thinking-control, #media-settings) { box-shadow:none; background-color:var(--color-field); }

html[data-design="leaders"] .composer-controls .model-pill > .model-pill-mark { display:grid; }
html[data-design="leaders"] .composer-controls .model-pill > .model-pill-name { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; -webkit-line-clamp:none; }
html[data-design="leaders"] .composer-controls .model-pill { min-width:0; max-width:100%; overflow:hidden; }

@media (max-width:640px) {
  html[data-design="leaders"] .composer-controls .model-pill > svg { display:block; }
}
@media (max-width:430px) {
  
  html[data-design="leaders"] .composer .composer-controls:has(> #thinking-control:not([hidden])) { grid-template-columns:36px minmax(0,max-content) minmax(36px,1fr); }
  html[data-design="leaders"] .composer-controls .model-pill > .model-pill-mark { display:none; }
}
@media (max-width:380px) {
  
  html[data-design="leaders"] .composer-controls .model-pill > svg:last-child { display:none; }
}
@media (max-width:430px) {
  html[data-design="leaders"] .composer .send-button.has-price { gap:2px; }
  html[data-design="leaders"] .composer .send-button.has-price > svg { width:16px; height:16px; }
  html[data-design="leaders"] .composer .has-price > svg { stroke-width:2; }
}
@media (max-width:640px) {
  html[data-design="leaders"] :is(#thinking-control, #media-settings):not(:hover):not([aria-expanded="true"]) { background-color:transparent; }
}
@media (max-width:360px) {
  html[data-design="leaders"] body:not(.guest-mode) .composer:not(:has(.send-button.has-price)) .composer-controls .model-pill { justify-content:flex-start; }
  html[data-design="leaders"] body:not(.guest-mode) .composer:not(:has(.send-button.has-price)) .composer-controls .model-pill > .model-pill-name { position:static; width:auto; height:auto; clip-path:none; min-width:72px; }
}

html[data-design="leaders"] .guest-mode .guest-links { flex-wrap:wrap; row-gap:var(--space-1); }
html[data-design="leaders"] .guest-links a { white-space:nowrap; }

@media (min-width:641px) and (max-width:900px) {
  html[data-design="leaders"] .composer-controls #action-tools > span { display:none; }
}


@media (max-width:520px) {
  html[data-design="leaders"] .agent-s-dialog > div:last-child { flex-direction:column-reverse; }
  html[data-design="leaders"] .agent-s-dialog > div:last-child > button { flex:none; width:100%; }
}


html[data-design="leaders"] :is(.composition-card, .composition-detail-body) { border:0; border-radius:var(--radius-panel); background:var(--color-surface); }
html[data-design="leaders"] .composition-card .composition-row:first-of-type { border-top-color:var(--color-border); }
html[data-design="leaders"] .composition-input { border:0; background:var(--color-field); }
html[data-design="leaders"] .composition-input:focus-visible { box-shadow:none; background:color-mix(in srgb, var(--color-field) 90%, var(--text)); }   
html[data-design="leaders"] .composition-prompt { padding:var(--space-3); resize:none; }
html[data-design="leaders"] .composition-field:has(> select.composition-input) { position:relative; }
html[data-design="leaders"] .composition-field:has(> select.composition-input)::after { content:""; position:absolute; right:var(--space-3); bottom:14px; width:16px; height:16px; background:var(--color-text-secondary); -webkit-mask:var(--icon-chevron-mask) center / contain no-repeat; mask:var(--icon-chevron-mask) center / contain no-repeat; pointer-events:none; }
html[data-design="leaders"] .composition-field > select.composition-input { appearance:none; -webkit-appearance:none; padding-right:calc(var(--space-3) + 24px); text-overflow:ellipsis; cursor:pointer; }
html[data-design="leaders"] .composition-choice button { border:0; color:var(--color-text-secondary); background:var(--color-field); }
html[data-design="leaders"] .composition-choice button[aria-pressed="true"] { color:var(--color-brand); background:var(--color-pick); }
html[data-design="leaders"] .composition-chip { border:0; color:var(--color-text-secondary); background:var(--color-field); }
html[data-design="leaders"] .composition-chip[aria-pressed="true"] { color:var(--color-brand); background:var(--color-pick); }
@media (hover:hover) { html[data-design="leaders"] .composition-chip:hover:not([aria-pressed="true"]):not(:disabled) { color:var(--color-text); background:var(--color-active); } }
@media (hover:hover) { html[data-design="leaders"] .composition-choice button:hover:not([aria-pressed="true"]):not(:disabled) { color:var(--color-text); background:var(--color-active); } }
html[data-design="leaders"] .composition-secondary { border:0; background:var(--color-field); }
html[data-design="leaders"] .composition-secondary:hover:not(:disabled) { background:var(--color-active); }
html[data-design="leaders"] .composition-photo { border:0; background:var(--color-field); }

html[data-design="leaders"] .composition-layout.is-tool { grid-template-columns:minmax(0, 760px); justify-content:center; }
html[data-design="leaders"] .agent-s-dialog > div:last-child:has(> #agent-s-open:not([hidden])):has(> #agent-s-download:not([hidden])) { flex-direction:column-reverse; }
html[data-design="leaders"] .agent-s-dialog > div:last-child:has(> #agent-s-open:not([hidden])):has(> #agent-s-download:not([hidden])) > button { flex:none; width:100%; }


html[data-design="leaders"] #action-agent, html[data-design="leaders"] #action-agent > svg { color:var(--color-brand); }

@media (max-width:640px) { html[data-design="leaders"] .composer-actions #action-agent { gap:var(--space-1); } html[data-design="leaders"] .composer-actions #action-agent svg { display:block; } }
html[data-design="leaders"] #action-agent[aria-pressed="true"] { color:var(--color-brand); background-color:color-mix(in srgb, var(--color-brand) 14%, transparent); }
@media (hover:hover) { html[data-design="leaders"] #action-agent:hover:not([aria-pressed="true"]) { color:var(--color-brand); background-color:color-mix(in srgb, var(--color-brand) 8%, transparent); } }

html[data-design="leaders"] .agent-empty-line { max-width:440px; margin:var(--space-2) auto 0; color:var(--color-text-secondary); font-size:var(--text-body); line-height:1.5; }
html[data-design="leaders"] .agent-starters { display:flex; flex-wrap:wrap; justify-content:center; gap:var(--space-2); max-width:560px; margin:var(--space-5) auto 0; }
html[data-design="leaders"] .agent-starters button { min-height:40px; padding:0 var(--space-4); border:0; border-radius:var(--radius-pill); background:var(--color-field); color:var(--color-text); font:inherit; font-size:15px; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"] .agent-starters button:hover { background:var(--color-active); } }

html[data-design="leaders"] .agent-card:not([hidden]) { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); max-width:760px; margin:0 auto var(--space-3); padding:var(--space-3) var(--space-3) var(--space-3) var(--space-4); border-radius:var(--radius-panel); background:var(--color-field); }
html[data-design="leaders"] .agent-card p { margin:0; color:var(--color-text); font-size:15px; line-height:1.4; }
html[data-design="leaders"] .agent-card-note { color:var(--color-text-secondary); }
html[data-design="leaders"] .agent-card > div { display:flex; flex:none; gap:var(--space-2); }
html[data-design="leaders"] .agent-card button { min-height:36px; padding:0 var(--space-4); border:0; border-radius:var(--radius-pill); background:var(--color-surface); color:var(--color-text); font:inherit; font-size:15px; font-weight:500; cursor:pointer; }
html[data-design="leaders"] .agent-card button.primary { background:var(--color-action); color:var(--color-on-action); }
html[data-design="leaders"] .agent-card button[hidden] { display:none; }
@media (max-width:640px) {
  html[data-design="leaders"] .agent-card:not([hidden]) { flex-direction:column; align-items:stretch; gap:var(--space-2); margin-bottom:var(--space-2); padding:var(--space-3); }
  html[data-design="leaders"] .agent-card > div > button { flex:1; }
}

html[data-design="leaders"] .agent-hint:not([hidden]) { position:absolute; z-index:6; top:0; left:var(--hint-left, 0); transform:translateY(calc(-100% - 8px)); padding:var(--space-2) var(--space-3); border-radius:var(--radius-control); background:var(--color-text); color:var(--color-bg); font-size:14px; line-height:20px; white-space:nowrap; pointer-events:none; }
html[data-design="leaders"] .agent-hint::after { content:""; position:absolute; left:var(--hint-arrow, 50%); bottom:-4px; width:8px; height:8px; background:inherit; transform:translateX(-50%) rotate(45deg); }

html[data-design="leaders"] .agent-nudge { display:flex; align-items:center; gap:var(--space-2); max-width:760px; margin:calc(-1 * var(--space-2)) auto var(--space-4); color:var(--color-text-secondary); font-size:14px; line-height:20px; }
html[data-design="leaders"] .agent-nudge button { min-height:32px; padding:0 var(--space-1); border:0; background:none; color:var(--color-text); font:inherit; font-weight:500; cursor:pointer; }
html[data-design="leaders"] .agent-nudge .agent-nudge-close { display:grid; place-items:center; width:32px; padding:0; border-radius:50%; color:var(--color-text-tertiary); }
html[data-design="leaders"] .agent-nudge .agent-nudge-close svg { width:16px; height:16px; }

html[data-design="leaders"] .agent-s-slot:not([hidden]) { flex:1; min-height:240px; }
html[data-design="leaders"] body.agent-in-app #messages,
html[data-design="leaders"] body.agent-in-app .composer-wrap > :not(.composer-stage),
html[data-design="leaders"] body.agent-in-app .composer-stage > :not(.composer),
html[data-design="leaders"] body.agent-in-app .composer > :not(#composer-actions) { display:none; }

html[data-design="leaders"] body.agent-mode:not(.agent-in-app) #model-pill,
html[data-design="leaders"] body.agent-mode:not(.agent-in-app) #thinking-control { display:none; }
html[data-design="leaders"] body.agent-in-app .composer-wrap { height:56px; margin:0; padding-top:var(--space-2); padding-bottom:var(--space-2); background:none; }
html[data-design="leaders"] body.agent-in-app .composer { display:flex; justify-content:center; min-height:0; padding:0; background:none; box-shadow:none; }

html[data-design="leaders"] body.agent-in-app:has(.agent-s-slot[data-serpent-chips="app"]) .composer-wrap { display:none; }

html[data-design="leaders"] #screen-composition[data-tool-run] .catalog-heading { display:none; }

html[data-design="leaders"] #screen-composition:has(.composition-layout.is-tool) .catalog-heading { display:none; }
@media (max-width:899px) { html[data-design="leaders"] #screen-composition:has(.composition-layout[data-view="detail"]) .catalog-heading { display:none; } }
html[data-design="leaders"] .composition-layout.is-tool > .composition-detail > .composition-detail-head { position:sticky; top:0; z-index:2; min-height:56px; margin-bottom:var(--space-2); padding:6px 0; background:var(--color-bg); }
html[data-design="leaders"] .composition-layout.is-tool .composition-detail-back { width:44px; height:44px; margin-left:-11px; justify-content:center; padding:0; border-radius:50%; color:var(--color-text-secondary); }
html[data-design="leaders"] .composition-layout.is-tool .composition-detail-back > span { display:none; }
html[data-design="leaders"] .composition-layout.is-tool .composition-detail-back svg { width:24px; height:24px; }
html[data-design="leaders"] .composition-layout.is-tool .composition-detail-head h2 { min-width:0; overflow:hidden; font-size:var(--text-heading); line-height:var(--leading-heading); font-weight:var(--weight-medium); letter-spacing:var(--tracking-heading); text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:899px) {
  html[data-design="leaders"] .composition-layout[data-view="detail"] > .composition-detail > .composition-detail-head { position:sticky; top:0; z-index:2; min-height:56px; margin-bottom:var(--space-2); padding:6px 0; background:var(--color-bg); }
  html[data-design="leaders"] .composition-layout[data-view="detail"] .composition-detail-back { width:44px; height:44px; margin-left:-11px; justify-content:center; padding:0; border-radius:50%; color:var(--color-text-secondary); }
  html[data-design="leaders"] .composition-layout[data-view="detail"] .composition-detail-back > span { display:none; }
  html[data-design="leaders"] .composition-layout[data-view="detail"] .composition-detail-back svg { width:24px; height:24px; }
  html[data-design="leaders"] .composition-layout[data-view="detail"] .composition-detail-head h2 { min-width:0; overflow:hidden; font-size:var(--text-heading); line-height:var(--leading-heading); font-weight:var(--weight-medium); letter-spacing:var(--tracking-heading); text-overflow:ellipsis; white-space:nowrap; }
}
html[data-design="leaders"] .composition-detail-back:active { background:var(--color-active); }

html[data-design="leaders"] .composition-detail-body > .composition-detail-actions:has(> .composition-primary):last-of-type { position:sticky; bottom:calc(-1 * (var(--space-8) + var(--edge-bottom))); z-index:1; margin-inline:calc(-1 * var(--space-4)); padding:var(--space-3) var(--space-4) calc(var(--space-3) + var(--edge-bottom)); border-radius:0 0 var(--radius-panel) var(--radius-panel); background:var(--color-surface); }

html[data-design="leaders"] #screen-composition .catalog-shell { max-width:1120px; }


html[data-design="leaders"] #screen-composition .composition-compare { border-radius: var(--radius-control); overflow: hidden; background: var(--color-field); }
html[data-design="leaders"] #screen-composition .composition-compare img { display: block; width: 100%; max-height: 62vh; object-fit: contain; }

html[data-design="leaders"] #screen-composition .composition-batch { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
html[data-design="leaders"] #screen-composition .composition-batch img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--radius-control); background: var(--color-field); }
html[data-design="leaders"] #screen-composition .composition-refs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
html[data-design="leaders"] #screen-composition .composition-ref { position: relative; width: 64px; height: 64px; }
html[data-design="leaders"] #screen-composition .composition-ref[data-off] { opacity: .4; }
html[data-design="leaders"] #screen-composition .composition-ref img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-control); background: var(--color-field); }
html[data-design="leaders"] #screen-composition .composition-ref button { position: absolute; top: -6px; right: -6px; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%; display: grid; place-items: center; background: var(--panel); box-shadow: 0 0 0 1px var(--color-border); color: inherit; }
html[data-design="leaders"] #screen-composition .composition-ref button svg { width: 12px; height: 12px; }
html[data-design="leaders"] #screen-composition .composition-mask { position: relative; border-radius: var(--radius-control); overflow: hidden; background: var(--color-field); touch-action: none; }
html[data-design="leaders"] #screen-composition .composition-mask img { display: block; width: 100%; height: auto; user-select: none; -webkit-user-drag: none; }
html[data-design="leaders"] #screen-composition .composition-mask canvas { position: absolute; inset: 0; width: 100%; height: 100%; cursor: crosshair; }
html[data-design="leaders"] #screen-composition .composition-edit-toggle { align-self: flex-start; }
html[data-design="leaders"] #screen-composition .composition-step { margin: 0; font-size: 20px; line-height: 1.25; font-weight: 600; }
html[data-design="leaders"] #screen-composition .composition-works, html[data-design="leaders"] #screen-composition .composition-cues { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
html[data-design="leaders"] #screen-composition .composition-work { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 48px; padding: 0 var(--space-4); border: 0; border-radius: var(--radius-control); background: var(--color-field); color: inherit; font: inherit; font-size: 16px; text-align: left; }
html[data-design="leaders"] #screen-composition .composition-work small { font-size: 14px; opacity: .7; flex-shrink: 0; white-space: nowrap; }

html[data-design="leaders"] #screen-composition .composition-works > li { min-width: 0; }
html[data-design="leaders"] #screen-composition .composition-work b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-design="leaders"] #screen-composition .composition-cue { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 8px; }
html[data-design="leaders"] #screen-composition .composition-primary, html[data-design="leaders"] #screen-composition .composition-secondary { gap: 8px; }

html[data-design="leaders"] #screen-composition .composition-failure { display: grid; gap: var(--space-1); }
html[data-design="leaders"] #studio-list .studio-filters { align-self: flex-start; margin: 0 0 var(--space-3); }


html[data-design="leaders"] :is(.settings-shell, #model-sheet) { border-color:transparent; box-shadow:none; }

html[data-design="leaders"] .catalog-list .chat-list-row { border-bottom-color:transparent; border-radius:var(--radius-control); }
html[data-design="leaders"] .chat-day { font-weight:var(--weight-regular); letter-spacing:0; }

html[data-design="leaders"] .history-state:not(.loading) strong { font-weight:var(--weight-medium); }
html[data-design="leaders"] .history-state:not(.loading) button { border-color:transparent; background:var(--color-hover); font-weight:var(--weight-medium); }
@media (hover:hover) { html[data-design="leaders"] .history-state:not(.loading) button:hover { background:var(--color-active); } }

html[data-design="leaders"] .company-disclosure { border-color:transparent; background:var(--color-surface); }
html[data-design="leaders"] .company-disclosure > summary strong { font-weight:var(--weight-medium); }
html[data-design="leaders"] .catalog-company .model-brand { box-shadow:none; }
@media (min-width:900px) {
  
  html[data-design="leaders"] #sidebar { border-right-color:transparent; }
  
  html[data-design="leaders"] .settings-home :is(.settings-account, .settings-group > button) { border-radius:var(--radius-control); background:transparent; box-shadow:none; }
  html[data-design="leaders"] .settings-home :is(.settings-account, .settings-group > button):hover { background:var(--color-hover); }
  html[data-design="leaders"] .settings-home :is(.settings-account, .settings-group > button).active { background:var(--color-active); }
  html[data-design="leaders"] .settings-shell :is(.settings-detail-card, .plan-stats, .profile-periods, .usage-sheet > :is(.usage-bars, .credit-wallet, .usage-model-details)) { background:transparent; }
  html[data-design="leaders"] .settings-shell .settings-group-title { padding-inline:0; }
  html[data-design="leaders"] .settings-shell .web-logout { justify-content:flex-start; margin-left:0; padding-inline:0; background:transparent; }
  html[data-design="leaders"] .settings-shell .account-delete-entry { justify-content:flex-start; margin-top:0; padding-inline:0; }
  html[data-design="leaders"] .settings-shell .account-delete-entry:is(:hover, :active) { background:transparent; opacity:.8; }
  html[data-design="leaders"] .settings-shell .web-logout:is(:hover, :active) { background:transparent; opacity:.8; }
}


html[data-design="leaders"] .brand .brand-glyph { background:var(--color-brand); }

html[data-design="leaders"] #action-agent:not([aria-pressed="true"]), html[data-design="leaders"] #action-agent:not([aria-pressed="true"]) > svg { color:inherit; }
@media (hover:hover) { html[data-design="leaders"] #action-agent:hover:not([aria-pressed="true"]) { color:var(--color-text); background-color:var(--color-active); } }

html[data-design="leaders"][data-theme="dark"] .composer { box-shadow:0 0 0 1px rgba(255,255,255,.08), var(--shadow-composer); }
@media (prefers-color-scheme:dark) { html[data-design="leaders"]:not([data-theme="light"]) .composer { box-shadow:0 0 0 1px rgba(255,255,255,.08), var(--shadow-composer); } }
@media (min-width:900px) {
  html[data-design="leaders"] { --row-height:36px; --radius-composer:24px; }
  
  html[data-design="leaders"] .sidebar :is(.new-chat-button, .sidebar-primary-nav > button, .chat-item, .settings-shortcut) { border-radius:10px; }
  html[data-design="leaders"] .sidebar-chat-list .chat-item, html[data-design="leaders"] .sidebar-chat-list .chat-list-row .chat-item { min-height:36px; padding-block:6px; font-size:14px; }
  html[data-design="leaders"] .sidebar #history-search.sidebar-search { height:36px; min-height:36px; border-radius:10px; font-size:14px; }
  
  html[data-design="leaders"] body:not(.guest-mode) .conversation-header { min-height:52px; padding:var(--space-2) var(--space-3) var(--space-2) var(--space-5); grid-template-columns:minmax(0, 1fr) auto auto auto; }
  html[data-design="leaders"] body:not(.guest-mode) .conversation-header .conversation-title { display:block; grid-column:1; grid-row:1; padding-left:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; font-weight:var(--weight-medium); color:var(--color-text); }
  html[data-design="leaders"] body .conversation-header > :is(#chat-more, #new-chat-header) { width:36px; min-width:36px; height:36px; min-height:36px; border-radius:10px; }
  
  html[data-design="leaders"] .composer-actions > button { min-height:36px; height:36px; }
  html[data-design="leaders"] .composer :is(.composer-control, .model-pill, .send-button, #thinking-control, #media-settings) { min-height:36px; height:36px; }
  html[data-design="leaders"] .composer :is(.composer-control.icon-only, .send-button:not(.has-price)) { width:36px; min-width:36px; }
}

html[data-design="leaders"] .brand .brand-glyph, html[data-design="leaders"] .welcome-mark.brand-glyph { background:var(--color-brand-mark, var(--color-brand)); }
html[data-design="leaders"] .composer-disclaimer { font-size:14px; line-height:20px; color:var(--color-text-tertiary); }
@media (min-width:900px) { html[data-design="leaders"] .message-row.user .message-bubble { padding:10px 16px; border-radius:20px; } }

html[data-design="leaders"] .answer-content .code-block { --code-bg:color-mix(in srgb, var(--color-text) 3%, var(--color-bg)); background:var(--code-bg); border-color:transparent; box-shadow:inset 0 0 0 1px var(--color-border); }
@media (hover:hover) and (pointer:fine) {
  html[data-design="leaders"] .message-row.assistant:has(~ .message-row.assistant) .message-actions.response-footer button { opacity:0; transition:opacity 120ms var(--ease-ui); }
  html[data-design="leaders"] .message-row.assistant:has(~ .message-row.assistant):is(:hover, :focus-within) .message-actions.response-footer button { opacity:1; }
  html[data-design="leaders"] .message-row.assistant:has(~ .message-row.assistant) .message-actions.response-footer button[data-read-aloud][aria-pressed="true"] { opacity:1; }   
  html[data-design="leaders"] .message-actions.response-footer button { width:32px; min-width:32px; min-height:32px; height:32px; border-radius:8px; color:var(--color-text-tertiary); }
}

html[data-design="leaders"] .sidebar-limit:not([hidden]) { display:flex; align-items:center; gap:10px; width:100%; min-height:44px; margin:-4px 0; padding:0 12px; border-radius:10px; color:var(--color-text-secondary); background:transparent; font-size:14px; line-height:20px; font-weight:var(--weight-medium); text-align:left; }
@media (hover:hover) { html[data-design="leaders"] .sidebar-limit:hover { color:var(--color-text); background:var(--color-hover); } }
html[data-design="leaders"] .sidebar-limit-label { flex:none; font-weight:var(--weight-regular); }
html[data-design="leaders"] .sidebar-limit-bar { position:relative; flex:1; min-width:0; height:6px; overflow:hidden; border-radius:3px; background:var(--color-track); }
html[data-design="leaders"] .sidebar-limit-fill { position:absolute; inset:0 auto 0 0; border-radius:3px; background:var(--color-text); transition:width 200ms var(--ease-ui); }
html[data-design="leaders"] .sidebar-limit[data-level="amber"] .sidebar-limit-fill { background:var(--color-warning); }
html[data-design="leaders"] .sidebar-limit[data-level="red"] .sidebar-limit-fill { background:var(--color-danger); }
html[data-design="leaders"] .sidebar-limit-percent { flex:none; min-width:36px; text-align:right; font-variant-numeric:tabular-nums; font-weight:var(--weight-regular); }
html[data-design="leaders"] .sidebar-limit[data-level="red"] .sidebar-limit-percent { color:var(--color-danger); }
html[data-design="leaders"] body.guest-mode .sidebar-limit { display:none; }
@media (min-width:900px) { html[data-design="leaders"] .conversation-header .limit-row:not(:has(.limit-line.has-credits)) { display:none; } }

@media (max-width:640px) {
  html[data-design="leaders"] #composer-actions > #media-settings { position:relative; margin-left:var(--space-2); background-color:transparent; }
  html[data-design="leaders"] #composer-actions > #media-settings::before { content:""; position:absolute; left:calc(-1 * var(--space-1) - 1px); top:12px; bottom:12px; width:1px; background:var(--color-border); }
  html[data-design="leaders"] #composer-actions > #action-tools { background-color:transparent; }
  @media (hover:hover) { html[data-design="leaders"] #composer-actions > :is(#media-settings, #action-tools):hover { background-color:var(--color-hover); } }
  html[data-design="leaders"] #composer-actions > :is(#media-settings, #action-tools)[aria-expanded="true"] { background-color:var(--color-active); }
}

html[data-design="leaders"] .sidebar-chat-list .chat-item { color:var(--color-text-secondary); }
html[data-design="leaders"] .sidebar-chat-list .chat-item:is(.active, [aria-current="page"], :hover, :focus-visible) { color:var(--color-text); }
html[data-design="leaders"] .settings-shortcut #account-plan { color:var(--color-text-tertiary); }

@media (max-width:640px) {
  html[data-design="leaders"] :is(.conversation-header > :is(.more-button, .header-new-chat), .studio-header) svg { width:24px; height:24px; }
}
html[data-design="leaders"] #settings-account svg { stroke-width:2; }

@media (max-width:640px) {
  html[data-design="leaders"] .conversation-header .limit-line:not(.has-credits) .limit-bar { width:56px; }
}

html[data-design="leaders"] body:not([data-screen="chat"]) .sidebar-chat-list .chat-item.active:not(:hover, :focus-visible) { background:transparent; color:var(--color-text-secondary); }
html[data-design="leaders"] body:not([data-screen="chat"]) .sidebar-chat-list .chat-list-row:not(:hover, :focus-within, :has(> .row-more[aria-expanded="true"])) { --more-gap:0px; }
html[data-design="leaders"] body:not([data-screen="chat"]) .sidebar-chat-list .chat-list-row:not(:hover, :focus-within, :has(> .row-more[aria-expanded="true"])) > .row-more { opacity:0; pointer-events:none; }
@media (min-width:900px) {
  
  html[data-design="leaders"] .conversation-header .limit-line.has-credits { height:36px; min-height:36px; border-width:0; }
}
@media (min-width:641px) {
  
  html[data-design="leaders"] [data-settings-view="profile"] .settings-view-title { flex-direction:row; justify-content:flex-start; gap:var(--space-4); margin:0 0 var(--space-2); text-align:left; }
  html[data-design="leaders"] [data-settings-view="profile"] .settings-view-title .avatar { width:56px; height:56px; font-size:22px; }
}

@media (min-width:641px) {
  
  html[data-design="leaders"] .catalog-list .chat-list-row:has(> .chat-item) > .row-more { position:absolute; top:calc(var(--space-3) + (1lh - var(--control-min)) / 2); right:var(--space-1); width:var(--control-min); height:var(--control-min); min-width:0; min-height:0; border-radius:var(--radius-small); }
  html[data-design="leaders"] .catalog-list .chat-list-row > .chat-item { padding-right:var(--space-3); }
  html[data-design="leaders"] .catalog-list .chat-list-row > .chat-item strong { padding-right:var(--control-min); }
}
@media (min-width:641px) and (hover:hover) {
  html[data-design="leaders"] .catalog-list .chat-list-row:has(> .chat-item):not(:hover, :focus-within, :has(> .row-more[aria-expanded="true"])) > .row-more { opacity:0; pointer-events:none; }
}
@media (min-width:900px) {
  
  html[data-design="leaders"] .settings-home .settings-account:not([hidden]) { display:none; }
  html[data-design="leaders"] .settings-home .settings-group > button[data-settings-panel="profile"] { display:grid; }
}

@media (min-width: 900px) {
  html[data-design="leaders"][data-serpent-app] .app-shell { grid-template-columns:264px minmax(0, 1fr); max-width:none; }
  html[data-design="leaders"][data-serpent-app] body .conversation-header { min-height:52px; height:52px; padding-left:24px; border-bottom:0; -webkit-app-region:drag; }
  html[data-design="leaders"][data-serpent-app] .conversation-header :is(button, a, input, [role="button"]) { -webkit-app-region:no-drag; }
  html[data-design="leaders"][data-serpent-app] .conversation-header > .conversation-title { padding-left:0; }
  html[data-design="leaders"][data-serpent-app] .conversation-title h2 { font-size:15px; font-weight:var(--weight-medium); }
}

html[data-design="leaders"] .home-chips { display:flex; flex-wrap:wrap; justify-content:center; gap:var(--space-2); max-width:760px; margin:var(--space-4) auto 0; }

html[data-design="leaders"] .home-chips:not([hidden]) ~ .composer-disclaimer:not(.guest-links) { display:none; }

html[data-design="leaders"] .home-examples { display:flex; flex-direction:column; gap:2px; max-width:760px; margin:var(--space-3) auto 0; }
html[data-design="leaders"] .home-examples[hidden] { display:none; }

html[data-design="leaders"][data-shell="home"] #loading { display:none; }
html[data-design="leaders"][data-shell="home"] #screen-chat { animation:none; }
html[data-design="leaders"]:not([data-shell="home"]) .is-shell { display:none; }
@media (max-width:640px) { html[data-design="leaders"][data-shell="home"] :is(.mobile-header, .conversation-header > .header-new-chat, .conversation-header > .more-button) { display:none; } }
html[data-design="leaders"] .home-examples button { display:flex; align-items:center; gap:var(--space-3); min-height:40px; padding:8px 12px; border:0; border-radius:var(--radius-control); background:transparent; color:var(--color-text-secondary); font:inherit; font-size:15px; line-height:22px; text-align:left; cursor:pointer; }
html[data-design="leaders"] .home-examples button:hover { background:var(--color-hover); color:var(--color-text); }
html[data-design="leaders"] .home-examples svg { flex:none; width:18px; height:18px; color:var(--color-text-tertiary); }
@media (min-width:641px) { html[data-design="leaders"] .home-examples:not([hidden]) ~ .composer-disclaimer:not(.guest-links) { display:none; } }
@media (max-width:640px) { html[data-design="leaders"] .home-examples { margin:0 0 var(--space-2); } html[data-design="leaders"] .home-examples button { min-height:44px; padding:10px 12px; } }
html[data-design="leaders"] .home-chips button { display:inline-flex; align-items:center; gap:var(--space-2); min-height:36px; height:36px; padding:0 14px; border:0; border-radius:999px; background:transparent; box-shadow:inset 0 0 0 1px var(--color-border); color:var(--color-text-secondary); font:inherit; font-size:14px; font-weight:var(--weight-medium); line-height:20px; white-space:nowrap; cursor:pointer; }
html[data-design="leaders"] .home-chips button:hover { background:var(--color-hover); color:var(--color-text); }
html[data-design="leaders"] .home-chips svg { flex:none; width:16px; height:16px; stroke-width:1.75; }

html[data-design="leaders"][data-serpent-app][data-serpent-frame] .app-sidebar-head { display:block; position:absolute; inset:0 0 auto 0; height:52px; -webkit-app-region:drag; }
html[data-design="leaders"][data-serpent-app][data-serpent-frame] .app-sidebar-toggle { display:grid; position:absolute; top:12px; right:12px; place-items:center; width:28px; min-width:28px; height:28px; min-height:28px; padding:0; border:0; border-radius:8px; color:var(--color-text-secondary); background:transparent; -webkit-app-region:no-drag; }
html[data-design="leaders"][data-serpent-app][data-serpent-frame] .app-sidebar-toggle:hover { color:var(--color-text); background:var(--color-hover); }
html[data-design="leaders"][data-serpent-app][data-serpent-frame] .app-sidebar-toggle svg { width:20px; height:20px; }
html[data-design="leaders"][data-serpent-app][data-serpent-frame] body .sidebar { padding-top:100px; border-right:0; }
html[data-design="leaders"][data-serpent-app][data-serpent-frame] .sidebar > .new-chat-button { margin-top:0; }
html[data-design="leaders"][data-serpent-app][data-serpent-frame] .sidebar > .brand, html[data-design="leaders"][data-serpent-app][data-serpent-frame] .sidebar > .drawer-close, html[data-design="leaders"][data-serpent-app][data-serpent-frame] .conversation-header > .back-button { display:none; }
@media (min-width:900px) {
  html[data-design="leaders"][data-serpent-app][data-serpent-frame][data-serpent-collapsed] .app-shell { grid-template-columns:minmax(0, 1fr); }
  html[data-design="leaders"][data-serpent-app][data-serpent-frame][data-serpent-collapsed] .sidebar { display:none; }
  html[data-design="leaders"][data-serpent-app][data-serpent-frame][data-serpent-collapsed] body .conversation-header { padding-left:196px; }
}
@media (max-width:899px) {
  html[data-design="leaders"][data-serpent-app][data-serpent-frame] body .sidebar { width:264px; border-radius:0; }
  
  html[data-design="leaders"][data-serpent-app][data-serpent-frame] body .conversation-header { min-height:52px; height:52px; padding-block:4px; padding-left:188px; grid-template-columns:0 minmax(0, 1fr) 44px; border-bottom:0; -webkit-app-region:drag; }
  html[data-design="leaders"][data-serpent-app][data-serpent-frame] .conversation-header :is(button, a, input, [role="button"]) { -webkit-app-region:no-drag; }
  html[data-design="leaders"][data-serpent-app][data-serpent-frame] .conversation-header > .conversation-title { padding-left:0; }
  html[data-design="leaders"][data-serpent-app][data-serpent-frame] .conversation-header #conversation-title { font-size:15px; font-weight:var(--weight-medium); line-height:22px; }
}

@media (max-width:899px) { html[data-design="leaders"][data-serpent-app] .home-chips:not([hidden]) { margin-bottom:var(--space-2); } }

html[data-design="leaders"][data-serpent-app] { --app-popover-shadow:0 2px 6px rgba(0,0,0,.30), 0 16px 40px rgba(0,0,0,.50); }
html[data-design="leaders"][data-serpent-app][data-theme="light"] { --app-popover-shadow:0 2px 6px rgba(0,0,0,.06), 0 12px 32px rgba(0,0,0,.12); }
@media (prefers-color-scheme: light) { html[data-design="leaders"][data-serpent-app]:not([data-theme="dark"]) { --app-popover-shadow:0 2px 6px rgba(0,0,0,.06), 0 12px 32px rgba(0,0,0,.12); } }

html[data-design="leaders"][data-serpent-app] .composer-controls .model-pill > .model-pill-mark { display:none; }
html[data-design="leaders"][data-serpent-app] .composer :is(.model-pill, #thinking-control) { min-height:32px; height:32px; padding:0 var(--space-2); border-radius:8px; background-color:transparent; box-shadow:none; color:var(--color-text-secondary); font-size:14px; font-weight:var(--weight-medium); }
html[data-design="leaders"][data-serpent-app] .composer :is(.model-pill, #thinking-control):hover:not(:disabled) { background-color:var(--color-hover); color:var(--color-text); }
html[data-design="leaders"][data-serpent-app] .composer :is(.model-pill, #thinking-control)[aria-expanded="true"] { background-color:var(--color-active); color:var(--color-text); }

html[data-design="leaders"][data-serpent-app] .assistant-byline { display:none; }

@media (max-width:899px) {
  html[data-design="leaders"][data-serpent-app] .conversation-header > :is(.limit-row, .header-new-chat) { display:none; }
  html[data-design="leaders"][data-serpent-app]:not([data-serpent-frame]) body:not(.guest-mode) .conversation-header { grid-template-columns:44px minmax(0, 1fr) 44px; }
  html[data-design="leaders"][data-serpent-app] .conversation-header > .more-button { grid-column:3; }
}

@media (min-width:900px) {
  html[data-design="leaders"][data-serpent-app] .settings-shell { width:min(760px, 100%); column-gap:32px; grid-template-rows:auto auto auto; }
  html[data-design="leaders"][data-serpent-app] .settings-shell > .settings-close { grid-column:1 / -1; grid-row:1; justify-self:start; min-height:32px; height:32px; margin:0 0 var(--space-2) calc(-1 * var(--space-2)); padding:0 var(--space-2); border-radius:8px; font-size:14px; font-weight:var(--weight-medium); }
  html[data-design="leaders"][data-serpent-app] .settings-shell > .settings-heading { grid-row:2; }
  html[data-design="leaders"][data-serpent-app] .settings-shell > :is(.settings-home, .settings-content) { grid-row:3; }
}

@media (min-width:641px) and (max-width:899px) {
  html[data-design="leaders"][data-serpent-app] .settings-screen { background:rgba(0,0,0,.50); }
  html[data-design="leaders"][data-serpent-app][data-theme="light"] .settings-screen { background:rgba(0,0,0,.32); }
  html[data-design="leaders"][data-serpent-app] .settings-shell { height:auto; max-height:calc(var(--app-height, 100dvh) - 48px); border-radius:16px; }
}
@media (prefers-color-scheme: light) and (min-width:641px) and (max-width:899px) { html[data-design="leaders"][data-serpent-app]:not([data-theme="dark"]) .settings-screen { background:rgba(0,0,0,.32); } }

@media (min-width:761px) {
  html[data-design="leaders"][data-serpent-app] .sheet-backdrop { background:transparent; animation:none; }
  html[data-design="leaders"][data-serpent-app] #model-sheet { padding:6px; border:0; outline:0; border-radius:12px; background:var(--color-elevated); box-shadow:var(--app-popover-shadow); }
  html[data-design="leaders"][data-serpent-app] #model-sheet > header { display:none; }
  html[data-design="leaders"][data-serpent-app] #model-sheet > #model-search-box, html[data-design="leaders"][data-serpent-app] #model-sheet > #model-search-box:focus-within { min-height:36px; margin:0 0 6px; border-color:transparent; border-radius:8px; box-shadow:none; }
  html[data-design="leaders"][data-serpent-app] #model-sheet > #model-search-box input { min-height:36px; font-size:14px; }
  html[data-design="leaders"][data-serpent-app] #model-sheet .model-options { gap:0; }
  html[data-design="leaders"][data-serpent-app] #model-sheet .model-option { border:0; border-radius:8px; }
  html[data-design="leaders"][data-serpent-app] #model-sheet .model-select { min-height:36px; height:36px; padding:0 32px 0 10px; border-radius:8px; font-size:14px; }
  html[data-design="leaders"][data-serpent-app] #model-sheet :is(.model-brand, .model-copy small) { display:none; }
  html[data-design="leaders"][data-serpent-app] #model-sheet .model-option:hover, html[data-design="leaders"][data-serpent-app] #model-sheet .model-option.is-selected { background:transparent; }
  html[data-design="leaders"][data-serpent-app] #model-sheet .model-select:hover { background:var(--color-hover); }
  html[data-design="leaders"][data-serpent-app] #model-sheet .model-selection { right:10px; width:16px; height:16px; color:var(--color-text); }
  html[data-design="leaders"][data-serpent-app] #model-sheet .model-selection svg { width:16px; height:16px; }
}

html[data-design="leaders"][data-agent-composer] .composer-chip > .chip-chevron { width:12px; height:12px; opacity:.7; }
html[data-design="leaders"][data-agent-composer] #agent-folder-chip { padding-right:4px; cursor:default; }
html[data-design="leaders"][data-agent-composer] #agent-folder-clear { display:grid; place-items:center; width:28px; min-width:28px; height:28px; min-height:28px; padding:0; border:0; border-radius:var(--radius-pill); background:transparent; color:inherit; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] #agent-folder-clear:hover { background:var(--color-hover); color:var(--color-text); } }
html[data-design="leaders"][data-agent-composer] #agent-folder-clear svg { width:14px; height:14px; }
html[data-design="leaders"][data-agent-composer] #agent-folder-name { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] #agent-mode-menu .plus-label { margin:0; padding:8px 10px 4px; color:var(--color-text-tertiary); font-size:var(--text-caption); font-weight:var(--weight-medium); line-height:var(--leading-caption); }
html[data-design="leaders"][data-agent-composer] .composer-wrap #agent-mode-menu button { min-height:60px; align-items:center; padding-block:8px; text-align:left; }
html[data-design="leaders"][data-agent-composer] #agent-mode-menu button > span { display:grid; flex:1; gap:2px; min-width:0; }
html[data-design="leaders"][data-agent-composer] #agent-mode-menu b { color:var(--color-text); font-size:14px; font-weight:var(--weight-medium); line-height:20px; }
html[data-design="leaders"][data-agent-composer] #agent-mode-menu small { color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption); white-space:normal; }
html[data-design="leaders"][data-agent-composer] .composer-wrap #agent-mode-menu .mode-check { width:16px; height:16px; color:var(--color-text); visibility:hidden; }
html[data-design="leaders"][data-agent-composer] #agent-mode-menu [aria-checked="true"] .mode-check { visibility:visible; }


html[data-design="leaders"][data-agent-composer] .agent-btn { display:inline-flex; flex:none; align-items:center; justify-content:center; gap:var(--space-2); height:32px; min-height:32px; padding:0 14px; border:0; border-radius:16px; background:var(--color-field); color:var(--color-text); font:inherit; font-size:14px; font-weight:var(--weight-medium); line-height:20px; white-space:nowrap; text-decoration:none; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .agent-btn.primary { background:var(--color-action); color:var(--color-on-action); }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .agent-btn:not(.primary):hover { background:var(--color-hover); } }
html[data-design="leaders"][data-agent-composer] .agent-btn:disabled { opacity:.5; cursor:default; }
html[data-design="leaders"][data-agent-composer] .agent-btn kbd { font:inherit; font-size:var(--text-caption); opacity:.55; }
html[data-design="leaders"][data-agent-composer] .agent-btn.more { margin-left:auto; padding:0 var(--space-2); background:transparent; color:var(--color-text-tertiary); font-weight:var(--weight-regular); }
html[data-design="leaders"][data-agent-composer] .agent-btn.more svg, html[data-design="leaders"][data-agent-composer] .agent-more svg { width:12px; height:12px; transform:rotate(-90deg); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-icon-btn { display:grid; flex:none; place-items:center; width:32px; min-width:32px; height:32px; min-height:32px; padding:0; border:0; border-radius:16px; background:transparent; color:var(--color-text-secondary); cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-icon-btn:hover { background:var(--color-hover); color:var(--color-text); } }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-icon-btn svg { width:18px; height:18px; }


html[data-design="leaders"][data-agent-composer] .agent-run { display:grid; gap:var(--space-2); margin:0 0 var(--space-2); }
html[data-design="leaders"][data-agent-composer] :is(.agent-run, .agent-status-slot):empty { display:none; }
html[data-design="leaders"][data-agent-composer] .agent-steps { display:grid; gap:2px; margin:0; padding:0; list-style:none; }
html[data-design="leaders"][data-agent-composer] .agent-step { display:flex; align-items:center; gap:10px; min-height:32px; color:var(--color-text-secondary); font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .agent-step[data-status="run"] { color:var(--color-text); font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .agent-step[data-status="wait"] { color:var(--color-text); font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .agent-tick { display:grid; flex:none; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--color-text-tertiary); color:var(--color-bg); }
html[data-design="leaders"][data-agent-composer] .agent-tick svg { width:12px; height:12px; stroke-width:2.4; }
html[data-design="leaders"][data-agent-composer] .agent-spin { flex:none; width:18px; height:18px; border:2px solid var(--color-field); border-top-color:var(--color-brand); border-radius:50%; animation:media-wait 900ms linear infinite; }
html[data-design="leaders"][data-agent-composer] .agent-step[data-status="hold"] .agent-spin { border-color:var(--color-border-strong); animation:none; }
html[data-design="leaders"][data-agent-composer] .agent-wdot { flex:none; width:8px; height:8px; margin:0 5px; border-radius:50%; background:var(--color-warning); }

html[data-design="leaders"][data-agent-composer] .agent-dock-card .agent-url { margin:0; color:var(--color-text-secondary); font-family:var(--font-code); font-size:var(--text-meta); line-height:var(--leading-meta); overflow-wrap:anywhere; word-break:break-all; white-space:normal; }
html[data-design="leaders"][data-agent-composer] .agent-stop-mark { display:grid; flex:none; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--color-field); }
html[data-design="leaders"][data-agent-composer] .agent-stop-mark::after { content:""; width:6px; height:6px; border-radius:1px; background:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .agent-step[data-status="stop"] { color:var(--color-text-tertiary); }

html[data-design="leaders"][data-agent-composer] .agent-step { min-width:0; }
html[data-design="leaders"][data-agent-composer] .agent-step-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-step-end { flex:none; margin-left:-6px; color:var(--color-text-tertiary); white-space:nowrap; }

html[data-design="leaders"][data-agent-composer] .agent-skip-mark { display:grid; flex:none; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--color-field); }
html[data-design="leaders"][data-agent-composer] .agent-skip-mark::after { content:""; width:8px; height:2px; border-radius:1px; background:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .agent-step[data-status="skip"] { color:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .agent-warn { display:grid; flex:none; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--color-warning); color:var(--color-bg); font-size:var(--text-caption); font-weight:var(--weight-medium); line-height:1; }

html[data-design="leaders"][data-agent-composer] .pending-answer:not(:empty) + .agent-status-slot { margin-top:12px; }
html[data-design="leaders"][data-agent-composer] .agent-status { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-2); margin:0; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .agent-status time { color:var(--color-text-secondary); }
html[data-design="leaders"][data-agent-composer] .agent-arc { flex:none; width:12px; height:12px; margin:0 3px; border:1.5px solid transparent; border-top-color:var(--color-brand); border-right-color:var(--color-brand); border-radius:50%; animation:media-wait 900ms linear infinite; }
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"][data-agent-composer] :is(.agent-spin, .agent-arc, .chat-task-state[data-state="running"]) { animation:none; } }

html[data-design="leaders"][data-agent-composer] .agent-steps-done { margin:0 0 var(--space-3); }
html[data-design="leaders"][data-agent-composer] .agent-steps-done > summary { display:flex; align-items:center; gap:10px; min-height:32px; color:var(--color-text-secondary); font-size:14px; line-height:20px; list-style:none; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .agent-steps-done > summary::-webkit-details-marker { display:none; }
html[data-design="leaders"][data-agent-composer] .agent-sum { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-more { display:inline-flex; flex:none; align-items:center; gap:4px; margin-left:auto; padding:0 var(--space-2); color:var(--color-text-tertiary); font-size:var(--text-meta); }
html[data-design="leaders"][data-agent-composer] .agent-steps-done[open] .agent-more svg { transform:none; }
html[data-design="leaders"][data-agent-composer] .agent-steps-done[open] > .agent-steps { margin-top:2px; }

html[data-design="leaders"][data-agent-composer] .message-row:has(.agent-steps-done, .agent-fail) .assistant-byline { display:none; }
html[data-design="leaders"][data-agent-composer] .agent-fail { display:flex; align-items:center; gap:10px; min-height:32px; margin:0 0 var(--space-2); color:var(--color-text-secondary); font-size:14px; }

html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result { display:grid; gap:var(--space-3); margin:var(--space-3) 0 0; }
html[data-design="leaders"][data-agent-composer] .agent-file { display:flex; align-items:center; gap:14px; min-width:0; padding:12px 12px 12px 14px; border-radius:16px; background:var(--color-surface); box-shadow:0 0 0 1px var(--color-border); }
html[data-design="leaders"][data-agent-composer] .agent-file-icon { display:grid; flex:none; place-items:center; width:40px; height:40px; border-radius:10px; background:var(--color-field); color:var(--color-text-secondary); }
html[data-design="leaders"][data-agent-composer] .agent-file-icon svg { width:20px; height:20px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-file-copy { display:grid; flex:1; min-width:0; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-file-copy b { overflow:hidden; font-size:15px; font-weight:var(--weight-semibold); line-height:21px; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-file-copy small { color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"][data-agent-composer] .agent-file-actions { display:flex; flex:none; align-items:center; gap:var(--space-2); }
html[data-design="leaders"][data-agent-composer] .agent-note { display:flex; align-items:flex-start; gap:10px; margin:0; color:var(--color-text-secondary); font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .agent-note .agent-warn { margin-top:1px; }

html[data-design="leaders"][data-agent-composer] .agent-status-shimmer { background:linear-gradient(90deg, var(--color-text-tertiary) 0%, var(--color-text) 50%, var(--color-text-tertiary) 100%); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation:voice-shimmer 1.6s linear infinite; }
html[data-design="leaders"][data-agent-composer] .agent-step-quiet { animation:agent-quiet 10s step-end forwards; }
html[data-design="leaders"][data-agent-composer] .agent-question { display:grid; gap:var(--space-2); }
html[data-design="leaders"][data-agent-composer] .agent-question p { display:flex; align-items:flex-start; gap:10px; margin:0; color:var(--color-text); font-size:15px; line-height:22px; }
html[data-design="leaders"][data-agent-composer] .agent-question .agent-wdot { margin-top:7px; }
html[data-design="leaders"][data-agent-composer] .agent-answer { display:flex; align-items:flex-end; gap:var(--space-2); }
html[data-design="leaders"][data-agent-composer] .agent-answer textarea { flex:1; min-width:0; min-height:40px; max-height:160px; margin:0; padding:9px 12px; border:0; border-radius:10px; background:var(--color-field); box-shadow:0 0 0 1px var(--color-border); color:var(--color-text); font:inherit; font-size:15px; line-height:22px; resize:vertical; }
html[data-design="leaders"][data-agent-composer] .agent-answer textarea:focus-visible { outline:none; box-shadow:0 0 0 1px var(--color-border-strong); }
@media (prefers-reduced-motion: reduce) { html[data-design="leaders"][data-agent-composer] .agent-status-shimmer { animation:none; -webkit-text-fill-color:currentColor; background:none; } html[data-design="leaders"][data-agent-composer] .agent-step-quiet { animation:agent-quiet 0s 10s step-end both !important; } }
html[data-design="leaders"][data-agent-composer] .agent-note[data-code-handoff-note] { color:var(--color-text-tertiary); }

html[data-design="leaders"][data-agent-composer] .agent-file:has(.agent-file-hit) { position:relative; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .agent-file-hit { position:absolute; z-index:0; inset:0; width:auto; min-width:0; height:auto; min-height:0; padding:0; border:0; border-radius:inherit; background:transparent; cursor:pointer; }

html[data-design="leaders"][data-agent-composer] .agent-plan { display:grid; min-width:0; border-radius:16px; background:var(--color-surface); box-shadow:0 0 0 1px var(--color-border); }
html[data-design="leaders"][data-agent-composer] .agent-plan-head { display:flex; align-items:baseline; gap:var(--space-3); min-width:0; padding:14px 18px 10px; }
html[data-design="leaders"][data-agent-composer] .agent-goal { flex:1; min-width:0; overflow:hidden; color:var(--color-text); font-size:15px; font-weight:var(--weight-semibold); line-height:21px; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-plan-count { flex:none; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .agent-track { display:flex; gap:4px; padding:0 18px 8px; }
html[data-design="leaders"][data-agent-composer] .agent-track i { flex:1; height:3px; border-radius:2px; background:var(--color-field); }
html[data-design="leaders"][data-agent-composer] .agent-track i[data-state="completed"] { background:var(--color-brand); }
html[data-design="leaders"][data-agent-composer] .agent-track i[data-state="in_progress"] { background:color-mix(in srgb, var(--color-brand) 40%, var(--color-field)); }
html[data-design="leaders"][data-agent-composer] .agent-plan > .agent-steps { padding:2px 10px 10px; }
html[data-design="leaders"][data-agent-composer] .agent-plan .agent-step { padding:6px 8px; border-radius:10px; }
html[data-design="leaders"][data-agent-composer] .agent-plan .agent-step[data-status="run"] { background:var(--color-hover); }
html[data-design="leaders"][data-agent-composer] .agent-plan .agent-step[data-status="todo"] { color:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .agent-ring { flex:none; width:18px; height:18px; border:1.5px solid var(--color-border-strong); border-radius:50%; }
html[data-design="leaders"][data-agent-composer] .agent-step-copy { display:grid; flex:1; min-width:0; }
html[data-design="leaders"][data-agent-composer] .agent-step-sub { overflow:hidden; color:var(--color-text-tertiary); font-size:var(--text-meta); font-weight:var(--weight-regular); line-height:var(--leading-meta); text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-step-time { flex:none; margin-left:auto; color:var(--color-text-tertiary); font-size:var(--text-meta); font-weight:var(--weight-regular); font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .agent-step:has(.agent-step-sub:not(.agent-step-quiet)) { align-items:flex-start; }
html[data-design="leaders"][data-agent-composer] .agent-step:has(.agent-step-sub:not(.agent-step-quiet)) > :is(.agent-spin, .agent-wdot, .agent-step-time) { margin-top:1px; }
html[data-design="leaders"][data-agent-composer] .agent-steps-done.agent-plan > summary { gap:var(--space-3); min-height:48px; padding:0 10px 0 18px; }
html[data-design="leaders"][data-agent-composer] .agent-steps-done.agent-plan .agent-sum { flex:1; color:var(--color-text); font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .agent-done-status { display:inline-flex; flex:none; align-items:center; gap:6px; color:var(--color-text-secondary); font-size:var(--text-meta); font-weight:var(--weight-medium); font-variant-numeric:tabular-nums; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-done-status .agent-tick { width:16px; height:16px; }
html[data-design="leaders"][data-agent-composer] .agent-steps-done.agent-plan .agent-more { margin-left:0; }
html[data-design="leaders"][data-agent-composer] .agent-steps-done.agent-plan[open] > .agent-steps { margin-top:0; padding:0 10px 10px; }
html[data-design="leaders"][data-agent-composer] .agent-plan + .agent-status-slot:not(:empty), html[data-design="leaders"][data-agent-composer] .agent-run:has(.agent-plan) { margin-bottom:var(--space-3); }
html[data-design="leaders"][data-agent-composer] .agent-file-done { color:var(--color-text); }
html[data-design="leaders"][data-agent-composer] .agent-file:has(.agent-file-hit) > * { pointer-events:none; }
html[data-design="leaders"][data-agent-composer] .agent-file-hit { pointer-events:auto; }
html[data-design="leaders"][data-agent-composer] .agent-file:has(.agent-file-hit) :is(button.agent-icon-btn, button.agent-btn, a.agent-btn) { position:relative; z-index:1; pointer-events:auto; }

html[data-design="leaders"][data-agent-composer] .agent-file:has(.agent-site-thumb) { flex-wrap:wrap; }
html[data-design="leaders"][data-agent-composer] .agent-site-thumb { position:relative; order:-1; flex:1 0 100%; aspect-ratio:2 / 1; max-height:240px; overflow:hidden; border-radius:10px; background:var(--color-field); box-shadow:0 0 0 1px var(--color-border); }
html[data-design="leaders"][data-agent-composer] .agent-site-thumb iframe { position:absolute; top:0; left:0; width:200%; height:200%; border:0; background:#fff; transform:scale(.5); transform-origin:0 0; pointer-events:none; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .agent-file:has(.agent-file-hit:hover) { background:color-mix(in srgb, var(--color-text) 5%, var(--color-surface)); } }
html[data-design="leaders"][data-agent-composer] .agent-file.is-shown { background:color-mix(in srgb, var(--color-text) 7%, var(--color-surface)); }
html[data-design="leaders"][data-agent-composer] .agent-file-hit:focus-visible { outline:2px solid var(--color-text); outline-offset:2px; }
@media (max-width:520px) {
  html[data-design="leaders"][data-agent-composer] .agent-file { flex-wrap:wrap; }
  html[data-design="leaders"][data-agent-composer] .agent-file .agent-file-actions { width:100%; }
  html[data-design="leaders"][data-agent-composer] .agent-file-actions .agent-btn { flex:1; height:36px; }
}

html[data-design="leaders"][data-agent-composer] .agent-onweb .message-bubble { display:grid; gap:var(--space-3); }
html[data-design="leaders"][data-agent-composer] .agent-reason { margin:0; }
html[data-design="leaders"][data-agent-composer] .agent-hand { display:flex; align-items:center; gap:14px; min-width:0; padding:12px 12px 12px 14px; border-radius:16px; background:var(--color-surface); box-shadow:0 0 0 1px var(--color-border); }
html[data-design="leaders"][data-agent-composer] .agent-hand-icon { display:grid; flex:none; place-items:center; width:44px; height:44px; border-radius:12px; background:var(--color-field); }
html[data-design="leaders"][data-agent-composer] .agent-hand-icon i { width:24px; height:24px; background:var(--color-text); -webkit-mask:url('/snake.svg') center / contain no-repeat; mask:url('/snake.svg') center / contain no-repeat; }
html[data-design="leaders"][data-agent-composer] .agent-hand-copy { display:grid; flex:1; min-width:0; }
html[data-design="leaders"][data-agent-composer] .agent-hand-copy b { font-size:15px; font-weight:var(--weight-semibold); line-height:21px; }
html[data-design="leaders"][data-agent-composer] .agent-hand-copy small { overflow:hidden; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-hand-acts { display:flex; flex:none; flex-wrap:wrap; align-items:center; gap:var(--space-2); }

html[data-design="leaders"][data-agent-composer] .agent-hand-download { justify-self:start; margin-top:2px; color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); }
@media (max-width:640px) {
  html[data-design="leaders"][data-agent-composer] .agent-hand { flex-wrap:wrap; }
  html[data-design="leaders"][data-agent-composer] .agent-hand-copy small { white-space:normal; }
  html[data-design="leaders"][data-agent-composer] .agent-hand-acts { width:100%; }
  html[data-design="leaders"][data-agent-composer] .agent-hand-acts .agent-btn { flex:1; height:40px; border-radius:20px; }
}


html[data-design="leaders"][data-agent-composer] .agent-dock:not([hidden]) { display:block; max-width:760px; margin:0 auto var(--space-2); }

html[data-design="leaders"][data-agent-composer] .request-error[data-kind="agent"] { max-width:760px; border-radius:16px; }

html[data-design="leaders"][data-agent-composer] .request-error[data-kind="agent"] { padding-left:var(--space-4); }
html[data-design="leaders"][data-agent-composer] .request-error[data-kind="agent"] > #request-error-message { padding-left:0; }
html[data-design="leaders"][data-agent-composer] .request-error[data-kind="agent"] > #request-error-message::before { content:none; }
html[data-design="leaders"][data-agent-composer] .agent-dock-card { display:grid; gap:12px; padding:16px; border-radius:16px; background:var(--color-surface); box-shadow:0 0 0 1px var(--color-border-strong), var(--shadow-composer); }
html[data-design="leaders"][data-agent-composer] .agent-dock-head { display:flex; align-items:center; gap:10px; font-size:15px; font-weight:var(--weight-semibold); line-height:22px; }
html[data-design="leaders"][data-agent-composer] .agent-dock-head svg { flex:none; width:20px; height:20px; color:var(--color-text-secondary); }
html[data-design="leaders"][data-agent-composer] .agent-dock-card[data-kind="confirm"] .agent-dock-head svg { color:var(--color-warning); }
html[data-design="leaders"][data-agent-composer] .agent-dock-card > p { margin:0; color:var(--color-text-secondary); font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .agent-dock-btns { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2); }
html[data-design="leaders"][data-agent-composer] .agent-dock-btns .agent-btn { height:36px; min-height:36px; border-radius:18px; }
html[data-design="leaders"][data-agent-composer] .agent-dock-btns .agent-btn:not(.primary):not(.more) { background:transparent; color:var(--color-text-secondary); }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .agent-dock-btns .agent-btn:not(.primary):hover { background:var(--color-hover); color:var(--color-text); } }
html[data-design="leaders"][data-agent-composer] .agent-folders { display:grid; gap:2px; margin:0 -6px; }
html[data-design="leaders"][data-agent-composer] .agent-folder-row { display:flex; align-items:center; gap:10px; min-height:36px; padding:0 6px; border:0; border-radius:8px; background:transparent; color:var(--color-text); font:inherit; font-size:14px; text-align:left; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .agent-folder-row:hover { background:var(--color-hover); } }
html[data-design="leaders"][data-agent-composer] .agent-folder-row svg { flex:none; width:16px; height:16px; color:var(--color-text-secondary); }
html[data-design="leaders"][data-agent-composer] .agent-folder-row b { font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .agent-folder-row small { min-width:0; overflow:hidden; color:var(--color-text-tertiary); font-size:var(--text-meta); text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-order { display:grid; padding:4px 14px; border-radius:12px; background:var(--color-field); }
html[data-design="leaders"][data-agent-composer] .agent-order > div { display:flex; justify-content:space-between; gap:12px; padding:8px 0; color:var(--color-text-secondary); font-size:14px; font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .agent-order > div + div { box-shadow:inset 0 1px 0 var(--color-border); }
html[data-design="leaders"][data-agent-composer] .agent-order b { color:var(--color-text); font-weight:var(--weight-medium); white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-order-total { color:var(--color-text); font-size:15px; font-weight:var(--weight-semibold); }
html[data-design="leaders"][data-agent-composer] .agent-order-total b { font-weight:var(--weight-semibold); }
html[data-design="leaders"][data-agent-composer] .agent-dock-card > .agent-safe { display:flex; align-items:center; gap:var(--space-2); color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"][data-agent-composer] .agent-safe svg { flex:none; width:14px; height:14px; }
@media (max-width:640px) {
  html[data-design="leaders"][data-agent-composer] .agent-dock-btns .agent-btn.primary { flex:1; }
  html[data-design="leaders"][data-agent-composer] .agent-step { min-height:40px; align-items:flex-start; padding-top:10px; }
}


html[data-design="leaders"][data-agent-composer] #tasks-nav[hidden] { display:none; }

html[data-design="leaders"][data-agent-composer] .tasks-badge:not([hidden]) { display:inline-grid; place-items:center; min-width:18px; height:18px; margin-left:auto; padding:0 5px; border-radius:9px; background:color-mix(in srgb, var(--color-warning) 16%, transparent); color:var(--color-warning); font-size:var(--text-caption); font-weight:var(--weight-medium); line-height:18px; font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .chat-task-state { flex:none; margin-left:auto; }
html[data-design="leaders"][data-agent-composer] .sidebar .chat-item:has(> .chat-task-state) { display:flex; align-items:center; gap:var(--space-2); }
html[data-design="leaders"][data-agent-composer] .sidebar .chat-item:has(> .chat-task-state) > strong { flex:1; min-width:0; }
html[data-design="leaders"][data-agent-composer] .chat-task-state[data-state="running"] { width:12px; height:12px; border:2px solid var(--color-border-strong); border-top-color:var(--color-brand); border-radius:50%; animation:media-wait 900ms linear infinite; }
html[data-design="leaders"][data-agent-composer] .chat-task-state[data-state="waiting"] { color:var(--color-warning); font-size:var(--text-caption); font-weight:var(--weight-medium); line-height:16px; white-space:nowrap; }

html[data-design="leaders"][data-agent-composer] .tasks-list { display:grid; gap:var(--space-2); }
html[data-design="leaders"][data-agent-composer] .tasks-group { display:grid; gap:var(--space-2); }
html[data-design="leaders"][data-agent-composer] .tasks-group h2 { display:flex; gap:var(--space-2); margin:var(--space-4) 0 2px; padding:0 4px; color:var(--color-text-tertiary); font-size:var(--text-meta); font-weight:var(--weight-medium); line-height:18px; }
html[data-design="leaders"][data-agent-composer] .task-row { display:flex; align-items:center; gap:14px; width:100%; min-height:64px; padding:10px 14px; border:0; border-radius:14px; background:var(--color-surface); box-shadow:0 0 0 1px var(--color-border); color:var(--color-text); font:inherit; text-align:left; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .task-row[data-state="waiting"] { box-shadow:0 0 0 1px color-mix(in srgb, var(--color-warning) 55%, transparent); }
html[data-design="leaders"][data-agent-composer] .task-row[data-state="done"] { min-height:52px; background:transparent; box-shadow:none; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .task-row:not([data-source="sc"]):hover { background:var(--color-hover); } }

html[data-design="leaders"][data-agent-composer] .task-row[data-source="sc"] { cursor:default; }
html[data-design="leaders"][data-agent-composer] .task-dot { flex:none; width:8px; height:8px; border-radius:50%; background:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .task-row[data-state="waiting"] .task-dot { background:var(--color-warning); }
html[data-design="leaders"][data-agent-composer] .task-row[data-state="running"] .task-dot { background:var(--color-brand); animation:record-pulse 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"][data-agent-composer] .task-row[data-state="running"] .task-dot { animation:none; } }
html[data-design="leaders"][data-agent-composer] .task-copy { display:grid; flex:1; gap:2px; min-width:0; }
html[data-design="leaders"][data-agent-composer] .task-copy b { overflow:hidden; font-size:15px; font-weight:var(--weight-medium); line-height:21px; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .task-row[data-state="done"] .task-copy b { font-weight:var(--weight-regular); }
html[data-design="leaders"][data-agent-composer] .task-copy small { overflow:hidden; color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .task-when { flex:none; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); font-variant-numeric:tabular-nums; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .task-row[data-state="waiting"] .task-when { color:var(--color-warning); }

html[data-design="leaders"][data-agent-composer] .task-row > .agent-warn { width:16px; height:16px; margin:0 -4px; }
html[data-design="leaders"][data-agent-composer] .tasks-empty { margin:var(--space-6) 0; color:var(--color-text-tertiary); text-align:center; }



html[data-design="leaders"][data-agent-composer] .tasks-acts { display:flex; align-items:center; gap:8px; }
html[data-design="leaders"][data-agent-composer] .tasks-hire svg { width:18px; height:18px; }
@media (max-width:640px) { html[data-design="leaders"][data-agent-composer] .tasks-hire { width:32px; padding:0; } html[data-design="leaders"][data-agent-composer] .tasks-hire span { display:none; } }

@media (max-width:640px) {
  html[data-design="leaders"][data-agent-composer] .tasks-heading { flex-wrap:wrap; justify-content:flex-start; gap:0 8px; }
  html[data-design="leaders"][data-agent-composer] .tasks-heading > div:first-child { margin-right:auto; }
  html[data-design="leaders"][data-agent-composer] .tasks-heading > .tasks-acts { display:contents; }
  html[data-design="leaders"][data-agent-composer] .tasks-heading::after { content:""; order:1; flex-basis:100%; }
  html[data-design="leaders"][data-agent-composer] .tasks-heading .tasks-waiting { order:2; margin-top:8px; }
}
html[data-design="leaders"][data-agent-composer] .tasks-view:not([hidden]) { display:inline-flex; flex:none; gap:2px; height:32px; padding:2px; border-radius:16px; background:rgb(0 0 0 / .05); }
html[data-design="leaders"][data-agent-composer] .tasks-view button { height:28px; min-height:0; padding:0 12px; border:0; border-radius:14px; background:transparent; color:var(--color-text-secondary); font:inherit; font-size:14px; font-weight:var(--weight-medium); line-height:28px; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .tasks-view button[aria-checked="true"] { background:#FFF; color:var(--color-text); box-shadow:0 1px 2px rgb(0 0 0 / .08), 0 0 0 1px rgb(0 0 0 / .04); }
html[data-design="leaders"][data-agent-composer][data-theme="dark"] .tasks-view:not([hidden]) { background:rgb(255 255 255 / .06); }
html[data-design="leaders"][data-agent-composer][data-theme="dark"] .tasks-view button[aria-checked="true"] { background:rgb(255 255 255 / .10); box-shadow:none; }
@media (prefers-color-scheme:dark) {
  html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) .tasks-view:not([hidden]) { background:rgb(255 255 255 / .06); }
  html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) .tasks-view button[aria-checked="true"] { background:rgb(255 255 255 / .10); box-shadow:none; }
}

html[data-design="leaders"][data-agent-composer] { --office-ask-tile:#FBF1DE; --office-ask-tile-strong:color-mix(in srgb, #F5E2BC 45%, #FBF1DE); --office-ask-fill:#F5E2BC; --office-ask-fill-strong:color-mix(in srgb, #7A5414 8%, #F5E2BC); --office-ask-ink:#7A5414; }
html[data-design="leaders"][data-agent-composer][data-theme="dark"] { --office-ask-tile:color-mix(in srgb, var(--color-warning) 14%, var(--color-surface)); --office-ask-tile-strong:color-mix(in srgb, var(--color-warning) 19%, var(--color-surface)); --office-ask-fill:color-mix(in srgb, var(--color-warning) 24%, var(--color-surface)); --office-ask-fill-strong:color-mix(in srgb, var(--color-warning) 30%, var(--color-surface)); --office-ask-ink:rgb(230 190 120); }

@media (prefers-color-scheme:dark) { html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) { --office-ask-tile:color-mix(in srgb, var(--color-warning) 14%, var(--color-surface)); --office-ask-tile-strong:color-mix(in srgb, var(--color-warning) 19%, var(--color-surface)); --office-ask-fill:color-mix(in srgb, var(--color-warning) 24%, var(--color-surface)); --office-ask-fill-strong:color-mix(in srgb, var(--color-warning) 30%, var(--color-surface)); --office-ask-ink:rgb(230 190 120); } }
html[data-design="leaders"][data-agent-composer] .tasks-acts > .tasks-waiting:not([hidden]) { display:inline-flex; flex:none; align-items:center; height:32px; min-height:32px; padding:0 12px; border:0; border-radius:16px; background:var(--office-ask-fill); color:var(--office-ask-ink); font:inherit; font-size:14px; font-weight:var(--weight-medium); line-height:20px; font-variant-numeric:tabular-nums; white-space:nowrap; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .tasks-waiting:hover { background:var(--office-ask-fill-strong); } }
html[data-design="leaders"][data-agent-composer][data-input="keyboard"] :is(.tasks-view button, .tasks-waiting):focus-visible { outline:2px solid var(--color-accent); outline-offset:1px; }
html[data-design="leaders"][data-agent-composer] .office {
  --px:3; --cell:calc(32px * var(--px)); --office-wall:var(--color-surface); --office-window:7;
  --office-floor:color-mix(in srgb, var(--color-text) 3%, var(--color-bg)); --office-seam:color-mix(in srgb, var(--color-text) 4%, var(--color-bg));
  position:relative; isolation:isolate; display:grid; gap:var(--space-2); padding:0 0 var(--space-4); overflow:hidden; border-radius:16px; box-shadow:0 0 0 1px var(--color-border);
  background:var(--office-floor);
}

html[data-design="leaders"][data-agent-composer] .office::before { content:""; position:absolute; inset:0; z-index:-1; background:var(--office-seam); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='72'%3E%3Cpath d='M0 23.5H240M0 47.5H240M0 71.5H240M.5 0V23M80.5 24V47M160.5 48V71' stroke='%23000'/%3E%3C/svg%3E") 0 0 / 240px 72px repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='72'%3E%3Cpath d='M0 23.5H240M0 47.5H240M0 71.5H240M.5 0V23M80.5 24V47M160.5 48V71' stroke='%23000'/%3E%3C/svg%3E") 0 0 / 240px 72px repeat; }
html[data-design="leaders"][data-agent-composer][data-theme="dark"] .office { --office-wall:var(--color-sidebar); --office-window:8; }
@media (prefers-color-scheme:dark) { html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) .office { --office-wall:var(--color-sidebar); --office-window:8; } }
@media (max-width:359px) { html[data-design="leaders"][data-agent-composer] .office { --px:2; } }
html[data-design="leaders"][data-agent-composer] .office :is(.office-sprite, .office-plant, .office-corner) { background-image:url("/office-sprites.png?v=4f0f7df058"); background-repeat:no-repeat; image-rendering:pixelated; }

html[data-design="leaders"][data-agent-composer] .office-wall { position:relative; height:var(--cell); background:var(--office-wall); box-shadow:inset 0 -1px 0 var(--color-border); }
html[data-design="leaders"][data-agent-composer] .office-wall::before,
html[data-design="leaders"][data-agent-composer] .office-wall::after { content:""; position:absolute; top:0; left:25%; width:var(--cell); height:var(--cell); translate:-50% 0; background:url("/office-sprites.png?v=4f0f7df058") no-repeat; image-rendering:pixelated; background-size:calc(480px * var(--px)) calc(192px * var(--px)); background-position:calc(var(--office-window) * -1 * var(--cell)) 0; }
html[data-design="leaders"][data-agent-composer] .office-wall::after { left:75%; }

html[data-design="leaders"][data-agent-composer] .office-row { display:grid; grid-template-columns:repeat(var(--cols), minmax(0, 1fr)) calc(16px * var(--px)); align-items:start; gap:var(--space-2); padding:0 var(--space-2); }
html[data-design="leaders"][data-agent-composer] .office-plant { position:relative; grid-column:-2; width:calc(16px * var(--px)); height:var(--cell); margin-top:68px; background-size:calc(480px * var(--px)) calc(192px * var(--px)); background-position:calc((6 * 32px + 8px) * -1 * var(--px)) 0; }
html[data-design="leaders"][data-agent-composer] .office-cell { display:grid; grid-template-columns:minmax(0, 1fr); min-width:0; }

html[data-design="leaders"][data-agent-composer] .office-desk { display:grid; grid-template-columns:minmax(0, 1fr); grid-template-rows:52px var(--cell) auto auto; grid-template-areas:"bubble" "figure" "plate" "meta"; justify-items:center; row-gap:6px; min-width:0; padding:10px 8px 10px; border:0; border-radius:12px; background:transparent; color:var(--color-text); font:inherit; text-align:center; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-desk:hover { background:color-mix(in srgb, var(--color-surface) 70%, transparent); } }
html[data-design="leaders"][data-agent-composer][data-input="keyboard"] .office-desk:focus-visible { outline:2px solid var(--color-accent); outline-offset:-2px; }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="type"] { --col:0; }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"] { --col:2; }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="done"] { --col:4; }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="fail"] { --col:5; }
html[data-design="leaders"][data-agent-composer] .office-plate { grid-area:plate; display:-webkit-box; max-width:100%; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:14px; font-weight:var(--weight-medium); line-height:20px; text-wrap:balance; }
html[data-design="leaders"][data-agent-composer] .office-meta { grid-area:meta; max-width:100%; min-height:var(--leading-meta); overflow:hidden; color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); font-variant-numeric:tabular-nums; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"] .office-meta { color:var(--color-warning); }
html[data-design="leaders"][data-agent-composer] .office-desk:is([data-pose="done"], [data-pose="fail"]) .office-meta { color:var(--color-text-tertiary); }

html[data-design="leaders"][data-agent-composer] .office-bubble { --office-line:var(--color-border-strong); grid-area:bubble; align-self:end; position:relative; max-width:100%; padding:5px 10px; border:1px solid var(--office-line); border-radius:10px; background:var(--color-surface); color:var(--color-text); font-size:var(--text-meta); line-height:18px; }
html[data-design="leaders"][data-agent-composer] .office-bubble::after { content:""; position:absolute; left:50%; bottom:-5px; width:8px; height:8px; border-right:1px solid var(--office-line); border-bottom:1px solid var(--office-line); background:var(--color-surface); translate:-50% 0; rotate:45deg; }
html[data-design="leaders"][data-agent-composer] .office-say { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow-wrap:anywhere; }


html[data-design="leaders"][data-agent-composer] .office-host { display:inline-block; max-width:100%; overflow-wrap:anywhere; }
html[data-design="leaders"][data-agent-composer] .office-corner { display:none; }

html[data-design="leaders"][data-agent-composer] :is(.office-plant, .office-corner)::after { content:""; position:absolute; z-index:-1; left:50%; bottom:calc(1px * var(--px)); width:calc(14px * var(--px)); height:calc(3px * var(--px)); background:color-mix(in srgb, var(--color-text) 10%, transparent); translate:-50% 50%; clip-path:polygon(14.29% 0, 85.71% 0, 85.71% 33.33%, 100% 33.33%, 100% 66.67%, 85.71% 66.67%, 85.71% 100%, 14.29% 100%, 14.29% 66.67%, 0 66.67%, 0 33.33%, 14.29% 33.33%); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"] .office-bubble { --office-line:color-mix(in srgb, var(--color-warning) 60%, transparent); }
html[data-design="leaders"][data-agent-composer] .office-bubble[data-new] { animation:fade-in 120ms ease-out; }

html[data-design="leaders"][data-agent-composer] .office-figure { grid-area:figure; position:relative; isolation:isolate; width:var(--cell); height:var(--cell); }
html[data-design="leaders"][data-agent-composer] .office-sprite { display:block; width:100%; height:100%; background-size:calc(480px * var(--px)) calc(192px * var(--px)); background-position:calc(var(--col) * -1 * var(--cell)) calc(var(--look) * -1 * var(--cell)); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="type"] .office-sprite { animation:office-frames 1s steps(2) var(--office-phase, 0ms) infinite; }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"] .office-sprite { animation:office-frames 4s steps(2) var(--office-phase, 0ms) infinite; }
html[data-design="leaders"][data-agent-composer] .office[data-paused] .office-sprite { animation-play-state:paused; }

html[data-design="leaders"][data-agent-composer] .office-mark { position:absolute; top:calc(-2px * var(--px)); left:calc(4px * var(--px)); display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--color-warning); color:var(--color-surface); font-size:var(--text-meta); font-weight:var(--weight-medium); line-height:1; }
html[data-design="leaders"][data-agent-composer] .office-more { display:grid; place-items:center; min-height:calc(52px + var(--cell) + 70px); padding:var(--space-3); border:1px dashed var(--color-border-strong); border-radius:12px; background:transparent; color:var(--color-text-secondary); font:inherit; font-size:var(--text-meta); cursor:pointer; }

html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="idle"] .office-sprite { background-position:calc((9 + var(--look)) * -1 * var(--cell)) 0; animation:none; }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="idle"] .office-meta { color:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="free"] .office-sprite { background-position:calc(-14 * var(--cell)) calc(-5 * var(--cell)); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="free"] .office-plate { color:var(--color-brand); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="free"] .office-meta { color:var(--color-text-tertiary); }

html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="free"] { --answer:32px; padding-bottom:calc(14px + var(--answer)); }
html[data-design="leaders"][data-agent-composer] .office-new { position:relative; z-index:1; grid-area:1 / 1; align-self:end; justify-self:center; min-height:32px; margin-bottom:10px; }

html[data-design="leaders"][data-agent-composer] .office-desk[data-live] .office-sprite { background-position:calc((9 + var(--look)) * -1 * var(--cell)) calc(var(--live) * -1 * var(--cell)); animation:none; }

html[data-design="leaders"][data-agent-composer] .office-jar { position:absolute; z-index:-1; left:calc(24px * var(--px)); top:calc(1px * var(--px)); width:calc(8px * var(--px)); height:calc(10px * var(--px)); background:url("/office-sprites.png?v=4f0f7df058") no-repeat; background-size:calc(480px * var(--px)) calc(192px * var(--px)); background-position:calc(-416px * var(--px)) calc(-160px * var(--px)); image-rendering:pixelated; }
html[data-design="leaders"][data-agent-composer] .office-jar::before { content:""; position:absolute; left:calc(1px * var(--px)); right:calc(1px * var(--px)); bottom:calc(1px * var(--px)); height:calc(var(--rows, 0) * 1px * var(--px)); background:#53DC85; }
html[data-design="leaders"][data-agent-composer] .office-jar[data-level="amber"]::before { background:#E8AA46; }

html[data-design="leaders"][data-agent-composer] .office-lobby {
  --px:3; --office-wall:var(--color-surface); --office-floor:color-mix(in srgb, var(--color-text) 3%, var(--color-bg));
  --office-frame:color-mix(in srgb, var(--color-text) 14%, var(--color-surface)); --office-plank:#C9C2B8; --office-plank-edge:#A9A196;
  display:grid; grid-template-columns:auto minmax(0, 1fr) auto; align-items:end; gap:32px; margin-bottom:var(--space-2); padding:20px 24px 0; overflow:hidden; border-radius:16px; box-shadow:0 0 0 1px var(--color-border);
  background:linear-gradient(var(--office-wall) calc(100% - 25px), var(--color-border) 0 calc(100% - 24px), var(--office-floor) 0);
}
html[data-design="leaders"][data-agent-composer][data-theme="dark"] .office-lobby { --office-wall:var(--color-sidebar); --office-plank:color-mix(in srgb, #C9C2B8 40%, var(--color-sidebar)); --office-plank-edge:color-mix(in srgb, #A9A196 40%, var(--color-sidebar)); }
@media (prefers-color-scheme:dark) { html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) .office-lobby { --office-wall:var(--color-sidebar); --office-plank:color-mix(in srgb, #C9C2B8 40%, var(--color-sidebar)); --office-plank-edge:color-mix(in srgb, #A9A196 40%, var(--color-sidebar)); } }
html[data-design="leaders"][data-agent-composer] .office-lobby > * { min-width:0; }
html[data-design="leaders"][data-agent-composer] .office-lobby small { display:block; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"][data-agent-composer] .office-lobby b { display:block; font-size:15px; font-weight:var(--weight-medium); line-height:21px; font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .office-board { align-self:center; min-width:228px; margin:0 6px 30px; padding:10px 15px 12px; background:color-mix(in srgb, var(--color-text) 1.5%, var(--color-surface)); box-shadow:0 0 0 3px color-mix(in srgb, var(--color-text) 10%, var(--color-surface)), 0 0 0 6px var(--office-frame), 0 9px 0 3px var(--office-frame); }
html[data-design="leaders"][data-agent-composer] .office-board b { margin-top:2px; }
html[data-design="leaders"][data-agent-composer] .office-board b > span { display:inline-block; }
html[data-design="leaders"][data-agent-composer] .office-shelf-wrap { align-self:center; display:grid; justify-items:start; gap:6px; margin-bottom:30px; }

html[data-design="leaders"][data-agent-composer] .office-shelf { display:flex; align-items:flex-end; gap:12px; min-height:calc(16px * var(--px)); padding:0 9px; box-shadow:0 9px 0 0 var(--office-plank), 0 12px 0 0 var(--office-plank-edge); }
html[data-design="leaders"][data-agent-composer] .office-shelf[data-empty] { align-items:center; min-width:228px; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"][data-agent-composer] .office-item { flex:none; width:calc(16px * var(--px)); height:calc(16px * var(--px)); min-width:0; min-height:0; padding:0; border:0; border-radius:0; background:url("/office-sprites.png?v=4f0f7df058") no-repeat; background-size:calc(480px * var(--px)) calc(192px * var(--px)); background-position:calc((9 + var(--item)) * -32px * var(--px)) calc(-160px * var(--px)); image-rendering:pixelated; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .office-item[data-kind="sheet"] { --item:1; }
html[data-design="leaders"][data-agent-composer] .office-item[data-kind="doc"] { --item:2; }
html[data-design="leaders"][data-agent-composer][data-input="keyboard"] .office-item:focus-visible { outline:2px solid var(--color-accent); outline-offset:3px; }
html[data-design="leaders"][data-agent-composer] .office-item[data-fly] { visibility:hidden; }
html[data-design="leaders"][data-agent-composer] .office-fly { position:fixed; z-index:30; pointer-events:none; cursor:default; }
html[data-design="leaders"][data-agent-composer] .office-shelf-more { align-self:center; color:var(--color-text-secondary); font-size:var(--text-meta); font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .office-door { display:flex; align-items:flex-end; gap:16px; }
html[data-design="leaders"][data-agent-composer] .office-day { align-self:center; margin-bottom:30px; text-align:right; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .office-door .office-jar { position:relative; z-index:auto; left:auto; top:auto; flex:none; }
html[data-design="leaders"][data-agent-composer] .office-door-art { flex:none; width:calc(16px * var(--px)); height:calc(30px * var(--px)); background:url("/office-sprites.png?v=4f0f7df058") no-repeat; background-size:calc(480px * var(--px)) calc(192px * var(--px)); background-position:calc(-384px * var(--px)) calc(-160px * var(--px)); image-rendering:pixelated; }

html[data-design="leaders"][data-agent-composer] .office-desk[aria-expanded="true"] { background:color-mix(in srgb, var(--color-surface) 70%, transparent); }

html[data-design="leaders"][data-agent-composer] .office-cell { container-type:inline-size; }
html[data-design="leaders"][data-agent-composer] .office-cell > :is(.office-answer, .office-desk) { grid-area:1 / 1; }

html[data-design="leaders"][data-agent-composer] .office-stop { grid-area:1 / 1; align-self:start; justify-self:end; position:relative; z-index:2; display:grid; place-items:center; width:32px; height:32px; margin:70px 4px 0 0; padding:0; border:1px solid var(--color-border-strong); border-radius:16px; background:var(--color-surface); color:var(--color-text-secondary); cursor:pointer; opacity:0; transition:opacity .15s; }
html[data-design="leaders"][data-agent-composer] .office-stop::before { content:""; width:10px; height:10px; border-radius:2px; background:currentColor; }
html[data-design="leaders"][data-agent-composer] .office-cell:is(:hover, :focus-within) > .office-stop { opacity:1; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-stop:hover { color:var(--color-text); } }
@media (hover:none), (pointer:coarse) { html[data-design="leaders"][data-agent-composer] .office-stop { opacity:1; width:44px; height:44px; margin:64px 0 0; border:0; background:radial-gradient(circle, var(--color-surface) 15px, var(--color-border-strong) 15.5px 16px, transparent 16.5px); } }
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"][data-agent-composer] .office-stop { transition:none; } }
html[data-design="leaders"][data-agent-composer] .office-stop[data-armed] { width:auto; padding:0 14px; border-radius:22px; background:var(--color-danger); color:var(--color-on-action); font:inherit; font-size:14px; font-weight:var(--weight-medium); white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .office-stop[data-armed]::before { content:none; }
html[data-design="leaders"][data-agent-composer] button.office-desk[data-sc-note] { cursor:pointer; }

html[data-design="leaders"][data-agent-composer] .tasks-start { display:grid; gap:12px; margin:0 0 var(--space-6); }
html[data-design="leaders"][data-agent-composer] .tasks-start[hidden], html[data-design="leaders"][data-agent-composer] .tasks-intro[hidden] { display:none; }
html[data-design="leaders"][data-agent-composer] .tasks-intro { margin:0; color:var(--color-text-secondary); font-size:15px; line-height:22px; text-wrap:pretty; }
html[data-design="leaders"][data-agent-composer] .tasks-assign { display:flex; align-items:flex-end; gap:8px; padding:6px 6px 6px 16px; border:1px solid var(--color-border); border-radius:24px; background:var(--color-surface); }
html[data-design="leaders"][data-agent-composer] .tasks-assign:focus-within { border-color:var(--color-border-strong); }
html[data-design="leaders"][data-agent-composer] .tasks-assign textarea { flex:1; min-width:0; min-height:36px; max-height:120px; padding:7px 0; border:0; background:transparent; color:var(--color-text); font:inherit; font-size:15px; line-height:22px; resize:none; field-sizing:content; }
html[data-design="leaders"][data-agent-composer] .tasks-assign textarea:focus { outline:none; }
html[data-design="leaders"][data-agent-composer] .tasks-assign textarea::placeholder { color:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .tasks-assign-go { flex:none; height:36px; min-height:36px; border-radius:18px; white-space:nowrap; }
@media (max-width:640px) { html[data-design="leaders"][data-agent-composer] .tasks-assign { flex-wrap:wrap; justify-content:flex-end; padding:8px 8px 8px 16px; border-radius:20px; } html[data-design="leaders"][data-agent-composer] .tasks-assign textarea { flex-basis:100%; font-size:16px; } html[data-design="leaders"][data-agent-composer] .tasks-assign-go { height:40px; min-height:40px; border-radius:20px; } }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"] { --answer:32px; padding-bottom:calc(14px + var(--answer)); background:var(--office-ask-tile); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"][aria-expanded="true"] { background:var(--office-ask-tile-strong); }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"]:hover { background:var(--office-ask-tile-strong); } }
html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"] .office-meta:empty { display:none; }
html[data-design="leaders"][data-agent-composer] .office-answer { position:relative; z-index:1; align-self:end; justify-self:center; gap:0; max-width:calc(100% - 12px); margin-bottom:10px; background:var(--office-ask-fill); color:var(--office-ask-ink); }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-answer:hover { background:var(--office-ask-fill-strong); } }
html[data-design="leaders"][data-agent-composer] .office-answer-time::before { content:"\00A0\00B7\00A0"; }
@container (max-width:230px) {
  html[data-design="leaders"][data-agent-composer] .office-desk[data-pose="wait"] { --answer:40px; }
  html[data-design="leaders"][data-agent-composer] .office-answer { flex-direction:column; height:40px; min-height:40px; padding:0 12px; line-height:17px; }
  html[data-design="leaders"][data-agent-composer] .office-answer-time { font-size:var(--text-meta); font-weight:var(--weight-regular); line-height:16px; }
  html[data-design="leaders"][data-agent-composer] .office-answer-time::before { content:none; }
}
html[data-design="leaders"][data-agent-composer] .office-talk { display:grid; grid-template-columns:repeat(var(--cols), minmax(0, 1fr)) calc(16px * var(--px)); gap:0 var(--space-2); padding:0 var(--space-2) var(--space-3); }
html[data-design="leaders"][data-agent-composer] .office-talk-tail { position:relative; z-index:1; grid-row:1; grid-column:var(--at); justify-self:center; width:12px; height:12px; margin-bottom:-6px; border-top:1px solid var(--color-border-strong); border-left:1px solid var(--color-border-strong); background:var(--color-surface); rotate:45deg; }
html[data-design="leaders"][data-agent-composer] .office-talk-card { grid-row:2; grid-column:1 / -1; display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:12px; min-width:0; padding:14px 12px 14px 16px; border:1px solid var(--color-border-strong); border-radius:16px; background:var(--color-surface); color:var(--color-text); text-align:left; }

html[data-design="leaders"][data-agent-composer] .office-talk-card > * { grid-column:1 / -1; }
html[data-design="leaders"][data-agent-composer] .office-talk-title { grid-row:1; grid-column:1; align-self:center; display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:15px; font-weight:var(--weight-medium); line-height:21px; overflow-wrap:anywhere; }
html[data-design="leaders"][data-agent-composer] .office-talk-tools { grid-row:1; grid-column:2; display:flex; align-items:center; gap:2px; margin:-6px -4px 0 0; }
html[data-design="leaders"][data-agent-composer] .office-talk-open { height:32px; padding:0 10px; border:0; border-radius:16px; background:transparent; color:var(--color-text-secondary); font:inherit; font-size:14px; white-space:nowrap; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-talk-open:hover { background:var(--color-hover); color:var(--color-text); } }
html[data-design="leaders"][data-agent-composer] .office-talk-steps { display:grid; grid-template-columns:auto minmax(0, 1fr); row-gap:4px; margin:0; padding:0; list-style:none; color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"][data-agent-composer] .office-talk-steps li { display:grid; grid-template-columns:subgrid; grid-column:1 / -1; column-gap:12px; }
html[data-design="leaders"][data-agent-composer] .office-talk-steps time { color:var(--color-text-tertiary); font-variant-numeric:tabular-nums; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .office-talk-steps li[data-now] time::before { content:""; display:inline-block; width:6px; height:6px; margin:0 6px 1px 0; border-radius:50%; background:var(--color-brand); }
html[data-design="leaders"][data-agent-composer] .office-talk-steps li > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .office-talk-steps li[data-now] > span { color:var(--color-text); }
html[data-design="leaders"][data-agent-composer] .office-q { display:grid; justify-items:start; gap:10px; padding:10px 12px 12px; border-radius:12px; background:var(--office-ask-tile); font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .office-q > span { white-space:pre-line; overflow-wrap:anywhere; }
html[data-design="leaders"][data-agent-composer] .office-budget { display:flex; align-items:center; gap:8px; color:var(--color-text-secondary); font-size:14px; line-height:20px; font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .office-budget > span { flex:0 1 auto; min-width:0; margin-right:4px; }
html[data-design="leaders"][data-agent-composer] .office-step { display:grid; flex:none; place-items:center; width:36px; height:36px; padding:0; border:1px solid var(--color-border-strong); border-radius:18px; background:transparent; color:var(--color-text); font:inherit; font-size:18px; line-height:1; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-step:not(:disabled):hover { background:var(--color-hover); } }
html[data-design="leaders"][data-agent-composer] .office-step:disabled { opacity:.4; cursor:default; }
html[data-design="leaders"][data-agent-composer] .office-step svg { width:18px; height:18px; }
html[data-design="leaders"][data-agent-composer] .office-talk-acts { display:flex; align-items:center; gap:8px; min-width:0; margin:0; }
html[data-design="leaders"][data-agent-composer] .office-talk-field { flex:1; min-width:0; height:40px; padding:0 14px; border:1px solid var(--color-border); border-radius:20px; background:var(--color-bg); color:var(--color-text); font:inherit; font-size:15px; }
html[data-design="leaders"][data-agent-composer] .office-talk-field:focus { border-color:var(--color-border-strong); outline:none; box-shadow:none; }
html[data-design="leaders"][data-agent-composer] .office-talk-go { display:grid; flex:none; place-items:center; width:36px; height:36px; padding:0; border:0; border-radius:18px; background:var(--color-action); color:var(--color-on-action); cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .office-talk-go svg { width:18px; height:18px; }

html[data-design="leaders"][data-agent-composer] .office-talk-acts:has(.office-talk-field:placeholder-shown) .office-talk-go { opacity:.35; cursor:default; }
html[data-design="leaders"][data-agent-composer][data-input="keyboard"] :is(.office-talk-card button, .office-answer, .office-new):focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; }
html[data-design="leaders"][data-agent-composer] .office-hire-card > :not(.office-talk-tools) { max-width:440px; }
html[data-design="leaders"][data-agent-composer] .office-models { display:grid; gap:6px; min-width:0; margin:0; padding:0; border:0; }
html[data-design="leaders"][data-agent-composer] :is(.office-models legend, .office-name label) { padding:0; color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); }

html[data-design="leaders"][data-agent-composer] .office-model-list { position:relative; display:grid; max-height:calc(7 * 36px); margin:0 -8px; overflow:auto; overscroll-behavior:contain; }
html[data-design="leaders"][data-agent-composer] .office-model { position:relative; display:flex; align-items:center; gap:10px; min-height:36px; padding:0 8px; border-radius:10px; font-size:15px; line-height:20px; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .office-model input { position:absolute; width:1px; height:1px; margin:0; opacity:0; pointer-events:none; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-model:not(:has(input:disabled)):hover { background:var(--color-hover); } }
html[data-design="leaders"][data-agent-composer] .office-model:has(input:checked) { background:var(--color-field); font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .office-model:has(input:checked)::after { content:""; flex:none; width:16px; height:16px; margin-left:auto; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
html[data-design="leaders"][data-agent-composer][data-input="keyboard"] .office-model:has(input:focus-visible) { outline:2px solid var(--color-accent); outline-offset:-2px; }
html[data-design="leaders"][data-agent-composer] .office-model:has(input:disabled) { color:var(--color-text-tertiary); cursor:default; }
html[data-design="leaders"][data-agent-composer] :is(.office-quiet, .office-cost) { margin:0; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"][data-agent-composer] .office-quiet { color:var(--color-text-secondary); }
html[data-design="leaders"][data-agent-composer] .office-assign-foot { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; }
html[data-design="leaders"][data-agent-composer] .office-assign-acts { display:flex; gap:2px; margin:0 -10px 0 auto; }
html[data-design="leaders"][data-agent-composer] .office-name { display:grid; gap:8px; }
html[data-design="leaders"][data-agent-composer] .office-chips { display:flex; flex-wrap:wrap; gap:6px; }
html[data-design="leaders"][data-agent-composer] .office-chip { height:30px; padding:0 12px; border:1px solid var(--color-border-strong); border-radius:15px; background:transparent; color:var(--color-text-secondary); font:inherit; font-size:var(--text-meta); line-height:18px; white-space:nowrap; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-chip:hover { background:var(--color-hover); color:var(--color-text); } }
html[data-design="leaders"][data-agent-composer] .office-hire-go { justify-self:start; }
@media (pointer:coarse) {
  html[data-design="leaders"][data-agent-composer] :is(.office-step, .office-talk-go) { width:44px; height:44px; border-radius:22px; }
  html[data-design="leaders"][data-agent-composer] :is(.office-talk-card :is(.agent-btn, .agent-icon-btn, .office-talk-open), .office-answer, .office-new) { min-height:44px; height:44px; }
  html[data-design="leaders"][data-agent-composer] .office-desk:is([data-pose="wait"], [data-pose="free"]) { --answer:44px; }
  html[data-design="leaders"][data-agent-composer] .office-talk-card .agent-icon-btn { width:44px; border-radius:22px; }
  html[data-design="leaders"][data-agent-composer] .office-talk-field { height:44px; border-radius:22px; font-size:16px; }
  html[data-design="leaders"][data-agent-composer] .office-model { min-height:44px; }
  html[data-design="leaders"][data-agent-composer] .office-model-list { max-height:calc(7 * 44px); }
  html[data-design="leaders"][data-agent-composer] .office-chip { height:44px; border-radius:22px; }
}

html[data-design="leaders"][data-agent-composer][data-theme="dark"] :is(.office-sprite, .office-jar, .office-item, .office-door-art) { filter:brightness(.82); }
html[data-design="leaders"][data-agent-composer][data-theme="dark"] .office-desk[data-pose="type"] .office-figure::before { content:""; position:absolute; z-index:-1; left:calc(9px * var(--px)); top:0; width:calc(14px * var(--px)); height:calc(10px * var(--px)); border-radius:4px; box-shadow:0 0 22px 6px color-mix(in srgb, var(--color-brand) 30%, transparent); }
@media (prefers-color-scheme:dark) {
  html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) :is(.office-sprite, .office-jar, .office-item, .office-door-art) { filter:brightness(.82); }
  html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) .office-desk[data-pose="type"] .office-figure::before { content:""; position:absolute; z-index:-1; left:calc(9px * var(--px)); top:0; width:calc(14px * var(--px)); height:calc(10px * var(--px)); border-radius:4px; box-shadow:0 0 22px 6px color-mix(in srgb, var(--color-brand) 30%, transparent); }
}

@media (max-width:899px) {
  html[data-design="leaders"][data-agent-composer] .office-row { gap:var(--space-1); padding:0 var(--space-1); }
  html[data-design="leaders"][data-agent-composer] .office-talk { column-gap:var(--space-1); padding-inline:var(--space-1); }
  html[data-design="leaders"][data-agent-composer] .office-desk { padding-inline:2px; }
  html[data-design="leaders"][data-agent-composer] .office-bubble { padding-inline:8px; }
  html[data-design="leaders"][data-agent-composer] .office-meta { white-space:normal; text-wrap:balance; }
  html[data-design="leaders"][data-agent-composer] .office-lobby { gap:24px; padding-inline:16px; }
  html[data-design="leaders"][data-agent-composer] .office-shelf { gap:8px; }
  html[data-design="leaders"][data-agent-composer] .office-door-art { display:none; }
}

@media (max-width:640px) {
  html[data-design="leaders"][data-agent-composer] .office-row { grid-template-columns:repeat(var(--cols), minmax(0, 1fr)); }
  html[data-design="leaders"][data-agent-composer] .office-row > .office-plant { display:none; }
  html[data-design="leaders"][data-agent-composer] .office-talk { grid-template-columns:repeat(var(--cols), minmax(0, 1fr)); }
  html[data-design="leaders"][data-agent-composer] .office-wall::before { left:20%; }
  html[data-design="leaders"][data-agent-composer] .office-wall::after { left:60%; }
  
  html[data-design="leaders"][data-agent-composer] .office-lobby { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; border-radius:14px; background:var(--color-surface); }
  html[data-design="leaders"][data-agent-composer] .office-board { min-width:0; margin:0; padding:0; background:none; box-shadow:none; }
  html[data-design="leaders"][data-agent-composer] :is(.office-shelf-wrap, .office-door .office-jar) { display:none; }
  html[data-design="leaders"][data-agent-composer] .office-day { margin:0; }
  html[data-design="leaders"][data-agent-composer] .office-corner { display:block; position:absolute; right:var(--space-3); bottom:calc(-1px * var(--px)); width:calc(16px * var(--px)); height:var(--cell); background-size:calc(480px * var(--px)) calc(192px * var(--px)); background-position:calc((6 * 32px + 8px) * -1 * var(--px)) 0; }
}

@media (prefers-reduced-motion:reduce) {
  html[data-design="leaders"][data-agent-composer] :is(.office-sprite, .office-bubble[data-new]) { animation:none; }
}


html[data-design="leaders"][data-agent-composer] .tasks-teams[aria-pressed="true"] { background:color-mix(in srgb, var(--color-text) 10%, var(--color-field)); }
html[data-design="leaders"][data-agent-composer] .office { --office-tree-line:color-mix(in srgb, var(--color-text) 18%, var(--office-floor)); }
html[data-design="leaders"][data-agent-composer] .office-sign { display:flex; flex-wrap:wrap; align-items:center; gap:0 4px; min-width:0; margin:0; padding:0 var(--space-4); color:var(--color-text-secondary); font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .office-sign b { color:var(--color-text); font-weight:var(--weight-medium); overflow-wrap:anywhere; }
html[data-design="leaders"][data-agent-composer] .office-team-foot { padding:0 var(--space-4); text-align:center; }
html[data-design="leaders"][data-agent-composer] .office-tree { display:flex; justify-content:safe center; margin:0; padding:0 var(--space-3); overflow-x:auto; list-style:none; }
html[data-design="leaders"][data-agent-composer] .office-tree ul { position:relative; display:flex; justify-content:center; margin:0; padding:24px 0 0; list-style:none; }
html[data-design="leaders"][data-agent-composer] .office-tree li { position:relative; display:flex; flex-direction:column; align-items:center; padding:24px 6px 0; }
html[data-design="leaders"][data-agent-composer] .office-tree > li { padding:0; }
html[data-design="leaders"][data-agent-composer] .office-tree ul::before { content:""; position:absolute; top:0; left:calc(50% - 1px); width:2px; height:24px; background:var(--office-tree-line); }
html[data-design="leaders"][data-agent-composer] .office-tree ul > li::before,
html[data-design="leaders"][data-agent-composer] .office-tree ul > li::after { content:""; position:absolute; top:0; height:24px; border-top:2px solid var(--office-tree-line); }
html[data-design="leaders"][data-agent-composer] .office-tree ul > li::before { left:0; right:calc(50% - 1px); }
html[data-design="leaders"][data-agent-composer] .office-tree ul > li::after { left:calc(50% - 1px); right:0; border-left:2px solid var(--office-tree-line); }

html[data-design="leaders"][data-agent-composer] .office-tree ul > li:first-child::before,
html[data-design="leaders"][data-agent-composer] .office-tree ul > li:last-child::after { border-top:0; }

html[data-design="leaders"][data-agent-composer] .office-room { container-type:inline-size; }
html[data-design="leaders"][data-agent-composer] .office-tree .office-cell { width:clamp(148px, calc((100cqi - 76px) / 4), 176px); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-lead] .office-plate::before { content:"★\00A0"; color:var(--color-text-secondary); }
html[data-design="leaders"][data-agent-composer] .office-desk[data-asks] { --answer:32px; padding-bottom:calc(14px + var(--answer)); }
html[data-design="leaders"][data-agent-composer] span.office-desk { cursor:default; }

html[data-design="leaders"][data-agent-composer] .office-tree .office-desk[data-source="sc"] { grid-template-rows:0 var(--cell) auto auto; padding-top:0; }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] span.office-desk:hover { background:transparent; } }
html[data-design="leaders"][data-agent-composer] .office-team-more { display:grid; place-items:center; width:176px; min-height:120px; border-radius:12px; background:color-mix(in srgb, var(--color-surface) 60%, transparent); color:var(--color-text-secondary); font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .office-room-talk { padding-inline:var(--space-3); }
html[data-design="leaders"][data-agent-composer] .office-room-talk .office-talk-tail { display:none; }
html[data-design="leaders"][data-agent-composer] .office-stop-ask { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:10px 12px; border-radius:12px; background:var(--color-field); font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .office-stop-ask > span { margin-right:auto; font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .task-branch { display:grid; gap:var(--space-2); margin-left:11px; padding-left:11px; border-left:2px solid color-mix(in srgb, var(--color-text) 14%, var(--color-bg)); }

html[data-design="leaders"][data-agent-composer] .office-teams { display:flex; flex-direction:column; gap:var(--space-3); min-width:0; }
html[data-design="leaders"][data-agent-composer] .office-team-bar { display:flex; align-items:flex-start; gap:8px; }
html[data-design="leaders"][data-agent-composer] .office-team-bar .office-chips { flex:1; min-width:0; }

html[data-design="leaders"][data-agent-composer] .office-teams .office-chip[aria-pressed="true"] { border-color:transparent; background:#FFF; color:var(--color-text); font-weight:var(--weight-medium); box-shadow:0 1px 2px rgb(0 0 0 / .08), 0 0 0 1px rgb(0 0 0 / .04); }
html[data-design="leaders"][data-agent-composer][data-theme="dark"] .office-teams .office-chip[aria-pressed="true"] { background:rgb(255 255 255 / .10); box-shadow:none; }
@media (prefers-color-scheme:dark) { html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) .office-teams .office-chip[aria-pressed="true"] { background:rgb(255 255 255 / .10); box-shadow:none; } }
html[data-design="leaders"][data-agent-composer] .office-team-name { field-sizing:content; min-width:4ch; max-width:100%; height:28px; margin:0 -3px 0 -7px; padding:0 6px; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--color-text); font:inherit; font-size:15px; font-weight:var(--weight-medium); }
@media (hover:hover) { html[data-design="leaders"][data-agent-composer] .office-team-name:hover { border-color:var(--color-border); } }
html[data-design="leaders"][data-agent-composer] .office-team-name:focus { border-color:var(--color-border-strong); background:var(--color-surface); outline:none; }
html[data-design="leaders"][data-agent-composer] .office-teams [data-team-member] { -webkit-user-select:none; user-select:none; }
html[data-design="leaders"][data-agent-composer] .office-teams [data-team-member]:not([data-lead]) { cursor:grab; }
html[data-design="leaders"][data-agent-composer] .office-teams [data-team-member][aria-pressed="true"] { background:#FFF; box-shadow:0 0 0 1px rgb(0 0 0 / .12); }
html[data-design="leaders"][data-agent-composer][data-theme="dark"] .office-teams [data-team-member][aria-pressed="true"] { background:color-mix(in srgb, #FFF 6%, var(--color-surface)); box-shadow:0 0 0 1px rgb(255 255 255 / .16); }
@media (prefers-color-scheme:dark) { html[data-design="leaders"][data-agent-composer]:not([data-theme="light"]) .office-teams [data-team-member][aria-pressed="true"] { background:color-mix(in srgb, #FFF 6%, var(--color-surface)); box-shadow:0 0 0 1px rgb(255 255 255 / .16); } }
html[data-design="leaders"][data-agent-composer] .office-teams .office[data-dragging] { cursor:grabbing; }
html[data-design="leaders"][data-agent-composer] .office-teams .office[data-dragging] [data-team-member] { cursor:grabbing; }
html[data-design="leaders"][data-agent-composer] .office-teams .office[data-dragging] [data-team-member][aria-pressed="true"] { background:transparent; box-shadow:none; }
html[data-design="leaders"][data-agent-composer] .office-teams [data-team-member][data-dragging] { opacity:.45; outline:2px dashed color-mix(in srgb, var(--color-text) 30%, transparent); outline-offset:-2px; }
html[data-design="leaders"][data-agent-composer] .office-teams [data-team-member][data-drop] { background:color-mix(in srgb, var(--color-brand) 8%, transparent); outline:2px dashed var(--color-brand); outline-offset:-2px; }
html[data-design="leaders"][data-agent-composer] .office-none { color:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-composer] .office-drag { position:fixed; z-index:1000; top:0; left:0; padding:6px 12px; border:1px solid var(--color-border-strong); border-radius:10px; background:var(--color-surface); color:var(--color-text); box-shadow:0 4px 16px rgb(0 0 0 / .12); font-size:var(--text-meta); font-weight:var(--weight-medium); line-height:18px; white-space:nowrap; pointer-events:none; }
html[data-design="leaders"][data-agent-composer] .office-field { display:grid; grid-template-columns:128px minmax(0, 1fr); align-items:center; gap:12px; margin:0; font-size:14px; line-height:20px; }
html[data-design="leaders"][data-agent-composer] .office-field > span:first-child { color:var(--color-text-secondary); }
html[data-design="leaders"][data-agent-composer] .office-select { -webkit-appearance:none; appearance:none; padding-right:36px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23888' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; background-size:16px; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .office-team-line { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin:0; }
html[data-design="leaders"][data-agent-composer] .office-team-chip { display:inline-flex; align-items:center; gap:4px; height:28px; padding:0 12px; border-radius:14px; background:var(--color-field); color:var(--color-text); font-size:var(--text-meta); font-weight:var(--weight-medium); white-space:nowrap; }
@container (max-width:230px) { html[data-design="leaders"][data-agent-composer] .office-desk[data-asks] { --answer:40px; } }
@media (pointer:coarse) { html[data-design="leaders"][data-agent-composer] .office-desk[data-asks] { --answer:44px; } html[data-design="leaders"][data-agent-composer] .office-stop-ask .agent-btn { min-height:44px; height:44px; } }
@media (max-width:719px) {
  html[data-design="leaders"][data-agent-composer] .office-tree { display:block; overflow:visible; }
  html[data-design="leaders"][data-agent-composer] .office-tree ul { display:block; margin:4px 0 0 11px; padding:0 0 0 11px; border-left:2px solid var(--office-tree-line); }
  html[data-design="leaders"][data-agent-composer] .office-tree li { display:block; padding:0; }
  html[data-design="leaders"][data-agent-composer] .office-tree li + li { margin-top:4px; }
  html[data-design="leaders"][data-agent-composer] .office-tree ul::before,
  html[data-design="leaders"][data-agent-composer] .office-tree ul > li::before,
  html[data-design="leaders"][data-agent-composer] .office-tree ul > li::after { content:none; }
  html[data-design="leaders"][data-agent-composer] .office-tree .office-cell { width:auto; }
  html[data-design="leaders"][data-agent-composer] .office-tree .office-desk { --px:1.5; --cell:48px; grid-template-columns:48px minmax(0, 1fr); grid-template-rows:1fr auto auto auto 1fr; grid-template-areas:"figure ." "figure plate" "figure bubble" "figure meta" "figure ."; justify-items:start; align-items:center; column-gap:12px; row-gap:2px; padding:8px 10px; text-align:left; }
  html[data-design="leaders"][data-agent-composer] .office-tree .office-bubble { align-self:start; max-width:100%; padding:0; border:0; background:none; color:var(--color-text-secondary); }
  html[data-design="leaders"][data-agent-composer] .office-tree .office-bubble::after { content:none; }
  html[data-design="leaders"][data-agent-composer] .office-tree .office-answer { justify-self:start; margin-left:70px; max-width:calc(100% - 80px); margin-bottom:8px; }
  html[data-design="leaders"][data-agent-composer] .office-tree .office-desk:is([data-pose="wait"], [data-asks]) { padding-bottom:calc(16px + var(--answer)); }
  html[data-design="leaders"][data-agent-composer] .office-team-more { width:auto; min-height:44px; justify-items:start; padding:0 12px; }
  html[data-design="leaders"][data-agent-composer] .office-field { grid-template-columns:minmax(0, 1fr); gap:6px; }
}

html[data-design="leaders"][data-agent-composer] .agent-watch:not([hidden]) { display:inline-flex; align-items:center; gap:var(--space-2); justify-self:end; height:32px; min-height:32px; padding:0 14px; border:0; border-radius:16px; background:var(--color-field); color:var(--color-text); font:inherit; font-size:14px; font-weight:var(--weight-medium); white-space:nowrap; cursor:pointer; }
html[data-design="leaders"][data-agent-composer] .agent-watch[aria-expanded="true"] { background:var(--color-active); }

html[data-design="leaders"][data-agent-composer] .conversation-header > .agent-watch { grid-row:1; grid-column:1; justify-self:end; }
@media (max-width:899px) {
  html[data-design="leaders"][data-agent-composer] body .conversation-header:has(> .agent-watch:not([hidden])) { grid-template-columns:44px minmax(0, 1fr) auto 44px; }
  html[data-design="leaders"][data-agent-composer][data-serpent-frame] body .conversation-header:has(> .agent-watch:not([hidden])) { grid-template-columns:0 minmax(0, 1fr) auto 44px; }
  html[data-design="leaders"][data-agent-composer] .conversation-header:has(> .agent-watch:not([hidden])) > .agent-watch { grid-column:3; }
  html[data-design="leaders"][data-agent-composer] .conversation-header:has(> .agent-watch:not([hidden])) > .more-button { grid-column:4; }
}
html[data-design="leaders"][data-agent-composer] .agent-watch i { width:6px; height:6px; border-radius:50%; background:var(--color-brand); }

html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane:not([hidden]) { position:fixed; z-index:45; top:0; right:0; bottom:0; display:flex; flex-direction:column; width:480px; max-width:100vw; background:var(--color-bg); box-shadow:inset 1px 0 0 var(--color-border); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-scrim:not([hidden]) { position:fixed; z-index:44; inset:0; background:var(--color-scrim); }
@media (min-width:900px) {
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-pane] .workspace { margin-right:480px; }
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-pane] :is(.messages, .composer-wrap) { padding-inline:var(--space-6); }
}
@media (max-width:899px) { html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane:not([hidden]) { box-shadow:var(--app-popover-shadow); } }
@media (max-width:760px) { html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane:not([hidden]) { width:100vw; } }

html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-grip { display:none; }
@media (min-width:761px) {
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-pane="result"] .agent-pane:not([hidden]) { width:var(--agent-result-w, 50vw); }
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-pane="result"] .agent-pane-grip { position:absolute; z-index:2; top:0; bottom:0; left:-4px; display:block; width:9px; cursor:col-resize; touch-action:none; }
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-pane="result"] .agent-pane-grip::after { content:""; position:absolute; top:0; bottom:0; left:4px; width:1px; background:transparent; transition:background .15s; }
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-pane="result"] :is(.agent-pane-grip:hover, .agent-pane-grip:focus-visible)::after,
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-resizing] .agent-pane-grip::after { width:2px; background:var(--color-border-strong); }
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-grip:focus-visible { outline:none; }
  html[data-design="leaders"][data-agent-composer][data-agent-resizing] { cursor:col-resize; user-select:none; }
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-resizing] .agent-preview iframe { pointer-events:none; }
}
@media (min-width:900px) {
  html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"])[data-agent-pane="result"] .workspace { margin-right:var(--agent-result-w, 50vw); }
}
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-tools { display:inline-flex; flex:none; align-items:center; gap:var(--space-1); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-head { display:flex; flex:none; align-items:center; gap:var(--space-2); height:52px; padding:0 10px 0 18px; -webkit-app-region:drag; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-head h2 { margin:0; font-size:15px; font-weight:var(--weight-medium); line-height:22px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-live:not([hidden]) { display:inline-flex; align-items:center; gap:6px; color:var(--color-text-tertiary); font-size:var(--text-meta); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-live i { width:6px; height:6px; border-radius:50%; background:var(--color-brand); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-close { display:grid; place-items:center; width:32px; min-width:32px; height:32px; min-height:32px; margin-left:auto; padding:0; border:0; border-radius:8px; background:transparent; color:var(--color-text-secondary); -webkit-app-region:no-drag; }
@media (hover:hover) { html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-close:hover { background:var(--color-hover); color:var(--color-text); } }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-close svg { width:18px; height:18px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-body { display:flex; flex:1; flex-direction:column; gap:12px; min-height:0; padding:0 16px 16px; overflow:auto; }
html[data-design="leaders"][data-agent-composer] .agent-view { position:relative; flex:none; aspect-ratio:16 / 10; overflow:hidden; border-radius:12px; background:var(--color-field); box-shadow:0 0 0 1px var(--color-border-strong); }
html[data-design="leaders"][data-agent-composer] .agent-view img { display:block; width:100%; height:100%; object-fit:cover; object-position:top left; }
html[data-design="leaders"][data-agent-composer] .agent-view-empty { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-2); color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"][data-agent-composer] .agent-view-empty svg { width:24px; height:24px; }
html[data-design="leaders"][data-agent-composer] .agent-cursor { position:absolute; display:flex; align-items:center; gap:6px; pointer-events:none; }
html[data-design="leaders"][data-agent-composer] .agent-cursor svg { width:18px; height:18px; fill:#0d1216; stroke:#fff; stroke-width:1.2; }
html[data-design="leaders"][data-agent-composer] .agent-cursor span { padding:2px 8px; border-radius:10px; background:#0d1216; color:#fff; font-size:var(--text-caption); font-weight:var(--weight-medium); line-height:var(--leading-caption); }
html[data-design="leaders"][data-agent-composer] .agent-caption { display:grid; gap:4px; }
html[data-design="leaders"][data-agent-composer] .agent-caption b { font-size:14px; font-weight:var(--weight-medium); line-height:20px; }
html[data-design="leaders"][data-agent-composer] .agent-caption small { overflow:hidden; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-visits { display:grid; flex:1; grid-template-columns:minmax(0, 1fr); align-content:start; gap:2px; }
html[data-design="leaders"][data-agent-composer] .agent-visits > p { margin:0; padding:4px 0 6px; color:var(--color-text-tertiary); font-size:var(--text-meta); font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .agent-visit { display:flex; align-items:center; gap:10px; min-height:36px; color:var(--color-text-secondary); font-size:14px; }
html[data-design="leaders"][data-agent-composer] .agent-visit b { color:var(--color-text); font-weight:var(--weight-medium); white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-visit > span:not(.agent-fav) { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"][data-agent-composer] .agent-visit small { flex:none; margin-left:auto; color:var(--color-text-tertiary); font-size:var(--text-meta); font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-agent-composer] .agent-fav { flex:none; width:16px; height:16px; border-radius:4px; background:var(--color-border-strong); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-foot { display:grid; flex:none; gap:var(--space-2); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-pane-foot .agent-btn { width:100%; height:44px; min-height:44px; border-radius:22px; font-size:15px; }

html[data-design="leaders"][data-agent-composer] .agent-take { display:flex; flex:none; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; background:color-mix(in srgb, var(--color-warning) 14%, transparent); font-size:14px; }
html[data-design="leaders"][data-agent-composer] .agent-take svg { flex:none; width:20px; height:20px; color:var(--color-warning); }
html[data-design="leaders"][data-agent-composer] .agent-take > span { display:grid; gap:2px; }
html[data-design="leaders"][data-agent-composer] .agent-take b { font-weight:var(--weight-medium); }
html[data-design="leaders"][data-agent-composer] .agent-take small { color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); }


html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder {
  grid-column:1 / -1; grid-row:controls;
  display:grid; grid-template-columns:40px minmax(0, 1fr) auto auto 40px; align-items:center; column-gap:var(--space-2);
  position:relative; z-index:2; align-self:stretch; max-width:none; min-height:44px; margin:0; padding:0; border:0; border-radius:0; background:var(--color-surface);
  animation:voice-in var(--motion-popover) var(--ease-ui) both;
}
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder[hidden] { display:none; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-cancel { grid-column:1; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > .voice-meter { grid-column:2; height:32px; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > time { grid-column:3; color:var(--color-text-secondary); font-size:var(--text-meta, 13px); font-variant-numeric:tabular-nums; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-retry { grid-column:4; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-done { grid-column:5; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder .voice-icon-button { width:36px; height:36px; min-width:36px; min-height:36px; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder .voice-icon-button svg { width:18px; height:18px; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder .voice-meter canvas { height:24px; color:var(--color-text-secondary); }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder time::before { display:none; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-ending > time { color:var(--color-warning); }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-busy > .voice-meter,
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-error > .voice-meter { grid-column:2 / 4; padding-left:0; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-busy > time,
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-error > time { display:none; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-busy .voice-meter .voice-status { font-size:14px; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-error .voice-meter canvas { display:none; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-error .voice-meter .voice-status {
  position:static; width:auto; height:auto; overflow:hidden; clip:auto; white-space:nowrap; text-overflow:ellipsis;
  color:var(--color-text-secondary); font-size:14px; font-weight:var(--weight-regular);
}
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-retry {
  min-height:36px; padding:0 var(--space-3); border:0; border-radius:999px;
  color:var(--color-text); background:var(--color-hover); font-size:14px; font-weight:var(--weight-medium);
}
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-retry:hover { background:color-mix(in srgb, var(--color-text) 10%, var(--color-surface)); }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-retry[hidden],
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-done[hidden] { display:none; }
@media (pointer:coarse) {
  html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder .voice-icon-button, html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-retry { min-width:44px; min-height:44px; }
  html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder .voice-icon-button { width:44px; height:44px; }
  html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder { grid-template-columns:44px minmax(0, 1fr) auto auto 44px; }
}

html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-busy > .voice-meter { height:auto; min-height:32px; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-busy .voice-meter .voice-status { white-space:normal; line-height:1.3; }

html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-error > .voice-meter { height:auto; min-height:32px; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder.is-error .voice-meter .voice-status { white-space:normal; text-overflow:clip; line-height:1.3; }

html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder {
  grid-template-columns:auto minmax(0, 1fr) 80px auto auto 36px 36px; justify-self:end; width:auto; min-width:0; background:var(--color-surface);
}
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > * { grid-row:1; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-mic { grid-column:1; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > .voice-meter { grid-column:3; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > time { grid-column:4; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-retry { grid-column:5; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-cancel { grid-column:6; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-done { grid-column:7; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:not(.is-ending) > time { display:none; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder .voice-meter canvas { height:20px; color:var(--color-text-tertiary); }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-mic { display:inline-flex; flex-direction:row; align-items:center; width:auto; min-width:0; gap:2px; padding:0 6px 0 8px; border-radius:999px; color:var(--color-text-secondary); }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-mic:hover { color:var(--color-text); background:var(--color-hover); }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-mic[aria-expanded="true"] { color:var(--color-text); background:var(--color-hover); }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder > #voice-mic .voice-mic-chevron { width:14px; height:14px; }
html[data-design="leaders"] .voice-recorder > #voice-mic[hidden] { display:none; }

html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:is(.is-busy, .is-error) { justify-self:stretch; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:is(.is-busy, .is-error) > #voice-mic { display:none; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:is(.is-busy, .is-error) > .voice-meter { grid-column:1 / 5; padding-left:var(--space-2); }

html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:is(.is-busy, .is-error) { grid-template-columns:minmax(0, 1fr) auto auto; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:is(.is-busy, .is-error) > .voice-meter { grid-column:1; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:is(.is-busy, .is-error) > #voice-retry { grid-column:2; }
html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder:is(.is-busy, .is-error) > #voice-cancel { grid-column:3; }

html[data-design="leaders"][data-voice="v2"] .composer.is-voice > #composer-controls { opacity:.45; }
@media (max-width:640px), (pointer:coarse) {
  html[data-design="leaders"][data-voice="v2"] .composer > .voice-recorder { justify-self:stretch; grid-template-columns:auto minmax(0, 1fr) 80px auto auto 44px 44px; }
}

html[data-design="leaders"] .composer-wrap #voice-mic-menu button { gap:var(--space-3); justify-content:space-between; min-height:56px; padding:8px 12px; }
@media (min-width:641px) and (pointer:fine) { html[data-design="leaders"] .composer-wrap #voice-mic-menu button { min-height:44px; } }
html[data-design="leaders"] #voice-mic-menu button > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"] #voice-mic-menu .plus-label { margin:0; padding:8px 10px 4px; color:var(--color-text-tertiary); font-size:var(--text-caption); font-weight:var(--weight-medium); line-height:var(--leading-caption); }
html[data-design="leaders"] #voice-mic-menu .mode-check { flex:none; width:16px; height:16px; color:var(--color-text); visibility:hidden; }
html[data-design="leaders"] #voice-mic-menu [aria-checked="true"] .mode-check { visibility:visible; }
html[data-design="leaders"] .voice-ghost {
  position:absolute; z-index:1; margin:0; overflow:hidden; pointer-events:none; border-style:solid; border-color:transparent; background:transparent;
  color:var(--color-text); white-space:pre-wrap; overflow-wrap:break-word; word-break:normal;
}
html[data-design="leaders"] .voice-ghost .voice-heard { color:var(--color-text-tertiary); }
html[data-design="leaders"] #composer-input.is-dictating { color:transparent; caret-color:transparent; }

html[data-design="leaders"] .guest-locked #guest-locked-copy { max-width:360px; text-wrap:balance; color:var(--color-text); font-size:17px; font-weight:var(--weight-medium); line-height:1.4; }
html[data-design="leaders"] .guest-locked .guest-locked-more { max-width:360px; text-wrap:pretty; color:var(--color-text-secondary); font-size:var(--text-body); line-height:1.5; }
html[data-design="leaders"] .guest-left:not([hidden]) { color:var(--color-text-secondary); font-variant-numeric:tabular-nums; }

html[data-design="leaders"] .guest-status:not([hidden]) { flex-basis:100%; display:flex; flex-wrap:wrap; justify-content:center; align-items:baseline; gap:2px 8px; }
html[data-design="leaders"] .guest-left:not([hidden]) + .guest-more:not([hidden])::before { content:"·"; display:inline-block; margin-right:8px; color:var(--color-text-tertiary); }
html[data-design="leaders"] .guest-more { min-height:0; line-height:inherit; padding:0; border:0; background:none; color:inherit; font:inherit; text-decoration:underline; text-decoration-color:var(--color-border-strong); text-underline-offset:3px; cursor:pointer; }
html[data-design="leaders"] .guest-more[hidden] { display:none; }
html[data-design="leaders"] .guest-more:hover { color:var(--color-text); }
@media (max-width:640px) { html[data-design="leaders"] .guest-left:not([hidden]) { flex-basis:100%; text-align:center; } html[data-design="leaders"] .guest-left:not([hidden]) + .guest-more:not([hidden])::before { content:none; } }

html[data-design="leaders"] .report-dialog textarea { display:block; width:100%; box-sizing:border-box; min-height:104px; margin-top:var(--space-3); padding:12px 13px;
  border:1px solid transparent; border-radius:var(--radius-control); color:var(--text); background:var(--color-field);
  font:inherit; font-size:var(--text-input); line-height:1.45; resize:none; max-height:240px; overflow-y:auto; }

html[data-design="leaders"] .report-dialog textarea:focus { outline:none; box-shadow:none; border-color:color-mix(in srgb, var(--color-text) 18%, transparent); }
html[data-design="leaders"] .report-dialog .report-status { margin:var(--space-2) 0 0; color:var(--color-danger); font-size:14px; }
html[data-design="leaders"] .report-dialog .report-done > div { display:flex; justify-content:flex-end; margin-top:var(--space-5); }
html[data-design="leaders"] .report-dialog .report-done > div > button { min-height:var(--control-size); padding:0 var(--space-4); border-radius:var(--radius-control);
  background:var(--color-action); color:var(--color-on-action); }

html[data-design="leaders"] #request-report { min-height:32px; padding:0 4px; background:none; border:0; box-shadow:none;
  color:var(--color-text-secondary); font-weight:var(--weight-regular); text-decoration:underline; text-underline-offset:3px; }
html[data-design="leaders"] #request-report:hover { color:var(--color-text); background:none; }


@media (min-width: 900px) { html[data-design="leaders"][data-modes]:not([data-serpent-app]) .app-shell { grid-template-columns:264px minmax(0, 1fr); } }

html[data-design="leaders"][data-serpent-frame] .sidebar-primary-nav [data-screen="studio"] { display:none; }
html[data-design="leaders"][data-modes] .mode-switch:not([hidden]) { display:flex; flex:none; gap:0; height:36px; margin:2px 0 var(--space-3); padding:2px; border-radius:10px; background:rgb(0 0 0 / .045); box-shadow:inset 0 0 0 1px rgb(0 0 0 / .03); }
html[data-design="leaders"][data-modes] .mode-switch button { display:flex; flex:1 1 auto; align-items:center; justify-content:center; min-width:0; height:32px; min-height:0; margin:0; padding:0 8px; border:0; border-radius:8px; background:transparent; color:var(--color-text-secondary); font:inherit; font-size:14px; font-weight:var(--weight-medium); line-height:20px; letter-spacing:-0.005em; white-space:nowrap; cursor:pointer; transition:background-color .15s ease, color .15s ease, box-shadow .15s ease; }
html[data-design="leaders"][data-modes] .mode-switch:not([hidden]) ~ .new-chat-button { margin-top:0; }
html[data-design="leaders"][data-modes] .mode-switch button[hidden] { display:none; }
html[data-design="leaders"][data-modes] .mode-switch button:hover { color:var(--color-text); }
html[data-design="leaders"][data-modes] .mode-switch button[aria-checked="true"] { background:#FFF; color:var(--color-text); box-shadow:0 1px 2px rgb(0 0 0 / .08), 0 0 0 .5px rgb(0 0 0 / .08); }
html[data-design="leaders"][data-modes][data-theme="dark"] .mode-switch:not([hidden]) { background:rgb(255 255 255 / .05); box-shadow:inset 0 0 0 1px rgb(255 255 255 / .04); }
html[data-design="leaders"][data-modes][data-theme="dark"] .mode-switch button[aria-checked="true"] { background:rgb(255 255 255 / .15); box-shadow:0 1px 3px rgb(0 0 0 / .35), inset 0 .5px 0 rgb(255 255 255 / .1); }
@media (prefers-color-scheme:dark) {
  html[data-design="leaders"][data-modes]:not([data-theme="light"]) .mode-switch:not([hidden]) { background:rgb(255 255 255 / .05); box-shadow:inset 0 0 0 1px rgb(255 255 255 / .04); }
  html[data-design="leaders"][data-modes]:not([data-theme="light"]) .mode-switch button[aria-checked="true"] { background:rgb(255 255 255 / .15); box-shadow:0 1px 3px rgb(0 0 0 / .35), inset 0 .5px 0 rgb(255 255 255 / .1); }
}
@media (prefers-reduced-motion: reduce) { html[data-design="leaders"][data-modes] .mode-switch button { transition:none; } }
html[data-design="leaders"][data-modes][data-input="keyboard"] .mode-switch button:focus-visible { outline:2px solid var(--color-accent); outline-offset:1px; }
html[data-design="leaders"][data-modes]:not([data-mode="chat"]) .sidebar > :is(.new-chat-button, .sidebar-primary-nav, .sidebar-recents):not(.sidebar-studio, .sidebar-code) { display:none; }
html[data-design="leaders"][data-modes]:not([data-mode="chat"]) .sidebar-footer > .sidebar-agent { display:none; }

html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-head { display:flex; flex:none; align-items:center; justify-content:space-between; gap:var(--space-3); min-height:40px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-head .agent-file-copy { display:grid; min-width:0; gap:2px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-head .agent-file-copy b { overflow:hidden; font-size:15px; font-weight:var(--weight-medium); line-height:20px; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-head .agent-file-copy small { color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-views { display:inline-flex; flex:none; gap:2px; padding:2px; border-radius:10px; background:var(--color-field); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-views button { display:inline-flex; align-items:center; gap:6px; height:28px; min-height:28px; padding:0 10px; border:0; border-radius:8px; background:transparent; color:var(--color-text-secondary); font-size:var(--text-meta); font-weight:var(--weight-medium); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-views button[aria-pressed="true"] { background:var(--color-surface); color:var(--color-text); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-views svg { width:16px; height:16px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-preview { position:relative; flex:1 1 auto; min-height:320px; overflow:hidden; border-radius:12px; background:var(--color-field); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-preview iframe { position:absolute; top:0; left:0; border:0; background:#fff; transform-origin:top left; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-preview[data-kind="image"] { flex:none; min-height:0; background:none; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-preview[data-kind="image"] img { display:block; width:100%; height:auto; border-radius:12px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-preview:is([data-state="loading"], [data-state="empty"]) { display:flex; align-items:center; justify-content:center; padding:var(--space-6); color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); text-align:center; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-more { display:grid; flex:none; gap:2px; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-more p { margin:var(--space-2) 0 4px; color:var(--color-text-tertiary); font-size:var(--text-meta); }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-pick { display:flex; align-items:center; gap:10px; min-height:40px; padding:0 10px; border:0; border-radius:10px; background:transparent; color:var(--color-text); font-size:14px; text-align:left; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-pick span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-pick svg { flex:none; width:18px; height:18px; color:var(--color-text-secondary); }
@media (hover:hover) { html[data-design="leaders"]:is([data-agent-composer], [data-agent-pane="result"]) .agent-result-pick:hover { background:var(--color-hover); } }

html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-kind="pdf"] iframe { width:100%; height:100%; transform:none; }
html[data-design="leaders"][data-agent-pane="result"] .agent-preview:is([data-kind="table"], [data-kind="doc"], [data-kind="text"]) { min-height:0; overflow:auto; border-radius:0; background:none; }
html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-kind="table"] .answer-table { margin:0; }
html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-kind="text"] .code-block { margin:0; }
html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-kind="text"] code { white-space:pre-wrap; overflow-wrap:anywhere; }
html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-kind="table"] .table-scroll[data-more] { -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 48px), transparent); mask-image:linear-gradient(to right, #000 calc(100% - 48px), transparent); }
html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-state="outside"] { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-3); padding:var(--space-6); color:var(--color-text-secondary); font-size:var(--text-meta); line-height:var(--leading-meta); text-align:center; }
html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-state="outside"] svg { width:40px; height:40px; color:var(--color-text-tertiary); }
html[data-design="leaders"][data-agent-pane="result"] .agent-pdf-open { min-height:44px; padding:0 22px; border:0; border-radius:22px; background:var(--color-text); color:var(--color-bg); font:inherit; font-size:var(--text-body); font-weight:var(--weight-medium); cursor:pointer; }

html[data-design="leaders"][data-agent-pane="result"] .agent-preview[data-kind="pages"] { display:grid; flex:none; gap:12px; min-height:0; overflow:visible; border-radius:0; background:none; }
html[data-design="leaders"][data-agent-pane="result"] .agent-page { display:block; aspect-ratio:var(--page-ratio); overflow:hidden; border:1px solid var(--color-border); border-radius:8px; background:var(--color-hover); }
html[data-design="leaders"][data-agent-pane="result"] .agent-page:empty { animation:skeleton-pulse 1.4s ease-in-out infinite; }
html[data-design="leaders"][data-agent-pane="result"] .agent-page img { display:block; width:100%; height:100%; object-fit:contain; }
html[data-design="leaders"][data-agent-pane="result"] .agent-pages-rest { margin:0; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:var(--leading-meta); text-align:center; }
html[data-design="leaders"][data-agent-pane="result"] .agent-result-pdf { flex:none; height:32px; min-height:32px; padding:0 12px; border:1px solid var(--color-border-strong); border-radius:16px; background:transparent; color:var(--color-text); font:inherit; font-size:var(--text-meta); font-weight:var(--weight-medium); white-space:nowrap; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"][data-agent-pane="result"] .agent-result-pdf:hover { background:var(--color-hover); } }
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"][data-agent-pane="result"] .agent-page:empty { animation:none; } }
html[data-design="leaders"][data-agent-pane="result"] .agent-table-note { margin:var(--space-2) 0 0; color:var(--color-text-tertiary); font-size:var(--text-meta); }


html[data-design="leaders"] .sidebar-agent:not([hidden]) { display:grid; gap:0; margin:0; }
html[data-design="leaders"] .sidebar-agent-label { margin:0 12px 2px; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:20px; font-weight:var(--weight-medium); }
html[data-design="leaders"] .sidebar-agent-tasks { display:grid; gap:0; }
html[data-design="leaders"] .sidebar-agent-tasks:empty { display:none; }
html[data-design="leaders"] .sidebar .sidebar-agent-task { border-radius:10px; }
html[data-design="leaders"] .sidebar-agent-title { flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align:left; }
html[data-design="leaders"] .sidebar-agent-dot { display:inline-grid; flex:none; place-items:center; width:var(--icon-toolbar, 18px); height:var(--icon-toolbar, 18px); }
html[data-design="leaders"] .sidebar-agent-dot::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--color-text-tertiary); }
html[data-design="leaders"] [data-state="running"] > .sidebar-agent-dot::before, html[data-design="leaders"] [data-state="running"] .helper-task-state .sidebar-agent-dot::before { background:var(--color-brand); }
html[data-design="leaders"] [data-state="waiting"] > .sidebar-agent-dot::before, html[data-design="leaders"] [data-state="waiting"] .helper-task-state .sidebar-agent-dot::before { background:var(--color-warning); }


html[data-design="leaders"] .helpers-screen .catalog-shell { max-width:860px; }
html[data-design="leaders"] .helpers-heading { margin:0 0 28px; }
html[data-design="leaders"] .helpers-kicker { margin:0 0 6px; color:var(--color-text-tertiary); font-size:var(--text-meta); font-weight:var(--weight-medium); }
html[data-design="leaders"] .helpers-heading h1 { margin:0; font-size:var(--text-screen); font-weight:var(--weight-semibold); letter-spacing:-.02em; }
html[data-design="leaders"] .helpers-sub { margin:8px 0 0; color:var(--color-text-secondary); font-size:16px; line-height:1.5; text-wrap:pretty; }
html[data-design="leaders"] .helpers-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; }
html[data-design="leaders"] .helper-card { display:grid; grid-template-columns:40px minmax(0, 1fr); align-items:start; gap:14px; min-height:100%; padding:16px; border:0; border-radius:var(--radius-large, 16px); background:var(--color-surface); color:var(--color-text); font:inherit; text-align:left; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"] .helper-card:hover { background:var(--color-hover); } html[data-design="leaders"] .helper-card:hover .helper-icon { background:var(--color-surface); } }
html[data-design="leaders"] .helper-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; background:var(--color-hover); color:var(--color-text); }
html[data-design="leaders"] .helper-icon svg { width:22px; height:22px; }
html[data-design="leaders"] .helper-copy { display:flex; flex-direction:column; gap:2px; align-self:stretch; min-width:0; }
html[data-design="leaders"] .helper-copy b { font-size:15px; line-height:1.35; font-weight:var(--weight-semibold); }
html[data-design="leaders"] .helper-promise { color:var(--color-text-secondary); font-size:14px; line-height:1.45; }
html[data-design="leaders"] .helper-copy .helper-app { margin-top:auto; padding-top:6px; }
html[data-design="leaders"] .helper-app { color:var(--color-text-tertiary); font-size:var(--text-meta); }
html[data-design="leaders"] .helpers-tasks-head { display:flex; align-items:baseline; justify-content:space-between; margin:40px 0 8px; }
html[data-design="leaders"] .helpers-tasks-head h2 { margin:0; font-size:var(--text-section, 18px); font-weight:var(--weight-semibold); }
html[data-design="leaders"] .helpers-all:not([hidden]) { padding:4px 8px; border:0; border-radius:8px; background:none; color:var(--color-text-secondary); font:inherit; font-size:14px; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"] .helpers-all:hover { color:var(--color-text); background:var(--color-hover); } }
html[data-design="leaders"] .helper-task { display:grid; grid-template-columns:32px minmax(0, 1fr) auto; align-items:center; gap:12px; width:100%; min-height:56px; padding:0 8px; border:0; border-radius:10px; background:none; color:var(--color-text); font:inherit; text-align:left; cursor:pointer; }
html[data-design="leaders"] .helper-task + .helper-task { box-shadow:0 -1px 0 color-mix(in srgb, var(--color-border) 55%, transparent); }
@media (hover:hover) { html[data-design="leaders"] .helper-task:hover { background:var(--color-hover); box-shadow:none; } html[data-design="leaders"] .helper-task:hover + .helper-task { box-shadow:none; } }
html[data-design="leaders"] .helper-task .helper-icon { width:32px; height:32px; border-radius:9px; }
html[data-design="leaders"] .helper-task .helper-icon svg { width:18px; height:18px; }
html[data-design="leaders"] .helper-task-copy { display:grid; min-width:0; }
html[data-design="leaders"] .helper-task-copy b { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:15px; font-weight:var(--weight-medium); }
html[data-design="leaders"] .helper-task-copy small { color:var(--color-text-tertiary); font-size:var(--text-meta); }
html[data-design="leaders"] .helper-task-state { display:inline-flex; align-items:center; gap:2px; color:var(--color-text-secondary); font-size:var(--text-meta); white-space:nowrap; }
html[data-design="leaders"] .helper-task[data-state="waiting"] .helper-task-state { color:var(--color-text); }
html[data-design="leaders"] .helpers-empty { padding:24px 8px; }
html[data-design="leaders"] .helpers-empty b { font-size:15px; font-weight:var(--weight-medium); }
html[data-design="leaders"] .helpers-empty p { margin:4px 0 0; color:var(--color-text-secondary); font-size:14px; }


html[data-design="leaders"] .helper-chip:not([hidden]) { grid-area:actions; position:relative; z-index:1; display:inline-flex; align-items:center; gap:6px; align-self:center; justify-self:end; max-width:min(240px, 50%); height:30px; margin:0 8px 0 0; padding:0 2px 0 6px; border-radius:var(--radius-pill); background:var(--color-hover); color:var(--color-text); font-size:14px; line-height:20px; }
html[data-design="leaders"] .helper-chip-icon { display:grid; place-items:center; width:20px; height:20px; }
html[data-design="leaders"] .helper-chip-icon svg { width:18px; height:18px; }
html[data-design="leaders"] .helper-chip-name { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-weight:var(--weight-medium); }
html[data-design="leaders"] #helper-chip-clear { display:grid; place-items:center; width:26px; height:26px; padding:0; border:0; border-radius:50%; background:none; color:var(--color-text-secondary); cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"] #helper-chip-clear:hover { color:var(--color-text); background:var(--color-active); } }
html[data-design="leaders"] #helper-chip-clear svg { width:14px; height:14px; }
html[data-design="leaders"] .helper-empty { display:grid; justify-items:center; text-align:center; }
html[data-design="leaders"] .helper-empty .helper-icon { width:48px; height:48px; margin-bottom:12px; border-radius:14px; }
html[data-design="leaders"] .helper-empty .helper-icon svg { width:26px; height:26px; }
html[data-design="leaders"] .helper-empty h1 { margin:0; }
html[data-design="leaders"] .helper-empty-line { max-width:480px; margin:8px 0 0; color:var(--color-text-secondary); font-size:16px; line-height:1.5; text-wrap:pretty; }
html[data-design="leaders"] .helper-empty .helper-app { margin:4px 0 0; }
html[data-design="leaders"] .helper-examples-label { margin:28px 0 8px; color:var(--color-text-tertiary); font-size:var(--text-meta); font-weight:var(--weight-medium); }
html[data-design="leaders"] .helper-examples { display:grid; gap:6px; width:100%; max-width:560px; }
html[data-design="leaders"] .helper-examples button { min-height:44px; padding:10px 16px; border:0; border-radius:12px; background:var(--color-field); color:var(--color-text); font:inherit; font-size:15px; line-height:1.4; text-align:left; cursor:pointer; }
@media (hover:hover) { html[data-design="leaders"] .helper-examples button:hover { background:var(--color-active); } }
@media (max-width:760px) {
  html[data-design="leaders"] .helpers-heading { margin-bottom:12px; }
  html[data-design="leaders"] .helpers-grid { grid-template-columns:minmax(0, 1fr); gap:0; }
  html[data-design="leaders"] .helper-card { padding:12px 4px; border-radius:0; background:none; }
  html[data-design="leaders"] .helper-card + .helper-card { box-shadow:0 -1px 0 color-mix(in srgb, var(--color-border) 55%, transparent); }
  html[data-design="leaders"] .helper-card .helper-copy .helper-app { margin-top:2px; padding-top:0; }
}


html[data-design="leaders"] .sc-nav svg { border-radius:5px; }
html[data-design="leaders"] .sc-page-screen .catalog-shell { max-width:880px; }
html[data-design="leaders"] .sc-page-hero { margin:8px 0 32px; }
html[data-design="leaders"] .sc-page-icon { display:block; width:64px; height:64px; margin:0 0 20px; border-radius:15px; }
html[data-design="leaders"] .sc-page-title h1 { margin:0; font-size:32px; line-height:1.15; font-weight:var(--weight-semibold); letter-spacing:-.025em; }
html[data-design="leaders"] .sc-page-line { max-width:520px; margin:10px 0 0; color:var(--color-text-secondary); font-size:17px; line-height:1.5; text-wrap:pretty; }
html[data-design="leaders"] .sc-page-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:40px; padding:0 18px; border:0; border-radius:999px; background:var(--color-hover); color:var(--color-text); font:inherit; font-size:15px; font-weight:var(--weight-medium); text-decoration:none; cursor:pointer; }
html[data-design="leaders"] .sc-page-btn.primary { background:var(--color-action); color:var(--color-on-action); }
html[data-design="leaders"] .sc-page-btn:disabled { cursor:default; color:var(--color-text-secondary); }
html[data-design="leaders"] .sc-page-btn.primary:disabled { background:var(--color-hover); }
html[data-design="leaders"] .sc-page-btn svg { display:block; flex:none; width:18px; height:18px; margin-left:-2px; }
html[data-design="leaders"] .sc-dl { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
html[data-design="leaders"] .sc-dl-card { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:20px; border-radius:16px; background:var(--color-surface); }
html[data-design="leaders"] .sc-dl-card h2 { margin:0; font-size:19px; line-height:1.3; font-weight:var(--weight-semibold); letter-spacing:-.01em; }
html[data-design="leaders"] .sc-dl-req { margin:4px 0 0; color:var(--color-text-secondary); font-size:14px; line-height:1.45; }
html[data-design="leaders"] .sc-dl-act { margin:18px 0 0; }

html[data-design="leaders"] .sc-dl-card .sc-page-btn { min-height:0; }
html[data-design="leaders"] .sc-dl-act + .sc-dl-act { margin-top:10px; }
html[data-design="leaders"] .sc-dl-act:has(.sc-dl-size) { display:flex; align-items:center; gap:12px; }
html[data-design="leaders"] .sc-dl-mirror { margin:4px 0 0; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:1.45; }
html[data-design="leaders"] .sc-dl-mirror a { white-space:nowrap; color:inherit; text-decoration:underline; text-underline-offset:2px; }
html[data-design="leaders"] .sc-dl-mirror a:hover { color:var(--color-text-secondary); }
html[data-design="leaders"] .sc-dl-size { color:var(--color-text-tertiary); font-size:var(--text-meta); font-variant-numeric:tabular-nums; white-space:nowrap; }
html[data-design="leaders"] .sc-dl-meta { margin:10px 0 0; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:1.45; font-variant-numeric:tabular-nums; }
html[data-design="leaders"] .sc-dl-soon { display:inline-flex; align-items:center; height:40px; color:var(--color-text-tertiary); font-size:15px; font-weight:var(--weight-medium); }
html[data-design="leaders"] .sc-dl-open { margin:14px 2px 0; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:1.45; }
html[data-design="leaders"] .sc-dl-open a { color:var(--color-text-secondary); text-decoration:underline; text-underline-offset:2px; }
html[data-design="leaders"] .sc-dl-phone { display:flex; flex-direction:column; align-items:flex-start; gap:12px; margin:0 0 12px; }
html[data-design="leaders"] .sc-dl-phone p { margin:0; color:var(--color-text-secondary); font-size:15px; line-height:1.45; }

html[data-design="leaders"] .sc-install { margin:64px 0 0; }
html[data-design="leaders"] .sc-install-head { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 16px; }
html[data-design="leaders"] .sc-install-head h2 { margin:0; font-size:28px; line-height:1.2; font-weight:var(--weight-semibold); letter-spacing:-.02em; }
html[data-design="leaders"] .sc-install-switch { padding:0; border:0; background:none; color:var(--color-text-secondary); font:inherit; font-size:15px; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
html[data-design="leaders"] .sc-install-switch:hover { color:var(--color-text); }
html[data-design="leaders"] .sc-install-intro { max-width:640px; margin:12px 0 0; font-size:18px; line-height:1.45; text-wrap:pretty; }
html[data-design="leaders"] .sc-install-why { max-width:640px; margin:6px 0 0; color:var(--color-text-secondary); font-size:15px; line-height:1.5; text-wrap:pretty; }
html[data-design="leaders"] .sc-steps { display:grid; gap:36px; margin:36px 0 0; padding:0; list-style:none; }
html[data-design="leaders"] .sc-step { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 400px); align-items:center; gap:20px 36px; min-width:0; }
html[data-design="leaders"] .sc-step-copy { display:grid; grid-template-columns:36px minmax(0, 1fr); align-items:start; column-gap:14px; }
html[data-design="leaders"] .sc-step-n { display:grid; place-items:center; width:36px; height:36px; grid-row:1 / span 2; border-radius:50%; background:var(--color-accent-subtle); color:var(--color-accent-text); font-size:17px; font-weight:var(--weight-semibold); font-variant-numeric:tabular-nums; }
html[data-design="leaders"] .sc-step h3 { margin:4px 0 0; font-size:21px; line-height:1.3; font-weight:var(--weight-semibold); letter-spacing:-.01em; text-wrap:balance; }
html[data-design="leaders"] .sc-step-copy p { margin:8px 0 0; color:var(--color-text-secondary); font-size:17px; line-height:1.5; text-wrap:pretty; }
html[data-design="leaders"] .sc-step-pic { margin:0; }

html[data-design="leaders"] .sc-install-next { display:grid; grid-template-columns:36px minmax(0, 1fr); align-items:start; column-gap:14px; margin:40px 0 0; padding:20px 22px; border-radius:var(--radius-panel); background:var(--color-surface); }
html[data-design="leaders"] .sc-next-icon { width:36px; height:36px; stroke:none; }
html[data-design="leaders"] .sc-install-next h3 { margin:4px 0 0; font-size:21px; line-height:1.3; font-weight:var(--weight-semibold); letter-spacing:-.01em; text-wrap:balance; }
html[data-design="leaders"] .sc-install-next p { max-width:640px; margin:8px 0 0; color:var(--color-text-secondary); font-size:17px; line-height:1.5; text-wrap:pretty; }

html[data-design="leaders"] .sc-install-got { display:flex; align-items:center; gap:8px; margin:14px 0 0; color:var(--color-text); font-size:15px; }
html[data-design="leaders"] .sc-install-got svg { width:18px; height:18px; flex:none; color:var(--color-accent-text); }
html[data-design="leaders"] .sc-pic-folder { fill:var(--color-active); stroke:var(--color-border-strong); stroke-width:1; }

html[data-design="leaders"] .sc-pic { display:block; width:100%; height:auto; font-family:inherit; stroke:none; }
html[data-design="leaders"] .sc-pic-stage { fill:var(--color-hover); }
html[data-design="leaders"] .sc-pic-win { fill:var(--color-elevated); stroke:var(--color-border-strong); stroke-width:1; }
html[data-design="leaders"] .sc-pic-side { fill:var(--color-hover); }
html[data-design="leaders"] .sc-pic-sep { fill:none; stroke:var(--color-border); stroke-width:1; }
html[data-design="leaders"] .sc-pic-light-0 { fill:#FF5F57; }
html[data-design="leaders"] .sc-pic-light-1 { fill:#FEBC2E; }
html[data-design="leaders"] .sc-pic-light-2 { fill:#28C840; }
html[data-design="leaders"] .sc-pic-text { fill:var(--color-text); font-size:12px; }
html[data-design="leaders"] .sc-pic-small { fill:var(--color-text-tertiary); font-size:10.5px; font-weight:var(--weight-medium); }
html[data-design="leaders"] .sc-pic-small-text { fill:var(--color-text); font-size:10.5px; }
html[data-design="leaders"] .sc-pic-head { fill:var(--color-text); font-size:12px; font-weight:var(--weight-semibold); }
html[data-design="leaders"] .sc-pic-title { fill:var(--color-text); font-size:13px; font-weight:var(--weight-semibold); }
html[data-design="leaders"] :is(.sc-pic-line, .sc-pic-glyph) { fill:var(--color-text-tertiary); opacity:.32; }
html[data-design="leaders"] .sc-pic-sel { fill:var(--color-active); }
html[data-design="leaders"] .sc-pic-target { fill:var(--color-accent-subtle); }
html[data-design="leaders"] :is(.sc-pic-field, .sc-pic-group) { fill:var(--color-hover); stroke:var(--color-border); stroke-width:1; }
html[data-design="leaders"] .sc-pic-tile { fill:var(--color-hover); }
html[data-design="leaders"] .sc-pic-switch { fill:var(--color-active); }
html[data-design="leaders"] :is(.sc-pic-lens, .sc-pic-chev) { fill:none; stroke:var(--color-text-tertiary); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
html[data-design="leaders"] .sc-pic-doc { fill:var(--color-surface); stroke:var(--color-border-strong); stroke-width:1; }
html[data-design="leaders"] .sc-pic-zip { fill:var(--color-text-tertiary); opacity:.55; }
html[data-design="leaders"] .sc-pic-ghost { opacity:.55; }
html[data-design="leaders"] .sc-pic-dl { fill:var(--color-accent-subtle); }
html[data-design="leaders"] :is(.sc-pic-dl-arrow, .sc-pic-arrow) { fill:none; stroke:var(--color-accent); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
html[data-design="leaders"] .sc-pic-arrow { stroke-dasharray:4 4; }

html[data-design="leaders"] .sc-pic-btn { fill:var(--color-active); }
html[data-design="leaders"] .sc-pic-btn-text { fill:var(--color-text); font-size:11px; font-weight:var(--weight-medium); }
html[data-design="leaders"] :is(.sc-pic-default, .sc-pic-select) { fill:#0A7AFF; }
html[data-design="leaders"] .sc-pic-default-text { fill:#FFFFFF; font-size:11px; font-weight:var(--weight-semibold); }
html[data-design="leaders"] .sc-pic-select-glyph { fill:#FFFFFF; opacity:.85; }
html[data-design="leaders"] .sc-pic-select-text { fill:#FFFFFF; font-size:10.5px; font-weight:var(--weight-medium); }
html[data-design="leaders"] .sc-pic-ring { fill:none; stroke:var(--color-accent); stroke-width:2; }
html[data-design="leaders"] .sc-pic-cursor { fill:#0D1216; stroke:#FFFFFF; stroke-width:1.2; stroke-linejoin:round; }

html[data-design="leaders"] .sc-pic-blue { fill:#1460AA; }
html[data-design="leaders"] .sc-pic-blue-x { fill:none; stroke:#FFFFFF; stroke-width:1.4; stroke-linecap:round; opacity:.8; }
html[data-design="leaders"] .sc-pic-blue-title { fill:#FFFFFF; font-size:17px; }
html[data-design="leaders"] .sc-pic-blue-line { fill:#FFFFFF; opacity:.5; }
html[data-design="leaders"] .sc-pic-blue-link { fill:#FFFFFF; font-size:12px; font-weight:var(--weight-semibold); text-decoration:underline; }
html[data-design="leaders"] .sc-pic-blue-text { fill:#FFFFFF; fill-opacity:.8; font-size:11.5px; }
html[data-design="leaders"] .sc-pic-blue-strong { fill-opacity:1; font-weight:var(--weight-semibold); }
html[data-design="leaders"] .sc-pic-blue-btn { fill:none; stroke:#FFFFFF; stroke-width:1.2; stroke-opacity:.85; }
html[data-design="leaders"] .sc-pic-blue-btn-text { fill:#FFFFFF; font-size:11px; font-weight:var(--weight-medium); }
html[data-design="leaders"] .sc-pic-ring.is-blue { stroke:#9BE8C8; }
html[data-design="leaders"] .sc-pic-cursor.is-blue { fill:#FFFFFF; stroke:#0D1216; }
html[data-design="leaders"] .sc-page-examples { margin:56px 0 48px; }
html[data-design="leaders"] .sc-page-examples h2 { margin:0 0 12px; color:var(--color-text-tertiary); font-size:var(--text-meta); font-weight:var(--weight-medium); }
html[data-design="leaders"] .sc-page-example-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; }
html[data-design="leaders"] .sc-page-example { padding:14px 16px; border-radius:12px; background:var(--color-surface); color:var(--color-text); font-size:15px; line-height:1.4; }
@media (max-width:640px) {
  html[data-design="leaders"] .sc-page-hero { margin:4px 0 24px; }
  html[data-design="leaders"] .sc-page-icon { width:56px; height:56px; margin-bottom:16px; border-radius:13px; }
  html[data-design="leaders"] .sc-page-title h1 { font-size:28px; }
  html[data-design="leaders"] .sc-page-line { font-size:16px; }
  html[data-design="leaders"] .sc-dl { grid-template-columns:minmax(0, 1fr); gap:10px; }
  html[data-design="leaders"] .sc-dl-card .sc-page-btn, html[data-design="leaders"] .sc-dl-act { width:100%; }
  html[data-design="leaders"] .sc-dl-card .sc-page-btn { height:44px; }
  html[data-design="leaders"] .sc-install { margin-top:48px; }
  html[data-design="leaders"] .sc-install-head h2 { font-size:24px; }
  html[data-design="leaders"] .sc-install-intro { font-size:17px; }
  html[data-design="leaders"] .sc-steps { gap:32px; margin-top:28px; }
  html[data-design="leaders"] .sc-step { grid-template-columns:minmax(0, 1fr); }
  html[data-design="leaders"] .sc-step-copy { grid-template-columns:32px minmax(0, 1fr); column-gap:12px; }
  html[data-design="leaders"] .sc-step-n { width:32px; height:32px; font-size:16px; }
  html[data-design="leaders"] .sc-step h3 { margin-top:3px; font-size:19px; }
  html[data-design="leaders"] .sc-step-copy p { font-size:16px; }
  html[data-design="leaders"] .sc-install-next { grid-template-columns:32px minmax(0, 1fr); column-gap:12px; margin-top:32px; padding:16px; }
  html[data-design="leaders"] .sc-next-icon { width:32px; height:32px; }
  html[data-design="leaders"] .sc-install-next h3 { margin-top:3px; font-size:19px; }
  html[data-design="leaders"] .sc-install-next p { font-size:16px; }
  html[data-design="leaders"] .sc-page-example-grid { grid-template-columns:minmax(0, 1fr); gap:6px; }
  html[data-design="leaders"] .sc-page-examples { margin-top:44px; }
}

@media (max-width: 767px) {
  html[data-design="leaders"]:not([data-serpent-frame]) body { --drawer-x:73vw; --drawer-p:0; --drawer-ease:cubic-bezier(.32, .72, 0, 1); }
  html[data-design="leaders"]:not([data-serpent-frame]) body.drawer-open { --drawer-p:1; }
  html[data-design="leaders"]:not([data-serpent-frame]) .sidebar { z-index:1; inset:var(--app-top,0px) 0 auto 0; width:100%; padding-right:calc(100% - var(--drawer-x) + var(--space-2)); border:0; border-radius:0; box-shadow:none; transform:none; visibility:hidden; transition:visibility 0s linear 320ms; will-change:auto; }
  html[data-design="leaders"]:not([data-serpent-frame]) :is(.drawer-open, .drawer-dragging) .sidebar { visibility:visible; transition:none; }
  html[data-design="leaders"]:not([data-serpent-frame]) .sidebar > .drawer-close { display:none; }
  html[data-design="leaders"]:not([data-serpent-frame]) .workspace { z-index:2; overflow:hidden; transform:translateX(calc(var(--drawer-p) * var(--drawer-x))); border-radius:calc(min(1, var(--drawer-p) * 3) * 44px); box-shadow:-1px 0 0 rgb(255 255 255 / .06), -16px 0 40px rgb(0 0 0 / .32); transition:transform 320ms var(--drawer-ease), border-radius 320ms var(--drawer-ease); }
  html[data-design="leaders"]:not([data-serpent-frame]) .workspace::after { content:""; position:absolute; z-index:1000; inset:0; background:#000; opacity:calc(var(--drawer-p) * .4); pointer-events:none; transition:opacity 320ms var(--drawer-ease); }
  html[data-design="leaders"]:not([data-serpent-frame]) .drawer-dragging .workspace, html[data-design="leaders"]:not([data-serpent-frame]) .drawer-dragging .workspace::after { transition:none; }
  
  html[data-design="leaders"]:not([data-serpent-frame]) body:not(.drawer-open, .drawer-dragging) .workspace { transform:none; }
  
  html[data-design="leaders"]:not([data-serpent-frame]) .drawer-backdrop { z-index:3; inset:var(--app-top,0px) 0 0 var(--drawer-x); background:transparent; opacity:1; transition:none; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  html[data-design="leaders"]:not([data-serpent-frame]) .workspace, html[data-design="leaders"]:not([data-serpent-frame]) .workspace::after { transition:none; }
  html[data-design="leaders"]:not([data-serpent-frame]) .sidebar { opacity:0; transition:opacity 160ms ease, visibility 0s linear 160ms; }
  html[data-design="leaders"]:not([data-serpent-frame]) :is(.drawer-open, .drawer-dragging) .sidebar { opacity:1; transition:opacity 160ms ease; }
}

@media (max-width: 767px) {
  html[data-design="leaders"] .guest-mode .conversation-header > .guest-login { min-height:44px; height:44px; border-block:4px solid transparent; background-clip:padding-box; }
  html[data-design="leaders"] .guest-mode .conversation-header > .guest-login::after { content:none; }
  html[data-design="leaders"] .guest-mode :is(.guest-links a, .guest-more:not([hidden])) { display:inline-flex; align-items:center; min-height:44px; margin-block:-12px; }
}

@media (max-width: 767px) {
  html[data-design="leaders"][data-modes] .mode-switch:not([hidden]) { height:44px; margin:-2px 0 calc(var(--space-3) - 4px); padding:0 2px; border-block:4px solid transparent; background-clip:padding-box !important; box-shadow:none !important; }
  html[data-design="leaders"][data-modes] .mode-switch button { position:relative; z-index:0; height:44px; margin-block:-4px; background:transparent !important; box-shadow:none !important; }
  html[data-design="leaders"][data-modes] .mode-switch button::before { content:""; position:absolute; inset:6px 0; z-index:-1; border-radius:8px; transition:background-color .15s ease, box-shadow .15s ease; }
  html[data-design="leaders"][data-modes] .mode-switch button[aria-checked="true"]::before { background:#FFF; box-shadow:0 1px 2px rgb(0 0 0 / .08), 0 0 0 .5px rgb(0 0 0 / .08); }
  html[data-design="leaders"][data-modes][data-theme="dark"] .mode-switch button[aria-checked="true"]::before { background:rgb(255 255 255 / .15); box-shadow:0 1px 3px rgb(0 0 0 / .35), inset 0 .5px 0 rgb(255 255 255 / .1); }
}
@media (max-width: 767px) and (prefers-color-scheme: dark) {
  html[data-design="leaders"][data-modes]:not([data-theme="light"]) .mode-switch button[aria-checked="true"]::before { background:rgb(255 255 255 / .15); box-shadow:0 1px 3px rgb(0 0 0 / .35), inset 0 .5px 0 rgb(255 255 255 / .1); }
}

@media (max-width: 767px) {
  html[data-design="leaders"] .studio-header-new { height:44px; min-height:44px; border-block:2px solid transparent; background-clip:padding-box; }
}

html[data-design="leaders"][data-modes][data-mode="code"] .mobile-header .brand { display:none; }
@media (max-width: 767px) { html[data-design="leaders"][data-modes][data-mode="code"] .sc-page-title h1 { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); } }
html[data-design="leaders"] .mobile-mode-title { order:2; margin:0; overflow:hidden; color:var(--color-text); font-size:var(--text-heading); line-height:var(--leading-heading); white-space:nowrap; text-overflow:ellipsis; }

@media (max-width:767px) {
  html[data-design="leaders"] .message-row.assistant :is(.answer-content, .pending-answer) :is(p, li, blockquote, h4, h5, h6) { line-height:26px; }
  html[data-design="leaders"] .message-row.user .message-bubble { line-height:26px; }
  html[data-design="leaders"] #messages > .message-row.user:has(> .user-actions) { margin-bottom:12px; }
  html[data-design="leaders"] .message-row.user > .user-actions { margin-top:-2px; }
}

html[data-design="leaders"] .code-block pre::after { background:linear-gradient(90deg, transparent, var(--code-bg) 85%); }

html[data-design="leaders"] :focus-visible { outline-color:var(--color-focus-border); }
@media (max-width:767px) {
  
  html[data-design="leaders"] .code-toolbar + pre { padding-top:var(--space-1); }
  
  html[data-design="leaders"] .conversation-header::after { content:""; position:absolute; left:0; right:0; top:100%; z-index:1; height:var(--space-3); background:linear-gradient(var(--color-bg), transparent); pointer-events:none; }
}

html[data-design="leaders"] .sidebar-chat-list { padding-bottom:var(--space-5); -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - var(--space-5)), transparent); mask-image:linear-gradient(to bottom, #000 calc(100% - var(--space-5)), transparent); }

html[data-design="leaders"] .message-bubble :not(pre) > code { -webkit-box-decoration-break:clone; box-decoration-break:clone; }

html[data-design="leaders"][data-modes] .mode-switch:not([hidden]) { container-type:inline-size; }
html[data-design="leaders"][data-modes] .mode-switch button > svg { display:none; flex:none; width:16px; height:16px; stroke-width:var(--icon-stroke-small); }
@container (max-width: 279px) {
  html[data-design="leaders"][data-modes] .mode-switch button { flex:1 1 0; gap:6px; min-width:44px; padding:0 6px; }
  html[data-design="leaders"][data-modes] .mode-switch button[aria-checked="true"] { flex-grow:2; }
  html[data-design="leaders"][data-modes] .mode-switch button > svg { display:block; }
  html[data-design="leaders"][data-modes] .mode-switch button[aria-checked="false"] > span, html[data-design="leaders"][data-modes] .mode-switch button[data-short] > .mode-name { display:none; }
  html[data-design="leaders"][data-modes] .mode-switch button[data-short][aria-checked="true"]::after { content:attr(data-short); }
}

@container (max-width: 279px) {
  html[data-design="leaders"][data-modes] .mode-switch button > svg { width:18px; height:18px; stroke-width:1.8; }
  html[data-design="leaders"][data-modes] .mode-switch button[aria-checked="false"] { color:color-mix(in srgb, var(--color-text) 80%, transparent); }
  html[data-design="leaders"][data-modes] .mode-switch button[aria-checked="false"]:hover { color:var(--color-text); }
  html[data-design="leaders"][data-modes] .mode-switch button[aria-checked="true"] { font-weight:600; }
}

@media (max-width: 767px) {
  html[data-design="leaders"][data-telegram-safe="true"]:not([data-serpent-frame]) .sidebar { top:var(--app-top, 0px); height:var(--app-height, 100dvh); padding-top:calc(var(--edge-top) + 12px); padding-bottom:calc(var(--edge-bottom) + 8px); padding-left:calc(var(--edge-left) + 8px); }
}

html[data-design="leaders"] .model-sheet .model-options::before { content:""; position:sticky; top:0; z-index:1; flex:none; height:var(--space-4); margin-bottom:calc(-1 * var(--space-4)); background:linear-gradient(var(--color-elevated), transparent); pointer-events:none; opacity:0; }
@supports (animation-timeline:scroll()) {
  html[data-design="leaders"] .model-sheet .model-options::before { animation:table-more linear both reverse; animation-timeline:scroll(nearest block); }
}

html[data-design="leaders"] .message-row.assistant.pending .request-activity { min-height:20px; margin-bottom:12px; line-height:20px; }

html[data-design="leaders"]:not([data-serpent-app]) .message-row.assistant.pending:not(:has(.agent-run)) > .message-bubble { padding-bottom:calc(var(--space-2) + 44px); }
@media (hover:hover) and (pointer:fine) {
  html[data-design="leaders"]:not([data-serpent-app]) .message-row.assistant.pending:not(:has(.agent-run)) > .message-bubble { padding-bottom:calc(var(--space-2) + 36px); }
}

@media (hover:hover) and (pointer:fine) {
  html[data-design="leaders"] #messages { -webkit-mask-image:linear-gradient(to bottom, transparent, #000 var(--space-4), #000 calc(100% - var(--space-5)), transparent); mask-image:linear-gradient(to bottom, transparent, #000 var(--space-4), #000 calc(100% - var(--space-5)), transparent); }
}

html[data-design="leaders"] .sc-dl-which { margin:10px 0 0; color:var(--color-text-tertiary); font-size:var(--text-meta); line-height:1.45; }

html[data-design="leaders"] .composer-wrap .attach-menu [data-attachment-source="video"] > span { display:grid; gap:2px; min-width:0; text-align:left; }
html[data-design="leaders"] #video-how { color:var(--color-text-tertiary); font-size:var(--text-caption); line-height:var(--leading-caption); white-space:normal; }
html[data-design="leaders"] #video-how[hidden] { display:none; }


html[data-design="leaders"] .sui-tool { padding-bottom:0; }
html[data-design="leaders"] .sui-tool .composition-detail { display:flex; flex-direction:column; min-height:calc(100dvh - 120px); }
html[data-design="leaders"] #composition-body:has(> .sui-tool) { padding-bottom:0; }

html[data-design="leaders"] #composition-body:has(> .sui-tool) { margin-inline:calc(-1 * var(--space-4)); padding-inline:var(--space-4); }

html[data-design="leaders"] :is(#screen-studio, #screen-composition, #guest-locked-examples) :is(.sui-tile-art, .sui-stage, .demo-before, .demo-inset, figure, img)[hidden] { display:none !important; }
html[data-design="leaders"] .sui-tool .composition-detail-head { display:flex; align-items:center; gap:var(--space-2); }
html[data-design="leaders"] .sui-tool .composition-detail-head h2 { flex:1; }
html[data-design="leaders"] .sui-tool .sui-more { margin-left:auto; }
html[data-design="leaders"] .sui-tool .sui-more > summary { display:grid; place-items:center; width:44px; height:44px; margin-right:-11px; border-radius:50%; color:var(--color-text-secondary); cursor:pointer; list-style:none; }
html[data-design="leaders"] .sui-tool .sui-more > summary::-webkit-details-marker { display:none; }
html[data-design="leaders"] .sui-tool .sui-more > summary:hover { background:var(--color-hover); color:var(--color-text); }
html[data-design="leaders"] .sui-tool .sui-more > summary svg { width:22px; height:22px; }

html[data-design="leaders"] .sui-tool .composition-detail-body:has(> .sui-composer) { flex:1; display:flex; flex-direction:column; padding:0; border:0; border-radius:0; background:none; gap:var(--space-3); }
html[data-design="leaders"] .sui-intro { display:grid; gap:var(--space-2); margin:auto 0 var(--space-6); padding:var(--space-8) var(--space-2) 0; text-align:center; }
html[data-design="leaders"] .sui-intro h3 { margin:0; color:var(--color-text); font-size:var(--text-title, 24px); font-weight:var(--weight-medium); letter-spacing:var(--tracking-heading); }
html[data-design="leaders"] .sui-intro p { margin:0 auto; max-width:34ch; color:var(--color-text-secondary); font-size:var(--text-body, 16px); line-height:1.45; }
html[data-design="leaders"] .sui-composer { position:sticky; bottom:0; z-index:2; display:grid; gap:var(--space-3); margin:auto calc(-1 * var(--space-4)) 0; padding:var(--space-2) var(--space-4) max(var(--space-3), calc(var(--space-2) + env(safe-area-inset-bottom)), calc(var(--space-3) + var(--edge-bottom, 0px))); background:linear-gradient(to bottom, transparent, var(--color-bg) var(--space-4)); }
html[data-design="leaders"] .sui-composer-card { display:grid; gap:var(--space-3); padding:var(--space-3); border-radius:24px; background:var(--color-surface); box-shadow:var(--shadow-composer); }
html[data-design="leaders"] .sui-composer-card > .composition-field { margin:0; }
html[data-design="leaders"] .sui-composer .sui-words > .composition-field-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

html[data-design="leaders"] .sui-composer .sui-words > .composition-field-label > output { display:none; }
html[data-design="leaders"] .sui-composer .sui-words textarea { min-height:52px; max-height:30vh; padding:var(--space-1) var(--space-1); border:0; background:none; box-shadow:none; font-size:var(--text-body, 16px); resize:none; field-sizing:content; }
html[data-design="leaders"] .sui-composer .composition-photos > .composition-field-label { display:none; }
html[data-design="leaders"] .sui-composer .composition-photos .composition-detail-actions { gap:var(--space-2); }
html[data-design="leaders"] .sui-composer .composition-photos .composition-secondary { min-height:36px; padding:0 var(--space-3); border-radius:var(--radius-pill); font-size:var(--text-caption, 14px); }
html[data-design="leaders"] .sui-pills { display:flex; flex-wrap:wrap; gap:var(--space-2); }
html[data-design="leaders"] .sui-pill { display:inline-flex; align-items:center; gap:6px; max-width:100%; min-height:36px; padding:0 10px 0 12px; border:1px solid var(--color-border); border-radius:var(--radius-pill); background:none; color:var(--color-text); font:inherit; font-size:var(--text-caption, 14px); cursor:pointer; }
html[data-design="leaders"] .sui-pill:hover { background:var(--color-hover); }
html[data-design="leaders"] .sui-pill > svg { flex:none; width:16px; height:16px; color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-pill > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[data-design="leaders"] .sui-pill > .sui-pill-chevron { width:14px; height:14px; }
html[data-design="leaders"] .sui-composer > .composition-detail-actions { position:static; margin:0; padding:0; border-radius:0; background:none; }
html[data-design="leaders"] .sui-composer > .composition-detail-actions > .composition-primary { width:100%; }



html[data-design="leaders"] .sui-sheet { width:min(100%, 480px); max-width:100%; max-height:min(80dvh, 640px); margin:auto auto 0; padding:0; border:0; border-radius:var(--radius-sheet, 22px) var(--radius-sheet, 22px) 0 0; background:var(--color-elevated, var(--color-surface)); color:var(--color-text); box-shadow:0 -8px 40px rgba(0,0,0,.35); overflow:hidden; }
html[data-design="leaders"] .sui-sheet[open] { display:flex; flex-direction:column; animation:sheet-up var(--dur-base, .2s) ease-out; }
html[data-design="leaders"] .sui-sheet.is-still[open] { animation:none; }
html[data-design="leaders"] .sui-sheet::backdrop { background:var(--color-scrim, rgba(0,0,0,.5)); }
html[data-design="leaders"] .sui-sheet-grip { width:36px; height:4px; margin:8px auto 0; border-radius:2px; background:var(--color-border-strong, var(--color-border)); }
html[data-design="leaders"] .sui-sheet-head { display:flex; align-items:center; gap:var(--space-2); padding:var(--space-3) var(--space-4) var(--space-2); }
html[data-design="leaders"] .sui-sheet-head h2 { flex:1; margin:0; font-size:var(--text-heading, 18px); font-weight:var(--weight-medium); }
html[data-design="leaders"] .sui-sheet-close { display:grid; place-items:center; width:36px; height:36px; margin-right:-6px; border:0; border-radius:50%; background:var(--color-hover); color:var(--color-text-secondary); cursor:pointer; }
html[data-design="leaders"] .sui-sheet-close svg { width:18px; height:18px; }
html[data-design="leaders"] .sui-sheet-body { display:grid; gap:var(--space-5); padding:var(--space-2) var(--space-4) calc(var(--space-5) + var(--edge-bottom, 0px)); overflow-y:auto; overscroll-behavior:contain; }
html[data-design="leaders"] .sui-sheet-body > .composition-field { margin:0; }
html[data-design="leaders"] .sui-sheet .sui-only > .composition-field-label { display:none; }

html[data-design="leaders"] .sui-sheet[data-sheet="model"] .composition-choice { display:grid; grid-template-columns:minmax(0, 1fr); gap:2px; }
html[data-design="leaders"] .sui-sheet[data-sheet="model"] .composition-choice > button { justify-content:flex-start; min-height:48px; padding:0 var(--space-3); text-align:left; }
@media (min-width:900px) {
  html[data-design="leaders"] .sui-sheet { margin:auto; border-radius:var(--radius-large, 20px); box-shadow:0 24px 64px rgba(0,0,0,.4); }
  html[data-design="leaders"] .sui-sheet-grip { display:none; }
}
@media (prefers-reduced-motion: reduce) { html[data-design="leaders"] .sui-sheet[open] { animation:none; } }

@media (min-width:1100px) { html[data-design="leaders"] .composition-layout:not(.is-tool) { grid-template-columns:minmax(0, 1fr) 430px; } }


html[data-design="leaders"] :is(#screen-studio, #screen-composition) {
  --font-ui:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display:-apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --color-brand:var(--color-text);
  --color-pick:var(--color-active);
  --sui-fill:color-mix(in srgb, var(--color-text) 7%, transparent);
  font-family:var(--font-ui); font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased;
}
html[data-design="leaders"] :is(#screen-studio, #screen-composition) :is(h1, h2, h3) { font-family:var(--font-display); }
html[data-design="leaders"] :is(#screen-studio, #screen-composition) .catalog-heading :is(#studio-title, #composition-title) { font-size:28px; line-height:34px; font-weight:600; letter-spacing:-.022em; }
html[data-design="leaders"] #screen-studio .studio-header-title { font-size:17px; font-weight:600; letter-spacing:-.01em; }
@media (min-width:768px) { html[data-design="leaders"] #screen-studio .studio-header-title { font-size:28px; line-height:34px; letter-spacing:-.022em; } }
html[data-design="leaders"] #screen-studio .studio-header-new { font-weight:600; }


html[data-design="leaders"] #screen-composition :is(.composition-choice:has(> :nth-child(5)) > button, .composition-chip) { min-height:34px; padding:0 14px; border:0; border-radius:var(--radius-pill); background:var(--sui-fill); color:var(--color-text); font-size:14px; font-weight:500; }
html[data-design="leaders"] #screen-composition :is(.composition-choice, .composition-chips) { gap:var(--space-2); }

html[data-design="leaders"] :is(#screen-studio, #screen-composition) :is(.composition-choice:not(:has(> :nth-child(5))), .composition-chips:not(:has(> :nth-child(5))), .studio-filters) { display:inline-flex; flex-wrap:nowrap; gap:2px; max-width:100%; padding:3px; border-radius:12px; background:var(--sui-fill); }
html[data-design="leaders"] :is(#screen-studio, #screen-composition) :is(.composition-choice:not(:has(> :nth-child(5))), .composition-chips:not(:has(> :nth-child(5))), .studio-filters) > button { flex:1 1 0; min-width:0; min-height:34px; padding:0 var(--space-4); border:0; border-radius:9px; background:transparent; color:var(--color-text-secondary); font-size:14px; font-weight:500; white-space:nowrap; }
html[data-design="leaders"] #screen-composition .sui-sheet :is(.composition-choice, .composition-chips):not(:has(> :nth-child(5))) { display:flex; width:100%; }

html[data-design="leaders"] :is(#screen-studio, #screen-composition) :is(.composition-choice button, .composition-chip, .catalog-tabs button) { transition:background-color .16s ease, color .16s ease; }
html[data-design="leaders"] :is(#screen-studio, #screen-composition) :is(.composition-choice:not(:has(> :nth-child(5))), .composition-chips:not(:has(> :nth-child(5))), .catalog-tabs, .composition-choice, .composition-chips, .studio-filters) > [aria-pressed="true"] { background:var(--color-text); color:var(--color-bg); font-weight:600; }

html[data-design="leaders"] #screen-composition .sui-sheet[data-sheet="model"] .composition-choice.composition-choice { display:grid; grid-template-columns:1fr; gap:2px; padding:0; background:none; }
html[data-design="leaders"] #screen-composition .sui-sheet[data-sheet="model"] .composition-choice.composition-choice > button { display:flex; align-items:center; min-height:52px; padding:0 var(--space-4); border-radius:14px; background:transparent; color:var(--color-text); font-size:15px; font-weight:500; text-align:left; }
html[data-design="leaders"] #screen-composition .sui-sheet[data-sheet="model"] .composition-choice.composition-choice > button[aria-pressed="true"] { background:var(--sui-fill); color:var(--color-text); }
html[data-design="leaders"] #screen-composition .sui-sheet[data-sheet="model"] .composition-choice > button[aria-pressed="true"]::after { content:""; flex:none; width:11px; height:6px; margin:-3px 2px 0 auto; border-left:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); }


html[data-design="leaders"] #screen-composition .sui-sheet .composition-field-label > span { color:var(--color-text); font-size:15px; font-weight:600; letter-spacing:-.006em; }
html[data-design="leaders"] #screen-composition .sui-sheet-head h2 { font-size:17px; font-weight:600; letter-spacing:-.012em; }
html[data-design="leaders"] #screen-composition .sui-sheet-body { gap:var(--space-6); }
html[data-design="leaders"] #screen-composition :is(.composition-note, .composition-why) { color:var(--color-text-tertiary); font-size:14px; line-height:20px; }
html[data-design="leaders"] #screen-composition .composition-detail-head h2 { font-size:17px; font-weight:600; letter-spacing:-.012em; }


html[data-design="leaders"] #screen-composition .sui-intro { gap:var(--space-2); padding-top:var(--space-4); }
html[data-design="leaders"] #screen-composition .sui-intro h3 { margin-top:var(--space-4); font-size:28px; line-height:34px; font-weight:600; letter-spacing:-.022em; }
html[data-design="leaders"] #screen-composition .sui-intro p { font-size:15px; line-height:22px; }
html[data-design="leaders"] .sui-stage { position:relative; overflow:hidden; width:100%; max-width:560px; margin:0 auto; aspect-ratio:4 / 3; max-height:38dvh; border-radius:24px; background:var(--sui-fill); }
html[data-design="leaders"] .sui-stage::before { content:""; position:absolute; inset:0; background:var(--sui-fill); animation:skeleton-pulse 1.2s ease-in-out infinite; }
html[data-design="leaders"] .sui-stage > :is(img, svg) { position:relative; }
html[data-design="leaders"] .sui-stage > img { display:block; width:100%; height:100%; object-fit:cover; }


html[data-design="leaders"] #screen-composition .sui-pill { min-height:34px; border:0; background:var(--sui-fill); font-size:14px; font-weight:500; transition:background-color .16s ease; }
html[data-design="leaders"] #screen-composition .sui-composer .composition-primary { min-height:52px; border-radius:16px; font-size:16px; font-weight:600; letter-spacing:-.008em; }
html[data-design="leaders"] #screen-composition .sui-composer .composition-primary:disabled { background:var(--sui-fill); color:var(--color-text-tertiary); }
html[data-design="leaders"] #screen-composition .sui-sheet[open] { animation-duration:.22s; animation-timing-function:cubic-bezier(.2, .8, .2, 1); }
@media (prefers-reduced-motion:reduce) {
  html[data-design="leaders"] :is(#screen-studio, #screen-composition) :is(.composition-choice button, .composition-chip, .catalog-tabs button, .sui-pill) { transition:none; }
  html[data-design="leaders"] .sui-stage::before { animation:none; }
}


html[data-design="leaders"] #studio-list > :is(.sui-blocks, .sui-filter, .sui-works, .sui-empty, .sui-open-studio, .sui-new-project, .sui-projects) { flex:none; }
html[data-design="leaders"] .sui-open-studio { justify-self:start; align-self:flex-start; min-height:44px; margin-top:16px; padding:0 20px; border:0; border-radius:var(--radius-pill); background:var(--color-text); color:var(--color-bg); font:inherit; font-size:15px; font-weight:600; cursor:pointer; }
html[data-design="leaders"] .sui-blocks { display:grid; gap:32px; padding-top:8px; }
html[data-design="leaders"] .sui-block { display:grid; align-content:start; gap:12px; min-width:0; }
html[data-design="leaders"] .sui-block-title { display:flex; align-items:center; gap:8px; margin:0 0 4px; font-size:20px; line-height:26px; font-weight:600; color:var(--color-text); }
html[data-design="leaders"] .sui-block-title > svg { width:22px; height:22px; }

html[data-design="leaders"] :is(.sui-block, .sui-examples, .sui-howto)[data-hue="photo"] { --sui-a:#ffb547; --sui-bg1:#3a2516; --sui-bg2:#3b1c22; }
html[data-design="leaders"] :is(.sui-block, .sui-examples, .sui-howto)[data-hue="video"] { --sui-a:#a78bfa; --sui-bg1:#251e40; --sui-bg2:#1b1f46; }
html[data-design="leaders"] :is(.sui-block, .sui-examples, .sui-howto)[data-hue="sound"] { --sui-a:#fb7185; --sui-bg1:#3c1a2b; --sui-bg2:#32183e; }
html[data-design="leaders"] .sui-block-title > svg { color:var(--sui-a); }
html[data-design="leaders"] .sui-tiles { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
html[data-design="leaders"] .sui-tile { display:grid; grid-template-rows:auto 1fr; align-content:start; padding:0; overflow:hidden; border:0; border-radius:16px; background:var(--sui-fill); color:var(--color-text); font:inherit; text-align:left; cursor:pointer; transition:background-color .16s ease; }
html[data-design="leaders"] .sui-tile-art { display:block; aspect-ratio:16 / 10; background:linear-gradient(135deg, var(--sui-bg1), var(--sui-bg2)); }
html[data-design="leaders"] .sui-examples { display:grid; gap:12px; margin-bottom:16px; }
html[data-design="leaders"] .sui-examples-row { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
html[data-design="leaders"] .sui-example { display:grid; align-content:start; gap:8px; padding:0; border:0; background:none; color:var(--color-text-secondary); font:inherit; font-size:14px; line-height:20px; text-align:left; cursor:pointer; }
html[data-design="leaders"] .sui-example > .sui-tile-art { overflow:hidden; border-radius:12px; }
html[data-design="leaders"] .sui-example > .sui-tile-art > img { display:block; width:100%; height:100%; object-fit:cover; }
html[data-design="leaders"] .sui-example.is-still { margin:0; cursor:default; }
html[data-design="leaders"] .sui-example > span:last-child { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }


@media (max-width:767px) {
  html[data-design="leaders"] .sui-examples-row { display:flex; gap:10px; margin:0 -16px; padding:0 16px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding:0 16px; scrollbar-width:none; }
  html[data-design="leaders"] .sui-examples-row::-webkit-scrollbar { display:none; }
  html[data-design="leaders"] .sui-examples-row > .sui-example { flex:0 0 42%; scroll-snap-align:start; }
  html[data-design="leaders"] .sui-examples-row > .sui-example > .sui-tile-art { aspect-ratio:4 / 5; }
}
@media (min-width:768px) { html[data-design="leaders"] .sui-examples-row { grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); } }
html[data-design="leaders"] .sui-tile-copy { display:grid; align-content:start; gap:2px; min-width:0; padding:12px 14px 14px; }
html[data-design="leaders"] .sui-tile-copy > b { font-size:15px; line-height:20px; font-weight:600; }
html[data-design="leaders"] .sui-tile-copy > small { font-size:14px; line-height:20px; color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-tile-copy > em { margin-top:4px; font-style:normal; font-size:14px; line-height:20px; color:var(--color-text-tertiary, var(--color-text-secondary)); font-variant-numeric:tabular-nums; }
@media (hover:hover) { html[data-design="leaders"] :is(.sui-tile, .sui-new-project):hover { background:color-mix(in srgb, var(--color-text) 11%, transparent); } }

html[data-design="leaders"] .sui-composer.has-main .composition-why { display:none; }
html[data-design="leaders"] .sui-asks { display:flex; flex-wrap:wrap; gap:6px; padding:0 4px; }
html[data-design="leaders"] .sui-asks.is-done { display:none; }
html[data-design="leaders"] .sui-ask { min-height:32px; padding:6px 12px; text-align:left; line-height:19px; border:1px solid var(--color-border); border-radius:16px; background:none; color:var(--color-text-secondary); font:inherit; font-size:14px; cursor:pointer; transition:color .16s ease, border-color .16s ease; }
@media (hover:hover) { html[data-design="leaders"] .sui-ask:hover { color:var(--color-text); border-color:var(--color-text-secondary); } }
html[data-design="leaders"] .sui-sheet[data-sheet="model"] button[data-value] > small { margin-left:auto; padding-left:12px; color:var(--color-text-secondary); font-size:14px; font-weight:400; font-variant-numeric:tabular-nums; white-space:nowrap; }
html[data-design="leaders"] .sui-extra { border-top:1px solid var(--color-border); margin:4px 0 0; }
html[data-design="leaders"] .sui-extra > summary { display:flex; align-items:center; gap:8px; min-height:44px; padding:0 4px; color:var(--color-text-secondary); font-size:14px; font-weight:500; list-style:none; cursor:pointer; }
html[data-design="leaders"] .sui-extra > summary::-webkit-details-marker { display:none; }
html[data-design="leaders"] .sui-extra > summary > svg:first-child { width:18px; height:18px; }
html[data-design="leaders"] .sui-extra > summary > .sui-pill-chevron { margin-left:auto; transition:transform .16s ease; }
html[data-design="leaders"] .sui-extra[open] > summary > .sui-pill-chevron { transform:rotate(180deg); }
html[data-design="leaders"] .sui-extra-body { display:grid; gap:16px; padding:4px 4px 12px; }

html[data-design="leaders"] .sui-tabbar { display:none; }
@media (max-width:899px) {
  html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-place { display:none; }
  html[data-design="leaders"] .sui-tabbar { position:fixed; z-index:30; left:0; right:0; bottom:0; display:grid; grid-template-columns:repeat(3, 1fr); padding:6px 8px calc(6px + env(safe-area-inset-bottom, 0px)); border-top:1px solid var(--color-border); background:var(--color-bg); }
  html[data-design="leaders"] .sui-tabbar > button { display:grid; justify-items:center; gap:2px; min-height:48px; padding:4px 0; border:0; background:none; color:var(--color-text-secondary); font:inherit; font-size:14px; line-height:16px; font-weight:500; cursor:pointer; }
  html[data-design="leaders"] .sui-tabbar > button > svg { width:24px; height:24px; }
  html[data-design="leaders"] .sui-tabbar > button[aria-current="page"] { color:var(--color-text); font-weight:600; }
  html[data-design="leaders"] #studio-list { padding-bottom:calc(88px + env(safe-area-inset-bottom, 0px)); }
}
html[data-design="leaders"] #studio-list > .sui-filter { align-self:flex-start; margin:8px 0 20px; }
html[data-design="leaders"] .sui-empty { margin:24px 0 0; color:var(--color-text-secondary); font-size:15px; line-height:22px; }
html[data-design="leaders"] .sui-new-project { display:grid; grid-template-columns:44px minmax(0, 1fr); align-items:center; gap:14px; margin-top:8px; padding:14px 16px; border:0; border-radius:16px; background:var(--sui-fill); color:var(--color-text); font:inherit; text-align:left; cursor:pointer; }
html[data-design="leaders"] .sui-new-project > svg { box-sizing:border-box; width:44px; height:44px; padding:11px; border-radius:12px; background:var(--color-text); color:var(--color-bg); }
html[data-design="leaders"] .sui-new-project b { display:block; font-size:17px; line-height:22px; font-weight:600; }
html[data-design="leaders"] .sui-new-project small { display:block; font-size:14px; line-height:20px; color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-projects { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px 12px; margin-top:24px; }
html[data-design="leaders"] .sui-project { display:grid; align-content:start; gap:8px; min-width:0; padding:0; border:0; background:none; color:var(--color-text); font:inherit; text-align:left; cursor:pointer; }
html[data-design="leaders"] .sui-project .sui-work-thumb { aspect-ratio:16 / 10; }
html[data-design="leaders"] .sidebar-studio-place { display:flex; align-items:center; gap:10px; }
html[data-design="leaders"] .sidebar-studio-place > svg { flex:none; width:20px; height:20px; }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-place.active { background:var(--color-active); color:var(--color-text); }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-group { margin:12px 0 4px; padding:0 12px; color:var(--color-text-tertiary); font-size:14px; line-height:20px; font-weight:500; }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-tool { min-height:36px; padding-block:8px; color:var(--color-text-secondary); }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-tool > strong { font-size:14px; line-height:20px; font-weight:400; }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-tool:hover, html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-tool.active { color:var(--color-text); }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-tool.active { background:var(--color-active); }

html[data-design="leaders"] .sidebar-studio-folder { margin-top:4px; }

html[data-design="leaders"] .sidebar-recents.sidebar-studio { padding-top:4px; }
html[data-design="leaders"] .sidebar-recents.sidebar-studio > .sidebar-section-head { margin:0; }
@media (min-width:900px) { html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-tool { min-height:32px; padding-block:6px; } }

html[data-design="leaders"] #sidebar-studio-list { -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - 24px), transparent); mask-image:linear-gradient(to bottom, #000 calc(100% - 24px), transparent); }
html[data-design="leaders"] .sidebar-studio-folder > summary { display:flex; align-items:center; gap:4px; min-height:28px; padding:0 12px; border-radius:8px; color:var(--color-text-tertiary); font-size:14px; line-height:20px; font-weight:500; list-style:none; cursor:pointer; }
html[data-design="leaders"] .sidebar-studio-folder > summary::-webkit-details-marker { display:none; }
html[data-design="leaders"] .sidebar-studio-folder > summary:hover { color:var(--color-text-secondary); }
html[data-design="leaders"] .sidebar-studio-folder > summary > .sidebar-studio-chevron { flex:none; width:14px; height:14px; transform:rotate(-90deg); transition:transform .16s ease; }
html[data-design="leaders"] .sidebar-studio-folder[open] > summary > .sidebar-studio-chevron { transform:none; }
html[data-design="leaders"] #sidebar-studio-list :is(.sidebar-studio-tool, .sidebar-studio-all) { display:flex; align-items:center; gap:10px; }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-tool > svg { flex:none; width:18px; height:18px; }

html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-work { display:flex; align-items:center; gap:10px; min-height:52px; padding-block:6px; }
html[data-design="leaders"] .sidebar-studio-thumb { display:grid; flex:none; place-items:center; width:32px; height:32px; overflow:hidden; border-radius:8px; background:var(--sui-fill, var(--color-active)); color:var(--color-text-tertiary); }
html[data-design="leaders"] .sidebar-studio-thumb > img { width:100%; height:100%; object-fit:cover; }
html[data-design="leaders"] .sidebar-studio-thumb > svg { width:16px; height:16px; }
html[data-design="leaders"] .sidebar-studio-copy { display:grid; flex:1; min-width:0; }
html[data-design="leaders"] .sidebar-studio-line { display:flex; align-items:baseline; gap:8px; min-width:0; }
html[data-design="leaders"] .sidebar-studio-line > strong { flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px; line-height:20px; font-weight:400; }
html[data-design="leaders"] .sidebar-studio-line > time { flex:none; color:var(--color-text-tertiary); font-size:14px; line-height:20px; }
html[data-design="leaders"] .sidebar-chat-list .sidebar-studio-copy > small { display:block; margin:0; color:var(--color-text-tertiary); font-size:14px; line-height:18px; }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-all { min-height:36px; color:var(--color-text-secondary); }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-all > strong { font-size:14px; line-height:20px; font-weight:400; }
html[data-design="leaders"] #sidebar-studio-list .sidebar-studio-all > svg { width:16px; height:16px; }
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"] .sidebar-studio-chevron { transition:none; } }

html[data-design="leaders"] .sui-composer:not(.has-main) { position:static; }

html[data-design="leaders"] .sui-pick { display:grid; gap:12px; align-content:start; }
html[data-design="leaders"] .sui-pick > .sui-empty { margin:0; }
html[data-design="leaders"] .sui-pick > .sui-open-studio { margin-top:0; }
html[data-design="leaders"] .sui-roll-start { display:grid; gap:8px; justify-items:start; }
html[data-design="leaders"] .sui-roll-start > h2 { margin:0; font-size:20px; line-height:26px; font-weight:600; }
html[data-design="leaders"] .sui-roll-start > p { margin:0 0 8px; color:var(--color-text-secondary); font-size:15px; line-height:22px; }
html[data-design="leaders"] .sui-roll-start > .composition-primary { display:inline-flex; align-items:center; gap:8px; }
html[data-design="leaders"] .sui-roll-start > .composition-primary > svg { width:20px; height:20px; }
html[data-design="leaders"] .sui-gallery-title { display:flex; align-items:baseline; gap:8px; margin:0 0 12px; font-size:20px; line-height:26px; font-weight:600; }
html[data-design="leaders"] .sui-gallery-title > span { font-size:15px; font-weight:400; color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-works { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:16px 12px; }

html[data-design="leaders"] #studio-new { display:none; }
html[data-design="leaders"] .sui-work { display:grid; align-content:start; gap:8px; min-width:0; padding:0; border:0; background:none; color:var(--color-text); font:inherit; text-align:left; cursor:pointer; }
html[data-design="leaders"] .sui-work-thumb { position:relative; display:grid; place-items:center; overflow:hidden; aspect-ratio:1; border-radius:12px; background:var(--sui-fill); color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-work-thumb > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
html[data-design="leaders"] .sui-work-thumb > svg { width:28px; height:28px; }
html[data-design="leaders"] .sui-work.is-busy .sui-work-thumb::before { content:""; position:absolute; inset:0; background:linear-gradient(100deg, transparent 30%, color-mix(in srgb, var(--color-text) 8%, transparent) 50%, transparent 70%); background-size:200% 100%; animation:skeleton-pulse 1.4s ease-in-out infinite; }
html[data-design="leaders"] .sui-work-copy { display:grid; gap:2px; min-width:0; }
html[data-design="leaders"] .sui-work-copy > b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; line-height:20px; font-weight:500; }
html[data-design="leaders"] .sui-work-copy > small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; line-height:20px; color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-work > .sui-work-copy > small { display:flex; min-width:0; }
html[data-design="leaders"] .sui-work > .sui-work-copy > small > span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
html[data-design="leaders"] .sui-work > .sui-work-copy > small > time { flex:none; white-space:pre; }
html[data-design="leaders"] .sui-work.is-failed .sui-work-copy > small { color:var(--color-text); }
html[data-design="leaders"] .sui-works:has(> .sui-work[data-kind="sound"]:only-child) { grid-template-columns:1fr; gap:4px; }
html[data-design="leaders"] .sui-works[data-kind="all"] .sui-work[data-kind="sound"] .sui-work-thumb > svg { width:32px; height:32px; color:var(--color-text); }
html[data-design="leaders"] .sui-pill.is-static { cursor:default; }

html[data-design="leaders"] .sui-tile.has-poster .sui-tile-art { overflow:hidden; background:var(--sui-fill); }
html[data-design="leaders"] .sui-tile.has-poster .sui-tile-art > img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
html[data-design="leaders"] .sui-tile.has-poster:hover .sui-tile-art > img { transform:scale(1.03); }

html[data-design="leaders"] :is(.sui-pill, .sui-sheet button[data-value]) > .model-pill-mark { display:grid; place-items:center; flex:none; width:20px; height:20px; }
html[data-design="leaders"] :is(.sui-pill, .sui-sheet button[data-value]) > .model-pill-mark .model-brand { width:20px; height:20px; margin:0; background:none; }
html[data-design="leaders"] :is(.sui-pill, .sui-sheet button[data-value]) > .model-pill-mark svg { width:18px; height:18px; }

html[data-design="leaders"] .sui-attach { margin:0 0 8px; }
html[data-design="leaders"] .sui-attach > .composition-field-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
html[data-design="leaders"] .sui-attach > .composition-detail-actions { margin:0; }
html[data-design="leaders"] .sui-attach .composition-secondary { min-height:34px; padding:0 12px; border:0; border-radius:var(--radius-pill); background:var(--sui-fill); font-size:14px; font-weight:500; }
html[data-design="leaders"] .sui-lede { margin:-4px 0 16px; color:var(--color-text-secondary); font-size:15px; line-height:22px; }
@media (prefers-reduced-motion: reduce) { html[data-design="leaders"] .sui-tile.has-poster .sui-tile-art > img { transition:none; } }

@media (max-height:720px) {
  html[data-design="leaders"] .sui-composer-card { gap:var(--space-2); padding:var(--space-2) var(--space-3); }
  html[data-design="leaders"] .sui-composer .sui-words textarea { min-height:28px; }
}
html[data-design="leaders"] .sui-composer-foot > .composition-note { margin:8px 0 0; font-size:14px; line-height:20px; color:var(--color-text-secondary); text-align:center; }
html[data-design="leaders"] .sui-balance { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; column-gap:12px; margin:4px 0 0; font-size:14px; line-height:20px; color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-balance > button { min-height:44px; padding:0 4px; border:0; background:none; color:var(--color-text); font:inherit; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
@media (min-width:768px) {
  html[data-design="leaders"] :is(.sui-works, .sui-projects) { grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:24px 16px; }
  html[data-design="leaders"] .sui-projects { grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); }
}

@media (min-width:768px) {
  html[data-design="leaders"] .sui-tiles { grid-template-columns:repeat(auto-fill, minmax(168px, 1fr)); gap:16px; }
  html[data-design="leaders"] .sui-tile-copy > b { font-size:17px; line-height:22px; }
}

@media (min-width:1100px) {
  html[data-design="leaders"] #screen-studio { padding-inline:40px; }
  html[data-design="leaders"] .sui-tiles { grid-template-columns:repeat(6, minmax(0, 1fr)); gap:12px; }
  html[data-design="leaders"] .sui-tile-copy > b { font-size:15px; line-height:20px; }
}
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"] .sui-work.is-busy .sui-work-thumb::before { animation:none; } }

@media (max-width:767px) {
  html[data-design="leaders"]:not([data-serpent-frame]) #sidebar { padding-bottom:max(var(--space-2), var(--edge-bottom)); }
  html[data-design="leaders"]:not([data-serpent-frame]) #sidebar > .new-chat-button { order:1; align-self:stretch; width:auto; min-height:48px; margin:var(--space-2) 0 0; padding:0 var(--space-4); justify-content:center; gap:var(--space-2); border-radius:999px; background:var(--color-elevated); background-image:none; color:var(--color-text); font-weight:var(--weight-semibold); box-shadow:inset 0 0 0 1px var(--color-border); }
  html[data-design="leaders"]:not([data-serpent-frame]) #sidebar > .sidebar-footer { order:2; }
}


html[data-design="leaders"] .sui-tile { position:relative; display:block; aspect-ratio:4 / 5; isolation:isolate; border-radius:18px; background:linear-gradient(150deg, var(--sui-bg1), var(--sui-bg2)); box-shadow:inset 0 0 0 1px rgb(255 255 255 / .06), 0 1px 2px rgb(0 0 0 / .3), 0 12px 28px -12px rgb(0 0 0 / .55); transition:transform .2s ease, box-shadow .2s ease; }
html[data-design="leaders"] .sui-tile > .sui-tile-art { position:absolute; inset:0; z-index:-1; aspect-ratio:auto; overflow:hidden; border-radius:inherit; background:none; }
html[data-design="leaders"] .sui-tile > .sui-tile-art > video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:45% 40%; opacity:0; transition:opacity .25s ease; }
html[data-design="leaders"] .sui-tile.is-playing > .sui-tile-art > video { opacity:1; }
html[data-design="leaders"] .sui-tile::after { content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; background:linear-gradient(to top, rgb(0 0 0 / .86) 0%, rgb(0 0 0 / .62) 24%, rgb(0 0 0 / 0) 42%); pointer-events:none; }
html[data-design="leaders"] .sui-tile > .sui-tile-copy { position:absolute; inset:auto 0 0 0; gap:2px; padding:12px 14px 14px; color:#fff; }
html[data-design="leaders"] .sui-tile > .sui-tile-copy > b { font-size:16px; line-height:21px; text-shadow:0 1px 8px rgb(0 0 0 / .35); }
html[data-design="leaders"] .sui-tile > .sui-tile-copy > small { display:block; font-size:14px; line-height:19px; color:rgb(255 255 255 / .78); }
html[data-design="leaders"] .sui-tile > .sui-tile-copy > em { margin-top:6px; font-size:14px; line-height:19px; font-weight:500; color:rgb(255 255 255 / .92); }
html[data-design="leaders"] .sui-tile:hover { background:linear-gradient(150deg, var(--sui-bg1), var(--sui-bg2)); transform:translateY(-2px); box-shadow:inset 0 0 0 1px rgb(255 255 255 / .1), 0 2px 4px rgb(0 0 0 / .3), 0 18px 36px -14px rgb(0 0 0 / .6); }
@media (min-width:768px) and (max-width:1099px) { html[data-design="leaders"] .sui-tiles { grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:14px; } }
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"] .sui-tile, html[data-design="leaders"] .sui-tile > .sui-tile-art > video { transition:none; } html[data-design="leaders"] .sui-tile:hover { transform:none; } }
html[data-design="leaders"][data-theme="light"] :is(#screen-studio, #screen-composition) { --sui-warm:#FFFFFF; --color-bg:var(--sui-warm); background:var(--sui-warm); --sui-fill:color-mix(in srgb, #000 6%, transparent); }
html[data-design="leaders"][data-theme="light"] .sui-tile { box-shadow:0 1px 2px rgb(0 0 0 / .06), 0 8px 24px rgb(0 0 0 / .10); }
@media (prefers-color-scheme: light) {
  html[data-design="leaders"]:not([data-theme="dark"]) :is(#screen-studio, #screen-composition) { --sui-warm:#FFFFFF; --color-bg:var(--sui-warm); background:var(--sui-warm); --sui-fill:color-mix(in srgb, #000 6%, transparent); }
  html[data-design="leaders"]:not([data-theme="dark"]) .sui-tile { box-shadow:0 1px 2px rgb(0 0 0 / .06), 0 8px 24px rgb(0 0 0 / .10); }
}

@media (min-width:1100px) { html[data-design="leaders"] .sui-tiles { grid-template-columns:repeat(5, minmax(0, 1fr)); gap:16px; } }

html[data-design="leaders"] .sui-tile.is-icon, html[data-design="leaders"] .sui-tile.is-icon:hover { --sui-card:#1f2023; background:var(--sui-card); }
html[data-design="leaders"] .sui-tile.is-icon::after { content:none; }
html[data-design="leaders"] .sui-tile.is-icon > .sui-tile-art { display:flex; justify-content:center; align-items:flex-start; padding-top:14%; box-sizing:border-box; }
html[data-design="leaders"] .sui-tile-icon { display:grid; place-items:center; width:64px; height:64px; border-radius:18px; background:rgb(255 255 255 / .05); box-shadow:inset 0 0 0 1px rgb(255 255 255 / .07); color:rgb(255 255 255 / .62); }
html[data-design="leaders"] .sui-tile-icon > svg { width:32px; height:32px; }
html[data-design="leaders"] .sui-tile.is-icon > .sui-tile-copy > b { text-shadow:none; }
html[data-design="leaders"][data-theme="light"] .sui-tile.is-icon { --sui-card:#F5F5F7; }
html[data-design="leaders"][data-theme="light"] .sui-tile.is-icon > .sui-tile-copy { color:#1D1D1F; }
html[data-design="leaders"][data-theme="light"] .sui-tile.is-icon > .sui-tile-copy > :is(small, em) { color:#6E6E73; }
html[data-design="leaders"][data-theme="light"] .sui-tile-icon { background:rgb(255 255 255 / .7); box-shadow:inset 0 0 0 1px rgb(0 0 0 / .06); color:rgb(0 0 0 / .55); }
@media (prefers-color-scheme: light) {
  html[data-design="leaders"]:not([data-theme="dark"]) .sui-tile.is-icon { --sui-card:#F5F5F7; }
  html[data-design="leaders"]:not([data-theme="dark"]) .sui-tile.is-icon > .sui-tile-copy { color:#1D1D1F; }
  html[data-design="leaders"]:not([data-theme="dark"]) .sui-tile.is-icon > .sui-tile-copy > :is(small, em) { color:#6E6E73; }
  html[data-design="leaders"]:not([data-theme="dark"]) .sui-tile-icon { background:rgb(255 255 255 / .7); box-shadow:inset 0 0 0 1px rgb(0 0 0 / .06); color:rgb(0 0 0 / .55); }
}

html[data-design="leaders"][data-theme="light"] :is(.composition-choice button[aria-pressed="true"], .composition-chip[aria-pressed="true"], .studio-voice-play[aria-pressed="true"], .studio-voice-check) { color:var(--color-text); }
@media (prefers-color-scheme: light) {
  html[data-design="leaders"]:not([data-theme="dark"]) :is(.composition-choice button[aria-pressed="true"], .composition-chip[aria-pressed="true"], .studio-voice-play[aria-pressed="true"], .studio-voice-check) { color:var(--color-text); }
}

html[data-design="leaders"] #studio-list[data-sui-view="works"]:has(> .sui-empty:only-of-type) { justify-content:center; align-items:center; text-align:center; min-height:60vh; }
html[data-design="leaders"] #studio-list[data-sui-view="works"] > .sui-empty { max-width:28ch; font-size:15px; line-height:22px; color:var(--color-text-secondary); }
html[data-design="leaders"] #studio-list[data-sui-view="works"] > .sui-open-studio { align-self:center; }

html[data-design="leaders"] .sui-upsell { display:grid; gap:10px; }
html[data-design="leaders"] .sui-upsell > p { margin:0 0 6px; color:var(--color-text-secondary); font-size:15px; line-height:22px; }
html[data-design="leaders"] .sui-upsell > button { display:flex; align-items:center; justify-content:center; width:100%; min-height:48px; }


html[data-design="leaders"] .sui-howto { margin:0 0 var(--space-4); padding:var(--space-3) var(--space-4); border-radius:20px; background:color-mix(in srgb, var(--sui-a, var(--color-accent)) 9%, var(--color-surface)); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--sui-a, var(--color-accent)) 26%, transparent); }
html[data-design="leaders"] .sui-howto > summary { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px var(--space-2); min-height:28px; cursor:pointer; list-style:none; }
html[data-design="leaders"] .sui-howto > summary::-webkit-details-marker { display:none; }
html[data-design="leaders"] .sui-howto-title { font-size:16px; line-height:22px; font-weight:600; color:var(--color-text); }
html[data-design="leaders"] .sui-howto-title::before { content:""; display:inline-block; width:8px; height:8px; margin-right:8px; border-radius:50%; background:var(--sui-a, var(--color-accent)); vertical-align:2px; }
html[data-design="leaders"] .sui-howto > summary > small { font-size:14px; line-height:20px; color:var(--color-text-secondary); font-variant-numeric:tabular-nums; }
html[data-design="leaders"] .sui-howto:not([open]) > summary > small { display:none; }
html[data-design="leaders"] .sui-howto-steps { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:var(--space-3); margin:var(--space-3) 0 0; padding:0; list-style:none; counter-reset:howto; }
html[data-design="leaders"] .sui-howto-step { display:grid; gap:6px; min-width:0; font-size:14px; line-height:19px; color:var(--color-text); counter-increment:howto; }
html[data-design="leaders"] .sui-howto-step > span:last-child::before { content:counter(howto) ". "; color:var(--sui-a, var(--color-accent)); font-weight:600; }
html[data-design="leaders"] .sui-howto-note { margin:var(--space-2) 0 0; color:var(--color-text-tertiary); font-size:14px; line-height:19px; }
html[data-design="leaders"] .sui-howto-steps + .sui-howto-note { margin-top:var(--space-3); }
html[data-design="leaders"] .sui-howto-pic { display:grid; place-items:center; aspect-ratio:16 / 9; overflow:hidden; border-radius:14px; background:var(--sui-fill, rgba(127,127,127,.12)); }
html[data-design="leaders"] .sui-howto-pic > img { width:100%; height:100%; object-fit:cover; }
html[data-design="leaders"] .sui-howto-pic > .sui-howto-btn { flex:none; gap:6px; max-width:calc(100% - 20px); min-height:38px; padding-inline:12px; white-space:nowrap; font-size:14px; pointer-events:none; }
html[data-design="leaders"] .sui-howto-pic > .sui-howto-rows { width:calc(100% - 16px); margin:0; pointer-events:none; }
html[data-design="leaders"] .sui-howto-pic > .sui-howto-pill { pointer-events:none; }
html[data-design="leaders"] :is(#screen-studio, #screen-composition) .sui-howto-pic > .sui-howto-tabs > button { flex:1 1 auto; min-width:0; padding-inline:0; font-size:14px; overflow:hidden; text-overflow:ellipsis; }
html[data-design="leaders"] .sui-howto-audio .mp-seek { min-width:0; }
html[data-design="leaders"] .sui-howto-btn > svg { width:18px; height:18px; flex:none; }
html[data-design="leaders"] .sui-howto-rows .composition-row { min-height:0; padding:6px 8px; gap:8px; }
html[data-design="leaders"] .sui-howto-rows .composition-row-index { width:26px; height:26px; }
html[data-design="leaders"] .sui-howto-rows .composition-row-chevron { width:12px; height:12px; }
html[data-design="leaders"] .sui-howto-rows .composition-row-body b { font-size:14px; white-space:normal; overflow:visible; }
html[data-design="leaders"] .sui-howto-rows .composition-row-body small { font-size:14px; }
html[data-design="leaders"] :is(#screen-studio, #screen-composition) .sui-howto-pic > .sui-howto-tabs { display:flex; width:100%; max-width:none; margin:0; padding:0; gap:0; pointer-events:none; }
html[data-design="leaders"] .sui-howto-pic > .sui-howto-audio { width:calc(100% - 16px); min-width:0; pointer-events:none; }
html[data-design="leaders"] .sui-howto-ask { margin:12px; padding:10px 12px; border-radius:12px; background:var(--color-surface); box-shadow:var(--shadow-composer, 0 1px 3px rgba(0,0,0,.2)); font-size:14px; line-height:19px; color:var(--color-text); }
html[data-design="leaders"] .sui-howto-ask::after { content:""; display:inline-block; width:1.5px; height:16px; margin-left:2px; background:var(--sui-a, var(--color-accent)); vertical-align:-3px; }
html[data-design="leaders"] .sui-howto:not([open]) .sui-howto-ok { display:none; }
html[data-design="leaders"] .sui-howto-ok { margin-left:auto; align-self:center; min-height:32px; padding:0 var(--space-4); border:0; border-radius:18px; background:color-mix(in srgb, var(--sui-a, var(--color-accent)) 18%, transparent); color:var(--color-text); font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
@media (max-width:640px) {
  html[data-design="leaders"] .sui-howto-steps { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; margin-inline:calc(-1 * var(--space-4)); padding-inline:var(--space-4); scrollbar-width:none; }
  
  html[data-design="leaders"] .sui-howto-step { flex:0 0 160px; scroll-snap-align:start; }
}

html[data-design="leaders"] .sui-howto-pic.is-live { place-items:start stretch; padding:8px; }
html[data-design="leaders"] .sui-howto-pic.is-live > .sui-composer { zoom:.5; position:static; margin:0; padding:0; background:none; pointer-events:none; }
html[data-design="leaders"] .sui-howto-field { display:block; min-height:52px; padding:var(--space-1); color:var(--color-text); font-size:var(--text-body, 16px); line-height:1.4; }
html[data-design="leaders"] .sui-howto-field.is-empty { color:var(--color-text-tertiary); }


html[data-design="leaders"] :is(#screen-studio, #screen-composition) {
  --sui-l1:#1d1f23; --sui-l2:var(--color-surface); --sui-l3:#2e3136;
  --sui-hair:rgb(255 255 255 / .07); --sui-lift:inset 0 1px 0 rgb(255 255 255 / .05);
  --sui-drop:0 1px 2px rgb(0 0 0 / .35), 0 12px 28px -16px rgb(0 0 0 / .6);
  --sui-gap:16px;
}
html[data-design="leaders"][data-theme="light"] :is(#screen-studio, #screen-composition) { --sui-l1:#fcfcfc; --sui-l2:#fff; --sui-l3:#ededed; --sui-hair:rgb(0 0 0 / .1); --sui-lift:inset 0 1px 0 rgb(255 255 255 / .9); --sui-drop:0 1px 2px rgb(0 0 0 / .06), 0 12px 24px -16px rgb(0 0 0 / .24); }
@media (prefers-color-scheme: light) {
  html[data-design="leaders"]:not([data-theme="dark"]) :is(#screen-studio, #screen-composition) { --sui-l1:#fcfcfc; --sui-l2:#fff; --sui-l3:#ededed; --sui-hair:rgb(0 0 0 / .1); --sui-lift:inset 0 1px 0 rgb(255 255 255 / .9); --sui-drop:0 1px 2px rgb(0 0 0 / .06), 0 12px 24px -16px rgb(0 0 0 / .24); }
}
@media (min-width:900px) { html[data-design="leaders"] :is(#screen-studio, #screen-composition) { --sui-gap:24px; } }


html[data-design="leaders"] .sui-tool .composition-detail { gap:var(--sui-gap); }
html[data-design="leaders"] #screen-composition .sui-tool .composition-detail-head { min-height:44px; margin:0; }
html[data-design="leaders"] .sui-tool .composition-detail-body:has(> .sui-composer) { gap:var(--sui-gap); }
html[data-design="leaders"] .sui-tool :is(.sui-lede, .sui-howto, .sui-examples) { margin:0; }
html[data-design="leaders"] .sui-examples { gap:12px; }


html[data-design="leaders"] .sui-howto { padding:16px; border-radius:20px; background:linear-gradient(180deg, color-mix(in srgb, var(--sui-a, var(--color-accent)) 7%, var(--sui-l2)), color-mix(in srgb, var(--sui-a, var(--color-accent)) 3%, var(--sui-l1))); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--sui-a, var(--color-accent)) 16%, var(--sui-hair)), var(--sui-lift), var(--sui-drop); }
html[data-design="leaders"] .sui-howto-steps { gap:16px; margin-top:16px; }
html[data-design="leaders"] .sui-howto-step { gap:8px; align-content:start; }
html[data-design="leaders"] .sui-howto-step > span:last-child { min-width:0; overflow-wrap:break-word; }
html[data-design="leaders"] .sui-howto-pic { border-radius:12px; background:var(--sui-l1); border:1px solid var(--sui-hair); box-sizing:border-box; }

html[data-design="leaders"] .sui-howto-pic.is-live { place-items:center stretch; padding:8px; }
html[data-design="leaders"] .sui-howto-pic.is-live > .sui-composer { zoom:.56; gap:8px; }
html[data-design="leaders"] .sui-howto-pic.is-live > .sui-composer::before { content:none; }
html[data-design="leaders"] .sui-howto-pic.is-live .sui-composer-card { gap:8px; padding:12px; }
html[data-design="leaders"] .sui-howto-pic.is-live :is(.sui-attach, .composition-photos, .sui-pills > .sui-pill ~ .sui-pill) { display:none; }
html[data-design="leaders"] .sui-howto-pic.is-live .sui-howto-field { min-height:0; }
@media (max-width:640px) {
  html[data-design="leaders"] .sui-howto-steps { display:grid; grid-template-columns:none; gap:12px; margin-inline:0; padding-inline:0; overflow:visible; }
  html[data-design="leaders"] .sui-howto-step { display:grid; grid-template-columns:128px minmax(0, 1fr); align-items:center; gap:12px; }
  html[data-design="leaders"] .sui-howto-pic { height:72px; }
  html[data-design="leaders"] .sui-howto-pic.is-live { padding:6px; }
  html[data-design="leaders"] .sui-howto-pic.is-live > .sui-composer { zoom:.36; }
}


html[data-design="leaders"] .sui-composer-card { background:linear-gradient(180deg, var(--sui-l2), color-mix(in srgb, var(--sui-l2) 60%, var(--sui-l1))); box-shadow:inset 0 0 0 1px var(--sui-hair), var(--sui-lift), var(--shadow-composer); }
html[data-design="leaders"] .sui-tool .composition-detail-body > .sui-composer.has-main { background:var(--color-bg); }
html[data-design="leaders"] .sui-tool .composition-detail-body > .sui-composer.has-main::before { content:""; position:absolute; left:0; right:0; bottom:100%; height:24px; background:linear-gradient(to bottom, transparent, var(--color-bg)); pointer-events:none; }
html[data-design="leaders"] #screen-composition :is(.sui-pill, .sui-attach .composition-secondary) { background:var(--sui-l3); box-shadow:inset 0 0 0 1px var(--sui-hair); }


html[data-design="leaders"] .sui-example > .sui-tile-art { border:1px solid var(--sui-hair); box-sizing:border-box; box-shadow:var(--sui-drop); }
@media (max-width:767px) {
  html[data-design="leaders"] .sui-examples-row { gap:8px; -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 64px), transparent calc(100% - 8px)); mask-image:linear-gradient(to right, #000 calc(100% - 64px), transparent calc(100% - 8px)); }
  html[data-design="leaders"] .sui-examples-row > .sui-example { flex:0 0 calc((100% - 56px) / 2); }
}


html[data-design="leaders"] .sui-tile { box-shadow:inset 0 0 0 1px rgb(255 255 255 / .07), inset 0 1px 0 rgb(255 255 255 / .08), var(--sui-drop); }
html[data-design="leaders"] .sui-tile > .sui-tile-copy > b { display:flex; align-items:flex-end; min-height:42px; }
html[data-design="leaders"] .sui-tile > .sui-tile-copy > small { min-height:38px; }

html[data-design="leaders"] .sui-tile.is-split > .sui-tile-copy { inset:0; grid-template-rows:1fr; align-content:stretch; }
html[data-design="leaders"] .sui-tile.is-split > .sui-tile-copy::before { content:""; margin:-12px -14px 0; pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Ccircle cx='15' cy='15' r='15' fill='%23fff' fill-opacity='.96'/%3E%3Cpath d='M5 15l6-5v10zM25 15l-6-5v10z' fill='%23141414'/%3E%3C/svg%3E") center / 28px 28px no-repeat,
    linear-gradient(rgb(255 255 255 / .92), rgb(255 255 255 / .92)) center / 2px 100% no-repeat;
  -webkit-mask-image:linear-gradient(#000 calc(100% - 40px), transparent calc(100% - 8px)); mask-image:linear-gradient(#000 calc(100% - 40px), transparent calc(100% - 8px)); }
@media (min-width:900px) and (max-width:1099px) {
  html[data-design="leaders"] :is(#screen-studio, #screen-composition) { padding-inline:32px; }
  html[data-design="leaders"] .sui-tiles { grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px; }
  html[data-design="leaders"] #screen-composition { padding-top:16px; }
}

@media (min-width:641px) and (max-height:720px) {
  html[data-design="leaders"] :is(#screen-studio, #screen-composition) { --sui-gap:16px; }
  html[data-design="leaders"] .sui-howto-pic { aspect-ratio:auto; height:96px; }
  html[data-design="leaders"] .sui-howto-steps { margin-top:12px; }
}

html[data-design="leaders"] .sui-tile::after { background:linear-gradient(to top, rgb(0 0 0 / .9) 0%, rgb(0 0 0 / .84) 34%, rgb(0 0 0 / .56) 50%, rgb(0 0 0 / .2) 60%, rgb(0 0 0 / 0) 70%); }

html[data-design="leaders"] .sui-tile-caption { position:absolute; inset:22% 8% auto; text-align:center; color:#fff; font-size:15px; line-height:20px; font-weight:600; text-wrap:balance;
  text-shadow:0 0 2px rgb(0 0 0 / .9), 0 0 2px rgb(0 0 0 / .9), 0 1px 3px rgb(0 0 0 / .7); pointer-events:none; }

@media (min-width:768px) and (max-width:1099px) { html[data-design="leaders"] .sui-tiles { grid-template-columns:repeat(4, minmax(0, 1fr)); } }
@media (max-width:767px) {
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(2n+3)) > :first-child { grid-column:1 / -1; aspect-ratio:8 / 5; }
}
@media (min-width:768px) and (max-width:1099px) {
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(4n+5)) > :first-child { grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(4n+6)) > :nth-child(-n+2) { grid-column:span 2; grid-row:span 2; }
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(4n+3)) > :first-child { grid-column:span 2; aspect-ratio:auto; }
}
@media (min-width:1100px) {
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(5n+6)) > :first-child,
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(5n+7)) > :first-child { grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(5n+6)) > :nth-child(2),
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(5n+3)) > :nth-child(-n+2),
  html[data-design="leaders"] .sui-tiles:has(> :last-child:nth-child(5n+4)) > :first-child { grid-column:span 2; aspect-ratio:auto; }
}

@media (min-width:1100px) { html[data-design="leaders"] #screen-composition:has(.sui-tool) { padding-top:16px; } }
html[data-design="leaders"] .sui-tool .composition-detail-head + .composition-detail-body:has(> .sui-above:first-child > .sui-lede:first-child) { margin-top:calc(-1 * var(--sui-gap) - 6px); }


html[data-design="leaders"] .sui-tool .composition-detail { min-height:0; }
html[data-design="leaders"] .sui-tool .composition-detail-body:has(> .sui-above) { min-height:0; overflow:hidden; }
html[data-design="leaders"] .sui-above { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; display:flex; flex-direction:column; gap:var(--sui-gap); margin-inline:calc(-1 * var(--space-4)); padding:0 var(--space-4) var(--space-2); }
html[data-design="leaders"] .sui-tool .composition-detail-body > .sui-above + .sui-composer { position:relative; margin-top:0; }
html[data-design="leaders"] .sui-tool .composition-detail-body > .sui-above + .sui-composer::before { content:none; }
html[data-design="leaders"] .sui-howto[open] ~ .sui-examples { display:none; }
html[data-design="leaders"] .sui-tool .is-flow .composition-detail-body:has(> .sui-above) { overflow:visible; }
html[data-design="leaders"] .sui-tool .is-flow .sui-above { flex:none; overflow:visible; }

@media (min-width:641px) and (max-height:720px) {
  html[data-design="leaders"] .sui-above .sui-examples { gap:8px; margin-bottom:0; }
  html[data-design="leaders"] .sui-above .sui-example > .sui-tile-art { aspect-ratio:auto; height:80px; }
  html[data-design="leaders"] .sui-above { padding-bottom:0; }
  html[data-design="leaders"] .sui-tool .composition-detail-body:has(> .sui-above) { gap:8px; }
  html[data-design="leaders"] .sui-above > .sui-howto:not([open]) { padding-block:10px; }
  html[data-design="leaders"] .sui-above .sui-example > span:last-child { -webkit-line-clamp:1; }
  html[data-design="leaders"] #screen-composition .sui-above + .sui-composer .composition-primary { min-height:44px; }
  html[data-design="leaders"] .sui-above ~ .sui-composer-foot > .composition-note { margin-top:0; }
  html[data-design="leaders"] .sui-above ~ .sui-composer-foot > .sui-balance { margin-top:0; }
}

@media (min-width:641px) and (max-height:720px) {
  html[data-design="leaders"] .conversation-screen.is-empty > .messages { padding-top:8px; }
}
@media (max-width:640px) {
  html[data-design="leaders"] .sui-howto-pic.is-live { aspect-ratio:auto; height:auto; min-height:72px; }
}

html[data-design="leaders"] .composition-music-take:has(> .composition-music-cover) { display:grid; grid-template-columns:64px minmax(0, 1fr); column-gap:12px; align-items:center; }
html[data-design="leaders"] .composition-music-take:has(> .composition-music-cover) > :not(.composition-music-cover, .mp) { grid-column:1 / -1; }
html[data-design="leaders"] .composition-music-cover { width:64px; border-radius:12px; }
html[data-design="leaders"] .sui-howto-pic:has(> .sui-howto-cover) { display:flex; align-items:center; gap:10px; padding:0 10px; }
html[data-design="leaders"] .sui-howto-pic > .sui-howto-cover { width:48px; height:48px; flex:none; border-radius:10px; }
html[data-design="leaders"] .sui-howto-pic:has(> .sui-howto-cover) > .sui-howto-audio { flex:1 1 auto; width:auto; }

@media (min-width:641px) {
  html[data-design="leaders"] .sui-howto-steps:has(> :nth-child(4):last-child) { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
html[data-design="leaders"] :is(#screen-studio, #screen-composition) .sui-howto-pic > .sui-howto-tabs { width:calc(100% - 16px); padding:3px; border-radius:10px; }
html[data-design="leaders"] :is(#screen-studio, #screen-composition) .sui-howto-pic > .sui-howto-tabs > button { padding:6px 3px; font-size:14px; border-radius:9px; zoom:.786; }

html[data-design="leaders"] .avatar-tool.sui-tool .composition-detail-body { padding:0; background:none; border-radius:0; }
html[data-design="leaders"] .avatar-tool.sui-tool [data-avatar-script] { min-height:120px; padding:12px 14px; border:1px solid var(--sui-hair); border-radius:16px; background:var(--sui-l1); box-shadow:var(--sui-lift); font-size:var(--text-body, 16px); resize:none; field-sizing:content; max-height:40vh; }
html[data-design="leaders"] .avatar-tool.sui-tool [data-avatar-script]:focus { outline-color:transparent; border-color:color-mix(in srgb, var(--color-text) 24%, transparent); }

@media (max-width:640px) {
  html[data-design="leaders"] :is(#screen-studio, #screen-composition) .sui-howto-pic > .sui-howto-tabs { flex-direction:column; gap:2px; width:calc(100% - 20px); }
  html[data-design="leaders"] :is(#screen-studio, #screen-composition) .sui-howto-pic > .sui-howto-tabs > button { flex:none; min-height:0; height:auto; padding:4px 8px; font-size:14px; line-height:1.2; zoom:.75; }
  
  html[data-design="leaders"] .sui-howto-pic > .sui-howto-ask { margin:10px; padding:8px 10px; border-radius:11px; font-size:14px; line-height:18px; zoom:.786; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
}


html[data-design="leaders"] #screen-composition .sui-hero .composition-detail-body:has(> .sui-composer) { align-items:center; gap:0; padding:clamp(24px, 9vh, 88px) 0 var(--space-8); }

html[data-design="leaders"] #screen-composition .composition-layout.is-tool:has(> .sui-hero) { grid-template-columns:minmax(0, 880px); }
html[data-design="leaders"] #screen-composition .sui-hero .composition-detail-body > * { width:100%; max-width:none; }

html[data-design="leaders"] #screen-composition .sui-hero .composition-detail-body > .composition-field:has(+ .sui-composer) { margin-bottom:var(--space-3); }
html[data-design="leaders"] .sui-hero-title { display:grid; justify-items:center; gap:6px; margin-bottom:24px; text-align:center; }
html[data-design="leaders"] .sui-hero-title > h3 { margin:0; font-size:28px; line-height:34px; font-weight:600; letter-spacing:-.02em; color:var(--color-text); }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link { width:100%; margin:0; padding:0; border-radius:0; background:none; box-shadow:none; }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link > summary { justify-content:center; min-height:24px; }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link .sui-howto-title { font-size:14px; line-height:20px; font-weight:500; color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link .sui-howto-title::before { display:none; }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link .sui-howto-title::after { content:""; display:inline-block; width:14px; height:14px; margin-left:4px; vertical-align:-2px; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9.75 5 5 5-5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9.75 5 5 5-5'/%3E%3C/svg%3E") center / contain no-repeat; transition:transform .16s ease; }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link[open] .sui-howto-title::after { transform:rotate(180deg); }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link:hover .sui-howto-title { color:var(--color-text); }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link > summary > :is(small, .sui-howto-ok) { display:none; }
html[data-design="leaders"] .sui-hero-title > .sui-howto.is-link > .sui-howto-steps { margin-top:12px; padding:12px; border-radius:20px; background:var(--sui-fill); text-align:left; }

html[data-design="leaders"] #screen-composition .sui-hero .sui-composer { position:static; margin:0; padding:0; background:none; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card { display:flex; flex-wrap:wrap; align-items:center; gap:10px 6px; padding:16px 12px 12px 16px; border-radius:28px; box-shadow:inset 0 0 0 1px var(--color-border), var(--shadow-composer); }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card > :not(.sui-pills, .sui-refs, .composition-detail-actions) { flex:1 0 100%; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .sui-words textarea { min-height:24px; padding:0; font-size:16px; line-height:24px; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-extra > summary, html[data-design="leaders"] #screen-composition .sui-hero .sui-extra:not([open]) { display:none; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-extra { margin:0; padding-top:12px; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card > .composition-detail-actions { display:flex; flex-wrap:nowrap; align-items:center; gap:6px; margin:0 0 0 auto; padding:0; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card > .composition-detail-actions > .composition-why { display:none; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary { width:auto; min-height:40px; gap:8px; padding:0 4px 0 16px; border-radius:999px; font-size:14px; font-weight:600; font-variant-numeric:tabular-nums; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary::after { content:""; flex:none; width:32px; height:32px; border-radius:50%; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 18.5V5.75'/%3E%3Cpath d='m6.5 11.25 5.5-5.5 5.5 5.5'/%3E%3C/svg%3E") center / 18px no-repeat, linear-gradient(#000 0 0); mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 18.5V5.75'/%3E%3Cpath d='m6.5 11.25 5.5-5.5 5.5 5.5'/%3E%3C/svg%3E") center / 18px no-repeat, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary:disabled { opacity:1; background:var(--sui-fill); color:var(--color-text-secondary); }
html[data-design="leaders"] .sui-mic { display:grid; place-items:center; flex:none; width:40px; height:40px; padding:0; border:0; border-radius:50%; background:none; color:var(--color-text-secondary); cursor:pointer; transition:background-color .16s ease, color .16s ease; }
html[data-design="leaders"] .sui-mic > svg { width:20px; height:20px; }
html[data-design="leaders"] .sui-mic:hover { background:var(--sui-fill); color:var(--color-text); }
html[data-design="leaders"] .sui-mic.is-on { background:#ff453a; color:#fff; }


html[data-design="leaders"] :is(.sui-pills, .sui-composer-card) > .sui-refs { display:contents; }
html[data-design="leaders"] :is(.sui-pills, .sui-composer-card) > .sui-refs > .composition-field-label { display:none; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card > .sui-refs { display:flex; flex:none; align-items:center; gap:6px; }

html[data-design="leaders"] #screen-composition .composition-layout:has(> .sui-hero) .composition-detail-back { margin-left:-14px; }
html[data-design="leaders"] :is(.sui-pills, .sui-composer-card) > .sui-refs .composition-refs { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0; padding:0; border:0; background:none; }
html[data-design="leaders"] :is(.sui-pills, .sui-composer-card) > .sui-refs .composition-detail-actions { display:contents; }
html[data-design="leaders"] :is(.sui-pills, .sui-composer-card) > .sui-refs .sui-add > svg { width:18px; height:18px; }


html[data-design="leaders"] #screen-composition .sui-hero .sui-composer { grid-template-columns:minmax(0, 1fr); }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card { flex-wrap:wrap; gap:12px 8px; }

html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card > .sui-pills { flex:1 1 0; flex-wrap:wrap; gap:6px; min-width:0; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > * { flex:none; max-width:none; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill { min-height:36px; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill:first-child { margin-right:0; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill:not(:first-child) { padding:0 12px; background:var(--sui-fill); box-shadow:none; color:var(--color-text); }
html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill:not(:first-child):hover { background:color-mix(in srgb, var(--sui-fill) 80%, var(--color-text)); }
html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill:not(:first-child) > .sui-pill-chevron { display:none; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill > span { overflow:visible; }
html[data-design="leaders"] #screen-composition .sui-hero :is(.sui-add.is-icon, .sui-mic) { display:grid; place-items:center; flex:none; width:36px; height:36px; min-height:36px; min-width:36px; padding:0; border-radius:50%; background:var(--sui-l3); box-shadow:inset 0 0 0 1px var(--sui-hair); color:var(--color-text); }
html[data-design="leaders"] #screen-composition .sui-hero :is(.sui-add.is-icon, .sui-mic):hover { background:color-mix(in srgb, var(--sui-l3) 80%, var(--color-text)); }
html[data-design="leaders"] #screen-composition .sui-hero :is(.sui-add.is-icon, .sui-mic) > svg { width:20px; height:20px; color:inherit; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-mic.is-on { background:#ff453a; box-shadow:none; color:#fff; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card > .composition-detail-actions { flex:none; gap:8px; margin:0; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary { min-height:36px; min-width:0; gap:8px; padding:0; border-radius:999px; background:none; color:var(--color-text-secondary); font-size:14px; font-weight:500; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary::after { width:36px; height:36px; background:var(--green); }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary:disabled { background:none; color:var(--color-text-secondary); }
html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary:disabled::after { background:color-mix(in srgb, var(--color-text) 22%, transparent); }
html[data-design="leaders"] #screen-composition .sui-hero .sui-price { display:inline-flex; align-items:center; gap:4px; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-price > svg { width:14px; height:14px; }
html[data-design="leaders"] #screen-composition .sui-hero .sui-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

@media (max-width:380px) {
  html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card { padding-left:12px; padding-right:8px; column-gap:4px; }
  html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill:first-child { margin-right:2px; padding:0 10px; }
  html[data-design="leaders"] #screen-composition .sui-hero .sui-pills > .sui-pill:first-child > .sui-pill-chevron { display:none; }
  html[data-design="leaders"] #screen-composition .sui-hero .sui-composer-card > .composition-detail-actions,
  html[data-design="leaders"] #screen-composition .sui-hero .sui-composer .composition-primary { gap:4px; }
  html[data-design="leaders"] #screen-composition .sui-hero .sui-price { gap:2px; }
}

html[data-design="leaders"] .sui-credits { display:inline-flex; align-items:center; gap:6px; margin-left:auto; min-height:32px; padding:0 12px 0 10px; border:0; border-radius:999px; background:var(--sui-fill); color:var(--color-text); font:inherit; font-size:14px; font-weight:500; font-variant-numeric:tabular-nums; cursor:pointer; }
html[data-design="leaders"] .sui-credits > svg { width:16px; height:16px; color:var(--color-text-secondary); }


html[data-design="leaders"] #screen-composition .sui-jobs { order:4; display:flex; flex-wrap:wrap; align-items:flex-start; gap:10px; margin:48px 0 0; }
html[data-design="leaders"] #screen-composition .sui-jobs > .sui-gallery-title { flex:0 0 100%; margin:0 0 2px; }
html[data-design="leaders"] #screen-composition .sui-jobs-col { display:flex; flex:1 1 0; flex-direction:column; gap:10px; min-width:0; }
html[data-design="leaders"] #screen-composition .sui-job { display:flex; flex-direction:column; gap:8px; width:100%; margin:0 0 4px; padding:0; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; }
html[data-design="leaders"] #screen-composition .sui-job-pic { position:relative; display:block; width:100%; overflow:hidden; border-radius:14px; background:var(--sui-fill); }
html[data-design="leaders"] #screen-composition .sui-job[hidden] { display:none; }
html[data-design="leaders"] #screen-composition .sui-job-pic > :is(img, video) { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
html[data-design="leaders"] #screen-composition .sui-job:hover .sui-job-pic > :is(img, video) { transform:scale(1.03); }

html[data-design="leaders"] #screen-composition .sui-job-label { padding:0 2px; color:var(--color-text-secondary); font-size:14px; line-height:20px; font-weight:500; }
html[data-design="leaders"] #screen-composition .sui-job:hover .sui-job-label { color:var(--color-text); }

html[data-design="leaders"] #screen-composition .sui-job.is-pair .sui-job-pic > img:not(.sui-job-before) { clip-path:inset(0 0 0 50%); }
html[data-design="leaders"] #screen-composition .sui-job.is-pair .sui-job-pic::after { content:''; position:absolute; inset:0 auto 0 calc(50% - 1px); width:2px; background:#fff; }

html[data-design="leaders"] #screen-composition .sui-jobs > .sui-ideas-row { display:flex; flex:0 0 100%; flex-wrap:wrap; justify-content:center; gap:8px; margin:-24px 0 24px; }
html[data-design="leaders"] #screen-composition .sui-ideas { order:4; display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:24px 0 0; }
html[data-design="leaders"] #screen-composition .sui-idea { height:36px; padding:0 14px; border:1px solid var(--color-border); border-radius:999px; background:none; color:var(--color-text-secondary); font:inherit; font-size:14px; line-height:20px; white-space:nowrap; cursor:pointer; transition:background-color .15s ease, color .15s ease; }
html[data-design="leaders"] #screen-composition .sui-idea:hover { background:var(--sui-fill); color:var(--color-text); }
@media (prefers-reduced-motion:reduce) { html[data-design="leaders"] #screen-composition :is(.sui-job-pic > img, .sui-idea) { transition:none; } }

html[data-design="leaders"] #screen-composition .sui-hero .sui-pill:not(.sui-add) > :is(svg:first-child:not(.sui-pill-chevron), .model-pill-mark) { display:none; }
@media (max-width:767px) {
  html[data-design="leaders"] #screen-composition .sui-hero .composition-detail-body:has(> .sui-composer) { padding-top:32px; }
  html[data-design="leaders"] .sui-hero-title > h3 { font-size:24px; line-height:30px; }
  html[data-design="leaders"] #screen-composition :is(.sui-jobs, .sui-jobs-col) { gap:8px; }
  html[data-design="leaders"] #screen-composition .sui-jobs { margin-top:32px; }
}

@media (min-width:768px) {
  html[data-design="leaders"] .sidebar-chat-list { -webkit-mask-image:none; mask-image:none; }
  html[data-design="leaders"] .sidebar-limit:not([hidden]) { position:relative; margin-top:4px; }
  html[data-design="leaders"] .sidebar-limit:not([hidden])::before { content:""; position:absolute; inset:-4px 12px auto; height:1px; background:var(--color-border); }
}


html[data-design="leaders"] .guest-mode .guest-login { background:var(--color-cta); background-image:none; color:var(--color-on-cta); box-shadow:none; }
html[data-design="leaders"] .guest-mode .guest-login:hover { background:var(--color-cta-hover); background-image:none; }
html[data-design="leaders"] .composer .send-button { transition:background-color 150ms ease, color 150ms ease, transform var(--motion-hover) ease; }
html[data-design="leaders"] .composer .send-button:not(:disabled):not(:has(use[href="#new-square"])) { background-color:var(--color-cta); color:var(--color-on-cta); }
html[data-design="leaders"] .composer .send-button:not(:disabled):not(:has(use[href="#new-square"])):hover { background-color:var(--color-cta-hover); }
html[data-design="leaders"] .sidebar .new-chat-button:hover { background:color-mix(in srgb, var(--color-text) 6%, var(--color-elevated)); }
html[data-design="leaders"] .sidebar .new-chat-button svg { color:currentColor; }


html[data-design="leaders"] #screen-composition .composition-note { text-wrap:pretty; }

html[data-design="leaders"] #screen-composition .sui-attach > .composition-note { text-wrap:wrap; }

html[data-design="leaders"] .sui-sheet[data-sheet="model"] .sui-model-name { display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-width:0; text-align:left; }
html[data-design="leaders"] .sui-sheet[data-sheet="model"] .sui-model-note { color:var(--color-text-secondary); font-size:14px; line-height:18px; font-weight:400; }