/* ══════════════════════════════════════════════════════════════════
 * 🍮 T42 输入卡彻底对齐 —— 双站实测差异 11/18
 *
 * 对标站 .img-composer.glass 实测：
 *   宽 720  高 64  radius 999px  padding 9px
 *   bg   linear-gradient(165deg,rgba(255,255,255,.66),rgba(255,255,255,.42) 55%,rgba(255,255,255,.56))
 *   border 1px rgba(255,255,255,.72)
 *   blur(12px) saturate(1.6)
 *   textarea font 15.5px / line-height 23.25px / padding 6px 4px
 *
 * 关键结构差异（我之前的错）：
 *   ✗ 我把比例/模型/张数做成一行「工具岛」，卡片被撑到 111px 高、26px 圆角
 *   ✓ 对标站是 999px 全圆角单行胶囊，控件以「岛」的形式浮在输入行左侧
 *     岛 30px 高 / 999px 圆角 / 12px 字号
 *
 * 所以正确结构是：
 *   ┌─────────────────────────────────────────────────────┐
 *   │ [🎨 图像模型 ▾] 输入框文字…              [↑]  │  ← 64px 单行 999 圆角
 *   └─────────────────────────────────────────────────────┘
 *   岛在左，输入框居中，发送键在右，全部同一行。
 * ══════════════════════════════════════════════════════════════════ */

/* ---------- 卡片：999px 全圆角单行 ---------- */
.st-composer{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  max-width:720px;
  margin:0 auto;
  min-height:64px;
  padding:9px;
  border-radius:999px;
  background:linear-gradient(165deg,rgba(255,255,255,.66) 0%,rgba(255,255,255,.42) 55%,rgba(255,255,255,.56) 100%),#fdfbf7;
  border:1px solid rgba(255,255,255,.72);
  backdrop-filter:blur(12px) saturate(1.6);
  -webkit-backdrop-filter:blur(12px) saturate(1.6);
  box-shadow:
    inset 0 1.5px 0 0 rgba(255,255,255,1),
    inset 0 2px 6px 0 rgba(255,255,255,.28),
    inset 2px 1px 0 0 rgba(170,205,225,.24),
    inset -2px -1px 0 0 rgba(235,195,205,.22),
    inset 0 -1px 0 0 rgba(140,120,180,.08),
    0 14px 38px 0 rgba(140,120,95,.12),
    0 3px 12px 0 rgba(140,120,95,.07);
  transition:box-shadow .35s,transform .45s var(--s-ease);
}
.st-composer:focus-within{
  transform:translateY(-2px);
  box-shadow:
    inset 0 1.5px 0 0 rgba(255,255,255,1),
    inset 0 2px 6px 0 rgba(255,255,255,.30),
    inset 2px 1px 0 0 rgba(170,205,225,.28),
    inset -2px -1px 0 0 rgba(235,195,205,.26),
    inset 0 -1px 0 0 rgba(140,120,180,.08),
    0 20px 48px 0 rgba(140,120,95,.145),
    0 4px 14px 0 rgba(140,120,95,.08);
}

/* ---------- 工具岛：改为卡片内左侧的单个「模型岛」---------- */
.st-tools{
  display:flex; align-items:center; gap:6px;
  flex:none;
  padding:0;
  margin:0;
  border:0;
}

/* 岛：30px 高 / 999 圆角 / 12px 字号（对齐实测） */
.st-island{
  display:inline-flex; align-items:center; gap:5px;
  height:30px; padding:0 12px;
  border-radius:999px;
  cursor:pointer; white-space:nowrap;
  border:1px solid rgba(140,120,95,.13);
  background:#fff;
  color:var(--s-ink);
  font:inherit; font-size:12px; font-weight:600; line-height:1;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    0 1px 2px rgba(140,120,95,.06);
  transition:transform .45s var(--s-ease),box-shadow .3s,border-color .2s;
}
.st-island:hover{
  transform:translateY(-1px);
  border-color:rgba(205,111,71,.42);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    0 4px 12px rgba(205,111,71,.14);
}
.st-island:active{transform:translateY(0) scale(.97)}
.st-island-k{display:none}          /* 对标站岛内不显示「比例/张数」这类前缀 */
.st-island select{
  border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;
  outline:none;padding:0 1px;
}
.st-island-model{gap:6px}
.st-island-model .st-mini-name{max-width:170px}
.st-island-model svg{flex:none;width:10px;height:10px;opacity:.45}

/* 计费提示挪出卡片（对标站放在卡片外下方） */
.st-island-hint{display:none}

/* ---------- 输入行：与岛同一行 ---------- */
.st-composer-input{
  flex:1; min-width:0;
  display:flex; align-items:center; gap:8px;
  padding:0;
}
.st-composer-input textarea{
  flex:1; min-width:0; resize:none; border:0; outline:0; background:transparent;
  color:var(--s-ink);
  font:inherit; font-size:15.5px; line-height:23.25px;
  max-height:120px;
  padding:6px 4px;
}
.st-composer-input textarea::placeholder{color:var(--s-muted);opacity:.85}

/* ---------- 发送键 ---------- */
.st-send{
  flex:none;
  display:grid; place-items:center;
  width:44px; height:44px;
  border-radius:50%;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.34);
  color:#fff;
  background:radial-gradient(circle at 34% 27%,#f9ab7f,#e0673f 76%,#d85b34);
  box-shadow:
    inset 0 1.5px 0 0 rgba(255,255,255,.42),
    inset 0 -2px 5px rgba(160,55,25,.26),
    0 6px 16px rgba(224,103,63,.38);
  transition:transform .45s var(--s-ease),box-shadow .3s,filter .2s;
}
.st-send svg{width:17px;height:17px}
.st-send:hover:not(:disabled){
  transform:translateY(-2px) scale(1.06);
  box-shadow:
    inset 0 1.5px 0 0 rgba(255,255,255,.5),
    inset 0 -2px 5px rgba(160,55,25,.26),
    0 12px 28px rgba(224,103,63,.48);
  filter:brightness(1.04);
}
.st-send:active:not(:disabled){transform:translateY(0) scale(.94)}
.st-send:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}

/* ---------- 灵感行：高度 36（对齐实测）---------- */
.st-inspo-row{
  height:36px;
  align-items:center;
}

/* ---------- 移动端 ---------- */
@media (max-width:760px){
  .st-composer{
    min-height:58px;
    padding:8px;
    gap:6px;
    max-width:100%;
  }
  .st-island{height:28px; padding:0 10px; font-size:11.5px}
  .st-island-model .st-mini-name{max-width:92px}
  .st-composer-input textarea{font-size:14.5px; padding:5px 3px}
  .st-send{width:40px; height:40px}
}
