/* v0.4.102 presentation trial. Every rule is gated by data-appearance="soft".
   Set that attribute to "classic" in index.html to restore the v0.4.101 look.
   Gameplay geometry, clue colors, timing, and disabled states stay in the base CSS. */
html[data-appearance="soft"] {
  --bg:#f8f5ef;--panel:#fffdfa;--surface:#fffdfa;--panel-soft:#f2f1eb;
  --text:#27312e;--muted:#626e69;--border:#cdd8d2;--line:#cdd8d2;
  --accent:#176b5b;--soft:#eef2ee;--shadow:0 10px 28px rgba(39,49,46,.06);
  --appearance-action:#176b5b;--appearance-action-text:#fffdfa;
  --appearance-highlight:#e9e1f3;--appearance-highlight-text:#604777;
  --appearance-tile:#fffdfa;--appearance-tile-border:#a7bcb2;
  --appearance-key:#e6eee9;--appearance-key-text:#27312e;
  --appearance-icon-green:#247853;--appearance-icon-slice:#885329;
  --appearance-icon-lock:#695080;--appearance-icon-skip:#336e91;
}
html[data-appearance="soft"][data-theme="dark"] {
  --bg:#1b2024;--panel:#272e33;--surface:#272e33;--panel-soft:#2c343a;
  --text:#f3f1ec;--muted:#b6bfc1;--border:#536068;--line:#536068;
  --accent:#91c9b0;--soft:#30383e;--shadow:0 10px 28px rgba(0,0,0,.16);
  --appearance-action:#91c9b0;--appearance-action-text:#1b2925;
  --appearance-highlight:#3c3449;--appearance-highlight-text:#d9c7ed;
  --appearance-tile:#262e33;--appearance-tile-border:#6f807c;
  --appearance-key:#b6c2be;--appearance-key-text:#1b2024;
  --appearance-icon-green:#a0d6b7;--appearance-icon-slice:#e7bf97;
  --appearance-icon-lock:#d2bce5;--appearance-icon-skip:#a1cce7;
}

/* Quiet neutral surfaces let the green/yellow/gray puzzle feedback stand out. */
html[data-appearance="soft"] body,
html[data-appearance="soft"] body.home-conversion-landing {background:var(--bg);color:var(--text)}
html[data-appearance="soft"] .topbar {background:var(--panel);border-color:var(--border);box-shadow:0 3px 16px rgba(0,0,0,.035)}
html[data-appearance="soft"] :is(.panel,.hero,.marketing-hero,.room-card,.home-conversion-hero,.home-conversion-section,.home-conversion-final,.home-conversion-play-dialog,.relay-admin-preview-card,.play-your-way-solo-card,.score-dialog,dialog,.relay-stats-dialog,.relay-stats-dialog-actions,.relay-power-helper,.relay-tutorial-card,.relay-countdown-powers,.relay-tutorial-strip>div,.relay-how-to>div,.rounds-power-help,.relay-below-game-help) {background:var(--panel);color:var(--text);border-color:var(--border)}
html[data-appearance="soft"] :is(.hero::before,.hero::after,.room-card::after) {background:none}
html[data-appearance="soft"] :is(.marketing-copy h1,.marketing-brand-wordmark,.relay-play-header h1,.relay-power-helper strong,.relay-tutorial-title,.relay-below-game-help,.rounds-power-help,.preplay-score-explainer h2) {color:var(--text)}
html[data-appearance="soft"] :is(.marketing-copy p,.relay-countdown-powers small,.rounds-power-help-copy,.relay-below-game-help span,.rounds-power-help span) {color:var(--muted)}
html[data-appearance="soft"] .brand .brand-name {color:var(--accent)!important}
html[data-appearance="soft"] :is(.theme-icon-button,.sound-icon-button.off) {background:var(--panel);border-color:var(--muted);color:var(--text);box-shadow:none}
html[data-appearance="soft"] .sound-icon-button.on {background:var(--appearance-action);color:var(--appearance-action-text);border-color:var(--appearance-action)}
html[data-appearance="soft"] :is(button,a,input,select,textarea,summary):focus-visible {outline-color:var(--accent)}

