/* workspace.css — shell persistant : topbar · sidepanel chat · onglets · #gentabs-container · drawer. Tokens --ds-* uniquement. */

.ws { display: flex; flex-direction: column; height: 100vh; }
.ws__body { display: grid; grid-template-columns: var(--ds-sidepanel-w) minmax(0, 1fr) 0; flex: 1; min-height: 0; transition: grid-template-columns var(--ds-t) var(--ds-ease); }
.ws--panel-closed .ws__body { grid-template-columns: 0 minmax(0, 1fr) 0; }
.ws--drawer-open .ws__body { grid-template-columns: var(--ds-sidepanel-w) minmax(0, 1fr) var(--ds-drawer-w); }
.ws--panel-closed.ws--drawer-open .ws__body { grid-template-columns: 0 minmax(0, 1fr) var(--ds-drawer-w); }
/* placement explicite : sous 960px le panneau passe en position:fixed (hors flux), l'auto-placement enverrait le main en colonne 1 (0px) */
.ws-panel { grid-column: 1; }
.ws__main { grid-column: 2; display: flex; flex-direction: column; min-width: 0; min-height: 0; background: hsl(var(--ds-surface)); }
.ws-drawer { grid-column: 3; }
.ws__container { flex: 1; min-height: 0; overflow: auto; }
.ws-fullpage { min-height: 100vh; }
.ws-fullpage__cta { margin-top: var(--ds-4); }

/* ---- topbar */
.ws-topbar { display: flex; align-items: center; justify-content: space-between; height: var(--ds-topbar-h); padding: 0 var(--ds-3) 0 var(--ds-2); border-bottom: 1px solid hsl(var(--ds-line)); background: hsl(var(--ds-canvas)); }
.ws-topbar__left, .ws-topbar__right { display: flex; align-items: center; gap: var(--ds-2); min-width: 0; }
.ws-topbar__sep { width: 1px; height: 16px; background: hsl(var(--ds-line-strong)); }
.ws-brand { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; letter-spacing: -.01em; }
.ws-brand__mark { width: 14px; height: 14px; border-radius: 3px; background: linear-gradient(135deg, hsl(var(--ds-primary)), hsl(var(--ds-primary) / .55)); box-shadow: inset 0 0 0 1px hsl(0 0% 100% / .15); }
.ws-theme { display: inline-flex; }
.ws-avatar { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: hsl(var(--ds-raised)); border: 1px solid hsl(var(--ds-line-strong)); color: hsl(var(--ds-ink-muted)); }

/* ---- sidepanel (chat) */
.ws-panel { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; border-right: 1px solid hsl(var(--ds-line)); background: hsl(var(--ds-canvas)); }
.ws-panel__head { display: flex; align-items: center; justify-content: space-between; height: 36px; padding: 0 var(--ds-4); flex: none; }
.chat { flex: 1; min-height: 0; overflow-y: auto; padding: var(--ds-2) var(--ds-4) var(--ds-3); display: flex; flex-direction: column; gap: var(--ds-2); }
.chat__hint { padding: var(--ds-2) 0; }
.chat__examples { display: flex; flex-direction: column; gap: 6px; margin-top: var(--ds-3); }
.chat__examples--center { align-items: center; margin-top: var(--ds-4); }
.chat__example { text-align: left; padding: 8px 10px; border: 1px dashed hsl(var(--ds-line-strong)); border-radius: var(--ds-radius); font-size: var(--ds-text-sm); color: hsl(var(--ds-ink-muted)); line-height: 1.4; transition: background var(--ds-t), color var(--ds-t); }
.chat__example:hover { background: hsl(var(--ds-raised)); color: hsl(var(--ds-ink)); border-style: solid; }
.chat__stream { display: none; } /* porte le sse-connect ; aucun rendu */

