/* Independent preview skin: visual properties only. Original markup, layout and game logic remain intact. */
@import url('./skin-crest-team.css?v=20261016');
@import url('./skin-engraving-tablet.css?v=20261016');
@import url('./skin-enhance-enchant.css?v=20261016');

html[data-preview-theme="unified"] {
  --ui-bg: #111315;
  --ui-panel: #1b1e21;
  --ui-surface: #22262a;
  --ui-input: #141719;
  --ui-border: #ffffff16;
  --ui-border-strong: #ffffff29;
  --ui-text: #ece9e1;
  --ui-muted: #a6aaa9;
  --ui-gold: #d8bb80;
  --ui-gold-light: #ecd6ab;
  --ui-green: #93c5ab;
  --ui-red: #ef8583;
  --background: var(--ui-bg);
  --foreground: var(--ui-text);
  --muted: var(--ui-muted);
  --line: var(--ui-border);
  --panel: var(--ui-panel);
  --panel-strong: var(--ui-surface);
  --gold: var(--ui-gold);
  --amber: var(--ui-gold);
  --green: var(--ui-green);
  --red: var(--ui-red);
  background-color: var(--ui-bg);
  color: var(--ui-text);
}
html[data-preview-theme="unified"] body,
html[data-preview-theme="unified"] .tool-route {
  background-color: var(--ui-bg);
  background-image: none;
  color: var(--ui-text);
}
html[data-preview-theme="unified"] :is(button, a, input, select):focus-visible {
  outline-color: var(--ui-gold);
}
html[data-preview-theme="unified"] :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--ui-gold); }
html[data-preview-theme="unified"] .tool-nav {
  background-color: #151719f5;
  border-color: var(--ui-border-strong);
  box-shadow: 0 8px 22px #00000014;
}
html[data-preview-theme="unified"] :is(.tool-home-link,.tool-switch-link) { color: var(--ui-text); }
html[data-preview-theme="unified"] :is(.tool-home-link span,.tool-switch-link span,.tool-nav-title) { color: var(--ui-gold); }
html[data-preview-theme="unified"] :is(.tool-home-link:hover,.tool-switch-link:hover) { color: var(--ui-gold-light); }