/* Main and secondary actions retain the existing sizes and hit areas. */
html[data-appearance="soft"] :is(.btn,.btn.good,.tab.active,.activity-range-btn.active,.key.action.enter,.home-conversion-header-play,.home-conversion-start-btn) {background:var(--appearance-action);color:var(--appearance-action-text);border-color:var(--appearance-action);box-shadow:none}
html[data-appearance="soft"] :is(.btn.secondary,.top-actions .btn.secondary.small,.tab,.dialog-close,.cookie-choice-close,.host-game-close,.rounds-inline-review-close,.relay-stats-dialog .dialog-close,.home-conversion-dialog-close) {background:var(--soft);color:var(--text);border-color:var(--border);box-shadow:none}
html[data-appearance="soft"] .tab.active {background:var(--appearance-action);color:var(--appearance-action-text)}
html[data-appearance="soft"] .btn.danger {background:#93493f;color:#fff}
html[data-appearance="soft"] :is(.rounds-play-again-solo,.daily-result-jump.btn.secondary) {background:var(--soft)!important;color:var(--accent)!important;border-color:var(--accent)!important}
html[data-appearance="soft"] :is(.rounds-play-again-solo:hover,.daily-result-jump.btn.secondary:hover) {background:var(--panel-soft)!important}

/* Do not override evaluated, revealed, sliced, or locked puzzle states. */
html[data-appearance="soft"] .tile:not(.correct):not(.present):not(.absent):not(.power-reveal-active) {background:var(--appearance-tile);border-color:var(--appearance-tile-border);color:var(--text)}
html[data-appearance="soft"] .tile.filled:not(.correct):not(.present):not(.absent):not(.power-reveal-active) {border-color:var(--accent)}
html[data-appearance="soft"] .tile.guess-reveal-pending {background:var(--appearance-tile)!important;border-color:var(--appearance-tile-border)!important;color:var(--text)!important}
html[data-appearance="soft"] .key:not(.correct):not(.present):not(.absent):not(.action):not(.relay-revealed-key) {background:var(--appearance-key);color:var(--appearance-key-text);border-color:var(--border);box-shadow:0 1px 0 rgba(0,0,0,.1)}
html[data-appearance="soft"] :is(.key.action.clear,.key.action.back) {background:var(--soft);color:var(--text);border-color:var(--border)}
html[data-appearance="soft"] body.active-game-layout .phone-edit-split {background:var(--soft);border-color:var(--border)}
html[data-appearance="soft"] body.active-game-layout .phone-edit-split>.key.action {background:transparent;color:var(--text);border-color:var(--border)}
html[data-appearance="soft"][data-theme="dark"] .key.absent {background:#293137;color:#c2ccca;border-color:#536068;box-shadow:none}
html[data-appearance="soft"] .round-score-bank.score-tone-black {background:var(--soft);border-color:var(--border)}
html[data-appearance="soft"] .relay-phone-pb {background:var(--soft);color:var(--accent)}
html[data-appearance="soft"] :is(.rounds-power-status-label,.round-score-label,.round-score-note,.phone-round-line span) {color:var(--muted)}
html[data-appearance="soft"][data-theme="dark"] .relay-guide-bubble {background:var(--panel);box-shadow:var(--shadow)}
html[data-appearance="soft"][data-theme="dark"] .home-guided-landing .relay-guide-start {background:var(--panel);color:var(--theme-ink)}
html[data-appearance="soft"][data-theme="dark"] .relay-novice-tutorial {background:var(--bg)}

/* One stroke weight and optical size for the four existing Power-Up concepts.
   Original icon markup is retained for an exact classic-appearance rollback. */
html[data-appearance="soft"] .relay-power-art {display:block;padding:0;letter-spacing:normal}
html[data-appearance="soft"] .relay-power-art>i,
html[data-appearance="soft"] .relay-power-art>b {display:none}
html[data-appearance="soft"] .relay-power-art::before {content:"";position:absolute;inset:0;background:currentColor;-webkit-mask:var(--power-art) center/contain no-repeat;mask:var(--power-art) center/contain no-repeat}
html[data-appearance="soft"] .relay-power-art.free-green {--power-art:url('/assets/power-free-green.svg');color:var(--appearance-icon-green)}
html[data-appearance="soft"] .relay-power-art.key-slice {--power-art:url('/assets/power-key-slice.svg');color:var(--appearance-icon-slice)}
html[data-appearance="soft"] .relay-power-art.lock-in {--power-art:url('/assets/power-lock-in.svg');color:var(--appearance-icon-lock)}
html[data-appearance="soft"] .relay-power-art.skip-word {--power-art:url('/assets/power-skip-word.svg');color:var(--appearance-icon-skip)}
html[data-appearance="soft"] :is(.relay-power-icon-button.free-green,.relay-power-icon-button.key-slice,.relay-power-icon-button.lock-in,.relay-power-icon-button.skip-word) {background:var(--panel);border-color:var(--border);box-shadow:none}
html[data-appearance="soft"] .relay-power-icon-button.available:hover {background:var(--soft);box-shadow:none}
html[data-appearance="soft"] :is(.relay-power-help-title,.rounds-power-help-title) {font-weight:750}
html[data-appearance="soft"] :is(.relay-power-help-item strong,.rounds-power-help-item strong) {font-weight:650;color:var(--text)}

/* Results: a restrained lavender accent and a small decorative tile sparkle.
   No extra animation or blocking delay is introduced. */
html[data-appearance="soft"] .relay-stats-dialog-head {background:var(--panel);border-color:var(--border)}
html[data-appearance="soft"] .relay-stats-dialog-head h2 {font-weight:750}
html[data-appearance="soft"] :is(.relay-recap-primary>div,.rounds-result-insights>div,.solo-stats-grid>div,.daily-stats-strip>div) {background:var(--soft);color:var(--text);border-color:var(--border)}
html[data-appearance="soft"] :is(.relay-recap-primary strong,.rounds-result-insights strong,.solo-stats-grid strong,.daily-result-summary-compact>div:first-child strong) {color:var(--text)}
html[data-appearance="soft"] :is(.relay-recap-primary span,.relay-recap-secondary span,.rounds-result-insights span,.daily-result-round-meta span,.daily-result-summary-lines,.solo-stats-grid span) {color:var(--muted);font-weight:550}
html[data-appearance="soft"] :is(.relay-recap-secondary,.daily-result-round.solved) {background:var(--panel-soft);border-color:var(--border);color:var(--text)}
html[data-appearance="soft"] :is(.daily-result-round-title,.daily-result-round-outcome) {color:var(--text);font-weight:650}
html[data-appearance="soft"] .daily-result-summary-compact>div:first-child strong {font-size:26px;line-height:1.15}
html[data-appearance="soft"] :is(.relay-recap-primary>div:first-child,.rounds-result-insights>div:last-child) {position:relative;background:var(--appearance-highlight);border-color:var(--appearance-highlight)}
html[data-appearance="soft"] :is(.relay-recap-primary>div:first-child strong,.relay-recap-primary>div:first-child span,.rounds-result-insights>div:last-child strong,.rounds-result-insights>div:last-child span) {color:var(--appearance-highlight-text)}
html[data-appearance="soft"] :is(.relay-recap-primary>div:first-child,.daily-result-summary-compact>div:first-child)::after {content:"";display:block;position:absolute;right:8px;top:8px;width:18px;height:18px;background:var(--appearance-highlight-text);-webkit-mask:url('/assets/result-sparkle.svg') center/contain no-repeat;mask:url('/assets/result-sparkle.svg') center/contain no-repeat;pointer-events:none}
html[data-appearance="soft"] .relay-recap-primary>div:first-child {padding-right:30px}
html[data-appearance="soft"] .daily-result-summary-compact>div:first-child {position:relative;padding-right:30px}
html[data-appearance="soft"] .rounds-result-perfect {background:var(--appearance-highlight);color:var(--appearance-highlight-text);border-color:var(--appearance-highlight);font-weight:700}
html[data-appearance="soft"] .relay-stats-dialog-actions {border-color:var(--border)}

/* Explicit selectors beat the legacy dark-mode grouped status selectors. */
html[data-appearance="soft"][data-theme="dark"] .daily-result-round.solved {background:var(--panel-soft);border-color:var(--border);color:var(--text)}
html[data-appearance="soft"][data-theme] .rounds-stats-dialog .rounds-result-perfect {background:var(--appearance-highlight);color:var(--appearance-highlight-text);border-color:var(--appearance-highlight)}
html[data-appearance="soft"] .daily-total-score-button {position:relative;padding-right:27px}
html[data-appearance="soft"][data-theme] .daily-total-score-button strong {font-size:28px;line-height:1.15;color:var(--text)}
html[data-appearance="soft"] .daily-total-score-button::after {content:"";position:absolute;right:0;top:4px;width:18px;height:18px;background:var(--appearance-highlight-text);-webkit-mask:url('/assets/result-sparkle.svg') center/contain no-repeat;mask:url('/assets/result-sparkle.svg') center/contain no-repeat;pointer-events:none}
html[data-appearance="soft"][data-theme] .relay-recap-primary>div:first-child {background:var(--appearance-highlight)}
html[data-appearance="soft"] .relay-share-primary {background:var(--appearance-action)!important;color:var(--appearance-action-text)!important}