/* ============================================================
   星露谷 (Stardew Valley) 主题
   —— 只定义「设计变量(tokens)」；结构样式在 globals.css 里读取这些变量。
   切换/新增主题时，业务组件零改动。
   ============================================================ */

[data-theme="stardew"],
:root {
  color-scheme: light;

  /* ---------- 调色板（星露谷原味） ---------- */
  --sv-sky: #8ec9e8;
  --sv-sky-deep: #6bb0da;
  --sv-grass: #7bb661;
  --sv-grass-deep: #4f8a3a;
  --sv-grass-dark: #3a6b2c;
  --sv-wood: #a9713e;
  --sv-wood-light: #c89b63;
  --sv-wood-dark: #6f451f;
  --sv-wood-darker: #4a2d13;
  --sv-parchment: #f6e6c2;
  --sv-parchment-light: #fdf3d7;
  --sv-parchment-deep: #eacf97;
  --sv-ink: #4a3520;
  --sv-ink-soft: #6b5135;
  --sv-gold: #f4b942;
  --sv-gold-deep: #e08b2d;
  --sv-berry: #d1495b;
  --sv-plum: #7d5ba6;

  /* ---------- 语义色（组件读取这些） ---------- */
  --color-bg: var(--sv-parchment);
  --listing-bg:
    linear-gradient(rgba(253, 243, 215, clamp(0, calc((var(--bg-texture-alpha, 0.747) - 0.45) * 0.65), 0.36)), rgba(253, 243, 215, clamp(0, calc((var(--bg-texture-alpha, 0.747) - 0.45) * 0.65), 0.36))),
    url("/images/textures/stardew-light-oak-tile.webp");
  --listing-bg-size: auto, 640px;
  --nav-underlay: #342013;
  --color-bg-image:
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.35) 0 2px, transparent 3px),
    radial-gradient(circle at 82% 62%, rgba(120, 80, 40, 0.06) 0 2px, transparent 3px),
    linear-gradient(180deg, rgba(248, 234, 208, var(--bg-texture-alpha, 0.78)) 0%, rgba(246, 230, 194, var(--bg-texture-alpha, 0.78)) 46%, rgba(239, 220, 176, var(--bg-texture-alpha, 0.85)) 100%),
    url("/images/textures/stardew-parchment-tile.png");
  --color-surface: var(--sv-parchment-light);
  --color-surface-2: var(--sv-parchment-deep);
  --color-text: var(--sv-ink);
  --color-text-muted: var(--sv-ink-soft);
  --color-heading: var(--sv-wood-darker);

  --color-border: var(--sv-wood-dark);
  --color-border-soft: #cda56a;
  --color-shadow: #1b0d06;

  --color-primary: #2f6028;
  --color-primary-hover: var(--sv-grass-dark);
  --color-on-primary: #f4ffe9;
  --color-accent: var(--sv-gold);
  --color-accent-deep: #96551b;
  --color-link: #2f6028;
  --color-link-hover: #96551b;
  --color-danger: #a32f43;
  --color-success: #2f6028;

  /* 滚动条（像素木质：暖黄轨 + 深木滑块 + 金色悬停） */
  --scrollbar-track: var(--sv-parchment-deep);
  --scrollbar-thumb: var(--sv-wood-dark);
  --scrollbar-thumb-hover: var(--sv-gold-deep);

  /* ---------- 纹理 / 渐变（主题专属质感） ---------- */
  --wood-gradient:
    linear-gradient(rgba(65, 34, 14, 0.58), rgba(42, 21, 9, 0.64)),
    url("/images/textures/game-wood-tile.webp") center / 256px repeat;
  --wood-plank: var(--wood-gradient);
  --panel-gradient:
    linear-gradient(180deg, rgba(253, 243, 215, var(--panel-texture-alpha, 0.58)) 0%, rgba(246, 230, 194, var(--panel-texture-alpha, 0.64)) 100%),
    url("/images/textures/stardew-parchment-tile.png") center / 360px repeat;
  --sky-gradient: linear-gradient(
    180deg,
    var(--sv-sky) 0%,
    #b7e0f0 55%,
    #d9f0e2 100%
  );
  --header-gradient: var(--wood-plank);

  /* ---------- 字体 ---------- */
  /* Fusion Pixel（缝合像素·OFL）覆盖中英文与数字，全站统一像素风；长文正文可另用 --font-reading */
  --font-pixel: var(--font-pixel-src), "Segoe UI", system-ui, sans-serif;
  --font-body: var(--font-pixel-src), "PingFang SC", "Microsoft YaHei",
    "Noto Sans SC", system-ui, sans-serif;
  --font-reading: "PingFang SC", "Microsoft YaHei", "Noto Sans SC",
    "Hiragino Sans GB", system-ui, -apple-system, sans-serif;
  --font-mono: var(--font-geist-mono), "Cascadia Code", "Consolas", monospace;

  /* ---------- 尺寸 / 形状（像素风：小圆角 + 硬阴影） ---------- */
  --radius: 4px;
  --radius-lg: 8px;
  --border-width: 3px;
  --pixel: 4px;

  /* 木质相框粗细（文章卡 / 面板外框）——调这一处即可整体改边框粗细 */
  --frame-width: 13px;
  /* 文章卡内图文分隔线粗细 */
  --card-divider-width: 3px;

  /* 硬边像素阴影（无模糊，偏移投影） */
  --shadow-pixel: 4px 4px 0 0 var(--color-shadow);
  --shadow-pixel-sm: 3px 3px 0 0 var(--color-shadow);
  --shadow-pixel-lg: 6px 6px 0 0 var(--color-shadow);
  --shadow-inset: inset 0 0 0 2px rgba(255, 255, 255, 0.35);

  /* ---------- 版式 ---------- */
  --content-width: 1120px;
  --prose-width: 760px;

  /* ============================================================
     语义 token 契约（扩展）
     —— globals.css 与所有组件只读这一段里的变量。
     —— 新增主题时复制并覆盖这一整段即可整站换肤；不要在组件里直接引用 --sv-*。
     ============================================================ */

  /* 文字扩展 */
  --heading-shadow: 4px 4px 0 rgba(201, 155, 99, 0.45);
  --on-dark: #fff0ca;   /* 深色 chrome（木牌/按钮/导航）上的文字 */
  --on-accent: #4a2d13; /* 金色/accent 上的深色文字 */
  --accent-soft: #ffe9b0; /* 淡强调：导航选中字 / 高光 */

  /* 招牌 / 横幅（wood-sign、导航、移动面板、技能栏底） */
  --sign-bg: var(--wood-plank);
  --sign-border: #b78345;

  /* 按钮 */
  --btn-bg: var(--wood-gradient);
  --btn-border: #b78345;
  --btn-primary-bg: linear-gradient(180deg, #416f31, #325824);
  --btn-primary-border: var(--sv-grass-dark);
  --btn-accent-bg: linear-gradient(180deg, var(--sv-gold) 0%, var(--sv-gold-deep) 100%);
  --btn-accent-border: #a85e18;
  --btn-ghost-hover-bg: rgba(111, 69, 31, 0.08);

  /* 品牌 logo / 角色胶囊 */
  --brand-bg: var(--btn-primary-bg);
  --brand-border: var(--sv-grass-dark);

  /* 标签 tag */
  --tag-bg: var(--color-surface-2);
  --tag-text: var(--sv-wood-darker);
  --tag-border: var(--color-border-soft);
  --tag-hover-bg: var(--sv-gold);
  --tag-hover-text: #4a2d13;
  --tag-hover-border: var(--sv-gold-deep);

  /* 表单 */
  --field-bg: #fffaf0;

  /* 代码 / 表格 */
  --code-inline-bg: #fff3d6;
  --code-inline-text: #a32f43;
  --table-head-bg: var(--sv-wood-dark);
  --code-border: var(--sv-wood-darker);
  --code-caption-bg: var(--sv-wood-darker);

  /* 提示框 callout（信息 / 提示 / 警告 / 成功） */
  --callout-info: var(--sv-plum);
  --callout-tip: #346b2c;
  --callout-warn: var(--sv-gold-deep);
  --callout-success: var(--sv-grass-dark);

  /* 首页小组件 */
  --slot-bg: url("/images/stardew/stardew-slot.png") center / cover no-repeat; /* 像素背包格 */
  --slot-border: transparent;
  --slot-num: #a8823f;
  --cell-empty: #efe3c4;   /* 四季图空格 */
  --avatar-bg: linear-gradient(180deg, var(--sv-parchment-light), var(--sv-parchment-deep));

  /* 首页 Hero 主视觉背景（stardew 由 HeroScene 农场覆盖，其余主题用这些绘制通用主视觉） */
  --hero-card-bg: linear-gradient(180deg, rgba(253, 243, 215, var(--hero-card-alpha, 0.95)), rgba(244, 227, 188, var(--hero-card-alpha, 0.92)));
  --hero-sky-top: #7db8e0;
  --hero-sky-mid: #a9d6ee;
  --hero-sky-bottom: #eaf3d3;
  --hero-horizon: #a7d08a;
  --hero-glow: rgba(255, 242, 191, 0.6);
  --hero-particle: rgba(255, 255, 255, 0.7);
  --hero-motif: none; /* 各主题可放一层专属图案（SVG data-uri） */
}

