/* ================================================================
   GeoStru NX — Components
   Layered on top of geostru-tokens.css
   ================================================================ */

/* ──────────────────────────────────────────────
   BUTTONS
   ────────────────────────────────────────────── */
.gs-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: var(--gs-density-btn-h);
  padding: 0 12px;
  font-size: var(--gs-fs-sm);
  font-weight: var(--gs-fw-medium);
  letter-spacing: -0.005em;
  border-radius: var(--gs-r-md);
  border: 1px solid var(--gs-border-strong);
  background: var(--gs-bg-elev);
  color: var(--gs-text);
  cursor: pointer;
  transition: background var(--gs-dur) var(--gs-ease), border-color var(--gs-dur) var(--gs-ease), box-shadow var(--gs-dur) var(--gs-ease);
  white-space: nowrap;
  user-select: none;
}
.gs-btn:hover { background: var(--gs-bg-hover); border-color: var(--gs-text-tertiary); }
.gs-btn:active { background: var(--gs-bg-active); }
.gs-btn:disabled, .gs-btn[aria-disabled="true"] { color: var(--gs-text-disabled); background: var(--gs-bg-sunken); cursor: not-allowed; border-color: var(--gs-border); }
.gs-btn .gs-icon { width: 16px; height: 16px; flex: none; }

.gs-btn--sm { height: var(--gs-density-btn-h-sm); padding: 0 8px; font-size: var(--gs-fs-xs); }
.gs-btn--lg { height: var(--gs-density-btn-h-lg); padding: 0 16px; font-size: var(--gs-fs-md); }

/* Primary — gold, signature CTA */
.gs-btn--primary {
  background: var(--gs-accent);
  border-color: var(--gs-accent);
  color: var(--gs-accent-fg);
  box-shadow: 0 1px 0 rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.25);
}
.gs-btn--primary:hover { background: var(--gs-accent-hover); border-color: var(--gs-accent-hover); }
.gs-btn--primary:active { background: var(--gs-accent-active); border-color: var(--gs-accent-active); }

/* Secondary — navy, less prominent action */
.gs-btn--secondary {
  background: var(--gs-navy);
  border-color: var(--gs-navy);
  color: var(--gs-navy-fg);
}
.gs-btn--secondary:hover { background: var(--gs-navy-hover); border-color: var(--gs-navy-hover); }

/* Ghost — for toolbar / dense areas */
.gs-btn--ghost {
  background: transparent;
  border-color: transparent;
  color: var(--gs-text);
}
.gs-btn--ghost:hover { background: var(--gs-bg-hover); }
.gs-btn--ghost:active { background: var(--gs-bg-active); }

/* Outline — neutral */
.gs-btn--outline {
  background: transparent;
  border-color: var(--gs-border-strong);
  color: var(--gs-text);
}

/* AI variant — violet shimmer */
.gs-btn--ai {
  background: var(--gs-ai);
  border-color: var(--gs-ai);
  color: var(--gs-ai-fg);
}
.gs-btn--ai:hover { background: var(--gs-ai-hover); border-color: var(--gs-ai-hover); }

/* Danger */
.gs-btn--danger { background: var(--gs-danger); border-color: var(--gs-danger); color: var(--gs-danger-fg); }
.gs-btn--danger.gs-btn--ghost { background: transparent; color: var(--gs-danger); border-color: transparent; }
.gs-btn--danger.gs-btn--ghost:hover { background: var(--gs-danger-soft); }

/* Icon-only square */
.gs-btn--icon { width: var(--gs-density-btn-h); padding: 0; }
.gs-btn--icon.gs-btn--sm { width: var(--gs-density-btn-h-sm); }

/* Toggle / segmented */
.gs-segmented {
  display: inline-flex;
  border: 1px solid var(--gs-border-strong);
  border-radius: var(--gs-r-md);
  background: var(--gs-bg-sunken);
  padding: 2px;
  gap: 2px;
}
.gs-segmented__item {
  height: calc(var(--gs-density-btn-h) - 6px);
  padding: 0 10px;
  border-radius: var(--gs-r-sm);
  font-size: var(--gs-fs-xs);
  font-weight: var(--gs-fw-medium);
  color: var(--gs-text-secondary);
  background: transparent;
  border: 0;
  display: inline-flex; align-items: center; gap: 4px;
}
.gs-segmented__item:hover { color: var(--gs-text); }
.gs-segmented__item[aria-pressed="true"] {
  background: var(--gs-bg-elev);
  color: var(--gs-text);
  box-shadow: var(--gs-shadow-xs);
}

