/* ============================================================
   theme-cloud-blue.css · 云蓝主题 Cloud Blue（加载于 app.css 之后，html[data-theme="cloud-blue"] 生效）
   token 与工艺提炼自 home-cloud-blue.html（公开门户·最高标准）
   与 redesign-model-market/style-3-cloud-blue.html（控制台页标准）
   设计语言：极光渐变底 / 细噪点 / sticky 磨砂顶栏 / 玻璃卡工艺 /
             135° 蓝渐变胶囊按钮 / 每页至多一处深色对比模块 / 手绘线性 SVG 图标
   红线：不改文案/层级/链接/字段；anno 注记仅降视觉权重；双轨语义（自费=青 / 补贴=琥珀）保留
   ============================================================ */

/* ---------- 手绘线性图标基座（icons.js 注入的 <svg class="ic"> 使用；仅云蓝下注入） ---------- */
.ic{width:1em;height:1em;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic-ok{color:var(--track-self)}
.ic-bad{color:var(--bad)}
.ic-warn{color:var(--track-sub)}
.ic-pend{color:var(--pend)}
.ic-info{color:var(--info)}
.ic-accent{color:var(--accent)}

/* ============================================================
   token 层（定义在 body 上，app.css 结构与内联页组件继承之）
   ============================================================ */
html[data-theme="cloud-blue"] body{
  --paper:#eef4ff; --paper-deep:#e2edff;
  --panel:rgba(255,255,255,.55); --panel-2:rgba(255,255,255,.4);
  --chip:rgba(255,255,255,.6);
  --ink:#16223c; --ink-2:#4d5a75; --ink-3:#8b97b0;
  --line:rgba(255,255,255,.85); --line-strong:rgba(120,150,200,.28);

  --blue:#2563eb; --blue-2:#1d4ed8; --blue-l:#e8effe; --blue-glow:rgba(37,99,235,.28);
  --glass:rgba(255,255,255,.55); --glass-2:rgba(255,255,255,.4); --glass-hi:rgba(255,255,255,.85);
  --hair:rgba(120,150,200,.28);
  --dark:#101c38; --dark-2:#1d2c50;
  /* 深色对比模块（banner/hero）文字色——若缺省，页面内 var(--hero-*) 会取不到值导致文字不可见 */
  --hero-bg:linear-gradient(140deg,#1d2c50,#101c38 72%); --hero-ink:#f5f9ff; --hero-ink-dim:#9fb3d8; --hero-accent:#7fb0ff;

  --accent:#2563eb; --accent-bg:#e8effe;
  /* 双轨语义色保留（app.css 全站强制）：自费=松石青 / 补贴=琥珀（镜像描边） */
  --track-self:#0d8a5f; --track-self-bg:rgba(214,245,230,.7);
  --track-sub:#b3761a;  --track-sub-bg:rgba(253,240,214,.75);
  --ok:#0d8a5f;   --ok-bg:rgba(214,245,230,.7);
  --warn:#b3761a; --warn-bg:rgba(253,246,227,.8);
  --bad:#c1503a;  --bad-bg:rgba(253,240,238,.82); --bad-chip:rgba(246,221,210,.8);
  --info:#2f5fa8; --info-bg:rgba(233,239,248,.8);
  --pend:#6b5ca8; --pend-bg:rgba(239,236,248,.8);

  /* “lime 点缀位”在云蓝里归蓝（yid / perm-edit 等） */
  --lime:#2563eb; --lime-soft:#e8effe; --lime-ink:#1d4ed8;

  --font-display:var(--font-body); /* 弃宋体，走字重层级 */
  --r:20px; --r-md:14px;
  --shadow:inset 0 1px 0 rgba(255,255,255,.95), 0 1px 2px rgba(30,64,175,.06), 0 16px 40px -12px rgba(30,64,175,.16);
  --shadow-lg:0 24px 60px -14px rgba(16,28,56,.4);
}

/* ============================================================
   极光底 + 细噪点
   ============================================================ */
html[data-theme="cloud-blue"] body{
  background:linear-gradient(165deg,#f0f6ff 0%,#e2edff 50%,#d2e2fc 100%) fixed;
  color:var(--ink); font-size:14px; -webkit-font-smoothing:antialiased;
}
html[data-theme="cloud-blue"] body::before{
  content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(900px 620px at 12% -6%, rgba(185,214,255,.9), transparent 62%),
    radial-gradient(760px 560px at 88% 4%, rgba(228,239,255,.95), transparent 58%),
    radial-gradient(820px 640px at 96% 88%, rgba(169,201,251,.75), transparent 60%),
    radial-gradient(640px 480px at 6% 92%, rgba(199,222,252,.6), transparent 62%);
}
html[data-theme="cloud-blue"] body::after{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* 标题字：弃宋体走字重 */
html[data-theme="cloud-blue"] .topbar h1,
html[data-theme="cloud-blue"] .card > h2, html[data-theme="cloud-blue"] .card-h h2,
html[data-theme="cloud-blue"] .sec-h h2, html[data-theme="cloud-blue"] .stat .s-num,
html[data-theme="cloud-blue"] .center-state h3, html[data-theme="cloud-blue"] .modal-demo .m-head,
html[data-theme="cloud-blue"] .appcard h3, html[data-theme="cloud-blue"] .auth-brand .b-name,
html[data-theme="cloud-blue"] .brand .b-name{
  font-family:var(--font-body); letter-spacing:0; font-weight:800;
}
html[data-theme="cloud-blue"] .topbar h1{font-weight:800;letter-spacing:-.01em}

/* ============================================================
   侧栏（浅色磨砂 · 收窄可收起）：板块清晰、主次分明、不压深
   ============================================================ */
html[data-theme="cloud-blue"] .sidebar,
html[data-theme="cloud-blue"] body[data-portal="park"] .sidebar,
html[data-theme="cloud-blue"] body[data-portal="ops"] .sidebar{
  width:196px;
  /* 弥散渐变：浅色底 + 三团柔光，避免大片纯色单调 */
  background:
    radial-gradient(360px 300px at 12% 1%, rgba(179,206,255,.6), transparent 60%),
    radial-gradient(320px 320px at 108% 26%, rgba(206,222,255,.55), transparent 62%),
    radial-gradient(400px 360px at 24% 104%, rgba(190,210,250,.58), transparent 60%),
    linear-gradient(180deg, rgba(248,251,255,.86), rgba(232,241,255,.74));
  -webkit-backdrop-filter:blur(20px) saturate(1.5); backdrop-filter:blur(20px) saturate(1.5);
  color:var(--ink-2);
  border-right:1px solid rgba(255,255,255,.7);
  box-shadow:1px 0 0 rgba(120,150,200,.12), 10px 0 30px -18px rgba(30,64,175,.16);
  transition:width .22s ease;
}
html[data-theme="cloud-blue"] .brand{border-bottom:1px solid rgba(120,150,200,.16)}
html[data-theme="cloud-blue"] .brand .b-name{color:var(--ink)}
html[data-theme="cloud-blue"] .brand .b-sub{color:var(--ink-3)}
html[data-theme="cloud-blue"] .brand .b-portal{
  background:linear-gradient(135deg,#4a8dff,#1d4ed8); color:#fff; font-weight:700;
  border-radius:999px; box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 12px -4px var(--blue-glow);
}
/* 分组标题＝次级板块标签（小·疏·静音），与菜单项拉开层级 */
html[data-theme="cloud-blue"] .nav{padding:4px 0 16px}
html[data-theme="cloud-blue"] .nav .n-group{
  font-size:10px; letter-spacing:.16em; font-weight:600; color:var(--ink-3);
  padding:18px 18px 6px; opacity:.85;
}
html[data-theme="cloud-blue"] .nav .n-group:first-child{padding-top:12px}
/* 菜单项＝主层级，圆角命中区 */
html[data-theme="cloud-blue"] .nav a{
  color:var(--ink-2); font-size:13px; font-weight:500; border-left:none;
  margin:1px 10px; padding:8px 12px; border-radius:9px;
}
html[data-theme="cloud-blue"] .nav a:hover{color:var(--ink); background:rgba(37,99,235,.07)}
html[data-theme="cloud-blue"] .nav a.on{
  color:var(--accent); font-weight:600; background:var(--blue-l);
  box-shadow:inset 0 0 0 1px rgba(37,99,235,.14);
}
html[data-theme="cloud-blue"] .nav a .n-badge{background:rgba(37,99,235,.12); color:var(--accent)}
html[data-theme="cloud-blue"] .side-foot{border-top:1px solid rgba(120,150,200,.16); color:var(--ink-3)}
html[data-theme="cloud-blue"] .side-foot a{color:var(--ink-2)}
html[data-theme="cloud-blue"] .side-foot a:hover{color:var(--accent)}

/* 收起态（仅桌面 ≥901px）：侧栏归零。移动端用抽屉（nav-open），不受此规则影响 */
@media(min-width:901px){
  html[data-theme="cloud-blue"] body.nav-collapsed .sidebar{
    width:0; min-width:0; overflow:hidden; border-right:none; box-shadow:none;
  }
}
html[data-theme="cloud-blue"] .nav-toggle{
  flex:none; display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; margin-right:6px; cursor:pointer; color:var(--ink-2);
  border-radius:10px; border:1px solid rgba(255,255,255,.8); background:rgba(255,255,255,.55);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:var(--shadow);
}
html[data-theme="cloud-blue"] .nav-toggle:hover{color:var(--accent); background:rgba(255,255,255,.85)}
html[data-theme="cloud-blue"] .nav-toggle .ic{width:18px; height:18px}
/* 移动端（≤900px）：侧栏改左侧滑入抽屉，nav-toggle 常显为菜单键 */
@media(max-width:900px){
  html[data-theme="cloud-blue"] .nav-toggle{display:inline-flex}
  html[data-theme="cloud-blue"] .sidebar{
    display:flex !important; position:fixed; left:0; top:0; height:100vh;
    width:248px; max-width:82vw; z-index:120;
    transform:translateX(-100%); transition:transform .26s ease; will-change:transform;
  }
  html[data-theme="cloud-blue"] body.nav-open .sidebar{ transform:translateX(0); box-shadow:12px 0 40px -8px rgba(16,28,56,.42) }
  html[data-theme="cloud-blue"] .nav-backdrop{
    position:fixed; inset:0; z-index:115; background:rgba(16,28,56,.42);
    -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
    opacity:0; pointer-events:none; transition:opacity .26s;
  }
  html[data-theme="cloud-blue"] body.nav-open .nav-backdrop{ opacity:1; pointer-events:auto }
}
html[data-theme="cloud-blue"] .nav-backdrop{display:none}
@media(max-width:900px){ html[data-theme="cloud-blue"] .nav-backdrop{display:block} }
/* 五列网格（原 ops 页内联 repeat(5,1fr)，收进断点） */
html[data-theme="cloud-blue"] .g5{grid-template-columns:repeat(5,1fr)}

/* 滑块验证码（登录页，防短信轰炸的行为验证演示） */
html[data-theme="cloud-blue"] .slidecap{position:relative;height:42px;border-radius:999px;background:rgba(120,150,200,.12);border:1px solid rgba(255,255,255,.7);overflow:hidden;user-select:none;touch-action:none}
html[data-theme="cloud-blue"] .slidecap-fill{position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,rgba(59,130,246,.22),rgba(37,99,235,.32))}
html[data-theme="cloud-blue"] .slidecap-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--ink-3);pointer-events:none}
html[data-theme="cloud-blue"] .slidecap-handle{position:absolute;left:0;top:0;width:42px;height:42px;border-radius:999px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;display:flex;align-items:center;justify-content:center;cursor:grab;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 12px -4px var(--blue-glow)}
html[data-theme="cloud-blue"] .slidecap-handle:active{cursor:grabbing}
html[data-theme="cloud-blue"] .slidecap.ok{background:var(--ok-bg)}
html[data-theme="cloud-blue"] .slidecap.ok .slidecap-text{color:var(--ok);font-weight:600}
html[data-theme="cloud-blue"] .slidecap.ok .slidecap-handle{background:var(--ok);cursor:default}

/* 顶栏验收编号：加「验收」前缀标签，并随「PRD 注记」开关一起隐藏（对外演示可一键收起） */
html[data-theme="cloud-blue"] .topbar-yids{display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap}
html[data-theme="cloud-blue"] .yid-lead{
  font-size:10px; letter-spacing:.12em; color:var(--ink-3);
  border:1px dashed var(--line-strong); border-radius:999px; padding:2px 8px;
}
html[data-theme="cloud-blue"] body.anno-off .topbar-yids{display:none}

/* 模型广场：按反馈删除模型卡顶部图标托盘（scoped，不影响应用广场等其它卡） */
html[data-theme="cloud-blue"] body[data-page="model-market"] .appcard .a-logo{display:none}

/* ============================================================
   顶栏（sticky 磨砂）+ 提示带 + 角色胶囊
   顶栏 alpha 取高值（.72），抗 headless backdrop-filter 掉透明 bug
   ============================================================ */
html[data-theme="cloud-blue"] .topbar{
  background:rgba(240,246,255,.72);
  -webkit-backdrop-filter:blur(24px) saturate(1.8); backdrop-filter:blur(24px) saturate(1.8);
  border-bottom:1px solid rgba(255,255,255,.6);
}
html[data-theme="cloud-blue"] .topbar .crumb{color:var(--ink-3)}
html[data-theme="cloud-blue"] .demo-note{
  background:rgba(255,255,255,.42); border-bottom:1px solid rgba(255,255,255,.6); color:var(--ink-3);
}
html[data-theme="cloud-blue"] .role-chip{
  background:rgba(255,255,255,.6); color:var(--accent);
  border:1px solid rgba(255,255,255,.85); border-radius:999px; box-shadow:var(--shadow);
}
html[data-theme="cloud-blue"] .role-chip::before{background:var(--accent)}

/* ============================================================
   玻璃卡通用工艺
   ============================================================ */
html[data-theme="cloud-blue"] .card,
html[data-theme="cloud-blue"] .stat,
html[data-theme="cloud-blue"] .appcard,
html[data-theme="cloud-blue"] .auth-card,
html[data-theme="cloud-blue"] .modal-demo{
  background:var(--glass); border:1px solid var(--line); border-radius:var(--r);
  -webkit-backdrop-filter:blur(22px) saturate(1.6); backdrop-filter:blur(22px) saturate(1.6);
  box-shadow:var(--shadow);
}
html[data-theme="cloud-blue"] .card{padding:22px 24px}
html[data-theme="cloud-blue"] .auth-card{border-radius:24px; box-shadow:var(--shadow),0 30px 60px -24px rgba(16,28,56,.32)}
html[data-theme="cloud-blue"] .modal-demo{box-shadow:var(--shadow-lg)}
html[data-theme="cloud-blue"] .modal-demo .m-head{border-bottom-color:var(--line); font-family:var(--font-body)}
html[data-theme="cloud-blue"] .modal-demo .m-foot{background:rgba(255,255,255,.35); border-top-color:var(--line)}
html[data-theme="cloud-blue"] .card-sub{color:var(--ink-3)}

/* 统计卡：双轨改标签前置圆点（大圆角下 inset 色条有弧形伪影） */
html[data-theme="cloud-blue"] .stat.t-self, html[data-theme="cloud-blue"] .stat.t-sub{border-top:none}
html[data-theme="cloud-blue"] .stat.t-self .s-label::before,
html[data-theme="cloud-blue"] .stat.t-sub .s-label::before{
  content:""; width:8px; height:8px; border-radius:50%; flex:none; display:inline-block;
}
html[data-theme="cloud-blue"] .stat.t-self .s-label::before{background:var(--track-self)}
html[data-theme="cloud-blue"] .stat.t-sub .s-label::before{background:var(--track-sub)}
html[data-theme="cloud-blue"] .stat .s-num{font-weight:800; letter-spacing:-.01em;
  background:linear-gradient(135deg,#16223c,#2563eb); -webkit-background-clip:text; background-clip:text; color:transparent}
html[data-theme="cloud-blue"] .stat.t-sub .s-num{background:linear-gradient(135deg,#16223c,#b3761a); -webkit-background-clip:text; background-clip:text}
html[data-theme="cloud-blue"] .stat .s-label, html[data-theme="cloud-blue"] .stat .s-sub{color:var(--ink-3)}

/* 应用/模型卡 */
html[data-theme="cloud-blue"] .appcard{padding:18px 20px; transition:transform .3s, box-shadow .3s}
html[data-theme="cloud-blue"] .appcard:hover{transform:translateY(-4px); border-color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 2px 4px rgba(30,64,175,.07),0 26px 52px -14px rgba(30,64,175,.24)}
html[data-theme="cloud-blue"] .appcard .a-logo{
  background:linear-gradient(135deg,#eaf2ff,#cfe3ff); color:var(--accent);
  border-radius:13px; box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
html[data-theme="cloud-blue"] .appcard .a-desc{color:var(--ink-2)}
html[data-theme="cloud-blue"] .appcard .corner{
  top:14px; right:14px; transform:none; border-radius:999px; padding:4px 12px;
  font-size:10.5px; font-weight:700; color:#fff;
  background:linear-gradient(135deg,#f0a03c,#d4562e); box-shadow:0 4px 12px -4px rgba(212,86,46,.5)}
html[data-theme="cloud-blue"] .appcard.off{opacity:.6}
html[data-theme="cloud-blue"] .appcard.off:hover{transform:none}

/* ============================================================
   按钮 → 135° 蓝渐变胶囊
   ============================================================ */
html[data-theme="cloud-blue"] .btn{
  border-radius:999px; padding:8px 18px; font-size:12.5px; font-weight:600; border:none;
  color:#fff; background:linear-gradient(135deg,#3b82f6,#1d4ed8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 8px 20px -8px var(--blue-glow); transition:transform .25s, box-shadow .25s, opacity .25s;
}
html[data-theme="cloud-blue"] .btn:hover{filter:none; transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 12px 26px -8px rgba(37,99,235,.5)}
html[data-theme="cloud-blue"] .btn.ghost{
  background:rgba(255,255,255,.55); color:var(--ink); border:1px solid rgba(255,255,255,.85);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); font-weight:500; box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
html[data-theme="cloud-blue"] .btn.ghost:hover{border-color:#fff; background:rgba(255,255,255,.75); transform:translateY(-1px)}
html[data-theme="cloud-blue"] .btn.plain{background:rgba(255,255,255,.55); color:var(--ink-2); border:1px solid rgba(255,255,255,.7); box-shadow:none}
html[data-theme="cloud-blue"] .btn.warn{background:linear-gradient(135deg,#f0b45c,#d4952e); color:#fff}
html[data-theme="cloud-blue"] .btn.danger{background:linear-gradient(135deg,#e0705a,#b23a2b); color:#fff}
html[data-theme="cloud-blue"] .btn.sm{padding:5px 14px; font-size:12px; border-radius:999px}
html[data-theme="cloud-blue"] .btn.disabled, html[data-theme="cloud-blue"] .btn[disabled]{
  background:rgba(255,255,255,.4); color:var(--ink-3); border:none; box-shadow:none; opacity:1; filter:none}

/* ============================================================
   徽章 / 角标 / yid
   ============================================================ */
html[data-theme="cloud-blue"] .tag{
  border:none; border-radius:999px; padding:3px 11px; font-size:10.5px;
  background:var(--chip); color:var(--ink-2)}
html[data-theme="cloud-blue"] .tag.self{background:var(--track-self-bg); color:var(--track-self); font-weight:600}
html[data-theme="cloud-blue"] .tag.sub{background:var(--track-sub-bg); color:var(--track-sub); font-weight:600}
html[data-theme="cloud-blue"] .tag.ok{background:var(--ok-bg); color:var(--ok); font-weight:600}
html[data-theme="cloud-blue"] .tag.warn{background:var(--warn-bg); color:var(--warn); font-weight:600}
html[data-theme="cloud-blue"] .tag.bad{background:var(--bad-chip); color:var(--bad); font-weight:700}
html[data-theme="cloud-blue"] .tag.info{background:var(--info-bg); color:var(--info)}
html[data-theme="cloud-blue"] .tag.pend{background:var(--pend-bg); color:var(--pend)}
html[data-theme="cloud-blue"] .tag.dim{background:transparent; color:var(--ink-3); border:1px dashed var(--line-strong)}
html[data-theme="cloud-blue"] .tag.mirror{background:transparent; color:var(--track-sub); border:1px dashed var(--track-sub)}
html[data-theme="cloud-blue"] .yid{
  border-radius:999px; background:var(--blue-l); color:var(--lime-ink); font-weight:600; padding:2px 10px;
  font-family:var(--font-mono)}

/* ============================================================
   提示条 / 口径横幅
   ============================================================ */
html[data-theme="cloud-blue"] .note{border:1px solid rgba(255,255,255,.7); border-radius:var(--r-md); background:rgba(255,255,255,.45)}
html[data-theme="cloud-blue"] .note.ok{background:var(--ok-bg); color:#0d6b4a}
html[data-theme="cloud-blue"] .note.warn{background:var(--warn-bg); color:#7a651f}
html[data-theme="cloud-blue"] .note.bad{background:var(--bad-bg); color:#9a4f38}
html[data-theme="cloud-blue"] .note.info{background:var(--info-bg); color:#33507e}
html[data-theme="cloud-blue"] .note b{color:inherit}

/* 口径横幅：深色对比模块（navy + 蓝辉光） */
html[data-theme="cloud-blue"] .banner{
  border-radius:var(--r); color:#cdd9f0;
  background:radial-gradient(560px 300px at 88% -20%, rgba(127,176,255,.24), transparent 60%),linear-gradient(140deg,#1d2c50,#101c38 72%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 20px 44px -18px rgba(16,28,56,.5)}
html[data-theme="cloud-blue"] .banner b{color:#fff}
html[data-theme="cloud-blue"] .banner .tag{background:rgba(255,255,255,.14); color:#9ec2ff; border:none}

/* ============================================================
   表格
   ============================================================ */
html[data-theme="cloud-blue"] table.tbl{
  border-radius:var(--r-md); overflow:hidden; background:rgba(255,255,255,.5);
  -webkit-backdrop-filter:blur(18px) saturate(1.5); backdrop-filter:blur(18px) saturate(1.5);
  border:1px solid var(--line); box-shadow:var(--shadow)}
html[data-theme="cloud-blue"] .tbl th{background:rgba(232,239,254,.6); color:var(--ink-2); border-bottom:none; letter-spacing:.06em}
html[data-theme="cloud-blue"] .tbl td{border-bottom-color:rgba(255,255,255,.55); color:var(--ink-2)}
html[data-theme="cloud-blue"] .tbl tr:hover td{background:rgba(255,255,255,.4)}
html[data-theme="cloud-blue"] .tbl .sub-row td{background:rgba(255,255,255,.32)}
html[data-theme="cloud-blue"] .tbl .num{color:var(--ink)}

/* ============================================================
   状态浮条 + 验收注记
   ============================================================ */
html[data-theme="cloud-blue"] .state-pill{
  background:radial-gradient(220px 80px at 50% -30%, rgba(127,176,255,.3), transparent),linear-gradient(140deg,#1d2c50,#101c38);
  box-shadow:0 18px 44px -12px rgba(16,28,56,.55)}
html[data-theme="cloud-blue"] .state-pill button{color:#9fb0d4}
html[data-theme="cloud-blue"] .state-pill button:hover{color:#fff}
html[data-theme="cloud-blue"] .state-pill button.on{background:linear-gradient(135deg,#3b82f6,#1d4ed8); color:#fff; font-weight:600}
html[data-theme="cloud-blue"] .state-pill .sp-anno.on{background:rgba(127,176,255,.28); color:#dbe6fb}
html[data-theme="cloud-blue"] .state-pill .sp-label{color:#7f92b8}

/* 验收注记：仅降视觉权重（原文保留） */
html[data-theme="cloud-blue"] .anno{
  background:transparent; border:1px dashed var(--line-strong); color:var(--ink-3);
  border-radius:999px; font-size:10px}
html[data-theme="cloud-blue"] .anno.block{border-radius:var(--r-md); background:rgba(255,255,255,.3)}
html[data-theme="cloud-blue"] .tbd{background:var(--bad-chip); color:var(--bad); border:none; border-radius:999px}

/* ============================================================
   表单
   ============================================================ */
html[data-theme="cloud-blue"] .input, html[data-theme="cloud-blue"] select.input, html[data-theme="cloud-blue"] textarea.input{
  background:rgba(255,255,255,.6); border:1px solid rgba(255,255,255,.85); border-radius:999px; padding:9px 16px;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:inset 0 1px 2px rgba(30,64,175,.05)}
html[data-theme="cloud-blue"] textarea.input{border-radius:var(--r-md)}
html[data-theme="cloud-blue"] .input:focus{outline:2px solid color-mix(in srgb, var(--accent) 35%, transparent); border-color:rgba(37,99,235,.5)}
html[data-theme="cloud-blue"] .input[disabled]{background:rgba(255,255,255,.35); color:var(--ink-3); box-shadow:none}
html[data-theme="cloud-blue"] .field label{color:var(--ink-2)}
html[data-theme="cloud-blue"] .hint{color:var(--ink-3)}
html[data-theme="cloud-blue"] .hint.err{color:var(--bad); font-weight:600}
html[data-theme="cloud-blue"] .radio-card{
  border:1.5px solid transparent; background:rgba(255,255,255,.5); border-radius:var(--r-md); box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px)}
html[data-theme="cloud-blue"] .radio-card.sel{border-color:var(--accent); background:rgba(232,239,254,.6); box-shadow:0 0 0 1px var(--accent),var(--shadow)}
html[data-theme="cloud-blue"] .radio-card p{color:var(--ink-3)}
html[data-theme="cloud-blue"] .switch{background:#c3d2ea}
html[data-theme="cloud-blue"] .switch.on{background:var(--accent)}
html[data-theme="cloud-blue"] .check input{accent-color:var(--accent)}

/* ============================================================
   流程 / 时间线 / 进度
   ============================================================ */
html[data-theme="cloud-blue"] .flow .f-step{background:rgba(255,255,255,.45); border-color:var(--line)}
html[data-theme="cloud-blue"] .flow .f-step::before{background:inherit; border-color:var(--line)}
html[data-theme="cloud-blue"] .flow .f-step.done{background:var(--ok-bg)}
html[data-theme="cloud-blue"] .flow .f-step.cur{background:linear-gradient(135deg,#3b82f6,#1d4ed8); border-color:transparent; color:#fff}
html[data-theme="cloud-blue"] .flow .f-step.cur h5{color:#fff}
html[data-theme="cloud-blue"] .flow .f-step.cur p{color:rgba(255,255,255,.8)}
html[data-theme="cloud-blue"] .flow .f-step.sub-cur{background:var(--track-sub-bg); color:var(--track-sub); border-color:transparent}
html[data-theme="cloud-blue"] .flow .f-step.sub-cur h5, html[data-theme="cloud-blue"] .flow .f-step.sub-cur p{color:var(--track-sub)}
html[data-theme="cloud-blue"] .flow .f-step.blocked{background:var(--bad-bg)}
html[data-theme="cloud-blue"] .timeline li{border-left-color:var(--line-strong)}
html[data-theme="cloud-blue"] .timeline li::before{background:#fff; border-color:var(--accent)}
html[data-theme="cloud-blue"] .timeline li.warn::before{border-color:var(--track-sub)}
html[data-theme="cloud-blue"] .timeline li.bad::before{border-color:var(--bad)}
html[data-theme="cloud-blue"] .timeline .t-time{color:var(--ink-3)}
html[data-theme="cloud-blue"] .prog{background:rgba(200,216,240,.6); border-radius:999px}
html[data-theme="cloud-blue"] .prog i{background:linear-gradient(90deg,#3b82f6,#1d4ed8)}
html[data-theme="cloud-blue"] .prog i.sub{background:var(--track-sub)}
html[data-theme="cloud-blue"] .prog i.bad{background:var(--bad)}

/* ============================================================
   其它组件
   ============================================================ */
html[data-theme="cloud-blue"] .errcode{background:var(--bad-chip); color:var(--bad); border-radius:999px}
html[data-theme="cloud-blue"] .keymask{background:var(--chip); border:1px solid rgba(255,255,255,.7); border-radius:999px}
html[data-theme="cloud-blue"] .amt.pos{color:var(--ok)}
html[data-theme="cloud-blue"] .amt.neg{color:var(--bad)}

/* 代码块：深色对比模块（navy + 蓝语法） */
html[data-theme="cloud-blue"] .code{
  background:radial-gradient(420px 200px at 90% -20%, rgba(127,176,255,.14), transparent 60%),#101c38;
  color:#cfe0f8; border-radius:var(--r-md); box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
html[data-theme="cloud-blue"] .code .c-k{color:#7fb0ff}
html[data-theme="cloud-blue"] .code .c-s{color:#9fd8c9}

html[data-theme="cloud-blue"] .skel{background:linear-gradient(90deg, rgba(255,255,255,.4) 25%, rgba(255,255,255,.7) 50%, rgba(255,255,255,.4) 75%); background-size:300% 100%}

/* 居中态：图标托盘（emoji 已替换为 .ic svg） */
html[data-theme="cloud-blue"] .center-state .cs-icon{
  display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px;
  border-radius:18px; font-size:24px; opacity:1; color:var(--accent);
  background:linear-gradient(135deg,#eaf2ff,#cfe3ff); box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
html[data-theme="cloud-blue"] .center-state h3{font-family:var(--font-body); font-weight:800}
html[data-theme="cloud-blue"] .center-state p{color:var(--ink-2)}

/* Tab → 玻璃胶囊 */
html[data-theme="cloud-blue"] .tabs{border-bottom:none; gap:6px}
html[data-theme="cloud-blue"] .tabs .tab{
  border-bottom:none; margin-bottom:0; border-radius:999px; padding:8px 18px; font-size:12.5px;
  background:rgba(255,255,255,.5); border:1px solid rgba(255,255,255,.75); box-shadow:var(--shadow)}
html[data-theme="cloud-blue"] .tabs .tab.on{background:linear-gradient(135deg,#3b82f6,#1d4ed8); color:#fff; border-color:transparent; font-weight:600}
html[data-theme="cloud-blue"] .tabs .tab:hover:not(.on){color:var(--accent)}

/* 权限矩阵 */
html[data-theme="cloud-blue"] .perm-cell{border-radius:999px}
html[data-theme="cloud-blue"] .perm-none{background:var(--chip); color:var(--ink-3)}
html[data-theme="cloud-blue"] .perm-read{background:var(--info-bg); color:var(--info)}
html[data-theme="cloud-blue"] .perm-edit{background:var(--blue-l); color:var(--lime-ink); font-weight:700}

/* 通行页 */
html[data-theme="cloud-blue"] .auth-brand .b-sub{color:var(--ink-3)}
html[data-theme="cloud-blue"] .sec-h .line{background:linear-gradient(90deg,var(--line-strong),transparent)}
html[data-theme="cloud-blue"] .kv dt{color:var(--ink-3)}

/* ============================================================
   响应式兜底（沿用参考断点 1180/900/640）
   ============================================================ */
@media (max-width:1180px){
  html[data-theme="cloud-blue"] .g4{grid-template-columns:repeat(2,1fr)}
  html[data-theme="cloud-blue"] .g5{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  html[data-theme="cloud-blue"] .g5{grid-template-columns:repeat(2,1fr)}
  html[data-theme="cloud-blue"] .content{padding:16px 14px 130px}
  html[data-theme="cloud-blue"] .state-pill{max-width:calc(100vw - 16px); flex-wrap:wrap; justify-content:center; border-radius:18px}
  /* 宽内容在自身容器内滚动，页面不得横向滚动 */
  html[data-theme="cloud-blue"] table.tbl{display:block; overflow-x:auto; max-width:100%}
  html[data-theme="cloud-blue"] .code, html[data-theme="cloud-blue"] .keymask{max-width:100%; overflow-x:auto}
  html[data-theme="cloud-blue"] .banner, html[data-theme="cloud-blue"] .card, html[data-theme="cloud-blue"] .note{overflow-wrap:anywhere}
}
@media (max-width:640px){
  html[data-theme="cloud-blue"] .g2, html[data-theme="cloud-blue"] .g3, html[data-theme="cloud-blue"] .g4, html[data-theme="cloud-blue"] .g5{grid-template-columns:1fr}
  html[data-theme="cloud-blue"] .flow{flex-direction:column}
  html[data-theme="cloud-blue"] .flow .f-step::before{display:none}
  html[data-theme="cloud-blue"] .flow .f-step{border-left:1px solid var(--line); border-radius:0}
  html[data-theme="cloud-blue"] .flow .f-step:first-child{border-radius:var(--r-md) var(--r-md) 0 0}
  html[data-theme="cloud-blue"] .flow .f-step:last-child{border-radius:0 0 var(--r-md) var(--r-md)}
}