/* ============================================================
   星露谷 · 夜晚变体（深浅色双态）
   —— data-daytime="night" 时覆盖语义色为暖木深棕夜色 + 奶油米字 + 暖金标题（贴合木质，主流 cozy dark）。
   跟随系统 prefers-color-scheme，或用户手动切换（见 SettingsPanel）。
   ============================================================ */
[data-theme="stardew"][data-daytime="night"] {
  --listing-bg:
    linear-gradient(rgba(28, 21, 15, 0.78), rgba(28, 21, 15, 0.78)),
    url("/images/textures/stardew-light-oak-tile.webp");
  color-scheme: dark;

  --color-bg: #241a11;
  --color-bg-image:
    radial-gradient(circle at 18% 16%, rgba(255, 220, 160, 0.05) 0 1px, transparent 2px),
    radial-gradient(circle at 68% 26%, rgba(255, 220, 160, 0.04) 0 1px, transparent 2px),
    linear-gradient(180deg, rgba(48, 34, 20, 0.82) 0%, rgba(30, 21, 12, 0.9) 100%),
    url("/images/textures/stardew-wood-tile.png");
  --color-surface: #382a1a;
  --color-surface-2: #46351f;
  --color-text: #f4ead7;
  --color-text-muted: #d8c8ad;
  --color-heading: #f6d98f;

  --color-border: #a5855b;
  --color-border-soft: #a5855b;
  --color-shadow: rgba(0, 0, 0, 0.6);

  --color-primary: #c3dfa0;
  --color-primary-hover: #d5edb7;
  --color-on-primary: #10230f;
  --color-accent: var(--sv-gold);
  --color-accent-deep: var(--sv-gold-deep);
  --color-link: #c3dfa0;
  --color-link-hover: var(--sv-gold);
  --color-danger: #ffb9b4;
  --color-success: #c3dfa0;

  --tag-bg: #493624;
  --tag-text: #fff0cf;
  --tag-border: #a5855b;
  --tag-hover-bg: #f4b942;
  --tag-hover-text: #4a2d13;
  --tag-hover-border: #ffe9b0;
  --btn-primary-bg: linear-gradient(180deg, #a6c784, #86ab65);
  --btn-primary-border: #c3dfa0;
  --brand-border: #c3dfa0;
  --btn-ghost-hover-bg: rgba(244, 217, 143, 0.12);
  --avatar-bg: linear-gradient(180deg, #493624, #382a1a);
  --cell-empty: #493624;
  --scrollbar-track: #241a11;
  --scrollbar-thumb: #a5855b;
  --scrollbar-thumb-hover: #f4b942;

  --panel-gradient:
    linear-gradient(180deg, rgba(30, 23, 16, 0.76), rgba(24, 18, 12, 0.78)),
    url("/images/textures/stardew-parchment-tile.png") center / 360px repeat;
  /* 木牌沿用游戏集的暖灯木材，夜间不再用浓黑色罩盖住木纹。 */
  --hero-card-bg: linear-gradient(180deg, rgba(58, 42, 26, var(--hero-card-alpha, 0.95)), rgba(42, 30, 18, var(--hero-card-alpha, 0.92)));

  --field-bg: #2e2013;
  --code-inline-bg: #2a2013;
  --code-inline-text: #ffc1b2;
  --table-head-bg: #2a2013;

  --hero-sky-top: #1a1206;
  --hero-sky-mid: #2a1e10;
  --hero-sky-bottom: #3a2a18;
  --hero-glow: rgba(244, 185, 66, 0.14);
  --hero-particle: rgba(255, 224, 160, 0.8);

  --heading-shadow: 3px 3px 0 rgba(0, 0, 0, 0.45);
  --shadow-inset: inset 0 0 0 2px rgba(255, 230, 190, 0.05);
}
/* 夜色只由前景/背景 token 控制，不对文字和封面施加整卡滤镜。 */

/* 只使用阅读档位，不再消费旧后台连续字重设置。 */
[data-theme="stardew"] {
  --font-weight-body: 400;
  --font-weight-ui: var(--font-weight-body);
  --font-weight-strong: 700;
}
html[data-theme="stardew"]:is([data-font="bold"], [data-font^="bold-"], [data-font="pixel-bold"], [data-font^="pixel-bold-"]) {
  --font-weight-body: 700;
  --font-weight-ui: var(--font-weight-body);
  --font-weight-strong: 900;
}

/* ============================================================
   星露谷 · 高辨识度鼠标指针（沿用矢量轮廓；不影响独立游戏）
   ============================================================ */
@media (hover: hover) and (pointer: fine) {
  [data-theme="stardew"] body:not(:has(.game-theme)) {
    cursor: url("/images/stardew/cursor-arrow.svg") 5 3, auto;
  }
  [data-theme="stardew"] body:not(:has(.game-theme)) :is(a, button, [role="button"], summary, label[for], select) {
    cursor: url("/images/stardew/cursor-hand.svg") 12 4, pointer;
  }
  [data-theme="stardew"] body:not(:has(.game-theme)) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="file"]):not([type="color"]), textarea, [contenteditable="true"]) {
    cursor: text;
  }
  [data-theme="stardew"] body:not(:has(.game-theme)) :is(:disabled, [aria-disabled="true"]) {
    cursor: not-allowed;
  }
}