/* ──────────────────────────────────────────────
   INPUTS
   ────────────────────────────────────────────── */
.gs-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.gs-field__label {
  font-size: var(--gs-fs-xs);
  font-weight: var(--gs-fw-medium);
  color: var(--gs-text-secondary);
  display: inline-flex; align-items: center; gap: 4px;
}
.gs-field__hint { font-size: var(--gs-fs-2xs); color: var(--gs-text-tertiary); }
.gs-field__error { font-size: var(--gs-fs-2xs); color: var(--gs-danger); }

.gs-input, .gs-select, .gs-textarea {
  height: var(--gs-density-input-h);
  padding: 0 10px;
  font-size: var(--gs-fs-md);
  color: var(--gs-text);
  background: var(--gs-bg-elev);
  border: 1px solid var(--gs-border-strong);
  border-radius: var(--gs-r-md);
  outline: none;
  transition: border-color var(--gs-dur) var(--gs-ease), box-shadow var(--gs-dur) var(--gs-ease);
  width: 100%;
  min-width: 0;
}
.gs-textarea { height: auto; padding: 8px 10px; line-height: var(--gs-lh-snug); resize: vertical; min-height: 72px; }
.gs-input:hover, .gs-select:hover, .gs-textarea:hover { border-color: var(--gs-text-tertiary); }
.gs-input:focus, .gs-select:focus, .gs-textarea:focus { border-color: var(--gs-accent); box-shadow: var(--gs-shadow-focus); }
.gs-input:disabled, .gs-select:disabled { background: var(--gs-bg-sunken); color: var(--gs-text-disabled); }
.gs-input::placeholder, .gs-textarea::placeholder { color: var(--gs-text-tertiary); }

