/* ==========================================================================
   爱命题 · Refine Layer  (loads LAST, after polish.css)
   --------------------------------------------------------------------------
   目标（适度提升质感，不改风格）：
     · 修正：fieldset 图注在 grid 里逐字折行、按钮/胶囊文字折行
     · 质感：白色面板从「贴在画布上」变成「轻浮于纸面」——克制的分层阴影
     · 节奏：表单内边距、卡片圆角、留白对齐统一到同一套刻度
     · 层级：标题 / 说明 / 标签的对比再清晰一档
   只覆盖样式，不改 id / class / JS 钩子；深色模式行为保持一致。
   ========================================================================== */

/* ──────────────────────────────────────────────────────────────────
   01 · 修正 · fieldset 图注在 grid 容器里被压成逐字折行
   （.form-card 是 display:grid，legend 会被挤进窄轨道）
   ────────────────────────────────────────────────────────────────── */
.form-card > legend.form-card-legend,
.scope-box > legend.form-card-legend,
.bank-fieldset > legend {
    white-space: nowrap;
    width: max-content;
    max-width: 100%;
    justify-self: start;
}

/* ──────────────────────────────────────────────────────────────────
   02 · 修正 · 文案型控件不再折行（按钮 / 状态胶囊 / 步骤徽标）
   ────────────────────────────────────────────────────────────────── */
.primary-btn,
.ghost-btn,
.regen-btn,
.login-submit,
.bank-new-btn,
.meta-pill,
.stepper-status,
.history-pager button {
    white-space: nowrap;
}

/* ──────────────────────────────────────────────────────────────────
   03 · 质感 · 主面板「浮于纸面」的克制分层阴影
   印刷感美学不靠重阴影，而是一层极柔的远投影 + 一道近实影，
   让白卡与暖灰画布之间出现可感却不喧哗的层级。
   ────────────────────────────────────────────────────────────────── */
.panel,
.command-panel,
.flow-panel,
.preview-panel,
.history-papers,
.history-runs,
.history-detail,
.bank-list-panel,
.bank-editor-panel,
.providers-panel,
.active-combo-panel,
.diagnosis-control,
.diagnosis-output,
.single-question-control,
.single-question-output,
.open-discussion-control,
.open-discussion-output,
.login-history-panel {
    border-color: var(--hairline);
    box-shadow:
        0 1px 2px rgba(14, 17, 22, 0.035),
        0 8px 18px -12px rgba(14, 17, 22, 0.10),
        0 28px 50px -32px rgba(14, 17, 22, 0.12);
}
.panel:hover {
    border-color: var(--hairline-strong);
    box-shadow:
        0 1px 2px rgba(14, 17, 22, 0.04),
        0 10px 22px -12px rgba(14, 17, 22, 0.12),
        0 32px 60px -34px rgba(14, 17, 22, 0.16);
}

/* 内嵌灰底卡片（form-card / scope-box / accordion）保持「凹陷」语义：
   不要阴影，仅用边线，与浮起的白面板形成对比 —— 层级关系更清楚 */
.form-card,
.scope-box,
.bank-fieldset {
    box-shadow: none;
    border-radius: var(--radius-lg);
}

/* ──────────────────────────────────────────────────────────────────
   04 · 节奏 · 内边距 / 留白统一刻度
   ────────────────────────────────────────────────────────────────── */
.panel:not(.compact),
.command-panel,
.flow-panel,
.preview-panel {
    padding: 28px 32px 30px;
}
/* 内嵌卡片统一到 20px 四边，呼吸更匀 */
.form-card,
.scope-box {
    padding: 20px;
    gap: 16px;
}
/* fieldset 之间的纵向节奏统一 */
.command-panel > .form-card,
.command-panel > .scope-box {
    margin-bottom: 18px;
}
.command-panel > .form-card:last-of-type {
    margin-bottom: 22px;
}

/* ──────────────────────────────────────────────────────────────────
   05 · 层级 · 标题 / 说明 / 标签对比再清晰一档
   ────────────────────────────────────────────────────────────────── */
/* 面板小标题：字重更稳，与说明文拉开 */
.panel-head h2 {
    letter-spacing: 0;
    line-height: 1.3;
}
.panel-head .minor-text {
    color: var(--ink-500);
    line-height: 1.7;
}
/* 内嵌卡片图注：印刷感小标签，弱化边框、强化字距 */
.form-card-legend,
.scope-list-label,
.bank-fieldset > legend {
    color: var(--seal);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: none;
}
/* 字段标签与输入框之间的关系更紧凑、更稳 */
.field > span,
.mini-field > span,
.field-label {
    color: var(--ink-600);
    letter-spacing: 0.04em;
}

/* ──────────────────────────────────────────────────────────────────
   06 · 表单 · 输入控件多一分克制的触感
   极淡的内顶高光，让白底输入框在白面板上仍有边界与层次
   ────────────────────────────────────────────────────────────────── */
textarea,
select,
input[type="text"],
input[type="search"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="url"],
input[type="tel"],
input:not([type]) {
    box-shadow: inset 0 1px 1.5px rgba(14, 17, 22, 0.03);
}
textarea:focus,
select:focus,
input:focus {
    box-shadow:
        inset 0 1px 1.5px rgba(14, 17, 22, 0.02),
        0 0 0 3px var(--focus-ring-soft);
}

/* ──────────────────────────────────────────────────────────────────
   07 · Stepper · 当前步徽标对比保障 + 节奏微调
   （白色徽标块上保证深色数字，避免任何边角情况下读不出）
   ────────────────────────────────────────────────────────────────── */
.stepper-item.is-current .stepper-index {
    color: var(--ink-900);
    background: #FFFFFF;
    border-color: #FFFFFF;
}

/* ──────────────────────────────────────────────────────────────────
   08 · 工作区头部 · 对齐与呼吸
   ────────────────────────────────────────────────────────────────── */
.workspace-header-meta {
    gap: 8px;
    align-items: center;
}
.workspace-header-main h2 {
    line-height: 1.2;
}

/* ──────────────────────────────────────────────────────────────────
   09 · 登录页 · 同源精修
   ────────────────────────────────────────────────────────────────── */
.login-card {
    box-shadow:
        0 1px 2px rgba(14, 17, 22, 0.04),
        0 18px 40px -18px rgba(14, 17, 22, 0.18),
        0 40px 80px -40px rgba(14, 17, 22, 0.22);
}
.login-submit {
    letter-spacing: 0.3em;
}
.login-field-label {
    color: var(--ink-600);
    letter-spacing: 0.06em;
}

/* Mobile uses document scrolling. Keeping the desktop 100dvh inner scroller
   below a stacked navigation clips the final controls out of the viewport. */
@media (max-width: 820px) {
    html,
    body:not(.login-body) {
        height: auto;
        min-height: 100dvh;
    }

    body:not(.login-body) {
        overflow-y: auto;
    }

    body:not(.login-body) .app-shell,
    body:not(.login-body) .main-shell {
        height: auto;
        min-height: 100dvh;
    }

    body:not(.login-body) .main-shell {
        overflow: visible;
    }
}