/* 左右导航使用同一种轻量入口，保留整条木纹，不再给操作按钮套小木牌。 */
[data-theme="stardew"] .site-root .nav-action {
  color: var(--on-dark);
  background: transparent;
  border: 2px solid transparent;
  border-radius: var(--radius);
  box-shadow: none;
  font-family: var(--font-pixel);
  font-size: var(--nav-label-size);
  font-weight: var(--font-weight-ui, 700);
  min-height: var(--nav-control-size);
  filter: none;
  text-shadow: 1px 1px 0 var(--nav-underlay);
  transition: background 0.12s ease, transform 0.1s steps(2);
}
[data-theme="stardew"] .site-root .nav-action:hover {
  color: var(--on-dark);
  background: color-mix(in srgb, var(--nav-underlay) 30%, transparent);
  border-color: transparent;
  box-shadow: none;
  filter: none;
  transform: translateY(-1px);
}
[data-theme="stardew"] .site-root .nav-action:is([data-active="true"], [aria-expanded="true"]) {
  color: var(--accent-soft);
  border-color: var(--color-accent);
  background: color-mix(in srgb, var(--nav-underlay) 40%, transparent);
}
[data-theme="stardew"] .site-root .nav-action:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  [data-theme="stardew"] .site-root .nav-action {
    transition: none;
    transform: none;
  }
}