/* Numeric inputs are typically monospace tnum */
.gs-input--num {
  font-family: var(--gs-font-mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* Input with adornments (unit, symbol, icon) */
.gs-input-group {
  display: flex; align-items: stretch;
  border: 1px solid var(--gs-border-strong);
  background: var(--gs-bg-elev);
  border-radius: var(--gs-r-md);
  overflow: hidden;
  transition: border-color var(--gs-dur) var(--gs-ease), box-shadow var(--gs-dur) var(--gs-ease);
  min-width: 0;
  height: var(--gs-density-input-h);
}
.gs-input-group:focus-within { border-color: var(--gs-accent); box-shadow: var(--gs-shadow-focus); }
.gs-input-group .gs-input {
  border: 0; border-radius: 0; height: auto;
  background: transparent;
}
.gs-input-group .gs-input:focus { box-shadow: none; }
.gs-input-group__addon {
  display: inline-flex; align-items: center; padding: 0 8px;
  background: var(--gs-bg-sunken);
  color: var(--gs-text-secondary);
  font-size: var(--gs-fs-xs);
  font-family: var(--gs-font-mono);
  border-left: 1px solid var(--gs-border);
  white-space: nowrap;
  flex: none;
}
.gs-input-group__addon--prefix { border-left: 0; border-right: 1px solid var(--gs-border); }
.gs-input-group__addon--symbol {
  font-family: var(--gs-font-sans);
  font-style: italic;
  font-size: var(--gs-fs-md);
  color: var(--gs-text);
  background: transparent;
}

/* Select dropdown caret */
.gs-select {
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%23545454' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M3 4.5L6 7.5L9 4.5'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 28px;
}

/* Checkbox + radio */
.gs-check, .gs-radio {
  display: inline-flex; align-items: center; gap: 8px;
  cursor: pointer; user-select: none;
  font-size: var(--gs-fs-sm);
}
.gs-check input, .gs-radio input { position: absolute; opacity: 0; pointer-events: none; }
.gs-check__box, .gs-radio__box {
  width: 16px; height: 16px; flex: none;
  border: 1.5px solid var(--gs-border-strong);
  background: var(--gs-bg-elev);
  display: inline-flex; align-items: center; justify-content: center;
  transition: all var(--gs-dur) var(--gs-ease);
}
.gs-check__box { border-radius: 3px; }
.gs-radio__box { border-radius: 50%; }
.gs-check input:checked + .gs-check__box {
  background: var(--gs-accent);
  border-color: var(--gs-accent);
}
.gs-check input:checked + .gs-check__box::after {
  content: ""; width: 9px; height: 5px;
  border-left: 1.75px solid var(--gs-accent-fg);
  border-bottom: 1.75px solid var(--gs-accent-fg);
  transform: rotate(-45deg) translate(1px, -1px);
}
.gs-radio input:checked + .gs-radio__box {
  border-color: var(--gs-accent);
}
.gs-radio input:checked + .gs-radio__box::after {
  content: ""; width: 8px; height: 8px; border-radius: 50%;
  background: var(--gs-accent);
}

/* Switch */
.gs-switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.gs-switch input { position: absolute; opacity: 0; pointer-events: none; }
.gs-switch__track {
  width: 32px; height: 18px; border-radius: 10px;
  background: var(--gs-border-strong);
  position: relative;
  transition: background var(--gs-dur) var(--gs-ease);
}
.gs-switch__track::after {
  content: ""; position: absolute;
  top: 2px; left: 2px; width: 14px; height: 14px;
  border-radius: 50%; background: white;
  transition: left var(--gs-dur) var(--gs-ease);
  box-shadow: 0 1px 2px rgba(0,0,0,0.18);
}
.gs-switch input:checked + .gs-switch__track { background: var(--gs-accent); }
.gs-switch input:checked + .gs-switch__track::after { left: 16px; }

/* ──────────────────────────────────────────────
   BADGES & TAGS
   ────────────────────────────────────────────── */
.gs-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px;
  font-size: var(--gs-fs-2xs);
  font-weight: var(--gs-fw-medium);
  border-radius: var(--gs-r-sm);
  background: var(--gs-bg-sunken);
  color: var(--gs-text-secondary);
  border: 1px solid var(--gs-border);
  white-space: nowrap;
  letter-spacing: 0.01em;
  height: 20px;
}
.gs-badge--success { background: var(--gs-success-soft); color: var(--gs-success); border-color: transparent; }
.gs-badge--warning { background: var(--gs-warning-soft); color: var(--gs-warning); border-color: transparent; }
.gs-badge--danger  { background: var(--gs-danger-soft);  color: var(--gs-danger);  border-color: transparent; }
.gs-badge--info    { background: var(--gs-info-soft);    color: var(--gs-info);    border-color: transparent; }
.gs-badge--accent  { background: var(--gs-accent-soft);  color: var(--gs-accent-text); border-color: transparent; }
.gs-badge--navy    { background: var(--gs-navy-soft);    color: var(--gs-navy-text); border-color: transparent; }
.gs-badge--ai      { background: var(--gs-ai-soft);      color: var(--gs-ai-text); border-color: transparent; }

.gs-badge--dot::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: currentColor; flex: none;
}

/* ──────────────────────────────────────────────
   CARD / PANEL
   ────────────────────────────────────────────── */
.gs-card {
  background: var(--gs-bg-elev);
  border: 1px solid var(--gs-border);
  border-radius: var(--gs-r-md);
  overflow: hidden;
}
.gs-card__header {
  padding: 12px 14px;
  border-bottom: 1px solid var(--gs-border);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  background: var(--gs-bg-elev);
}
.gs-card__title { font-size: var(--gs-fs-md); font-weight: var(--gs-fw-semibold); margin: 0; letter-spacing: -0.01em; }
.gs-card__body { padding: 14px; }

/* ──────────────────────────────────────────────
   TOOLBAR (top global)
   ────────────────────────────────────────────── */
