/* The authoring canvas uses the same quiet paper as the welcome screen. */
body.authoring{background:var(--paper)}
body.authoring::before{display:none}
body.authoring .workspace{padding-top:18px;padding-bottom:22px}
body.authoring .authoring-flow{height:calc(100dvh - 40px)}

/* Preserve the composer footprint while the next response is prepared. */
.composer-pending-frame{position:relative;min-height:var(--pending-composer-height,80px);isolation:isolate}
.composer-pending-content{min-height:inherit;visibility:hidden;pointer-events:none;user-select:none}
.composer-pending-content .composer-shell{min-height:inherit}
.composer-pending-skeleton{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  gap:24px;padding:18px 22px;background:var(--surface);border:0;
  border-radius:24px;box-shadow:var(--authoring-surface-shadow,0 5px 25px #0000000e);
  overflow:hidden;pointer-events:none;
}
.composer-pending-frame.is-expanded .composer-pending-skeleton{padding:28px 28px 20px}
.composer-skeleton-body{display:flex;flex:1;flex-direction:column;gap:13px;min-height:0;overflow:hidden}
.composer-skeleton-line,.composer-skeleton-circle,.composer-skeleton-options>span{
  display:block;flex:none;background:linear-gradient(100deg,#eeeeee 18%,#f7f7f7 45%,#eeeeee 72%);
  background-size:240% 100%;animation:composer-skeleton-shimmer 1.7s ease-in-out infinite;
}
.composer-skeleton-line{height:13px;border-radius:7px}
.composer-skeleton-line.is-heading{width:58%;height:23px}
.composer-skeleton-line.is-description{width:78%}
.composer-skeleton-options{display:flex;gap:12px;flex:1;min-height:40px;max-height:78px;margin-top:13px}
.composer-skeleton-options>span{flex:1;min-width:0;border-radius:15px}
.composer-skeleton-entry{display:flex;align-items:center;gap:15px;min-height:42px}
.composer-skeleton-line.is-input{flex:1;height:15px;max-width:68%;margin-right:auto}
.composer-skeleton-circle{width:42px;height:42px;border-radius:50%}
.composer-skeleton-circle.is-small{width:26px;height:26px}
@keyframes composer-skeleton-shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
.progress-rail-pending .progress-step.current .progress-dot::after{display:none}

/* Keep the stages tied to the composer instead of floating beside the chat. */
@media(min-width:641px){
  body.authoring .authoring-dock .progress-rail{
    position:relative;left:auto;top:auto;transform:none;width:100%;
    display:flex;flex-direction:row;align-items:center;justify-content:space-between;
    gap:8px;margin:14px 0 0;padding:0 2px;
  }
  body.authoring .authoring-dock .progress-step{
    flex:1 1 0;min-width:0;min-height:30px;display:flex;
    align-items:center;justify-content:center;gap:7px;padding:3px 0;
  }
  body.authoring .authoring-dock .progress-step.current{min-height:30px}
  body.authoring .authoring-dock .progress-dot{width:15px;height:15px}
  body.authoring .authoring-dock .progress-step.current .progress-dot{
    width:15px;height:15px;border-radius:50%;box-shadow:0 0 0 3px #00000012;
  }
  body.authoring .authoring-dock .progress-step.done .progress-dot::after{
    left:4px;top:2px;width:4px;height:7px;
  }
  body.authoring .authoring-dock .progress-label,
  body.authoring .authoring-dock .progress-step.current .progress-label{
    display:block;min-width:0;max-width:none;overflow:hidden;text-overflow:ellipsis;
    white-space:nowrap;font-size:calc(10px * var(--scale));line-height:1.3;
    letter-spacing:0;text-transform:none;color:var(--muted);
  }
  body.authoring .authoring-dock .progress-step.done .progress-label{color:var(--body)}
  body.authoring .authoring-dock .progress-step.current .progress-label{color:var(--ink);font-weight:600}
  body.authoring .authoring-dock .progress-tooltip{
    right:auto;left:50%;top:auto;bottom:calc(100% + 9px);transform:translateX(-50%);
  }
  body.authoring .authoring-dock .progress-step:first-child .progress-tooltip{left:0;transform:none}
  body.authoring .authoring-dock .progress-step:last-child .progress-tooltip{left:auto;right:0;transform:none}
}
@media(min-width:641px) and (max-width:1100px){
  body.authoring .workspace{padding-right:36px}
}
@media(min-width:641px) and (max-width:760px){
  body.authoring .authoring-dock .progress-rail{gap:4px}
  body.authoring .authoring-dock .progress-step{gap:4px}
  body.authoring .authoring-dock .progress-label,
  body.authoring .authoring-dock .progress-step.current .progress-label{font-size:calc(9px * var(--scale))}
}

@media(max-width:640px){
  /* A single floating Projects control replaces the authoring header bar. */
  body.authoring .mobile-workspace-header{
    display:flex;position:fixed;top:calc(8px + env(safe-area-inset-top,0px));right:12px;left:auto;
    z-index:31;width:44px;height:44px;margin:0;padding:0;justify-content:center;
    background:transparent;box-shadow:none;
  }
  body.authoring .mobile-workspace-brand{display:none}
  body.authoring .mobile-projects-trigger{width:44px;height:44px;background:var(--surface);border:1px solid var(--line);box-shadow:0 3px 12px #00000012}
  body.authoring .workspace{
    height:var(--mobile-viewport-height,100dvh);min-height:0;
    padding-top:56px;padding-bottom:max(8px,env(safe-area-inset-bottom,0px));
  }
  body.authoring .authoring-flow{height:100%;min-height:0}
  .composer-pending-skeleton{padding:14px 16px;border-radius:22px}
  .composer-pending-frame.is-expanded .composer-pending-skeleton{padding:22px 18px 16px;gap:20px}
  .composer-skeleton-entry{gap:11px}
  .composer-skeleton-circle{width:36px;height:36px}
  .composer-skeleton-circle.is-small{width:22px;height:22px}
  .composer-skeleton-options{gap:9px}

}

/* The conversation and workspace are defined by elevation, without an outline. */
body .sidebar,
body.authoring .authoring-card,
body.authoring .composer{border:0!important}
body.authoring .authoring-card{box-shadow:var(--authoring-surface-shadow,0 8px 28px #00000016)!important}
@media(prefers-reduced-motion:reduce){.composer-skeleton-line,.composer-skeleton-circle,.composer-skeleton-options>span{animation:none;background:#eeeeee}}

/* Keep reference selection focused on the source images and one clear action. */
.reference-composer .reference-heading{align-items:flex-start;gap:20px}
.reference-composer .reference-heading h2{font-size:25px;line-height:1.22;max-width:590px}
.reference-composer .reference-selection-count{margin:12px 0 14px}
.staged-palette-host>.palette-folio{margin-top:0}
.provided-link-receipt-host:empty{display:none}
@media(max-width:640px){
  .reference-composer .reference-heading{gap:14px}
  .reference-composer .reference-heading h2{font-size:22px;max-width:none;flex:1}
  .reference-composer .reference-heading>.text-button{max-width:76px;flex:none;line-height:1.4}
  .reference-composer .reference-selection-count{margin:10px 0 12px}
}