/* ════════════════════════════════════════════════
   theme.css · 日间（浅色）主题
   原理：app.css 已全部变量化，这里只覆盖 :root 变量，
        再补几条浅色下需要单独处理的规则。
   ════════════════════════════════════════════════ */

html[data-theme="light"]{
  /* ── 主色板 ── */
  --bg:#eef3f9; --panel:#ffffff; --panel2:#f4f7fb; --panel3:#eaf0f7;
  --line:#d5e0ec; --line2:#b3c6da;
  --acc:#0b7fa3; --acc-d:#57b8d4; --acc2:#6d4df0; --amber:#a86a00;
  --ok:#0f7c55; --danger:#cf2438;
  --text:#1e2c3f; --dim:#57697f; --dim2:#6d7d92;

  /* ── 文本层级 ── */
  --text-hi:#12212f; --text-hi2:#0b1826; --btn-fg:#0d5468;

  /* ── 凹陷底面 ── */
  --sunken:#f8fbfe; --sunken2:#f2f6fb; --sunken3:#eef3f9;
  --port-bg:#ffffff; --switch-bg:#e4ecf4; --track:#dde7f1; --ring-border:#ffffff;

  /* ── 透明棋盘 ── */
  --chk-a:#ffffff; --chk-b:#e6edf5;
  --chk2-a:#ffffff; --chk2-b:#e9eff6;

  /* ── 弱填充 / 阴影 ── */
  --fill:rgba(12,42,68,.035); --fill2:rgba(12,42,68,.055);
  --sh:rgba(23,45,74,.20); --sw-border:rgba(0,0,0,.2);
  --dotted:rgba(120,145,175,.55); --dotted2:rgba(120,145,175,.45);
  --glass-s:rgba(255,255,255,.88); --badge-bg:rgba(255,255,255,.9);
  --thumb-close:rgba(255,255,255,.92); --scrim-bg:rgba(23,45,74,.34);
  --btn-primary-fg:#06323d; --danger-fg:#8f1024;

  /* ── 滚动条 ── */
  --sb-track:#e7eef6; --sb-thumb:#c3d3e3; --sb-thumb-h:#a6bcd4;

  /* ── 背景光晕 / 网格 ── */
  --glow:
    radial-gradient(1100px 560px at 15% -8%,rgba(11,127,163,.13),transparent 62%),
    radial-gradient(900px 520px at 92% -4%,rgba(109,77,240,.10),transparent 58%);
  --gridimg:
    linear-gradient(rgba(11,127,163,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,127,163,.055) 1px,transparent 1px);
  --gridimg2:
    linear-gradient(rgba(11,127,163,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,127,163,.08) 1px,transparent 1px);

  /* ── 面板渐变 ── */
  --g-topbar:linear-gradient(180deg,#ffffff,#f5f9fd);
  --g-side:linear-gradient(180deg,#fbfdff,#f1f6fb);
  --g-panel:linear-gradient(180deg,#ffffff,#fbfdff);
  --g-card:linear-gradient(160deg,#ffffff,#f5fafd);
  --g-bar:linear-gradient(180deg,#ffffff,#f6fafd);
  --g-bar2:linear-gradient(180deg,#ffffff,#f7fbfe);
  --g-node:linear-gradient(180deg,#ffffff,#f8fbfe);
  --g-fsel:linear-gradient(180deg,#ffffff,#f8fbfe);
  --g-drawer:linear-gradient(180deg,#ffffff,#f4f8fc);

  /* ── 半透明强调底（浅色下加深一点才有存在感） ── */
  --acc-a1:rgba(11,127,163,.10);
  --acc-a2:rgba(11,127,163,.16);
  --acc-a3:rgba(11,127,163,.22);
}

/* ── 浅色下需要单独调整的规则 ── */
html[data-theme="light"] ::selection{background:rgba(11,127,163,.24)}
html[data-theme="light"] body{color-scheme:light}

html[data-theme="light"] .panel-h{background:var(--acc-a1)}
html[data-theme="light"] .dropzone{
  background:repeating-linear-gradient(45deg,rgba(11,127,163,.045) 0 9px,transparent 9px 18px);
}
html[data-theme="light"] .dropzone:hover{background:var(--acc-a1)}
html[data-theme="light"] .dropzone.over{background:var(--acc-a2)}
html[data-theme="light"] .topbar{box-shadow:0 1px 0 rgba(11,127,163,.16),0 8px 26px -18px var(--sh)}
html[data-theme="light"] .modcard:hover{
  box-shadow:0 16px 34px -24px rgba(23,45,74,.42),0 0 0 1px rgba(11,127,163,.12) inset;
}
html[data-theme="light"] .modcard::after{
  background:radial-gradient(circle,rgba(11,127,163,.13),transparent 68%);
}
html[data-theme="light"] .logo{
  background:linear-gradient(160deg,rgba(11,127,163,.14),transparent);
  text-shadow:0 0 10px rgba(11,127,163,.30);
}
html[data-theme="light"] .btn.primary{text-shadow:none}
html[data-theme="light"] .fcanvas-wrap,
html[data-theme="light"] .bpcv{background-image:var(--gridimg2)}
html[data-theme="light"] .sw{border-color:rgba(0,0,0,.22)}
html[data-theme="light"] .thumb button,
html[data-theme="light"] .fcell .lockbtn{color:var(--dim)}
html[data-theme="light"] .node,
html[data-theme="light"] .toast,
html[data-theme="light"] .fselbar{box-shadow:0 10px 26px -20px var(--sh)}
html[data-theme="light"] .scrim{backdrop-filter:blur(2px)}
html[data-theme="light"] .drawer{box-shadow:-24px 0 60px -34px var(--sh)}
html[data-theme="light"] .modal{background:rgba(23,45,74,.40)}
html[data-theme="light"] .wsbadge{color:#8a5200}

/* 颜色选择器 / 数值输入在浅色下的原生控件外观 */
html[data-theme="light"] input[type=color].colorin{border-color:var(--line2)}
html[data-theme="light"] .rng::-webkit-slider-thumb{border-color:#ffffff}