.gs-toolbar {
  height: var(--gs-toolbar-h);
  padding: 0 12px;
  display: flex; align-items: center; gap: 8px;
  background: var(--gs-bg-elev);
  border-bottom: 1px solid var(--gs-border);
  flex: none;
  font-size: var(--gs-fs-sm);
}
.gs-toolbar__brand {
  display: inline-flex; align-items: center; gap: 8px;
  padding-right: 12px; margin-right: 4px;
  font-weight: var(--gs-fw-semibold);
  letter-spacing: -0.01em;
  border-right: 1px solid var(--gs-border);
  height: 100%;
}
.gs-toolbar__brand-mark {
  width: 22px; height: 22px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--gs-navy);
}
.gs-toolbar__product {
  font-size: var(--gs-fs-md);
  font-weight: var(--gs-fw-semibold);
  letter-spacing: -0.015em;
  color: var(--gs-text);
}
.gs-toolbar__product-suffix {
  color: var(--gs-text-tertiary);
  font-weight: var(--gs-fw-medium);
  margin-left: 2px;
}
.gs-toolbar__group { display: inline-flex; align-items: center; gap: 4px; }
.gs-toolbar__sep { width: 1px; height: 20px; background: var(--gs-border); margin: 0 4px; flex: none; }
.gs-toolbar__spacer { flex: 1 1 auto; }

/* Menu trigger button (toolbar dropdowns) */
.gs-menu-btn {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px;
  padding: 0 10px;
  font-size: var(--gs-fs-sm);
  font-weight: var(--gs-fw-medium);
  color: var(--gs-text);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--gs-r-md);
  white-space: nowrap;
}
.gs-menu-btn:hover { background: var(--gs-bg-hover); }
.gs-menu-btn[aria-expanded="true"] { background: var(--gs-bg-active); }
.gs-menu-btn__caret { width: 10px; height: 10px; opacity: 0.6; }

.gs-menu-btn--primary {
  background: var(--gs-accent);
  color: var(--gs-accent-fg);
  border-color: var(--gs-accent);
}
.gs-menu-btn--primary:hover { background: var(--gs-accent-hover); }

.gs-menu-btn--ai {
  background: var(--gs-ai);
  color: var(--gs-ai-fg);
  border-color: var(--gs-ai);
}
.gs-menu-btn--ai:hover { background: var(--gs-ai-hover); }

/* Dropdown menu */
.gs-menu {
  background: var(--gs-bg-elev);
  border: 1px solid var(--gs-border-strong);
  border-radius: var(--gs-r-md);
  box-shadow: var(--gs-shadow-popover);
  padding: 4px;
  min-width: 200px;
  font-size: var(--gs-fs-sm);
}
.gs-menu__item {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px;
  border-radius: var(--gs-r-sm);
  color: var(--gs-text);
  cursor: pointer;
  white-space: nowrap;
}
.gs-menu__item:hover { background: var(--gs-bg-hover); }
.gs-menu__item--danger { color: var(--gs-danger); }
.gs-menu__item-shortcut { margin-left: auto; font-family: var(--gs-font-mono); font-size: var(--gs-fs-2xs); color: var(--gs-text-tertiary); }
.gs-menu__sep { height: 1px; background: var(--gs-border); margin: 4px -4px; }
.gs-menu__icon { width: 16px; height: 16px; flex: none; color: var(--gs-text-secondary); }
.gs-menu__label { flex: 1; }

/* ──────────────────────────────────────────────
   TABS
   ────────────────────────────────────────────── */
.gs-tabs {
  display: flex; align-items: stretch;
  border-bottom: 1px solid var(--gs-border);
  background: var(--gs-bg-elev);
  height: var(--gs-tabbar-h);
  padding: 0 12px;
  gap: 2px;
}
.gs-tabs__tab {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0 12px;
  height: 100%;
  font-size: var(--gs-fs-sm);
  font-weight: var(--gs-fw-medium);
  color: var(--gs-text-secondary);
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  background: transparent;
}
.gs-tabs__tab:hover { color: var(--gs-text); }
.gs-tabs__tab[aria-selected="true"] {
  color: var(--gs-text);
  border-bottom-color: var(--gs-accent);
}

/* ──────────────────────────────────────────────
   SIDEBAR / SECTION (collapsible)
   ────────────────────────────────────────────── */