/* ============================================================
   星露谷 · AI 像素素材接入（木质雕花相框）
   ============================================================ */

/* 木质雕花相框（9-slice border-image；白色中心被丢弃，露出羊皮纸底）
   粗细由 --frame-width 控制（见上方 token 段，后台可调） */
[data-theme="stardew"] .wood-sign {
  border-radius: 0;
  box-shadow: var(--shadow-pixel-sm);
}

/* 整个前台共享画布，文章/分类/登录等新路由自动接入。 */
[data-theme="stardew"] .site-root {
  background-image: var(--listing-bg);
  background-size: var(--listing-bg-size);
  background-repeat: repeat;
}
[data-theme="stardew"] .wood-bg {
  background: transparent;
  box-shadow: none;
}

/* 背景木纹只出现在画布，不穿透羊皮纸卡片。 */
[data-theme="stardew"] :is(.panel, .pixel-card) {
  background-color: var(--color-surface);
}

[data-theme="stardew"] .btn-primary {
  text-shadow: none;
}
[data-theme="stardew"] .btn-ghost:hover {
  background: var(--btn-ghost-hover-bg);
}
[data-theme="stardew"] :is(input, textarea)::placeholder {
  color: var(--color-text-muted);
  opacity: 1;
}

/* Shiki 的浅红/紫语法色不能被高亮底洗淡；边线仍负责标识重点行。 */
[data-theme="stardew"] .prose pre code [data-highlighted-line] {
  background: color-mix(in srgb, var(--color-accent) 6%, transparent);
}
[data-theme="stardew"] .prose pre code [data-highlighted-chars] {
  background: color-mix(in srgb, var(--color-accent) 8%, transparent);
}

[data-theme="stardew"] .panel,
[data-theme="stardew"] .pixel-card {
  border: var(--frame-width) solid transparent;
  border-image: url("/images/stardew/stardew-wood-frame-v2.png") 150 / var(--frame-width) / 0 round;
  border-radius: 0;
}
[data-theme="stardew"] .pixel-card:hover {
  filter: brightness(1.03);
}