/* Home: same cards, illustrations, typography and grid. */
html[data-preview-theme="unified"] .tool-hub { color: var(--ui-text); }
html[data-preview-theme="unified"] .hub-header { border-color: var(--ui-border-strong); }
html[data-preview-theme="unified"] :is(.hub-kicker,.library-heading span,.tool-index,.tool-enter,.hub-footer a) { color: var(--ui-gold); }
html[data-preview-theme="unified"] :is(.tool-hub h1,.tool-hub h2,.tool-card h3) { color: var(--ui-text); }
html[data-preview-theme="unified"] :is(.hub-subtitle,.tool-card p,.hub-footer) { color: var(--ui-muted); }
html[data-preview-theme="unified"] .library-heading strong { color: var(--ui-gold-light); }
html[data-preview-theme="unified"] .tool-card {
  background-color: var(--ui-panel);
  border-color: var(--ui-border-strong);
  border-radius: 12px;
  box-shadow: 0 12px 28px #00000020;
}
html[data-preview-theme="unified"] :is(.tool-card:hover,.tool-card:focus-visible) {
  border-color: #d8bb8080;
  box-shadow: 0 14px 34px #00000035;
}
html[data-preview-theme="unified"] .tool-card-visual { background-color: var(--ui-input); border-color: var(--ui-border); }
html[data-preview-theme="unified"] :is(.crest-tool-preview,.team-job-cover,.engraving-tool-preview,.tablet-tool-preview,.enhancement-tool-preview,.enchantment-tool-preview) {
  background-color: var(--ui-input);
  background-image: radial-gradient(ellipse at 50% 45%,#d8bb800c,transparent 65%);
}
html[data-preview-theme="unified"] :is(.preview-grid,.team-job-cover-grid,.engraving-preview-frame) {
  border-color: #d8bb8029;
  border-radius: 8px;
  box-shadow: inset 0 0 28px #00000038;
}
html[data-preview-theme="unified"] :is(.tool-tag,.tablet-preview-rune) {
  background-color: var(--ui-input);
  border-color: #d8bb803d;
  color: var(--ui-gold-light);
}
html[data-preview-theme="unified"] :is(.tool-enter,.hub-footer) { border-color: var(--ui-border); }
html[data-preview-theme="unified"] :is(.tablet-preview-orbit,.enhancement-preview-ring,.enhancement-preview-dial,.enchantment-tool-preview::before,.enchantment-tool-preview::after) {
  border-color: #d8bb803d;
  box-shadow: inset 0 0 24px #00000024, 0 0 24px #d8bb8009;
}
html[data-preview-theme="unified"] .spirit-tool-preview {
  background-image: radial-gradient(circle,#d8bb801c,transparent 70%);
  border-color: #d8bb8045;
  box-shadow: inset 0 0 30px #d8bb800d;
  color: var(--ui-gold-light);
}

/* Spirit: retain the original horizontal settings, orb, action position and statistics. */
html[data-preview-theme="unified"] .spirit-shell { color: var(--ui-text); }
html[data-preview-theme="unified"] .spirit-hero {
  background-color: var(--ui-panel);
  background-image: radial-gradient(ellipse at right,#d8bb800c,transparent 70%);
  border-color: var(--ui-border-strong);
  border-radius: 12px;
  box-shadow: 0 12px 28px #00000020;
}
html[data-preview-theme="unified"] :is(.spirit-hero p,.spirit-hero > svg) { color: var(--ui-gold); }
html[data-preview-theme="unified"] .spirit-hero h1 { color: var(--ui-text); }
html[data-preview-theme="unified"] .spirit-hero span { color: var(--ui-muted); }
html[data-preview-theme="unified"] :is(.spirit-panel,.spirit-totals > div) {
  background-color: var(--ui-panel);
  border-color: var(--ui-border-strong);
  border-radius: 12px;
  box-shadow: 0 12px 28px #00000020;
}
html[data-preview-theme="unified"] .spirit-panel h2 { color: var(--ui-text); }
html[data-preview-theme="unified"] :is(.spirit-panel p,.spirit-panel h2 small,.spirit-settings label,.spirit-settings .spirit-settings-hint,.spirit-rule-heading > span,.spirit-rule-table th,.spirit-rule .spirit-rule-note,.spirit-forge-title,.spirit-orb span,.spirit-attributes span,.spirit-next small,.spirit-totals span,.spirit-logs > div,.spirit-result-popup small) { color: var(--ui-muted); }
html[data-preview-theme="unified"] .spirit-settings select {
  background-color: var(--ui-input);
  border-color: var(--ui-border-strong);
  border-radius: 8px;
  color: var(--ui-text);
}
html[data-preview-theme="unified"] .spirit-rule {
  background-color: #d8bb8006;
  border-color: #d8bb8030;
  border-radius: 8px;
}
html[data-preview-theme="unified"] .spirit-rule-heading strong { color: var(--ui-gold-light); }
html[data-preview-theme="unified"] .spirit-rule-table td { border-color: var(--ui-border); color: var(--ui-text); }
html[data-preview-theme="unified"] .spirit-rule-stable { color: var(--ui-green); background-color: #93c5ab0b; }
html[data-preview-theme="unified"] .spirit-rule-drop { color: var(--ui-red); background-color: #ef85830b; }
html[data-preview-theme="unified"] .spirit-reset {
  background-color: var(--ui-surface);
  border-color: var(--ui-border-strong);
  border-radius: 8px;
  color: var(--ui-muted);
}
html[data-preview-theme="unified"] .spirit-reset:hover { border-color: #d8bb8066; color: var(--ui-text); }
html[data-preview-theme="unified"] .spirit-orb {
  background-color: var(--ui-input);
  background-image: radial-gradient(circle,#d8bb801a,transparent 70%);
  border-color: #d8bb8060;
  box-shadow: 0 0 45px #d8bb800c,inset 0 0 30px #d8bb8009;
}
html[data-preview-theme="unified"] :is(.spirit-orb svg,.spirit-orb strong,.spirit-attributes b,.spirit-totals strong) { color: var(--ui-gold-light); }
html[data-preview-theme="unified"] .spirit-attributes > div { background-color: var(--ui-surface); border-radius: 8px; }
html[data-preview-theme="unified"] .spirit-next {
  background-color: var(--ui-input);
  border-color: #d8bb8033;
  border-radius: 8px;
  color: var(--ui-text);
}
html[data-preview-theme="unified"] .spirit-next strong { color: var(--ui-gold-light); }
html[data-preview-theme="unified"] .spirit-actions button {
  background-image: none;
  background-color: var(--ui-gold);
  border-color: var(--ui-gold);
  border-radius: 8px;
  color: #26221a;
  box-shadow: 0 4px 14px #00000024;
}
html[data-preview-theme="unified"] .spirit-actions button:hover:not(:disabled) {
  background-color: var(--ui-gold-light);
  border-color: var(--ui-gold-light);
}
html[data-preview-theme="unified"] .spirit-progress { background-color: var(--ui-input); border-color: var(--ui-border-strong); border-radius: 8px; }
html[data-preview-theme="unified"] .spirit-progress.active { border-color: #d8bb8080; }
html[data-preview-theme="unified"] .spirit-progress i { background-image: linear-gradient(90deg,#a68b58,var(--ui-gold-light)); }
html[data-preview-theme="unified"] .spirit-progress small { color: var(--ui-gold-light); }
html[data-preview-theme="unified"] .spirit-logs > div { border-color: var(--ui-border); }
html[data-preview-theme="unified"] .spirit-logs .success { color: var(--ui-green); }
html[data-preview-theme="unified"] .spirit-logs .failure { color: var(--ui-red); }
html[data-preview-theme="unified"] .spirit-result-popup { background-color: #1b1e21fa; border-radius: 12px; box-shadow: 0 26px 70px #00000077; }
html[data-preview-theme="unified"] .spirit-result-popup.success { color: var(--ui-green); border-color: var(--ui-green); }
html[data-preview-theme="unified"] .spirit-result-popup.failure { color: var(--ui-red); border-color: var(--ui-red); }
html[data-preview-theme="unified"] .tool-route-crest :is(.primary-action,.forge-panel .primary-action) { text-shadow: none; }