.gs-sidebar {
  width: var(--gs-sidebar-w);
  background: var(--gs-bg-elev);
  border-right: 1px solid var(--gs-border);
  display: flex; flex-direction: column;
  flex: none;
  min-height: 0;
}
.gs-sidebar--right { border-right: 0; border-left: 1px solid var(--gs-border); width: var(--gs-properties-w); }

.gs-sidebar__header {
  padding: 10px 12px;
  border-bottom: 1px solid var(--gs-border);
  display: flex; align-items: center; justify-content: space-between;
  font-size: var(--gs-fs-xs);
  font-weight: var(--gs-fw-semibold);
  color: var(--gs-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.gs-sidebar__body { flex: 1; overflow-y: auto; min-height: 0; }

/* Collapsible section */
.gs-section {
  border-bottom: 1px solid var(--gs-border-subtle);
}
.gs-section__head {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px;
  cursor: pointer;
  user-select: none;
  background: transparent;
  border: 0; width: 100%; text-align: left;
  font-size: var(--gs-fs-sm);
  font-weight: var(--gs-fw-semibold);
  color: var(--gs-text);
}
.gs-section__head:hover { background: var(--gs-bg-hover); }
.gs-section__chev {
  width: 12px; height: 12px;
  transition: transform var(--gs-dur) var(--gs-ease);
  color: var(--gs-text-tertiary);
}
.gs-section[data-open="true"] .gs-section__chev { transform: rotate(90deg); }
.gs-section__icon { width: 16px; height: 16px; color: var(--gs-text-secondary); flex: none; }
.gs-section__label { flex: 1; }
.gs-section__body { padding: 4px 12px 12px; display: flex; flex-direction: column; gap: 10px; }
.gs-section[data-open="false"] .gs-section__body { display: none; }

/* ──────────────────────────────────────────────
   TABLE (data-dense)
   ────────────────────────────────────────────── */
.gs-table-wrap {
  border: 1px solid var(--gs-border);
  border-radius: var(--gs-r-md);
  background: var(--gs-bg-elev);
  overflow: hidden;
}
.gs-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: var(--gs-fs-sm);
}
.gs-table thead th {
  background: var(--gs-bg-sunken);
  color: var(--gs-text-secondary);
  font-weight: var(--gs-fw-semibold);
  text-align: left;
  padding: 8px 10px;
  font-size: var(--gs-fs-xs);
  letter-spacing: 0.01em;
  border-bottom: 1px solid var(--gs-border);
  white-space: nowrap;
  position: sticky; top: 0;
}
.gs-table thead th .gs-unit {
  display: block;
  font-weight: var(--gs-fw-regular);
  font-family: var(--gs-font-mono);
  font-size: var(--gs-fs-2xs);
  color: var(--gs-text-tertiary);
  text-transform: none;
  letter-spacing: 0;
}
.gs-table tbody td {
  padding: 0 10px;
  height: var(--gs-density-row-h);
  border-bottom: 1px solid var(--gs-border-subtle);
  vertical-align: middle;
}
.gs-table tbody tr:hover td { background: var(--gs-bg-hover); }
.gs-table tbody tr:last-child td { border-bottom: 0; }
.gs-table td.num, .gs-table th.num { text-align: right; font-family: var(--gs-font-mono); font-variant-numeric: tabular-nums; }
.gs-table td .gs-input, .gs-table td .gs-input-group { height: calc(var(--gs-density-row-h) - 6px); }

/* ──────────────────────────────────────────────
   STATUS BAR
   ────────────────────────────────────────────── */
.gs-statusbar {
  height: var(--gs-statusbar-h);
  padding: 0 12px;
  display: flex; align-items: center; gap: 12px;
  background: var(--gs-bg-elev);
  border-top: 1px solid var(--gs-border);
  font-size: var(--gs-fs-2xs);
  color: var(--gs-text-secondary);
  flex: none;
  font-family: var(--gs-font-mono);
}
.gs-statusbar__item { display: inline-flex; align-items: center; gap: 4px; }
.gs-statusbar__sep { width: 1px; height: 12px; background: var(--gs-border); }
.gs-statusbar__spacer { flex: 1; }
.gs-statusbar__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--gs-success);
}
.gs-statusbar__dot--warn { background: var(--gs-warning); }
.gs-statusbar__dot--err { background: var(--gs-danger); }