.msg { list-style: none; }
.msg--user { align-self: flex-end; max-width: 92%; margin-top: var(--ds-2); }
.msg--user .msg__body { padding: 8px 12px; border-radius: var(--ds-radius-lg) var(--ds-radius-lg) 4px var(--ds-radius-lg); background: hsl(var(--ds-raised)); border: 1px solid hsl(var(--ds-line)); }
.msg__time { display: block; text-align: right; font-size: var(--ds-text-xs); margin-top: 2px; }
.msg--status { display: grid; grid-template-columns: 16px minmax(0, 1fr); column-gap: 8px; align-items: baseline; font-size: var(--ds-text-sm); color: hsl(var(--ds-ink-muted)); padding-left: 2px; }
.msg--status .msg__marker { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 18px; color: hsl(var(--ds-success)); }
.msg--status[data-state="error"] .msg__marker { color: hsl(var(--ds-danger)); }
.msg--status[data-state="running"] .msg__label { color: hsl(var(--ds-ink)); }
.msg--status .msg__detail { grid-column: 2; font-size: 11px; color: hsl(var(--ds-ink-faint)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.msg--assistant { margin-top: var(--ds-2); padding: 10px 12px; border-radius: var(--ds-radius-lg); border: 1px solid hsl(var(--ds-line)); background: hsl(var(--ds-surface)); }
.msg__result { display: flex; flex-direction: column; gap: 6px; margin-top: var(--ds-2); }
.msg__tool { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid hsl(var(--ds-primary) / .4); border-radius: var(--ds-radius); background: hsl(var(--ds-primary-soft)); font-weight: 500; text-align: left; }
.msg__tool:hover { border-color: hsl(var(--ds-primary)); }
.msg__meta { font-size: 11px; }
.msg--error { display: grid; grid-template-columns: 16px 1fr; gap: 8px; padding: 10px 12px; border-radius: var(--ds-radius-lg); border: 1px solid hsl(var(--ds-danger) / .4); background: hsl(var(--ds-danger) / .06); }
.msg--error .msg__marker { color: hsl(var(--ds-danger)); }
.msg--error .msg__detail { margin: 6px 0; font-size: 11px; color: hsl(var(--ds-ink-muted)); }

.prompt { flex: none; padding: var(--ds-3) var(--ds-4) var(--ds-4); border-top: 1px solid hsl(var(--ds-line)); }
.prompt__input { min-height: 72px; }
.prompt__bar { display: flex; align-items: center; gap: var(--ds-2); margin-top: var(--ds-2); }
.prompt__hint { flex: 1; font-size: var(--ds-text-xs); display: flex; gap: 4px; align-items: center; white-space: nowrap; overflow: hidden; }
.prompt__context { display: inline-flex; align-items: center; gap: 4px; font-size: var(--ds-text-xs); white-space: nowrap; }

/* ---- onglets (ADR-008 : rendus serveur) */
.ws-tabs { display: flex; align-items: stretch; gap: 2px; height: var(--ds-tabs-h); padding: 4px var(--ds-2) 0; border-bottom: 1px solid hsl(var(--ds-line)); background: hsl(var(--ds-canvas)); overflow-x: auto; scrollbar-width: none; }
.ws-tabs::-webkit-scrollbar { display: none; }
.ws-tab { position: relative; display: flex; align-items: center; flex: 0 1 220px; min-width: 96px; border-radius: var(--ds-radius) var(--ds-radius) 0 0; color: hsl(var(--ds-ink-muted)); }
.ws-tab:hover { background: hsl(var(--ds-raised)); }
.ws-tab.is-active { background: hsl(var(--ds-surface)); color: hsl(var(--ds-ink)); box-shadow: inset 0 2px 0 hsl(var(--ds-primary)), inset 1px 0 0 hsl(var(--ds-line)), inset -1px 0 0 hsl(var(--ds-line)); }
.ws-tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: hsl(var(--ds-surface)); }
.ws-tab__main { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; height: 100%; padding: 0 26px 0 10px; font-size: var(--ds-text-sm); text-align: left; }
.ws-tab__status { width: 6px; height: 6px; border-radius: 50%; background: hsl(var(--ds-success)); flex: none; }
.ws-tab[data-status="generating"] .ws-tab__status { background: hsl(var(--ds-primary)); animation: ds-blink 1s ease-in-out infinite; }
.ws-tab[data-status="error"] .ws-tab__status { background: hsl(var(--ds-danger)); }
@keyframes ds-blink { 50% { opacity: .3; } }
.ws-tab__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-tab__version { font-size: 10.5px; color: hsl(var(--ds-ink-faint)); }
.ws-tab__close { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 3px; color: hsl(var(--ds-ink-faint)); opacity: 0; transition: opacity var(--ds-t); }
.ws-tab:hover .ws-tab__close, .ws-tab.is-active .ws-tab__close, .ws-tab__close:focus-visible { opacity: 1; }
.ws-tab__close:hover { background: hsl(var(--ds-hover)); color: hsl(var(--ds-ink)); }
.ws-tab--new { flex: none; width: 30px; justify-content: center; margin-left: 2px; border-radius: var(--ds-radius); align-self: center; height: 26px; color: hsl(var(--ds-ink-muted)); }
.ws-tab--new:hover { background: hsl(var(--ds-raised)); color: hsl(var(--ds-ink)); }

/* ---- panneau d'outil */
.tool { display: flex; flex-direction: column; min-height: 100%; }
.tool { container-type: inline-size; }
.tool__head { display: flex; align-items: center; gap: var(--ds-4); flex-wrap: nowrap; padding: var(--ds-3) var(--ds-4); border-bottom: 1px solid hsl(var(--ds-line)); position: sticky; top: 0; z-index: 3; background: hsl(var(--ds-surface)); }
.tool__title { display: flex; align-items: center; gap: var(--ds-2); min-width: 150px; flex: 1 1 auto; }
.tool__title .ds-chip { flex: none; }
.tool__title > .ds-icon { color: hsl(var(--ds-ink-muted)); }
.tool__name { font-size: var(--ds-text-lg); font-weight: 600; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tool__ident { display: inline-flex; align-items: baseline; gap: var(--ds-2); min-width: 0; }
.tool__version { color: hsl(var(--ds-ink-faint)); }
.tool__actions { display: flex; align-items: center; gap: 4px; margin-left: auto; position: relative; flex: none; }
.tool__more { position: relative; }
.tool__menu { position: absolute; right: 0; top: 100%; margin-top: 4px; z-index: 6; }
.tool__layer { padding: 0 var(--ds-4); }
.tool__layer--sources { padding-top: var(--ds-3); padding-bottom: var(--ds-3); }
.tool__layer--table { flex: 1; padding-bottom: var(--ds-2); overflow-x: auto; }
.tool__layer--presentation { position: sticky; bottom: 0; background: hsl(var(--ds-surface)); border-top: 1px solid hsl(var(--ds-line)); }
.tool__layer--presentation:empty { display: none; }
.layer-pending { display: flex; align-items: center; gap: 8px; padding: var(--ds-3) 0; font-size: var(--ds-text-sm); }

/* Signature : rail des couches */
.layer-rail { display: flex; align-items: center; gap: 4px; flex: none; }
.layer-chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 8px 0 6px; border: 1px solid hsl(var(--ds-line)); border-radius: var(--ds-radius); background: hsl(var(--ds-raised)); font-size: var(--ds-text-sm); color: hsl(var(--ds-ink-muted)); position: relative; transition: border-color var(--ds-t), color var(--ds-t), background var(--ds-t); }
.layer-chip + .layer-chip::before { content: ""; position: absolute; left: -5px; top: 50%; width: 5px; height: 1px; background: hsl(var(--ds-line-strong)); }
.layer-chip__n { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 3px; font-size: 10px; background: hsl(var(--ds-line)); color: hsl(var(--ds-ink-muted)); }
.layer-chip__mark { display: inline-flex; width: 12px; height: 12px; align-items: center; justify-content: center; }
.layer-chip__mark > * { display: none; }
.layer-chip[data-state="done"] { color: hsl(var(--ds-ink)); border-color: hsl(var(--ds-line-strong)); }
.layer-chip[data-state="done"] .layer-chip__n { background: hsl(var(--ds-primary-soft)); color: hsl(var(--ds-primary-text)); }
.layer-chip[data-state="done"] .layer-chip__done { display: inline-flex; color: hsl(var(--ds-success)); }
.layer-chip[data-state="streaming"] { color: hsl(var(--ds-ink)); border-color: hsl(var(--ds-primary) / .6); background: hsl(var(--ds-primary-soft)); }
.layer-chip[data-state="streaming"] .layer-chip__n { background: hsl(var(--ds-primary)); color: hsl(var(--ds-primary-fg)); }
.layer-chip[data-state="streaming"] .layer-chip__spin { display: inline-flex; }
.layer-chip[data-state="forked"] .layer-chip__fork { display: inline-flex; color: hsl(var(--ds-warning)); }
.layer-chip[data-state="forked"] { border-color: hsl(var(--ds-warning) / .5); }
.layer-chip[data-state="error"] { border-color: hsl(var(--ds-danger) / .6); color: hsl(var(--ds-danger)); }
.layer-chip:hover { border-color: hsl(var(--ds-line-strong)); background: hsl(var(--ds-hover)); }

/* couche 1 */
.sources { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.sources__label { margin-right: 4px; }
.sources__chip { height: 24px; }
.sources__arrow { display: inline-flex; }
.sources__sep { width: 1px; height: 16px; background: hsl(var(--ds-line-strong)); margin: 0 4px; }
.sources__add { margin-left: 2px; }

/* couche 4 */
.presentation { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ds-3); padding: var(--ds-2) 0; font-size: var(--ds-text-sm); }
.presentation__group { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid hsl(var(--ds-line)); border-radius: var(--ds-radius); }
.presentation__group .ds-btn.is-active { background: hsl(var(--ds-raised)); color: hsl(var(--ds-ink)); }
.presentation__formats { font-size: 11px; }
.presentation__count { margin-left: auto; font-size: 11px; }

/* erreur d'outil */
.tool__error { display: grid; grid-template-columns: 20px 1fr; gap: var(--ds-3); margin: var(--ds-4); padding: var(--ds-4); border: 1px solid hsl(var(--ds-danger) / .4); border-radius: var(--ds-radius-lg); background: hsl(var(--ds-danger) / .05); }
.tool__error > .ds-icon { width: 20px; height: 20px; color: hsl(var(--ds-danger)); }
.tool__error-title { font-weight: 600; margin-bottom: 4px; }
.tool__error-detail { margin: var(--ds-2) 0; padding: var(--ds-2) var(--ds-3); border-radius: var(--ds-radius); background: hsl(var(--ds-raised)); font-size: 11px; white-space: pre-wrap; }
.tool__error-actions { display: flex; gap: var(--ds-2); margin-top: var(--ds-3); }

/* ---- drawer (historique / spec) */
.ws-drawer { display: flex; flex-direction: column; min-height: 0; border-left: 1px solid hsl(var(--ds-line)); background: hsl(var(--ds-canvas)); box-shadow: var(--ds-shadow-drawer); }
.ws-drawer__head { display: flex; align-items: center; justify-content: space-between; height: 36px; padding: 0 var(--ds-2) 0 var(--ds-4); flex: none; }
.ws-drawer__body { flex: 1; min-height: 0; overflow-y: auto; padding: 0 var(--ds-4) var(--ds-4); }
.history { position: relative; display: flex; flex-direction: column; }
.history__step { position: relative; display: grid; grid-template-columns: 14px 1fr; gap: 10px; padding-bottom: var(--ds-4); }
.history__rail { position: relative; }
.history__rail::before { content: ""; position: absolute; left: 6px; top: 16px; bottom: -4px; width: 1px; background: hsl(var(--ds-line-strong)); }
.history__step:last-child .history__rail::before { display: none; }
.history__rail::after { content: ""; position: absolute; left: 3px; top: 7px; width: 7px; height: 7px; border-radius: 50%; background: hsl(var(--ds-ink-faint)); }
.history__step.is-current .history__rail::after { background: hsl(var(--ds-primary)); box-shadow: 0 0 0 3px hsl(var(--ds-primary-soft)); }
.history__step.is-fork .history__rail::after { background: hsl(var(--ds-warning)); }
.history__line { display: flex; align-items: baseline; gap: 8px; font-size: var(--ds-text-sm); }
.history__version { color: hsl(var(--ds-ink)); }
.history__layer { color: hsl(var(--ds-ink-muted)); }
.history__line time { margin-left: auto; font-size: var(--ds-text-xs); }
.history__prompt { margin: 4px 0 6px; font-size: var(--ds-text-sm); }
.history__diff { margin: 0 0 8px; padding: 6px 8px; border-radius: var(--ds-radius-sm); background: hsl(var(--ds-raised)); font-size: 11px; white-space: pre-wrap; color: hsl(var(--ds-ink-muted)); }
.history__spec summary { cursor: pointer; padding: var(--ds-2) 0; list-style: none; display: flex; gap: 8px; align-items: baseline; }
.history__spec summary::-webkit-details-marker { display: none; }
.history__json { margin: 0; padding: var(--ds-3); border-radius: var(--ds-radius); background: hsl(var(--ds-raised)); font-size: 11px; line-height: 1.55; white-space: pre; overflow-x: auto; color: hsl(var(--ds-ink-muted)); }

/* ---- mes outils */
.tools-list { padding: var(--ds-6) var(--ds-6) var(--ds-8); max-width: 1100px; }
.tools-list__head { display: flex; align-items: baseline; gap: var(--ds-3); margin-bottom: var(--ds-4); }
.tools-list__title { font-size: var(--ds-text-xl); font-weight: 600; letter-spacing: -.01em; }
.tools-list__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--ds-3); }
.tools-list__card { display: grid; grid-template-columns: 24px 1fr; grid-template-rows: auto auto auto; column-gap: 10px; row-gap: 2px; width: 100%; padding: var(--ds-3); border: 1px solid hsl(var(--ds-line)); border-radius: var(--ds-radius-lg); background: hsl(var(--ds-canvas)); text-align: left; transition: border-color var(--ds-t), background var(--ds-t); }
.tools-list__card:hover { border-color: hsl(var(--ds-line-strong)); background: hsl(var(--ds-raised)); }
.tools-list__type { grid-row: 1 / 4; color: hsl(var(--ds-ink-muted)); padding-top: 2px; }
.tools-list__name { font-weight: 500; }
.tools-list__meta, .tools-list__sources { font-size: 11px; }
.tools-list__empty { padding-top: 12vh; }

