/* 林间 theme：只在 html[data-ui="grove"] 下生效。经典界面完全不走这里。
   Forest palette, one accent (moss), amber only for warnings. */

html[data-ui="grove"] {
  --brand-1: #2f6f4e;
  --brand-2: #3d8a62;
  --brand-3: #245a3f;
  --bg-1: #e4eee6;
  --bg-2: #f0f4ee;
  --ink: #1c2a22;
  --ink-soft: #5b6b60;
  --card: #f6faf6;
  --green: #2f9d6a;
  --green-soft: #d9f3e4;
  --red: #c45c4a;
  --red-soft: #f8e4df;
  --amber: #c9892a;
  --radius: 16px;
  --shadow: 0 14px 36px rgba(36, 90, 63, .11);
  --shadow-sm: 0 4px 14px rgba(28, 42, 34, .08);
}

html[data-ui="grove"] {
  scrollbar-color: #7a9a82 transparent;
}
html[data-ui="grove"]::-webkit-scrollbar-thumb {
  background: #8aaa90;
}

html[data-ui="grove"] body {
  font-family: "Avenir Next", "Segoe UI Variable Display", "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei UI", sans-serif;
  background:
    radial-gradient(980px 520px at 8% -8%, rgba(63, 122, 88, .16), transparent 58%),
    radial-gradient(760px 420px at 108% 6%, rgba(201, 168, 92, .14), transparent 52%),
    linear-gradient(180deg, #e6efe8 0%, #f2f6f1 46%, #e8efe8 100%);
  letter-spacing: .01em;
}

html[data-ui="grove"] body::before {
  background: #8fb89a;
  opacity: .26;
  filter: blur(100px);
}
html[data-ui="grove"] body::after {
  background: #d3c28a;
  opacity: .2;
  filter: blur(110px);
}

html[data-ui="grove"] .brand .logo {
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(47, 111, 78, .32);
  letter-spacing: 0;
}
html[data-ui="grove"] .brand .name {
  letter-spacing: .14em;
  font-size: 15px;
  font-weight: 800;
}

html[data-ui="grove"] .user-chip {
  background: rgba(246, 250, 246, .82);
  border: 1px solid rgba(47, 111, 78, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), var(--shadow-sm);
}

html[data-ui="grove"] .ui-theme-tab.on {
  background: var(--brand-1);
  color: #f6faf6;
}

html[data-ui="grove"] .btn-primary,
html[data-ui="grove"] .combo-btn.primary,
html[data-ui="grove"] .combo-mic,
html[data-ui="grove"] .loose-btn,
html[data-ui="grove"] .loose-go,
html[data-ui="grove"] .record-go,
html[data-ui="grove"] .story-mic,
html[data-ui="grove"] .g-dot,
html[data-ui="grove"] .user-chip .avatar {
  background: var(--brand-1);
  box-shadow: 0 8px 18px rgba(47, 111, 78, .28);
}
html[data-ui="grove"] .btn-primary {
  background: var(--brand-1);
}
html[data-ui="grove"] .btn-primary:hover,
html[data-ui="grove"] .loose-btn:hover {
  box-shadow: 0 10px 22px rgba(47, 111, 78, .38);
}

html[data-ui="grove"] .btn-ghost,
html[data-ui="grove"] .combo-btn.ghost,
html[data-ui="grove"] .record-cancel,
html[data-ui="grove"] .story-close,
html[data-ui="grove"] .review-close {
  background: #e7efe8;
  color: var(--ink);
}

html[data-ui="grove"] .card,
html[data-ui="grove"] .group,
html[data-ui="grove"] .pool-card,
html[data-ui="grove"] .login-card {
  background: var(--card);
  border: 1px solid rgba(47, 111, 78, .1);
  box-shadow: var(--shadow-sm);
}

html[data-ui="grove"] .group {
  border-color: #d5e3d8;
}

html[data-ui="grove"] .wc-face {
  background: #fbfefb;
  border-color: #d7e5db;
}
html[data-ui="grove"] .wc-word,
html[data-ui="grove"] .combo-word,
html[data-ui="grove"] .combo-dict-prompt,
html[data-ui="grove"] .combo-speak-prompt,
html[data-ui="grove"] .ring-word,
html[data-ui="grove"] .loose-riddle {
  letter-spacing: .015em;
}

html[data-ui="grove"] .wc-peek-btn {
  background: #e4f0e6;
  color: var(--brand-1);
  border-radius: 999px;
}
html[data-ui="grove"] .wc-peek-btn:hover { background: #d5e8d9; }

html[data-ui="grove"] .progress-track { background: #d7e3d9; }
html[data-ui="grove"] .progress-fill {
  background: linear-gradient(90deg, #2f9d6a, #4fb57f);
}

html[data-ui="grove"] .pool-slot {
  background: #eef4ef;
  border-color: #d5e3d8;
}
html[data-ui="grove"] .g-tab {
  background: #f6faf6;
  color: var(--ink-soft);
}
html[data-ui="grove"] .g-tab.on {
  background: var(--brand-1);
  color: #f6faf6;
}

html[data-ui="grove"] .memory-tabs { border-bottom-color: #dce8de; }
html[data-ui="grove"] .memory-tab {
  background: #eef4ef;
  border-color: #d5e3d8;
}
html[data-ui="grove"] .memory-tab.on {
  background: #f6faf6;
  color: var(--brand-1);
  border-color: #7eaa8a;
  box-shadow: 0 4px 14px rgba(47, 111, 78, .12);
}

html[data-ui="grove"] .story-overlay,
html[data-ui="grove"] .loose-overlay,
html[data-ui="grove"] .review-overlay,
html[data-ui="grove"] .add-words-overlay {
  background: rgba(22, 36, 28, .52);
}
html[data-ui="grove"] .story-modal,
html[data-ui="grove"] .review-modal {
  background: #f6faf6;
  box-shadow: 0 28px 70px rgba(22, 36, 28, .32);
}
html[data-ui="grove"] .story-words .sw {
  background: #e4f0e6;
  color: var(--brand-1);
}
html[data-ui="grove"] .story-prompt,
html[data-ui="grove"] .story-lines .line,
html[data-ui="grove"] .review-meaning {
  background: #eef4ef;
}
html[data-ui="grove"] .story-lines .line.active {
  background: #d9eedf;
  border-left-color: var(--brand-1);
}
html[data-ui="grove"] .story-mic {
  box-shadow: 0 10px 28px rgba(47, 111, 78, .35);
}

html[data-ui="grove"] .add-word-btn {
  background: #f3f8f3;
  color: #1c2a22;
  border-color: rgba(47, 111, 78, .16);
  box-shadow: 0 6px 16px rgba(36, 90, 63, .12), inset 0 1px 0 rgba(255,255,255,.8);
}
html[data-ui="grove"] .add-word-plus {
  background: var(--brand-1); color: #f6faf6;
}
html[data-ui="grove"] .add-words-sheet {
  background:
    linear-gradient(90deg, transparent 36px, #c9a45c 36px, #c9a45c 38px, transparent 38px),
    repeating-linear-gradient(180deg, transparent 0 31px, rgba(47, 111, 78, .07) 31px 32px),
    #eef4ee;
  box-shadow: 0 30px 70px rgba(22, 36, 28, .32);
}
html[data-ui="grove"] .add-words-title { color: #1c2a22; }
html[data-ui="grove"] .add-words-kicker { color: #6a8a72; }
html[data-ui="grove"] .add-words-lead,
html[data-ui="grove"] .add-words-hint { color: #5b6b60; }
html[data-ui="grove"] .add-words-input { color: #1c2a22; }
html[data-ui="grove"] .add-words-mic,
html[data-ui="grove"] .empty-add { background: var(--brand-1); color: #f6faf6; }
html[data-ui="grove"] .add-words-go {
  background: #c9892a; color: #fffaf3;
  box-shadow: 0 8px 18px rgba(201, 137, 42, .28);
}
html[data-ui="grove"] .add-words-chip {
  background: rgba(246, 250, 246, .85);
  border-color: rgba(47, 111, 78, .12);
}
html[data-ui="grove"] .next-line-btn {
  background: var(--brand-1);
  box-shadow: 0 8px 18px rgba(47, 111, 78, .3);
}
html[data-ui="grove"] .next-line-btn:hover {
  box-shadow: 0 10px 24px rgba(47, 111, 78, .4);
}

html[data-ui="grove"] .combo-side {
  background: #fbfefb;
  border-color: #d7e5db;
  box-shadow: var(--shadow-sm);
}
html[data-ui="grove"] .combo-hint { color: #7a8c80; }
html[data-ui="grove"] .combo-rec {
  background: #eef4ef;
  border-color: #d5e3d8;
}
html[data-ui="grove"] .combo-rec:focus {
  background: #fbfefb;
}
html[data-ui="grove"] .combo-btn.remember { background: #d9f3e4; color: #1f7a52; }
html[data-ui="grove"] .rv-btn.peek {
  background: #e4f0e6;
  color: var(--brand-1);
}

html[data-ui="grove"] .mic-loud-tip {
  background: #f4efe2;
  border-color: #d4b36a;
  color: #5c4316;
  box-shadow: 0 8px 18px rgba(171, 122, 38, .12);
}

html[data-ui="grove"] .loose-btn {
  box-shadow: 0 6px 16px rgba(47, 111, 78, .32);
}
html[data-ui="grove"] .loose-modal,
html[data-ui="grove"] .loose-head {
  background: #eef4ef;
}
html[data-ui="grove"] .loose-card {
  background: #fbfefb;
  border-color: #d5e3d8;
}
html[data-ui="grove"] .loose-card:hover,
html[data-ui="grove"] .loose-card:active {
  border-color: #7eaa8a;
  box-shadow: 0 8px 20px rgba(47, 111, 78, .12);
}
html[data-ui="grove"] .loose-no {
  background: #e4f0e6;
  color: var(--brand-1);
}
html[data-ui="grove"] .loose-log-btn {
  border-color: #b7d0bc;
  background: #fbfefb;
  color: var(--brand-1);
}
html[data-ui="grove"] .loose-log-btn:active { background: #e4f0e6; }
html[data-ui="grove"] .loose-table {
  background: #fbfefb;
}
html[data-ui="grove"] .loose-table th {
  background: #eef4ef;
  border-bottom-color: #d5e3d8;
}
html[data-ui="grove"] .loose-table tbody tr:active,
html[data-ui="grove"] .loose-table tbody tr.on {
  background: #e4f0e6;
}
html[data-ui="grove"] .record-action {
  background: #fbfefb;
  border-color: #d5e3d8;
}

html[data-ui="grove"] .more-btn {
  background: #e4f0e6;
}
html[data-ui="grove"] .more-btn:active { background: #d5e8d9; }
html[data-ui="grove"] .more-menu {
  background: #fbfefb;
}
html[data-ui="grove"] .more-menu button {
  background: #fbfefb;
}
html[data-ui="grove"] .more-menu button:active { background: #e4f0e6; }

html[data-ui="grove"] .field input {
  border-color: #d5e3d8;
  background: #fbfefb;
}
html[data-ui="grove"] .hint-box {
  background: #eef4ef;
}
html[data-ui="grove"] .login-card {
  box-shadow: 0 24px 60px rgba(36, 90, 63, .16);
}

html[data-ui="grove"] .toast {
  background: #1c2a22;
}

html[data-ui="grove"] .lock-icon {
  filter: drop-shadow(0 3px 6px rgba(47, 111, 78, .28));
}
html[data-ui="grove"] .fog-panel {
  background: linear-gradient(160deg, rgba(228, 238, 230, .94) 0%, rgba(246, 250, 246, .98) 100%);
}

@media (prefers-reduced-motion: reduce) {
  html[data-ui="grove"] .ui-theme-tab,
  html[data-ui="grove"] .btn,
  html[data-ui="grove"] .loose-btn {
    transition: none;
  }
}

@media (prefers-reduced-transparency: reduce) {
  html[data-ui="grove"] .user-chip {
    background: #f6faf6;
    backdrop-filter: none;
  }
}