/* ──────────────────────────────────────────────
   AI PANEL (right rail, stackable)
   ────────────────────────────────────────────── */
.gs-ai-panel {
  background: var(--gs-bg-elev);
  border-top: 1px solid var(--gs-border);
  display: flex; flex-direction: column;
  flex: none;
}
.gs-ai-panel__header {
  height: var(--gs-ai-panel-collapsed-h);
  padding: 0 12px;
  display: flex; align-items: center; gap: 8px;
  border-bottom: 1px solid var(--gs-border);
  background: linear-gradient(180deg, var(--gs-ai-soft) 0%, transparent 100%);
  flex: none;
}
.gs-ai-panel__title {
  font-size: var(--gs-fs-sm);
  font-weight: var(--gs-fw-semibold);
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--gs-ai-text);
}
.gs-ai-panel__body { flex: 1; padding: 12px; overflow-y: auto; min-height: 0; display: flex; flex-direction: column; gap: 10px; }
.gs-ai-panel__footer { padding: 10px 12px; border-top: 1px solid var(--gs-border); flex: none; }
.gs-ai-msg {
  padding: 8px 10px;
  border-radius: var(--gs-r-md);
  font-size: var(--gs-fs-sm);
  line-height: 1.45;
  max-width: 85%;
}
.gs-ai-msg--user { background: var(--gs-bg-sunken); align-self: flex-end; color: var(--gs-text); }
.gs-ai-msg--ai { background: var(--gs-ai-soft); color: var(--gs-text); align-self: flex-start; }
.gs-ai-msg--ai .gs-ai-msg__from {
  font-size: var(--gs-fs-2xs); color: var(--gs-ai-text); font-weight: var(--gs-fw-semibold);
  display: flex; align-items: center; gap: 4px; margin-bottom: 4px;
}
.gs-ai-suggestion {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px;
  font-size: var(--gs-fs-xs);
  background: var(--gs-bg-elev);
  border: 1px solid var(--gs-ai-soft);
  border-radius: var(--gs-r-pill);
  color: var(--gs-ai-text);
  cursor: pointer;
}
.gs-ai-suggestion:hover { background: var(--gs-ai-soft); }

/* AI panel — dockable variants (left / right / bottom) */
.gs-ai-panel--dock-right { border-left: 1px solid var(--gs-border); border-top: 0; height: 100%; }
.gs-ai-panel--dock-left  { border-right: 1px solid var(--gs-border); border-top: 0; height: 100%; }
.gs-ai-panel--dock-bottom { border-top: 1px solid var(--gs-border); width: 100%; }

