/* ==================================================================
   低空翼站 · 门户共享视觉层 wst2（Phase 4 UI 升级）
   ------------------------------------------------------------------
   参照已上线并验收过的 /app/wingstation-ui.css（第 3 版首页视觉方向）
   提取「安全子集」：大圆角卡片(19px) + 柔和阴影 + eyebrow 小标题
   (11px/800 字重/.08em 字距) + focus-visible 可见环 + 响应式断点
   + prefers-reduced-motion 动效降级。

   命名空间纪律（重要）：
   · 全部规则一律挂在 .wst2 作用域类下；本文件不含任何全局 :root 变量、
     不含全局元素/类选择器，因此不会外溢影响作用域之外的任何页面；
   · 不搬运 wingstation-ui.css 中改写 /app/ 既有组件的规则
     （.appbar .numcard .tabbar .fab .btn-primary .card .mini 等一律未搬）；
   · 仅使用 !important 的唯一位置是 prefers-reduced-motion 动效降级块；
   · 原 v1 门户全局样式（:root / .card / .grid / .hero / .pill 等）已移除：
     它们与本页面的既有组件同名，加载后会造成视觉回归，故不再保留。
   ================================================================== */
.wst2{
  --wst2-primary:#1764dc;
  --wst2-primary-d:#104ba8;
  --wst2-primary-soft:#eaf4ff;
  --wst2-bg:#f3f8fc;
  --wst2-surface:#fff;
  --wst2-text:#102b48;
  --wst2-text-2:#496782;
  --wst2-text-3:#607c95;
  --wst2-line:#dbe9f4;
  --wst2-line-strong:#c4dced;
  --wst2-radius:19px;
  --wst2-radius-sm:12px;
  --wst2-shadow-sm:0 2px 9px rgba(24,71,117,.05);
  --wst2-shadow:0 12px 34px rgba(24,71,117,.08);
  --wst2-shadow-lg:0 20px 48px rgba(24,71,117,.13);
  --wst2-ok:#0b8a75;
  --wst2-ok-soft:#e6f6f2;
  --wst2-warn:#a66a11;
  --wst2-warn-soft:#fff5e3;
  --wst2-danger:#b63d30;
  --wst2-danger-soft:#fff0eb;
  --wst2-gray-soft:#f0f5fa;
  --wst2-font:"Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
}
/* ---------- 基础（仅命名空间内生效） ---------- */
.wst2{
  box-sizing:border-box;
  -webkit-tap-highlight-color:transparent;
}
.wst2 *,.wst2 *::before,.wst2 *::after{box-sizing:border-box}

/* ---------- eyebrow 小标题 ---------- */
.wst2 .wst2-eyebrow{
  font:800 11px/1.3 var(--wst2-font);
  letter-spacing:.08em;
  color:var(--wst2-primary-d);
}
.wst2 .wst2-eyebrow-soft{color:var(--wst2-text-3)}

/* ---------- 卡片 ---------- */
.wst2 .wst2-card{
  background:var(--wst2-surface);
  border:1px solid var(--wst2-line);
  border-radius:var(--wst2-radius);
  box-shadow:var(--wst2-shadow-sm);
}
.wst2 .wst2-card-hover{
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.wst2 .wst2-card-hover:hover{
  transform:translateY(-2px);
  border-color:var(--wst2-line-strong);
  box-shadow:var(--wst2-shadow-lg);
}

/* ---------- 表单：标签 / 输入态 ---------- */
.wst2 .wst2-label{
  display:block;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--wst2-text-2);
  margin-bottom:7px;
}
.wst2 .wst2-control{
  display:block;
  width:100%;
  min-height:46px;
  padding:11px 13px;
  font-family:inherit;
  font-size:14px;
  line-height:1.6;
  color:var(--wst2-text);
  background:var(--wst2-surface);
  border:1px solid var(--wst2-line-strong);
  border-radius:var(--wst2-radius-sm);
  outline:none;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.wst2 .wst2-control::placeholder{color:var(--wst2-text-3)}
.wst2 .wst2-control:hover{border-color:#a9c9e8}
.wst2 .wst2-control:focus{
  border-color:var(--wst2-primary);
  box-shadow:0 0 0 3px rgba(23,100,220,.14);
}
.wst2 textarea.wst2-control{min-height:92px;resize:vertical}
.wst2 select.wst2-control{
  -webkit-appearance:none;
  appearance:none;
  padding-right:34px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23496782' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");
  background-repeat:no-repeat;
  background-position:right 11px center;
  background-size:15px;
}

/* ---------- 按钮 ---------- */
.wst2 .wst2-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:44px;
  padding:0 18px;
  font-family:inherit;
  font-size:14px;
  font-weight:700;
  border-radius:var(--wst2-radius-sm);
  border:1px solid transparent;
  text-decoration:none;
  cursor:pointer;
  transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.wst2 .wst2-btn:active{transform:translateY(1px)}
.wst2 .wst2-btn-primary{
  background:var(--wst2-primary);
  color:#fff;
  box-shadow:0 8px 20px -10px rgba(23,100,220,.6);
}
.wst2 .wst2-btn-primary:hover{
  background:var(--wst2-primary-d);
  box-shadow:0 12px 26px -12px rgba(23,100,220,.66);
}
.wst2 .wst2-btn-ghost{
  background:var(--wst2-surface);
  border-color:var(--wst2-line-strong);
  color:var(--wst2-text-2);
}
.wst2 .wst2-btn-ghost:hover{
  border-color:var(--wst2-primary);
  color:var(--wst2-primary-d);
  background:var(--wst2-primary-soft);
}
.wst2 .wst2-btn-block{width:100%}
.wst2 .wst2-btn-lg{min-height:48px;font-size:15px;padding:0 24px}
.wst2 .wst2-btn[disabled],.wst2 .wst2-btn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}

/* ---------- 提示条 ---------- */
.wst2 .wst2-note{
  font-size:12.5px;
  line-height:1.65;
  color:var(--wst2-text-2);
  background:var(--wst2-primary-soft);
  border:1px solid #cfe1f8;
  border-radius:var(--wst2-radius-sm);
  padding:10px 13px;
}
.wst2 .wst2-note-err{
  color:var(--wst2-danger);
  background:var(--wst2-danger-soft);
  border-color:#f3d3cc;
}
.wst2 .wst2-note-ok{
  color:var(--wst2-ok);
  background:var(--wst2-ok-soft);
  border-color:#c8e8de;
}
.wst2 .wst2-note-warn{
  color:var(--wst2-warn);
  background:var(--wst2-warn-soft);
  border-color:#f0dcb4;
}

/* ---------- 焦点可见环 ---------- */
.wst2 a:focus-visible,
.wst2 button:focus-visible,
.wst2 input:focus-visible,
.wst2 select:focus-visible,
.wst2 textarea:focus-visible,
.wst2 [tabindex]:focus-visible{
  outline:3px solid #71b6f5;
  outline-offset:2px;
}

/* ---------- 动效降级（唯一允许 !important 的位置） ---------- */
@media (prefers-reduced-motion:reduce){
  .wst2 *,
  .wst2 *::before,
  .wst2 *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}