/* 像素图标替换 emoji（未映射的 data-icon 保留 emoji） */
[data-theme="stardew"] .ui-icon[data-icon="wheat"],
[data-theme="stardew"] .ui-icon[data-icon="backpack"],
[data-theme="stardew"] .ui-icon[data-icon="leaf"],
[data-theme="stardew"] .ui-icon[data-icon="book"],
[data-theme="stardew"] .ui-icon[data-icon="github"],
[data-theme="stardew"] .ui-icon[data-icon="mail"],
[data-theme="stardew"] .ui-icon[data-icon="farmer"] {
  color: transparent;
  text-shadow: none;
  background-position: center;
  background-repeat: no-repeat;
  image-rendering: pixelated;
}
[data-theme="stardew"] .ui-icon[data-icon="book"] {
  width: 20px; height: 20px; font-size: 0; vertical-align: middle;
  background-image: url("/images/stardew/stardew-icon-book.png"); background-size: contain;
}
[data-theme="stardew"] .ui-icon[data-icon="wheat"] {
  width: 22px; height: 22px; font-size: 0; vertical-align: middle;
  background-image: url("/images/stardew/stardew-icon-wheat.png"); background-size: contain;
}
[data-theme="stardew"] .ui-icon[data-icon="backpack"] {
  width: 22px; height: 22px; font-size: 0; vertical-align: middle;
  background-image: url("/images/stardew/stardew-icon-backpack.png"); background-size: contain;
}
[data-theme="stardew"] .ui-icon[data-icon="leaf"] {
  width: 18px; height: 18px; font-size: 0; vertical-align: middle;
  background-image: url("/images/stardew/stardew-icon-leaf.png"); background-size: contain;
}
[data-theme="stardew"] .ui-icon[data-icon="github"] {
  width: 24px; height: 24px; font-size: 0;
  background-image: url("/images/stardew/stardew-icon-cat.png"); background-size: contain;
}
[data-theme="stardew"] .ui-icon[data-icon="mail"] {
  width: 24px; height: 24px; font-size: 0;
  background-image: url("/images/stardew/stardew-icon-mail.png"); background-size: contain;
}
[data-theme="stardew"] .ui-icon[data-icon="farmer"] {
  font-size: 0;
  background-image: url("/images/stardew/stardew-avatar-farmer.png");
  background-size: cover;
  background-position: center;
}

/* 分类卡片：木箱像素图标（每主题不同，取代 emoji 📁） */
[data-theme="stardew"] .ui-icon[data-icon="folder"] {
  color: transparent;
  text-shadow: none;
  font-size: 0;
  width: 46px;
  height: 46px;
  background-image: url("/images/stardew/stardew-icon-folder.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  image-rendering: pixelated;
  filter: drop-shadow(1px 2px 0 rgba(60, 40, 15, 0.3));
}

/* 技能背包：像素科技图标替换 emoji（React/Next/TS/Node/Go/Python/CSS/SQL） */
[data-theme="stardew"] .ui-icon[data-icon="react"],
[data-theme="stardew"] .ui-icon[data-icon="next"],
[data-theme="stardew"] .ui-icon[data-icon="typescript"],
[data-theme="stardew"] .ui-icon[data-icon="node"],
[data-theme="stardew"] .ui-icon[data-icon="go"],
[data-theme="stardew"] .ui-icon[data-icon="python"],
[data-theme="stardew"] .ui-icon[data-icon="css"],
[data-theme="stardew"] .ui-icon[data-icon="sql"] {
  color: transparent;
  text-shadow: none;
  font-size: 0;
  width: clamp(26px, 7.5vw, 36px);
  height: clamp(26px, 7.5vw, 36px);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  image-rendering: pixelated;
  filter: drop-shadow(1px 2px 0 rgba(60, 40, 15, 0.35));
}
[data-theme="stardew"] .ui-icon[data-icon="react"] {
  background-image: url("/images/stardew/stardew-tech-react.png");
}
[data-theme="stardew"] .ui-icon[data-icon="next"] {
  background-image: url("/images/stardew/stardew-tech-next.png");
}
[data-theme="stardew"] .ui-icon[data-icon="typescript"] {
  background-image: url("/images/stardew/stardew-tech-typescript.png");
}
[data-theme="stardew"] .ui-icon[data-icon="node"] {
  background-image: url("/images/stardew/stardew-tech-node.png");
}
[data-theme="stardew"] .ui-icon[data-icon="go"] {
  background-image: url("/images/stardew/stardew-tech-go.png");
}
[data-theme="stardew"] .ui-icon[data-icon="python"] {
  background-image: url("/images/stardew/stardew-tech-python.png");
}
[data-theme="stardew"] .ui-icon[data-icon="css"] {
  background-image: url("/images/stardew/stardew-tech-css.png");
}
[data-theme="stardew"] .ui-icon[data-icon="sql"] {
  background-image: url("/images/stardew/stardew-tech-sql.png");
}