/* AI panel — header v2 (avatar + title + context + tools) */
.gs-ai-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--gs-border);
  background: var(--gs-bg-elev);
  flex: none;
}
.gs-ai-head__avatar {
  width: 28px; height: 28px; border-radius: 6px;
  background: var(--gs-ai-soft); color: var(--gs-ai-text);
  display: inline-flex; align-items: center; justify-content: center;
  flex: none;
}
.gs-ai-head__meta { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.gs-ai-head__title {
  font-size: var(--gs-fs-sm); font-weight: var(--gs-fw-semibold);
  color: var(--gs-text); line-height: 1.2;
}
.gs-ai-head__context {
  font-size: var(--gs-fs-2xs); color: var(--gs-text-tertiary);
  font-variant-numeric: tabular-nums; line-height: 1.3;
}
.gs-ai-head__tools { display: flex; align-items: center; gap: 2px; }
.gs-ai-head__btn {
  width: 28px; height: 28px; border-radius: 6px;
  background: transparent; border: 0; color: var(--gs-text-secondary);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
}
.gs-ai-head__btn:hover { background: var(--gs-bg-sunken); color: var(--gs-text); }

/* AI greeting (inline message + timestamp) */
.gs-ai-greeting {
  display: flex; gap: 8px;
  font-size: var(--gs-fs-sm); line-height: 1.55;
  color: var(--gs-text);
}
.gs-ai-greeting__avatar {
  width: 22px; height: 22px; border-radius: 4px;
  background: var(--gs-ai-soft); color: var(--gs-ai-text);
  display: inline-flex; align-items: center; justify-content: center;
  flex: none;
}
.gs-ai-greeting__body { flex: 1; }
.gs-ai-greeting__time {
  font-size: var(--gs-fs-2xs);
  color: var(--gs-text-tertiary);
  margin-top: 4px;
}

/* AI action card (banner with inline actions) */
.gs-ai-action-card {
  border: 1px solid var(--gs-warning);
  background: var(--gs-warning-soft);
  border-radius: var(--gs-r-md);
  padding: 12px;
  display: flex; gap: 10px;
}
.gs-ai-action-card__icon {
  width: 22px; height: 22px; border-radius: 4px;
  color: var(--gs-warning);
  flex: none;
  display: inline-flex; align-items: center; justify-content: center;
}
.gs-ai-action-card__body {
  font-size: var(--gs-fs-sm); line-height: 1.5;
  color: var(--gs-text);
  flex: 1;
}
.gs-ai-action-card__actions { display: flex; gap: 8px; margin-top: 10px; }

/* Quick actions list (AZIONI RAPIDE) */
.gs-ai-quick-label {
  font-size: var(--gs-fs-2xs);
  font-weight: var(--gs-fw-semibold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gs-text-tertiary);
  padding: 14px 4px 6px;
}
.gs-ai-quick {
  display: flex; flex-direction: column; gap: 6px;
}
.gs-ai-quick__item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--gs-border);
  border-radius: var(--gs-r-md);
  background: var(--gs-bg-elev);
  font-size: var(--gs-fs-sm);
  color: var(--gs-text);
  cursor: pointer;
  text-align: left;
  transition: border-color 100ms, background 100ms;
}
.gs-ai-quick__item:hover { border-color: var(--gs-border-strong); background: var(--gs-bg-sunken); }
.gs-ai-quick__icon { color: var(--gs-text-secondary); flex: none; }
.gs-ai-quick__label { flex: 1; }
.gs-ai-quick__cost {
  font-family: var(--gs-font-mono);
  font-size: var(--gs-fs-2xs);
  color: var(--gs-accent-text);
  font-variant-numeric: tabular-nums;
}
.gs-ai-quick__chev { color: var(--gs-text-tertiary); flex: none; }

