@layer light {
/* AUTO-EXTRACTED from styles.css — LIGHT theme rules.
Loaded AFTER styles.css for natural cascade override.
Regenerate with: node scripts/theme-extract.cjs --apply
*/
html[data-theme="light"] .wwm-brand-vert { border-color: var(--gold); }
html[data-theme="light"] .hero {
background:
radial-gradient(ellipse 70% 100% at 0% 50%, var(--vermilion-tint), transparent 60%),
linear-gradient(180deg, rgba(244,232,204,0.65), rgba(232,218,184,0.72)),
url("https://www.wherewindsmeetgame.com/m/zt/20251121182818/img/xf-bg-23f42caf.png") center / cover no-repeat;
}
html[data-theme="light"] .wwm-footer-logo { filter: brightness(0) saturate(100%) invert(35%) sepia(20%) saturate(800%) hue-rotate(15deg); }
html[data-theme="light"] .wwm-sb-tier-badge.tier-S {
animation: tier-s-pulse-light-mini 2.2s ease-in-out infinite;
}
/* S2-d split: safe 組 (lang/preset) と unsafe 組 (icon-btn hover 競合 / hero box-shadow 競合) を分離 */
html[data-theme="light"] .icon-btn:focus-visible,
html[data-theme="light"] .hero:focus-visible {
box-shadow: 0 0 0 4px var(--vermilion-bright-soft);
}
html[data-theme="light"] {
--bg-0: #ede2c8;
--bg-1: #e6dabd;
--bg-2: #ddd0ad;
--bg-3: #d4c69b;
--surf-1: rgba(255, 248, 228, 0.55);
--surf-2: rgba(244, 232, 204, 0.72);
--surf-shade: rgba(58, 38, 22, 0.06);
--surf-shade-2:rgba(58, 38, 22, 0.10);
--surf-shade-3:rgba(58, 38, 22, 0.14);
--rail-grad: linear-gradient(180deg, rgba(58,38,22,0.10), rgba(58,38,22,0.04) 60%, rgba(58,38,22,0.08));
--input-bg: rgba(255, 250, 235, 0.85);
--input-text: #5e3a14;
--header-grad: linear-gradient(180deg, rgba(244,232,204,0.85), rgba(232,218,184,0.85));
--hero-grad: radial-gradient(ellipse 70% 100% at 0% 50%, var(--vermilion-tint), transparent 60%),
linear-gradient(180deg, rgba(244,232,204,0.85), rgba(232,218,184,0.92));
--hero-num: #8a1f17;
--hero-num-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 0 24px var(--vermilion-soft-2);
--donut-track: rgba(58,38,22,0.10);
--ink-1: rgba(40, 25, 18, 0.10);
--ink-2: rgba(40, 25, 18, 0.20);
--ink-3: rgba(40, 25, 18, 0.35);
--paper: #3a2a20;
--paper-2: #3a2818;
--paper-dim: #5a4226;
--paper-mute:#6a5236;
--gold: #8a6a20;
--gold-bright: #5e4310;
--gold-deep: #c9a45a;
--gold-glow: rgba(138, 106, 32, 0.3);
--jade: #4a7a5a;
--jade-bright: #2d5a3a;
--vermilion-bright: #c83c2b;
--vermilion-glow: var(--vermilion-mid-2);
--bone: #6a5236;
--bone-dim: #8a7350;
/* ─── Phase 5.3-B: Semantic component token overrides ─── */
--c-surf-warm-1: #f4e8cc;
--c-surf-warm-2: #ede0c0;
--c-toast-bg: #fff8e8;
--c-modal-a-option-bg: #f4e8cc;
--c-rail-bg: linear-gradient(180deg, rgba(58,38,22,0.10), rgba(58,38,22,0.04) 60%, rgba(58,38,22,0.08)); /* light theme rail gradient (brown alpha scale) */
--c-text-warm: #5a3a20; /* modal-a 系 secondary text 統一色 */
--c-border-soft-warm: rgba(40,25,18,0.18); /* 暖色系 soft border (modal-a, mobile overlay) */
--c-border-mid-warm: rgba(40,25,18,0.25); /* 暖色系 mid border (modal-a select/input) */
--c-gold-rich: #b8860b; /* lv-select / section-title 用 rich gold (light のみ) */
--c-cream-pale: #f5e6c8; /* lv-select bg 用 淡 cream (light のみ) */
--c-overlay-cream: rgba(255,248,225,0.40); /* header bg blend overlay film */
--c-vermilion-fade-end: rgba(232,81,58,0.05); /* vermilion gradient 透明側 endpoint */
--c-fg-cream-bright: #fff8e8; /* accent bg 上 cream text (tier-S, opt-sort-btn.active) */
--c-gold-deep-faint: rgba(138,106,32,0.14); /* light theme dark-gold scale: faint (bg glow) */
--c-gold-deep-mid: rgba(138,106,32,0.25); /* light theme dark-gold scale: mid (drop-shadow wide) */
--c-gold-deep-strong: rgba(138,106,32,0.5); /* light theme dark-gold scale: strong (border, drop-shadow tight) */
--c-shadow-light: rgba(0,0,0,0.35); /* light theme element shadow (drop-shadow / inset) */
--c-mobile-overlay-top: rgba(248,238,210,0.98);/* mobile drawer/overlay gradient top */
--c-mobile-overlay-bot: rgba(235,222,188,0.98);/* mobile drawer/overlay gradient bottom */
/* tier badge palettes (hero-wuxia .hero-tier + .wwm-sb-tier-badge ペア) */
--c-tier-ss-grad-1: #f4d97a; --c-tier-ss-grad-2: #e8c548; --c-tier-ss-grad-3: #d4a930;
--c-tier-ss-fg: #5a3a0a; --c-tier-ss-border: rgba(184,134,11,0.9);
--c-tier-s-grad-1: #f4a89a; --c-tier-s-grad-2: #e87862;
--c-tier-s-fg: #4a1410; --c-tier-s-border: rgba(200,60,43,0.9);
--c-tier-a-grad-1: #c8e0c8; --c-tier-a-grad-2: #88b894; --c-tier-a-grad-3: #5a8868;
--c-tier-a-fg: #1a3a24; --c-tier-a-border: rgba(45,90,58,0.85);
--c-tier-b-grad-1: #e8d4a8; --c-tier-b-grad-2: #c4a868; --c-tier-b-grad-3: #8a7030;
--c-tier-b-fg: #3a2810; --c-tier-b-border: rgba(122,90,32,0.85);
--c-tier-c-grad-1: #d8ccb4; --c-tier-c-grad-2: #a89880; --c-tier-c-grad-3: #786850;
--c-tier-c-fg: #2a2010; --c-tier-c-border: rgba(90,66,38,0.85);
/* misc component-local pairs (B10) */
--c-header-cream-top: #ffeac4; /* header.topbar + .wwm-anlz-header gradient 上 */
--c-header-cream-bot: #fcd5a8; /* 同 gradient 下 */
--c-modal-a-option-checked: #e0cfa0; /* modal-a select option:checked bg */
--c-migration-accent: #2d5a8a; /* migration banner accent (青) */
--c-orange-deep: #b85a14; /* light theme 暗オレンジ accent (share warn / rank-gold val) */
/* opt-* button cluster: 暖橙 scale (B11) */
--c-opt-border-soft: rgba(120,60,20,0.35); /* opt-sort group/divider border */
--c-opt-border-mid: rgba(120,60,20,0.4); /* opt-btn border */
--c-opt-border-strong: rgba(120,60,20,0.7); /* opt-btn:hover border */
--c-opt-hover-bg: rgba(184,134,42,0.12);/* opt-sort/opt-btn hover bg */
/* additional gold-deep glow scale + vermilion-deep mid (B12) */
--c-gold-deep-glow-1: rgba(138,106,32,0.4); /* compare modal bg-icon drop-shadow */
--c-gold-deep-glow-2: rgba(138,106,32,0.45);/* regular modal bg-icon drop-shadow (PC+mobile) */
--c-vermilion-deep-mid: rgba(138,31,23,0.55); /* tier-SS / xinfa-tier-chip border */
/* vermilion + tier-SS halo (B16) */
--c-vermilion-glow-soft: rgba(200,60,43,0.25); /* seal / tier-S outer glow (light theme) */
--c-tier-ss-text-halo: rgba(255,255,255,0.55); /* tier-SS badge text 白 halo (hero + sb-badge) */
/* mobile overlay header + card bg film (B17) */
--c-mobile-overlay-header-bg: linear-gradient(180deg, rgba(248,238,210,0.95), rgba(235,222,188,0.92)); /* mobile stat/anlz overlay header gradient */
--c-card-bg-overlay-film: rgba(255,250,235,0.55); /* equip/xinfa-slot 背景 film (solid overlay layer) */
/* same-line gradient cluster (B18) */
--c-ink-line-faint: rgba(0,0,0,0.04); /* anlz-header::after decoration 細線 (1px alpha line) */
--c-gold-transparent-fade: rgba(184,134,11,0); /* mini-hero-ink gold horizontal accent fade endpoints */
--c-mini-hero-bg-film: rgba(245,236,209,0.85); /* mini-hero-card 全体 bg solid film layer */
/* misc text + glow (B13) */
--c-text-brown-bright: #8a5212; /* sb-mini-hero totalmartial / sb-applied */
--c-text-brown-dim: #6a4220; /* equip stat-pct / step2 muted */
--c-tier-ss-glow-pink: rgba(255,200,180,0.4);/* tier-SS inset/text glow (pink) */
--c-anlz-shadow-orange: rgba(120,60,20,.18); /* anlz-header / anlz-body box-shadow */
--c-sb-top-bg: #f5ead0; /* sidebar wwm-sb-top + sb-rest gradient 上 */
/* ─── @layer S2-j: theme-swap tokens (light 値) ─── */
--c-tier-C-text-shadow: none;
--c-cmp-col-border: var(--ink-2);
--c-cmp-lv-select-border: var(--c-gold-rich);
--c-num-input-border: var(--ink-2);
--c-btn-secondary-border: var(--ink-2);
--c-cmp-title--cmp-lv-border: var(--bone-dim);
--c-cmp-btn-row--btn-secondary-border: var(--bone-dim);
/* ─── @layer Step 2-i: theme-swap tokens (light 値) ─── */
--c-cmp-modal-a--cmp-kongfu-select-border: var(--c-border-mid-warm);
--c-cmp-modal-a--cmp-set-select-border: var(--c-border-mid-warm);
--c-cmp-title--cmp-lv-select-border: var(--bone-dim);
--c-cmp-modal-a--cmp-val-input-border: initial;
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
--c-cmp-modal-a--cmp-stat-select-border: var(--c-border-mid-warm);
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
--c-bm-code-border: var(--ink-2);
--c-xinfa-cell--xinfa-tier-border: var(--ink-2);
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
--c-cmp-kongfu-select-fg: var(--paper);
--c-cmp-set-select-fg: var(--paper);
--c-xinfa-tier-fg: var(--paper);
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
--c-cmp-current--cmp-row-bg: var(--surf-shade-2); /* S2-g cmp-current--cmp-row */
--c-cmp-current--cmp-kongfu-header-fg: var(--paper); /* S2-g cmp-current--cmp-kongfu-header */
--c-cmp-current--cmp-kongfu-header-bg: var(--surf-shade-2); /* S2-g cmp-current--cmp-kongfu-header */
--c-cmp-current--cmp-set-header-fg: var(--paper); /* S2-g cmp-current--cmp-set-header */
--c-cmp-current--cmp-set-header-bg: var(--surf-shade-2); /* S2-g cmp-current--cmp-set-header */
--c-cmp-modal-a--modal-close-fg: var(--brown-1); /* S2-g cmp-modal-a--modal-close */
--c-cmp-modal-a--optionchecked-checked-fg: var(--brown-1); /* S2-g cmp-modal-a--optionchecked-checked */
--c-cmp-lv-select--optionchecked-checked-fg: var(--brown-1); /* S2-g cmp-lv-select--optionchecked-checked */
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
--c-opt-sort-btn-border-left: var(--c-opt-border-soft);
--c-cmp-modal-a-fg: var(--brown-1);
/* ─── @layer Step 2-h: theme-swap tokens (light 値) ─── */
--c-focus-ring: var(--vermilion);
/* ─── @layer Step 2-g: theme-swap tokens (light 値) ─── */
--c-sb-totalmartial--b-text-shadow: none; /* S2-g sb-totalmartial--b */
--c-sb-totalmartial--muted-fg: #5a4326; /* S2-g sb-totalmartial--muted */
--c-sb-totalmartial--muted-opacity: 0.85; /* S2-g sb-totalmartial--muted */
--c-cmp-modal-a--cmp-delta-label-fg: var(--c-text-warm); /* S2-g cmp-modal-a--cmp-delta-label */
--c-cmp-modal-a--cmp-delta-base-fg: var(--bone-dim); /* S2-g cmp-modal-a--cmp-delta-base */
--c-hero-wuxia--hero-tier-tier-SS-before-right: auto; /* S2-g hero-wuxia--hero-tier-tier-SS-before */
--c-hero-wuxia--hero-tier-tier-SS-before-width: 120%; /* S2-g hero-wuxia--hero-tier-tier-SS-before */
--c-hero-wuxia--hero-tier-tier-SS-before-height: 100%; /* S2-g hero-wuxia--hero-tier-tier-SS-before */
--c-hero-wuxia--hero-tier-tier-SS-before-transform: translateX(-200%); /* S2-g hero-wuxia--hero-tier-tier-SS-before */
--c-hero-wuxia--hero-tier-tier-SS-before-z: 1; /* S2-g hero-wuxia--hero-tier-tier-SS-before */
--c-equip-section--stat-pct-opacity: 1; /* S2-g equip-section--stat-pct */
--c-step2-section-title-fw: 900; /* S2-g step2-section-title */
--c-step2--muted-opacity: 0.95; /* S2-g step2--muted */
--c-step2--num-input-bg: var(--hover-strong); /* S2-g step2--num-input */
--c-step2-section-title-border-bot: rgba(120,60,20,0.45); /* S2-g step2-section-title */
--c-step2--xinfa-cell-border-bot: 1px dashed rgba(120,60,20,0.25); /* S2-g step2--xinfa-cell */
--c-step2--xinfa-cell-pad-bot: var(--space-1); /* S2-g step2--xinfa-cell */
--c-step2--arsenal-tier-border: 1px solid rgba(120,60,20,0.3); /* S2-g step2--arsenal-tier */
--c-step2--arsenal-tier-bg: rgba(255,240,210,0.4); /* S2-g step2--arsenal-tier */
--c-anlz-title-fg-n2: #2a1610; /* S2-g anlz-title */
--c-anlz-title-text-shadow-n2: 0 0 0.5px rgba(42,22,16,.6), 0 0 1.5px rgba(74,40,20,.35), 0 0 3px rgba(106,62,22,.18), 0.6px 0 1.2px rgba(42,22,16,.25), -0.6px 0 1.2px rgba(42,22,16,.22), 0 0.5px 1.5px rgba(74,40,20,.14); /* S2-g anlz-title */
--c-anlz-subtitle-fg: var(--brown-5); /* S2-g anlz-subtitle */
--c-anlz-subtitle-opacity: 0.9; /* S2-g anlz-subtitle */
/* ─── @layer Step 2-f: theme-swap tokens (light 値) ─── */
--c-brand-seal-opacity: 0.8;
--c-brand-en-opacity: 0.75;
--c-shared-build-mode--shared-build-banner-border: var(--vermilion);
--c-lang-btn-focus-outline: var(--vermilion);
--c-hero-focus-outline: var(--vermilion);
--c-hero-number--unit-border-bot: var(--gold-bright);
--c-tier-C-shadow: none;
--c-sb-rest-border: rgba(40,25,18,0.15);
--c-opt-sort-group-border: var(--c-opt-border-soft);
--c-sb-section-title-border-left: 3px solid var(--gold-deep);
--c-sb-section-title-pad-left: var(--space-2);
--c-cmp-modal-a--cmp-title-ja-text-shadow: none;
--c-brand-sub-text-shadow: 0 0 4px var(--c-gold-deep-mid);
--c-diag-modal--modal-bg-icon-opacity: 0.22;
--c-xinfa-tier-chip-border: var(--c-vermilion-deep-mid);
--c-hero-label--en-opacity: .8;
--c-hero-wuxia--hero-next-val-text-shadow: 0 0 2px rgba(255,250,235,0.6);
--c-hero-wuxia--judge-name-text-shadow: 0 0 1px var(--hover-mid-2);
--c-hero-wuxia--judge-val-text-shadow: 0 0 2px rgba(255,250,235,0.7);
--c-hero-wuxia--judge-dot-phys-border: var(--vermilion-deep);
--c-hero-wuxia--hero-tier-tier-SS-shadow: 0 0 12px rgba(184,134,11,0.45), inset 0 1px 0 var(--hover-strong), inset 0 -1px 0 rgba(90,42,10,0.3);
--c-hero-wuxia--hero-tier-tier-S-shadow: 0 0 12px var(--vermilion-mid-strong), inset 0 1px 0 var(--hover-mid-2), inset 0 -1px 0 rgba(60,10,8,0.3);
--c-migration-banner-border-bot: var(--c-migration-accent);
--c-sb-label-fw: 500;
--c-note-cl-items--note-cl-featured-border-left: var(--vermilion-deep);
--c-note-cl-items--note-cl-featured-fg: var(--brown-1);
--c-mobile-drawer-border-left: var(--vermilion);
--c-cmp-modal-a--cmp-rows-border: initial;
--c-cmp-modal-a--cmp-rows-shadow: initial;
--c-cmp-modal-a--cmp-current-border: var(--c-border-soft-warm);
--c-cmp-modal-a--cmp-col-border: var(--c-border-soft-warm);
/* ─── @layer Step 2-e: theme-swap tokens (light 値) ─── */
--c-modal-a-rows-bg: var(--overlay-trace);
--c-modal-a-title-ja-fg: var(--c-modal-a-fg);
--c-modal-a-col-bg: var(--overlay-heavy);
--c-modal-a-kongfu-header-bg: var(--gold-tint);
--c-modal-a-kongfu-header-fg: var(--paper);
--c-modal-a-kongfu-select-fg: var(--brown-1);
--c-modal-a-set-fg: var(--vermilion-bright);
--c-modal-a-name-fg: var(--c-modal-a-fg);
--c-modal-a-val-fg: var(--c-fg-emphasis);
/* ─── @layer Step 2-d r3: theme-swap tokens (light 値) ─── */
--c-focus-ring-shadow: 0 0 0 4px var(--vermilion-bright-soft);
--c-equip-setname-fg: var(--vermilion-deep);
--c-equip-setname-text-shadow: none;
--c-cmp-set-header-fg: var(--vermilion-deep);
--c-modal-a-val-input-fg: var(--brown-1);
--c-modal-a-lv-bg: var(--hover-strong);
--c-hero-next-arrow-fg: var(--paper-mute);
/* ─── @layer Step 2-d r2: theme-swap tokens (light 値) ─── */
--c-preset-slot-num-fg: var(--vermilion);
--c-preset-save-fg: var(--gold-bright);
--c-preset-save-hover-fg: #fff5dc;
--c-preset-load-hover-fg: #fff;
--c-preset-del-hover-fg: #fff;
--c-hb-pct-phys-fg: rgba(200,60,43,0.75);
--c-hb-pct-elem-fg: var(--jade-bright);
--c-footer-strong-fg: var(--vermilion);
--c-tier-chip-ss-fg: var(--vermilion-deep);
--c-tier-chip-ss-bg: linear-gradient(135deg, var(--vermilion-soft-2), rgba(138,31,23,0.14));
--c-tier-chip-ss-border: var(--c-vermilion-deep-mid);
--c-tier-chip-ss-text-shadow: 0 0 10px rgba(200,60,43,0.45);
--c-tier-chip-s-fg: var(--c-fg-cream-bright);
--c-tier-chip-s-bg: linear-gradient(135deg, var(--vermilion) 0%, #a02818 100%);
--c-tier-chip-s-border: #6a1810;
--c-tier-chip-s-text-shadow: 0 1px 2px var(--overlay-soft-2), 0 0 8px var(--c-tier-ss-glow-pink);
--c-tier-chip-a-bg: rgba(74,122,90,0.12);
--c-tier-chip-a-border: rgba(74,122,90,0.42);
--c-tier-chip-a-text-shadow: none;
--c-tier-chip-b-fg: var(--bone-dim);
--c-tier-chip-b-bg: rgba(106,82,54,0.10);
--c-tier-chip-b-border: rgba(106,82,54,0.35);
--c-tier-chip-b-text-shadow: none;
--c-tier-chip-c-bg: var(--surf-shade);
--c-tier-chip-c-border: rgba(58,38,22,0.20);
--c-opt-sort-btn-fg: #5a4838;
--c-opt-sort-btn-hover-bg: var(--c-opt-hover-bg);
--c-opt-sort-btn-hover-fg: var(--brown-1);
/* audit P1 (2026-06-07): #b8862a + cream 3.06:1 fail → tokens.css の theme constant (金地墨字) に委譲、 override 撤去 */
--c-opt-btn-apply-border: rgba(45,90,58,0.4);
--c-opt-btn-apply-hover-border: rgba(45,90,58,0.7);
--c-rank-row-border-left: 1px solid rgba(120,60,20,0.36); /* critique P3: side-stripe 3px→1px */
--c-rank-row-border-bot: 1px solid rgba(120,60,20,0.16);
--c-rank-row-odd-bg: rgba(120,60,20,0.05);
--c-rank-row-hover-bg: rgba(212,175,55,0.16);
--c-rank-row-hover-border-left: #b8861a;
--c-eff-row-odd-bg: var(--surf-shade);
--c-eff-row-hover-bg: var(--surf-shade-2);
--c-cmp-lv-select-fg: var(--c-gold-rich);
--c-cmp-stat-select-bg: var(--surf-shade);
--c-btn-secondary-bg: var(--surf-shade-2);
--c-btn-secondary-fg: var(--paper);
--c-btn-secondary-hover-bg: var(--surf-shade-3);
--c-modal-a-kongfu-select-bg: var(--gold-mid);
--c-modal-a-set-select-bg: linear-gradient(90deg, var(--vermilion-bright-tint), var(--c-vermilion-fade-end));
--c-modal-a-stat-select-bg: var(--hover-strong);
--c-modal-a-lv-fg: var(--c-text-warm);
--c-modal-a-btn-secondary-bg: var(--hover-mid-2);
--c-slot-border: rgba(40,25,18,0.30);
--c-tier-badge-hero-bg: linear-gradient(180deg, var(--c-surf-warm-1), #e8dab8);
--c-tier-badge-hero-fg: var(--paper-dim);
--c-tier-badge-hero-border: rgba(122,90,32,.6);
--c-tier-ss-hero-bg: linear-gradient(135deg, var(--c-tier-ss-grad-1) 0%, var(--c-tier-ss-grad-2) 50%, var(--c-tier-ss-grad-3) 100%);
--c-tier-ss-hero-fg: var(--c-tier-ss-fg);
--c-tier-ss-hero-border: var(--c-tier-ss-border);
--c-tier-s-hero-bg: linear-gradient(135deg, var(--c-tier-s-grad-1) 0%, var(--c-tier-s-grad-2) 50%, var(--vermilion) 100%);
--c-tier-s-hero-fg: var(--c-tier-s-fg);
--c-tier-s-hero-border: var(--c-tier-s-border);
--c-tier-a-hero-bg: linear-gradient(135deg, var(--c-tier-a-grad-1) 0%, var(--c-tier-a-grad-2) 50%, var(--c-tier-a-grad-3) 100%);
--c-tier-a-hero-fg: var(--c-tier-a-fg);
--c-tier-a-hero-border: var(--c-tier-a-border);
--c-tier-b-hero-bg: linear-gradient(135deg, var(--c-tier-b-grad-1) 0%, var(--c-tier-b-grad-2) 50%, var(--c-tier-b-grad-3) 100%);
--c-tier-b-hero-fg: var(--c-tier-b-fg);
--c-tier-b-hero-border: var(--c-tier-b-border);
--c-tier-c-hero-bg: linear-gradient(135deg, var(--c-tier-c-grad-1) 0%, var(--c-tier-c-grad-2) 50%, var(--c-tier-c-grad-3) 100%);
--c-tier-c-hero-fg: var(--c-tier-c-fg);
--c-tier-c-hero-border: var(--c-tier-c-border);
--c-migration-strong-fg: #0e2c52;
--c-anlz-tab-fg: var(--brown-1);
--c-anlz-tab-active-fg: #8a5a14;
/* ─── @layer Step 2-d r1: theme-swap tokens (light 値) ─── */
--c-tier-chip-ss-shadow: 0 0 12px var(--vermilion-mid), inset 0 1px 0 rgba(255,200,180,0.3);
--c-tier-chip-ss-sheen: linear-gradient(105deg, transparent 25%, rgba(255,180,150,0.22) 50%, transparent 75%);
--c-tier-chip-s-shadow: 0 0 18px rgba(200,60,43,0.65), 0 0 32px var(--c-vermilion-glow-soft), inset 0 1px 0 rgba(255,230,210,0.45), inset 0 -1px 0 rgba(60,10,5,0.35);
--c-tier-chip-a-shadow: 0 0 8px rgba(74,122,90,0.18);
--c-tier-chip-b-shadow: none;
--c-modal-a-option-fg: var(--brown-1);
--c-anlz-title-fg: #1a0e08;
--c-anlz-title-text-shadow: 0 1px 0 var(--hover-mid-2);
/* ─── @layer Step 2-c: theme-swap tokens (light 値) ─── */
--c-hero-before-fg: rgba(160,28,18,0.18);
--c-brand-en-fg: var(--gold);
--c-brand-sub-fg: var(--vermilion-bright);
--c-shared-banner-bg: linear-gradient(90deg, var(--vermilion-soft-light), var(--vermilion-faint));
--c-shared-banner-fg: var(--vermilion-deep);
--c-footer-logo-opacity: 0.7;
--c-preset-bar-bg: rgba(232,218,184,0.92);
--c-h1-accent-fg: var(--vermilion);
--c-h1-sub-fg: var(--paper-dim);
--c-icon-btn-export-btn-border: var(--vermilion);
--c-preset-slot-has-data-bg: rgba(255,246,220,0.7);
--c-preset-slot-has-data-border: var(--vermilion-mid-strong);
--c-preset-save-border: var(--c-gold-deep-strong);
--c-preset-load-border: rgba(74,122,90,0.5);
--c-preset-load-hover-bg: var(--jade-bright);
--c-sb-mini-hero-ink-bg: linear-gradient(90deg, var(--c-gold-transparent-fade), rgba(184,134,11,0.16), var(--c-gold-transparent-fade));
--c-sb-rest-bg: linear-gradient(180deg, var(--c-sb-top-bg), var(--c-surf-warm-2));
--c-sb-applied-fg: var(--c-text-brown-bright);
--c-sb-applied-opacity: 1;
--c-equip-delta-pos-text-shadow: none;
--c-equip-delta-neg-fg: var(--vermilion-deep);
--c-equip-delta-neg-text-shadow: none;
--c-sb-notice-fg: var(--vermilion-deep);
--c-opt-loading-fg: var(--gold-deep);
--c-opt-loading-text-shadow: 0 0 8px rgba(168,120,40,0.3);
--c-opt-btn-fg: #5a4220;
--c-opt-btn-hover-bg: var(--c-opt-hover-bg);
--c-opt-btn-apply-hover-bg: rgba(168,212,180,0.25);
--c-eff-input-bg: var(--surf-shade-2);
--c-eff-input-fg: #000;
--c-sb-section-title-bg: rgba(122,90,32,0.18);
--c-sb-section-title-fg: var(--c-gold-rich);
--c-modal-fg: var(--paper);
--c-cmp-modal-a--modal-header-bg: transparent;
--c-cmp-title-en-fg: var(--c-text-warm);
--c-cmp-set-header-text-shadow: none;
--c-cmp-preview-zero-fg: var(--bone-dim);
--c-cmp-modal-bg-icon-opacity: 0.22;
--c-modal-bg-icon-opacity: 0.22;
--c-xinfa-tier-chip-bg: var(--vermilion-bright-tint);
--c-hero-number-text-shadow: none;
--c-hero-next-val-fg: #6e4a0c;
--c-luopan-center-label-fg: var(--vermilion-deep);
--c-judge-name-fg: var(--brown-1);
--c-judge-name-fw: var(--fw-bold);
--c-judge-val-fw: var(--fw-extra);
--c-judge-dot-phys-shadow: 0 0 4px rgba(138,36,24,0.45);
--c-judge-dot-elem-shadow: 0 0 4px rgba(45,90,58,0.45);
--c-tier-a-hero-shadow: 0 0 8px rgba(74,122,90,0.18);
--c-tier-b-hero-shadow: none;
--c-tier-c-hero-shadow: none;
--c-ink-stroke-opacity: 1;
--c-last-import-bg: linear-gradient(180deg, var(--surf-1), var(--surf-2));
--c-migration-banner-bg: rgba(60, 100, 180, 0.12);
--c-migration-banner-fg: #1a3a66;
--c-migration-btn-bg: var(--c-migration-accent);
--c-sb-label-opacity: 0.95;
--c-anlz-header-after-bg: linear-gradient(180deg, transparent 18%, var(--c-ink-line-faint) 19%, var(--c-ink-line-faint) 20%, transparent 21%), linear-gradient(180deg, transparent 60%, rgba(0,0,0,.025) 61%, transparent 62%);
--c-anlz-bamboo-opacity: 0.12; /* critique P2 (2026-06-07): 0.28 = 古紙上で泥灰の塊 → 墨絵の淡さへ */
--c-anlz-body-after-bg: repeating-linear-gradient(45deg, transparent 0 24px, rgba(120,60,20,.04) 24px 25px), repeating-linear-gradient(-45deg, transparent 0 24px, rgba(184,134,11,.04) 24px 25px);
--c-anlz-bgicon-opacity: 0.09; /* critique P2 (2026-06-07): 0.22 = 古紙上で黒 silhouette が泥灰の塊 → 墨絵の淡さへ */
--c-note-cl-featured-bg: linear-gradient(90deg, var(--vermilion-bright-trace), var(--c-vermilion-fade-end));
--c-score-update-banner-bg: var(--vermilion-tint);
--c-score-update-banner-fg: var(--vermilion-deep);
--c-mobile-drawer-bg: linear-gradient(180deg, var(--c-mobile-overlay-top), var(--c-mobile-overlay-bot));
--c-mobile-drawer-fg: var(--paper-2);
--c-mobile-fab-bg: linear-gradient(180deg, rgba(248,238,210,0.96), rgba(235,222,188,0.96));
--c-mobile-fab-shadow: 0 4px 16px var(--overlay-tint), 0 0 12px var(--vermilion-mid-2);
/* ─── @layer Step 2-b: theme-swap pair tokens (light 値) ─── */
--c-fg-accent: var(--vermilion); /* アクセント前景 (dark 明金 / light 朱) */
--c-fg-gold-label: var(--gold-bright); /* 金ラベル前景 (light は暗金) */
--c-fg-hidden-stat: #3d5266; /* 隠しステ行 青灰 */
--c-modal-a-fg: var(--brown-1); /* compare modal A 主文字色 */
--c-icon-dim-opacity: 0.22; /* equip/xinfa icon 背景透かし opacity */
--c-fg-vermilion-strong: var(--vermilion-deep); /* 朱前景 強調 (light は深朱) */
--c-fg-emphasis: var(--vermilion-deep); /* 見出し強調 (hero label ja / cmp-val-input) */
--c-anlz-shadow: 0 6px 18px var(--c-anlz-shadow-orange); /* anlz header/body 浮き shadow */
}
html[data-theme="light"] body {
background:
radial-gradient(ellipse 60% 35% at 50% 0%, var(--vermilion-soft-2), transparent 65%),
radial-gradient(ellipse 50% 25% at 0% 0%, var(--c-gold-deep-faint), transparent 70%),
radial-gradient(ellipse 50% 25% at 100% 0%, var(--c-gold-deep-faint), transparent 70%),
radial-gradient(ellipse 60% 70% at 100% 100%, rgba(138,106,32,0.10), transparent 55%),
url("data:image/svg+xml;utf8,"),
linear-gradient(var(--c-mini-hero-bg-film), var(--c-mini-hero-bg-film)),
url("https://www.wherewindsmeetgame.com/m/zt/20251121182818/img/bg-b74e3a33.png") center top / cover no-repeat fixed,
var(--bg-0);
}
html[data-theme="light"] header.topbar {
background:
linear-gradient(var(--c-overlay-cream), var(--c-overlay-cream)),
url("https://www.wherewindsmeetgame.com/m/zt/20251121182818/img/wq-bg-99758f80.png") center / cover no-repeat,
linear-gradient(180deg, var(--c-header-cream-top), var(--c-header-cream-bot));
background-blend-mode: normal, difference, normal;
}
html[data-theme="light"] .seal {
/* keep red seal but tone the gold inside a bit darker so it pops on paper */
}
html[data-theme="light"] .lang-btn { color: var(--paper-dim); }
html[data-theme="light"] .lang-btn:hover { color: var(--paper); }
/* critique P1 (2026-06-07): vermilion on vermilion-tint 2.09:1 fail → theme constant token (朱影地金文字 6.2:1)。
light:458 generic .lang-btn が layer 勝ちするため rule 削除不可 — token 置換で維持 */
html[data-theme="light"] .lang-btn.active { color: var(--c-lang-active-fg); background: var(--c-lang-active-bg); }
/* mobile drawer の active lang-btn: drawer は theme 不問 dark デザイン。
上の汎用 .lang-btn (paper-dim) に layer 移行後負けないよう明記 (2026-06-05 @layer Step 1 複製)
critique P1 (2026-06-07): vermilion-bright 3.94 fail → lang-active token */
html[data-theme="light"] .wwm-mobile-drawer-langs .lang-btn.active { color: var(--c-lang-active-fg); }
html[data-theme="light"] .icon-btn { color: var(--paper-dim); }
html[data-theme="light"] .icon-btn:hover { color: var(--vermilion-deep); border-color: var(--vermilion); background: var(--vermilion-faint); } /* audit P2 (2026-06-07): vermilion 2.03 → deep ~9:1 */
html[data-theme="light"] .icon-btn.export-btn { color: var(--vermilion); }
html[data-theme="light"] .icon-btn.export-btn:hover { background: var(--vermilion); color: #fff; }
html[data-theme="light"] .icon-btn.import-btn { color: var(--gold-bright); border-color: var(--gold); }
html[data-theme="light"] .icon-btn.import-btn:hover { background: var(--gold); color: #fff; }
html[data-theme="light"] .hcb-pct.phys { color: rgba(200,60,43,0.7); }
html[data-theme="light"] .hcb-pct.elem { color: var(--jade-bright); }
html[data-theme="light"] .hcb-val.phys { color: var(--vermilion); }
html[data-theme="light"] .hcb-val.elem { color: var(--jade-bright); }
html[data-theme="light"] #toast { border-left-color: var(--gold-bright); }
html[data-theme="light"] .tier-SS {
animation: tier-ss-glow-light 2.2s ease-in-out infinite;
}
html[data-theme="light"] .tier-S {
animation: tier-s-pulse-light 2.2s ease-in-out infinite;
}
html[data-theme="light"] .wwm-sb-mini-hero-card {
background: linear-gradient(180deg, var(--c-surf-warm-1), var(--c-surf-warm-2));
}
/* .wwm-sb-top light bg override は削除 (2026-06-05 pre-existing bug fix):
sb-top は mini-hero card 内のみ存在 (anlz.js)、 card 側が背景を持ち sb-top は
components の .wwm-sb-mini-hero-card .wwm-sb-top { background: none } が正。
theme layer からの撃ち抜きで light のみ cream 背景が復活していた */
html[data-theme="light"] [data-liupai-pinyin="tianquan"] .wwm-equip-icon,
html[data-theme="light"] [data-liupai-pinyin="tianquan"] .wwm-xinfa-icon {
filter:
brightness(0)
drop-shadow(0 0 3px rgba(20,60,140,0.75))
drop-shadow(0 0 8px rgba(20,60,140,0.55))
drop-shadow(0 0 16px rgba(20,60,140,0.35));
}
html[data-theme="light"] [data-liupai-pinyin="kuanglan"] .wwm-equip-icon,
html[data-theme="light"] [data-liupai-pinyin="kuanglan"] .wwm-xinfa-icon {
filter:
brightness(0)
drop-shadow(0 0 3px rgba(140,25,18,0.8))
drop-shadow(0 0 8px rgba(140,25,18,0.6))
drop-shadow(0 0 16px rgba(140,25,18,0.38));
}
html[data-theme="light"] [data-liupai-pinyin="qingxi"] .wwm-equip-icon,
html[data-theme="light"] [data-liupai-pinyin="qingxi"] .wwm-xinfa-icon {
filter:
brightness(0)
drop-shadow(0 0 3px rgba(20,110,55,0.75))
drop-shadow(0 0 8px rgba(20,110,55,0.55))
drop-shadow(0 0 16px rgba(20,110,55,0.35));
}
html[data-theme="light"] [data-liupai-pinyin="guyun"] .wwm-equip-icon,
html[data-theme="light"] [data-liupai-pinyin="guyun"] .wwm-xinfa-icon {
filter:
brightness(0)
drop-shadow(0 0 3px rgba(90,30,140,0.8))
drop-shadow(0 0 8px rgba(90,30,140,0.6))
drop-shadow(0 0 16px rgba(90,30,140,0.38));
}
html[data-theme="light"] .wwm-equip-liupai-badge {
filter: drop-shadow(0 1px 2px var(--c-shadow-light));
}
html[data-theme="light"] .wwm-sb-notice { background: var(--vermilion-tint); }
html[data-theme="light"] .wwm-opt-btn { border-color: var(--c-opt-border-mid); }
html[data-theme="light"] .wwm-opt-btn:hover { border-color: var(--c-opt-border-strong); }
/* S2-h split: cmp-col/row (modals dashed border 真競合 = stay) と share-url/bm-code を分離
S2-j split: col / row を分離 (cascade-neutral 隣接 + 同 decl) — row は modals:513/514 真競合で stay、
col は theme-shadow (light .wwm-cmp-modal-a .wwm-cmp-col/new) で解錠可のため物理 decl を独立化 */
html[data-theme="light"] .wwm-cmp-col {
background: var(--surf-shade);
}
html[data-theme="light"] .wwm-cmp-row {
background: var(--surf-shade);
border-color: var(--ink-2);
}
html[data-theme="light"] .wwm-share-url,
html[data-theme="light"] .wwm-bm-code {
background: var(--surf-shade);
}
html[data-theme="light"] .wwm-eff-row {
border-bottom: 1px solid var(--ink-2);
}
html[data-theme="light"] .wwm-eff-input {
border-color: var(--ink-2);
}
html[data-theme="light"] .wwm-cmp-lv-select {
background: var(--c-cream-pale);
}
/* 2本目 selector は modals.css の高 spec rule (.wwm-cmp-modal-a .wwm-cmp-title ...) 対抗
(theme 蘇生採用 2026-06-05 @layer Step 1: light theme で dark bg option は theme bug だった)。
color はファイル後方の :619/:628 (brown-1) が担当 — ここに書くな (dead + 紛らわしい) */
html[data-theme="light"] .wwm-cmp-lv-select option,
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-title .wwm-cmp-lv-select option {
background: var(--c-cream-pale);
}
html[data-theme="light"] .wwm-cmp-current .wwm-cmp-title {
color: #1a6ad6;
}
html[data-theme="light"] .wwm-cmp-new .wwm-cmp-title {
color: #1a8d52;
}
/* S2-h split: mixed-cat (M/P/N split 同居) を per-selector rule 化 — cascade-neutral (隣接 + 同 decl) */
html[data-theme="light"] .wwm-num-input {
color: var(--paper);
}
html[data-theme="light"] .wwm-xinfa-cell > .wwm-xinfa-tier {
color: var(--paper);
}
html[data-theme="light"] .wwm-xinfa-tier {
border-color: var(--ink-2);
}
html[data-theme="light"] select.wwm-num-input {
color: var(--paper);
border-color: var(--ink-2);
}
html[data-theme="light"] input.wwm-num-input {
color: var(--paper);
border-color: var(--ink-2);
}
/* S2-d split: cmp-set-header / xinfa-header b は modal/equip-base 競合で unsafe → 分離 */
html[data-theme="light"] .wwm-cmp-set-header {
text-shadow: none;
}
html[data-theme="light"] .wwm-xinfa-header b {
color: var(--paper);
font-weight: 600;
}
html[data-theme="light"] .wwm-cmp-bg-icon {
filter: brightness(0) drop-shadow(0 0 4px var(--c-gold-deep-glow-1));
opacity: 0.2;
}
html[data-theme="light"] .wwm-cmp-modal-a .wwm-modal-header { border-bottom-color: transparent; }
html[data-theme="light"] .wwm-cmp-modal-a .wwm-modal-header::after {
background: linear-gradient(90deg, transparent 0%, transparent 30%, rgba(232,81,58,0.85) 50%, transparent 70%, transparent 100%);
}
/* S2-j split: col と current/new は pair が別 token (modals:698 col-border / modals:368 current-border)
→ m-phys uniformity 不可のため物理 decl 分離 (cascade-neutral: 隣接 + 同 decl、 current/new は col 併持で後 rule 勝ち同値) */
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-col {
background: var(--hover-mid-2);
}
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-current,
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-new {
background: var(--hover-mid-2);
}
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-kongfu-header { color: var(--brown-1); background: var(--gold-mid); }
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-set-header { color: var(--vermilion-deep); background: linear-gradient(90deg, var(--vermilion-bright-tint), var(--c-vermilion-fade-end)); }
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-set-select { color: var(--vermilion-deep); }
/* S2-d split: stat-select は L524 組と競合残置 → val-input と分離 */
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-val-input {
border-color: var(--c-border-mid-warm);
}
/* S2-d split: cmp-lv-select は単独 light rule 競合残置 → cmp-lv と分離 */
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-title .wwm-cmp-lv-select {
background: var(--hover-strong);
}
/* .wwm-cmp-ratio rank別 light color は styles-modals.css へ co-locate move 済
(2026-06-05 @layer Step 1: inline 対抗 imp の layer 反転 flip 根治) */
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-footer-a { border-color: var(--c-border-soft-warm); }
html[data-theme="light"] .wwm-cmp-modal-bg-icon {
filter: brightness(0) drop-shadow(0 0 6px var(--c-gold-deep-glow-1));
}
html[data-theme="light"] .wwm-cmp-modal-a select option:checked {
background: var(--c-modal-a-option-checked);
}
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-title .wwm-cmp-lv-select option:checked {
background: var(--c-modal-a-option-checked);
}
html[data-theme="light"] .wwm-cmp-modal-a .wwm-cmp-title .wwm-cmp-lv-select {
background-color: var(--hover-strong);
}
html[data-theme="light"] .wwm-modal-bg-icon {
filter:
brightness(0)
drop-shadow(0 0 6px var(--c-gold-deep-glow-2))
drop-shadow(0 0 14px var(--c-gold-deep-mid));
}
html[data-theme="light"] .wwm-equip-icon,
html[data-theme="light"] .wwm-xinfa-icon {
filter:
brightness(0)
drop-shadow(0 0 3px var(--c-gold-deep-strong))
drop-shadow(0 0 8px var(--gold-glow));
}
html[data-theme="light"] .wwm-diag-modal .wwm-modal-bg-icon {
filter:
brightness(0)
drop-shadow(0 0 6px var(--vermilion-strong))
drop-shadow(0 0 14px var(--vermilion-mid));
}
html[data-theme="light"] .wwm-xinfa-liupai-badge {
filter: drop-shadow(0 1px 2px var(--c-shadow-light));
}
html[data-theme="light"] .wwm-gear-grid .wwm-equip-slot::before,
html[data-theme="light"] .wwm-xinfa-slot::before {
mix-blend-mode: multiply;
}
html[data-theme="light"] .wwm-gear-grid .wwm-equip-slot,
html[data-theme="light"] .wwm-xinfa-slot {
background-image:
linear-gradient(var(--c-card-bg-overlay-film), var(--c-card-bg-overlay-film)),
url("https://www.wherewindsmeetgame.com/m/zt/20251121182818/img/bg_usercard2-e8900864.png"),
linear-gradient(180deg, #fff3da, #fce0bc);
background-position: 0 0, center, 0 0;
background-size: auto, 100% 100%, auto;
background-repeat: repeat, no-repeat, repeat;
background-blend-mode: normal, difference, normal;
}
/* hover 朱化 復活 — light の non-hover override (specificity 0,2,1) が dark の :hover (0,2,0) に勝ってしまうため、
light でも :hover で border accent (朱) を確実に出すよう同 specificity tier で再宣言 */
html[data-theme="light"] {
--chart-graze: #8b8170;
--chart-normal: #c8bda6;
}
html[data-theme="light"] .hero.hero-wuxia {
background:
url("https://www.wherewindsmeetgame.com/m/zt/20251121182818/img/xf-bg-23f42caf.png") center / cover no-repeat,
linear-gradient(180deg, #fff5dc, #fde0c0);
background-blend-mode: difference, normal;
box-shadow: inset 0 0 40px rgba(122,90,32,.18);
}
/* K: hero number の JS inline color 対抗 — strip するな (Step 5 確定) */
html[data-theme="light"] .hero-wuxia .hero-number {
color: var(--paper) !important; /* 濃茶 (墨黒より明るめ) */
filter: none;
}
/* S2-d split: label = pair 同値 (削除可) / arrow = pair 値違い (token 化) → 分離 */
html[data-theme="light"] .hero-wuxia .judge-val {
filter: brightness(0.38) saturate(1.8);
}
html[data-theme="light"] .hero-wuxia #dmgPhysVal { filter: none; }
html[data-theme="light"] .hero-wuxia #dmgElemVal { filter: none; }
html[data-theme="light"] .hero-wuxia .judge-row-sep { border-top-color: rgba(40,25,18,0.2); }
html[data-theme="light"] .hero-wuxia .hero-tier.tier-badge {
text-shadow: 0 0 2px rgba(244,232,204,0.9);
}
html[data-theme="light"] .hero-wuxia .hero-tier.tier-SS {
text-shadow: 0 0 2px var(--c-tier-ss-text-halo);
}
html[data-theme="light"] .hero-wuxia .hero-tier.tier-SS::before,
html[data-theme="light"] .wwm-sb-tier-badge.tier-SS::before {
background: linear-gradient(105deg, transparent 10%, rgba(255,255,255,0.30) 50%, transparent 90%);
animation: tier-ss-shimmer-light 1.6s linear infinite;
}
html[data-theme="light"] .wwm-sb-tier-badge.tier-SS {
background: linear-gradient(135deg, var(--c-tier-ss-grad-1) 0%, var(--c-tier-ss-grad-2) 50%, var(--c-tier-ss-grad-3) 100%);
color: var(--c-tier-ss-fg);
border-color: var(--c-tier-ss-border);
text-shadow: 0 0 2px var(--c-tier-ss-text-halo);
}
html[data-theme="light"] .wwm-sb-tier-badge.tier-S {
background: linear-gradient(135deg, var(--c-tier-s-grad-1) 0%, var(--c-tier-s-grad-2) 50%, var(--vermilion) 100%);
color: var(--c-tier-s-fg);
border-color: var(--c-tier-s-border);
text-shadow: 0 0 2px var(--hover-mid-2);
}
html[data-theme="light"] .wwm-sb-tier-badge.tier-A {
background: linear-gradient(135deg, var(--c-tier-a-grad-1) 0%, var(--c-tier-a-grad-2) 50%, var(--c-tier-a-grad-3) 100%);
color: var(--c-tier-a-fg);
border-color: var(--c-tier-a-border);
}
html[data-theme="light"] .wwm-sb-tier-badge.tier-B {
background: linear-gradient(135deg, var(--c-tier-b-grad-1) 0%, var(--c-tier-b-grad-2) 50%, var(--c-tier-b-grad-3) 100%);
color: var(--c-tier-b-fg);
border-color: var(--c-tier-b-border);
}
html[data-theme="light"] .wwm-sb-tier-badge.tier-C {
background: linear-gradient(135deg, var(--c-tier-c-grad-1) 0%, var(--c-tier-c-grad-2) 50%, var(--c-tier-c-grad-3) 100%);
color: var(--c-tier-c-fg);
border-color: var(--c-tier-c-border);
}
html[data-theme="light"] .hero-wuxia .hero-tier.tier-S {
text-shadow: 0 0 2px var(--hover-mid-2);
}
/* tier-A/B/C の shadow: dark 用 glow (components.css) が spec 抑圧で漏れ出ていた調整漏れを
汎用 light tier 調整 (.tier-A/B/C) と同値に明記修正 (2026-06-05 @layer Step 1、 兄貴目視対象) */
html[data-theme="light"] .hero-wuxia .hero-tier.tier-A {
text-shadow: none;
}
html[data-theme="light"] .hero-wuxia .hero-tier.tier-B {
text-shadow: none;
}
html[data-theme="light"] .hero-wuxia .hero-tier.tier-C {
text-shadow: none;
}
html[data-theme="light"] .hero-wuxia .ink-stroke {
filter: none;
/* 単色stroke の両端を横maskでフェード → ダーク同様の筆の透明感 (平帯解消) */
-webkit-mask: linear-gradient(90deg, transparent 0%, #000 30%, #000 70%, transparent 100%);
mask: linear-gradient(90deg, transparent 0%, #000 30%, #000 70%, transparent 100%);
}
html[data-theme="light"] .hero-wuxia .l-bracket {
border-color: var(--gold-deep);
}
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-gold,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-gold .wwm-stat-name,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-gold .wwm-stat-val {
/* 暗オレンジ */
}
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-purple,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-purple .wwm-stat-name,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-purple .wwm-stat-val {
/* 暗紫 */
}
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-blue,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-blue .wwm-stat-name,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-blue .wwm-stat-val {
/* 暗青 */
}
html[data-theme="light"] .wwm-step2 .wwm-num-input {
color: var(--brown-2);
}
html[data-theme="light"] .wwm-anlz {
--anlz-header-bg: #f0e8d2;
--anlz-content-bg: #faf3df;
--anlz-line: rgba(120,60,20,.32);
}
html[data-theme="light"] .wwm-anlz-header {
background:
linear-gradient(var(--c-overlay-cream), var(--c-overlay-cream)),
url("https://www.wherewindsmeetgame.com/m/zt/20251121182818/img/section_bg-66d4d3cb.png") center / cover no-repeat,
linear-gradient(180deg, var(--c-header-cream-top), var(--c-header-cream-bot));
background-blend-mode: normal, difference, normal;
}
html[data-theme="light"] .wwm-anlz-header::before {
background-image: url("data:image/svg+xml;utf8,");
mix-blend-mode: multiply;
}
html[data-theme="light"] .wwm-anlz-body::before {
background-image: url("data:image/svg+xml;utf8,");
mix-blend-mode: multiply;
}
html[data-theme="light"] .wwm-anlz-bgicon {
filter:
brightness(0)
drop-shadow(0 0 6px var(--c-gold-deep-glow-2))
drop-shadow(0 0 14px var(--c-gold-deep-mid));
}
html[data-theme="light"] .wwm-mobile-drawer * { color: var(--vermilion-deep); }
html[data-theme="light"] body.wwm-layout-active .wwm-mobile-stat-fab {
border-color: var(--vermilion);
}
html[data-theme="light"] .wwm-mobile-stat-overlay-header {
border-bottom-color: var(--c-border-soft-warm);
}
html[data-theme="light"] .wwm-mobile-anlz-overlay-header {
border-bottom-color: var(--c-border-soft-warm);
}
/* ── Step 5-c (2026-06-06): S2-g B-relocate 6 rule を theme layer へ再移動 ──
components layer 内では modals/light layer の同 subject 競合に imp でしか勝てなかった群。
light layer 末尾 = natural 常勝 (旧 imp と同勝者) → imp 不要化。
元位置: xinfa.css (rank 3) / mobile.css (step2 2) / sidebar.css (mini-hero 1) */
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-gold,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-gold .wwm-stat-name,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-gold .wwm-stat-val {
color: var(--c-orange-deep);
}
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-purple,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-purple .wwm-stat-name,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-purple .wwm-stat-val {
color: #6a2e8a;
}
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-blue,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-blue .wwm-stat-name,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix .wwm-rank-blue .wwm-stat-val {
color: #1e5a9e;
}
html[data-theme="light"] .wwm-equip-section .wwm-stat-name,
html[data-theme="light"] .wwm-equip-section .wwm-stat-val,
html[data-theme="light"] .wwm-step2 .wwm-step2-section-title,
html[data-theme="light"] .wwm-step2 .wwm-xinfa-cell,
html[data-theme="light"] .wwm-step2 .wwm-xinfa-label,
html[data-theme="light"] .wwm-step2 .wwm-xinfa-effect,
html[data-theme="light"] .wwm-step2 .wwm-arsenal-tier,
html[data-theme="light"] .wwm-step2 .wwm-arsenal-lv,
html[data-theme="light"] .wwm-step2 .wwm-arsenal-peaked-label,
html[data-theme="light"] .wwm-step2 .wwm-arsenal-preset,
html[data-theme="light"] .wwm-step2 .wwm-arsenal-custom,
html[data-theme="light"] .wwm-step2 .wwm-stat-label,
html[data-theme="light"] .wwm-step2 .wwm-radio-label,
html[data-theme="light"] .wwm-equip-section .wwm-equip-base b,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix b,
html[data-theme="light"] .wwm-equip-section,
html[data-theme="light"] .wwm-equip-section .wwm-equip-slot,
html[data-theme="light"] .wwm-equip-section .wwm-equip-slot-header,
html[data-theme="light"] .wwm-equip-section .wwm-equip-base,
html[data-theme="light"] .wwm-equip-section .wwm-equip-affix,
html[data-theme="light"] .wwm-step2 {
color: var(--brown-2);
}
/* rank 色 rule (上) より後 = .wwm-stat-name/.wwm-stat-val の同 spec 競合に注意:
rank rule は .wwm-rank-* 付き = spec 上位で rank 行は rank 色が勝つ (旧 imp 同士の spec 順と同一) */
html[data-theme="light"] .wwm-step2 .wwm-step2-section-title {
color: var(--brown-3);
}
html[data-theme="light"] .wwm-sb-mini-hero-card .wwm-sb-totalmartial b,
html[data-theme="light"] .wwm-sb-mini-hero-card .wwm-sb-martial b {
color: var(--c-text-brown-bright);
}
/* ── EXPORT カード生成 modal: light theme control コントラスト調整 (2026-06-07 兄貴指摘 Image#9) ──
cream 地上で --paper-dim/--paper-2 系が薄い → 墨茶へ濃色化。 card artifact (.wwm-card 内) は対象外 */
html[data-theme="light"] .wwm-card-stage-hint,
html[data-theme="light"] .wwm-card-post-hint,
html[data-theme="light"] .wwm-card-tpl-btn i,
html[data-theme="light"] .wwm-card-play-label {
color: #6a5135;
}
html[data-theme="light"] .wwm-card-toggle,
html[data-theme="light"] .wwm-card-zoom-row,
html[data-theme="light"] .wwm-card-align-row {
color: #3a2a1a;
}
html[data-theme="light"] .wwm-card-tpl-btn,
html[data-theme="light"] .wwm-card-play-chip {
color: #3a2a1a;
background: rgba(58,38,22,0.05);
border-color: rgba(40,25,18,0.32);
}
html[data-theme="light"] .wwm-card-tpl-btn b { color: #2a1c12; }
html[data-theme="light"] .wwm-card-ctl-btn {
color: #5e4310;
border-color: rgba(94,67,16,0.55);
}
html[data-theme="light"] .wwm-card-tpl-btn.active,
html[data-theme="light"] .wwm-card-play-chip.active,
html[data-theme="light"] .wwm-card-align-btn.active {
color: #8a1f17;
border-color: #8a1f17;
background: rgba(200,60,43,0.08);
}
html[data-theme="light"] .wwm-card-tpl-btn.active b { color: #8a1f17; }
} /* end @layer light */