/* ---- responsive */
@media (max-width: 960px) {
  .ws__body, .ws--drawer-open .ws__body { grid-template-columns: 0 minmax(0, 1fr) 0; }
  .ws-panel, .ws-drawer { position: fixed; top: var(--ds-topbar-h); bottom: 0; width: min(420px, 100vw); z-index: 40; }
  .ws-panel { left: 0; transform: translateX(-100%); transition: transform var(--ds-t) var(--ds-ease); }
  .ws:not(.ws--panel-closed) .ws-panel { transform: none; }
  .ws-drawer { right: 0; }
  .tool__head { position: static; }
}

@media (max-width: 1280px) { .tt__path { display: none; } }
/* rail compact quand le panneau est étroit (drawer ouvert, écran moyen) : les couches terminées ne gardent que leur numéro */
@container (max-width: 900px) { .layer-chip[data-state="done"] .layer-chip__label, .layer-chip[data-state="pending"] .layer-chip__label { display: none; } .tool__head { gap: var(--ds-3); } }

/* ---- formulaires du drawer (R2) et renommage inline */
.drawer-form { display: flex; flex-direction: column; gap: var(--ds-3); padding-top: var(--ds-2); }
.drawer-form__path { margin-top: -6px; color: hsl(var(--ds-ink-muted)); }
.drawer-form__field { display: flex; flex-direction: column; gap: 4px; font-size: var(--ds-text-sm); color: hsl(var(--ds-ink-muted)); border: 0; padding: 0; margin: 0; }
.drawer-form__field legend { padding: 0; margin-bottom: 4px; }
.drawer-form__field label { display: inline-flex; gap: 6px; margin-right: var(--ds-3); color: hsl(var(--ds-ink)); }
.drawer-form__check { display: flex; align-items: center; gap: 8px; font-size: var(--ds-text-sm); }
.drawer-form__section { margin-top: var(--ds-2); }
.drawer-form__error { font-size: var(--ds-text-sm); color: hsl(var(--ds-danger)); }
.drawer-form__actions { display: flex; gap: var(--ds-2); margin-top: var(--ds-2); }
.tool__name-form { display: inline-flex; align-items: center; gap: 6px; }
.tool__name-input { width: 280px; height: 28px; padding: 0 8px; font-size: var(--ds-text-md); font-weight: 600; }
.tool__name-error { font-size: var(--ds-text-xs); color: hsl(var(--ds-danger)); }
.ds-toast--success { border-color: hsl(var(--ds-success) / .5); }
.ds-toast--error { border-color: hsl(var(--ds-danger) / .5); }

/* ---- connexion */
.login { display: flex; flex-direction: column; gap: var(--ds-3); width: min(360px, 90vw); padding: var(--ds-6); border: 1px solid hsl(var(--ds-line)); border-radius: var(--ds-radius-lg); background: hsl(var(--ds-surface)); text-align: left; }
.login .ws-brand { align-self: flex-start; }
.login__field { display: flex; flex-direction: column; gap: 4px; font-size: var(--ds-text-sm); color: hsl(var(--ds-ink-muted)); }
.login__error { font-size: var(--ds-text-sm); color: hsl(var(--ds-danger)); }

/* ---- partage (v1.2) */
.share-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: var(--ds-2); }
.share-list__item { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: var(--ds-2); padding: 6px 8px; border: 1px solid hsl(var(--ds-line)); border-radius: var(--ds-radius); font-size: var(--ds-text-sm); }
.share-list__item--expired { opacity: .55; }
.tools-list__head--shared { margin-top: var(--ds-6); }
.ws-tab .ds-icon--xs { color: hsl(var(--ds-primary-text)); }