/* AI footer v2 (input + chip row + send) */
.gs-ai-foot {
  border-top: 1px solid var(--gs-border);
  padding: 12px;
  background: var(--gs-bg-elev);
  flex: none;
}
.gs-ai-foot__box {
  border: 1px solid var(--gs-border);
  border-radius: var(--gs-r-lg);
  background: var(--gs-bg-elev);
  padding: 12px 14px 10px;
  display: flex; flex-direction: column; gap: 10px;
  transition: border-color 100ms, box-shadow 100ms;
}
.gs-ai-foot__box:focus-within { border-color: var(--gs-ai); box-shadow: 0 0 0 3px var(--gs-ai-soft); }
.gs-ai-foot__textline {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--gs-fs-md); color: var(--gs-text-tertiary);
  min-height: 24px;
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow: hidden;
  min-width: 0;
}
.gs-ai-foot__textline > span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.gs-ai-foot__input {
  flex: 1; min-width: 0;
  border: 0; outline: 0;
  font: inherit; font-size: var(--gs-fs-md);
  color: var(--gs-text);
  background: transparent;
  padding: 0;
}
.gs-ai-foot__input::placeholder { color: var(--gs-text-tertiary); }
.gs-ai-foot__kbd {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 22px; height: 22px; padding: 0 6px;
  font-family: var(--gs-font-mono);
  font-size: var(--gs-fs-xs);
  color: var(--gs-text-secondary);
  background: var(--gs-bg-elev);
  border: 1px solid var(--gs-border);
  border-radius: 4px;
  flex: none;
}
.gs-ai-foot__row {
  display: flex; align-items: center; gap: 4px;
}
.gs-ai-foot__icon-btn {
  width: 28px; height: 28px; border-radius: 6px;
  border: 0; background: transparent; color: var(--gs-text-secondary);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.gs-ai-foot__icon-btn:hover { background: var(--gs-bg-sunken); color: var(--gs-text); }
.gs-ai-foot__provider {
  margin-left: auto;
  font-size: var(--gs-fs-sm);
  color: var(--gs-text-tertiary);
  font-variant-numeric: tabular-nums;
}
.gs-ai-foot__send,
button.gs-ai-foot__send {
  width: 30px; height: 30px; border-radius: 6px;
  margin-left: 8px;
  background: #5b58e4 !important;
  color: #ffffff !important;
  border: 0 !important;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.gs-ai-foot__send svg { stroke: #ffffff !important; color: #ffffff !important; }
.gs-ai-foot__send:hover { background: #4a47d4 !important; }

/* ──────────────────────────────────────────────
   MODAL / DIALOG
   ────────────────────────────────────────────── */
.gs-modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(20, 20, 18, 0.45);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  z-index: var(--gs-z-modal);
}
.gs-modal {
  background: var(--gs-bg-elev);
  border-radius: var(--gs-r-lg);
  box-shadow: var(--gs-shadow-modal);
  max-width: 560px; width: 100%;
  max-height: 90vh;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.gs-modal__header {
  padding: 14px 16px;
  border-bottom: 1px solid var(--gs-border);
  display: flex; align-items: center; gap: 8px;
}
.gs-modal__title { font-size: var(--gs-fs-md); font-weight: var(--gs-fw-semibold); margin: 0; flex: 1; }
.gs-modal__body { padding: 16px; flex: 1; overflow: auto; }
.gs-modal__footer { padding: 12px 16px; border-top: 1px solid var(--gs-border); display: flex; justify-content: flex-end; gap: 8px; }

/* ──────────────────────────────────────────────
   TOOLTIP / KBD
   ────────────────────────────────────────────── */
.gs-tooltip {
  background: #1a1a1a;
  color: white;
  padding: 4px 8px;
  font-size: var(--gs-fs-2xs);
  border-radius: var(--gs-r-sm);
  white-space: nowrap;
}
.gs-kbd {
  display: inline-flex; align-items: center;
  padding: 1px 5px;
  font-size: var(--gs-fs-2xs);
  font-family: var(--gs-font-mono);
  background: var(--gs-bg-sunken);
  border: 1px solid var(--gs-border-strong);
  border-radius: 3px;
  color: var(--gs-text-secondary);
  line-height: 1.4;
}

/* ──────────────────────────────────────────────
   ALERT / BANNER
   ────────────────────────────────────────────── */
.gs-alert {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px;
  border-radius: var(--gs-r-md);
  font-size: var(--gs-fs-sm);
  border: 1px solid transparent;
}
.gs-alert--info    { background: var(--gs-info-soft);    color: var(--gs-info);    border-color: rgba(11,93,184,0.18); }
.gs-alert--success { background: var(--gs-success-soft); color: var(--gs-success); border-color: rgba(25,122,62,0.18); }
.gs-alert--warning { background: var(--gs-warning-soft); color: var(--gs-warning); border-color: rgba(184,115,10,0.18); }
.gs-alert--danger  { background: var(--gs-danger-soft);  color: var(--gs-danger);  border-color: rgba(180,35,24,0.18); }
.gs-alert__icon { flex: none; margin-top: 1px; }
.gs-alert__title { font-weight: var(--gs-fw-semibold); margin-bottom: 2px; }
.gs-alert__body { color: var(--gs-text); }

/* ──────────────────────────────────────────────
   LOGO
   ────────────────────────────────────────────── */
.gs-logo {
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: var(--gs-fw-semibold);
  font-size: var(--gs-fs-md);
  letter-spacing: -0.01em;
}
.gs-logo__mark {
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
}
.gs-logo__name { color: var(--gs-text); }
.gs-logo__suite { color: var(--gs-text-tertiary); margin-left: 6px; font-weight: var(--gs-fw-regular); }
