html:has(body.piano-app-page[data-page="piano"][data-theme="blessed"]) {
  background: #FCECF3;
  scrollbar-color: #F14591 #FCECF3;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] {
  --bg: #FCECF3;
  --panel: #ff50b1;
  --panel-warm: #ffc7e0;
  --panel-strong: #ffb7d6;
  --text: #7A2854;
  --text-strong: #5F2346;
  --muted: #9F6078;
  --muted-soft: #C2859C;
  --highlight: #F14591;
  --highlight-soft: #FC97C4;
  --accent: #F6B660;
  --accent-strong: #DE894E;
  --accent-deep: #9E5A34;
  --accent-glow: #FEEBB1;
  --button-bg: #FFF7FC;
  --button-hover-bg: #FDE2EE;
  --button-border: #F9A4CB;
  --button-text: #710a1b;
  --active-bg: #E83D8C;
  --active-text: #FFFFFF;
  --active-border: #F998C6;
  --active-shadow: #A62D6B;
  --play-highlight: #F14591;
  --play-highlight-soft: #FCB0D3;
  --play-border: #F6B660;
  --piano-white-key: #FFF8FB;
  --piano-white-key-shadow: #E8D8DF;
  --piano-white-key-border: #C2859C;
  --piano-black-key: #282A36;
  --piano-black-key-highlight: #44454E;
  --piano-active-key: #F14591;
  --piano-active-key-light: #FBA1C7;
  --focus-ring: #EF3E8E;
  --scrollbar-track: #FCECF3;
  --scrollbar-thumb: #F14591;
  --scrollbar-thumb-hover: #D53183;
  --scrollbar-thumb-border: #FFF7FC;
  --pv-bg: var(--bg);
  --pv-bg-deep: #FCE8F1;
  --pv-panel: var(--panel);
  --pv-panel-2: var(--panel-warm);
  --pv-panel-inner: var(--panel-strong);
  --pv-border: var(--button-border);
  --pv-border-bright: var(--active-border);
  --pv-border-hot: var(--accent-strong);
  --pv-accent: var(--highlight);
  --pv-accent-2: var(--accent);
  --pv-cyan: var(--highlight-soft);
  --pv-text: var(--text);
  --pv-muted: var(--muted);
  --pv-dim: var(--muted-soft);
  --pv-glow: rgba(241, 69, 145, 0.34);
  --pv-glow-soft: rgba(246, 182, 96, 0.24);
  --pv-pink-soft: rgba(252, 151, 196, 0.26);
  --pv-button: var(--button-bg);
  --pv-button-hover: var(--button-hover-bg);
  --pv-button-active: linear-gradient(180deg, #FC97C4 0%, #E83D8C 100%);
  --pv-key-white: var(--piano-white-key);
  --pv-key-white-stroke: var(--piano-white-key-border);
  --pv-key-black: var(--piano-black-key);
  --pv-key-active: var(--piano-active-key);
  --pv-key-active-text: var(--active-text);
  --pv-play-button-image: url("assets/themes/blessed/blessed-play-button.webp");
  --pv-play-button-hover-image: url("assets/themes/blessed/blessed-play-button-hover.webp");
  --pv-repeat-button-image: url("assets/themes/blessed/blessed-repeat-button.webp");
  --pv-repeat-button-hover-image: url("assets/themes/blessed/blessed-repeat-button-hover.webp");
  --pv-repeat-button-active-image: url("assets/themes/blessed/blessed-repeat-button-active.webp");
  color: var(--text);
  background:
    radial-gradient(circle at 16% 0%, rgba(254, 235, 177, 0.46), transparent 30%),
    radial-gradient(circle at 84% 12%, rgba(252, 151, 196, 0.46), transparent 28%),
    linear-gradient(180deg, #FEFBFA 0%, #FCECF3 50%, #FDE2EE 100%);
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
  accent-color: var(--highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"]::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"]::-webkit-scrollbar-thumb {
  border-color: var(--scrollbar-thumb-border);
  background: var(--scrollbar-thumb);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"]::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"]::before {
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.9) 0 1px, transparent 1.6px),
    radial-gradient(circle, rgba(254, 235, 177, 0.46) 0 1px, transparent 1.7px),
    linear-gradient(rgba(241, 69, 145, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(241, 69, 145, 0.06) 1px, transparent 1px);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .home-cosmos {
  background:
    url("assets/themes/blessed/blessed-banner-bg.webp") center top / min(100vw, 1440px) auto no-repeat,
    linear-gradient(180deg, #f893c9 0%, #eb68a7 58%, #f14591 100%);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .home-cosmos-stars {
  background:
    radial-gradient(circle at 12px 18px, rgba(255, 255, 255, 0.86) 0 0.95px, transparent 2px) 0 0 / 150px 118px repeat,
    radial-gradient(circle at 78px 44px, rgba(254, 235, 177, 0.82) 0 0.85px, transparent 1.9px) 0 0 / 182px 146px repeat,
    radial-gradient(circle at 132px 98px, rgba(252, 151, 196, 0.62) 0 0.9px, transparent 2px) 0 0 / 214px 172px repeat,
    radial-gradient(circle at 196px 26px, rgba(255, 247, 252, 0.9) 0 0.85px, transparent 1.9px) 0 0 / 266px 206px repeat,
    radial-gradient(circle at 248px 132px, rgba(246, 182, 96, 0.58) 0 0.9px, transparent 2px) 0 0 / 318px 244px repeat;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .home-cosmos-stars::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .home-cosmos-stars::after {
  background:
    radial-gradient(circle at 24px 32px, rgba(255, 255, 255, 0.88) 0 0.85px, transparent 1.9px) 0 0 / 132px 104px repeat,
    radial-gradient(circle at 92px 86px, rgba(253, 222, 160, 0.7) 0 0.9px, transparent 2px) 0 0 / 174px 136px repeat,
    radial-gradient(circle at 154px 18px, rgba(241, 69, 145, 0.46) 0 0.9px, transparent 2px) 0 0 / 226px 178px repeat,
    radial-gradient(circle at 214px 124px, rgba(255, 255, 255, 0.82) 0 0.85px, transparent 1.9px) 0 0 / 286px 220px repeat;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .site-brand {
  color: var(--text-strong);
  text-shadow: 0 0 0.35rem rgba(252, 151, 196, 0.46);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .site-logo {
  border-color: var(--button-border);
  background: var(--panel-warm);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.76),
    0 0 16px rgba(241, 69, 145, 0.24);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .site-logo span {
  background:
    linear-gradient(90deg, #FFF8FB 0 16%, #282A36 16% 29%, #FFF8FB 29% 47%, #282A36 47% 58%, #FFF8FB 58% 77%, #282A36 77% 88%, #FFF8FB 88% 100%);
  box-shadow: inset 0 -0.48rem 0 var(--piano-active-key-light);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .site-header {
  background: transparent;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .site-section {
  border-color: var(--accent);
  color: var(--accent-deep);
  text-shadow: 0 0 8px rgba(254, 235, 177, 0.72);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-panel,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .card,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .section-heading-row-with-asset {
  border-color: var(--button-border);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(255, 246, 251, 0.94)),
    var(--panel);
  box-shadow:
    0 0 0 1px rgba(249, 164, 203, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.76),
    inset 0 -18px 30px rgba(253, 226, 238, 0.44),
    0 0 18px rgba(241, 69, 145, 0.15);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .site-header::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-panel::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .card::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .section-heading-row-with-asset::before {
  border-color: rgba(246, 182, 96, 0.34);
  box-shadow: inset 0 0 14px rgba(254, 235, 177, 0.2);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .site-header::after {
  background: linear-gradient(90deg, transparent, var(--highlight-soft), var(--accent), var(--highlight), transparent);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .chord-workspace,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-selector-panel,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel {
  border-color: rgba(246, 182, 96, 0.72);
  box-shadow:
    0 0 0 1px rgba(249, 164, 203, 0.34),
    0 0 30px rgba(241, 69, 145, 0.16);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .hero-section,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .hero-image-frame,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .future-illustration-slot {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .hero-section::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .hero-section::after,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .hero-image-frame::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .hero-image-frame::after,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .future-illustration-slot::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .future-illustration-slot::after {
  background: transparent;
  box-shadow: none;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-control,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-select,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-icon-button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-menu-button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .card-actions button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .type-menu button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .category-tabs button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-card button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .root-menu button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .notation-toggle button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-toggle,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-builder button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-customizer button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-scale-toggle button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-mobile-formula-button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-next-voicing,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-guitar-mode .guitar-play-mode-toggle {
  border-color: var(--button-border);
  background-color: var(--button-bg);
  background-image: linear-gradient(180deg, #FFFFFF, var(--button-bg));
  color: var(--button-text);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.68),
    0 0 10px rgba(241, 69, 145, 0.12);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu:focus,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu:active,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .instrument-family-select,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .instrument-family-select:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .instrument-family-select:focus,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .instrument-family-select:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .instrument-family-select:active {
  border-color: var(--play-border);
  background-color: var(--accent);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--text-strong) 50%),
    linear-gradient(135deg, var(--text-strong) 50%, transparent 50%),
    linear-gradient(180deg, #FEEBB1, #F6B660);
  color: var(--text-strong);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.56) inset,
    0 0 1rem rgba(241, 69, 145, 0.22);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu:focus,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu:active,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu:focus,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu:active {
  border-color: var(--button-border);
  background-color: var(--button-bg);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--highlight) 50%),
    linear-gradient(135deg, var(--highlight) 50%, transparent 50%),
    linear-gradient(180deg, #FFFFFF, var(--button-bg));
  color: var(--button-text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-menu-button[data-header-menu-for="piano-area-menu"]::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-menu-button[data-header-menu-for="theme-menu"]::before {
  background: var(--highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-icon-button {
  color: var(--highlight);
  text-shadow: 0 0 10px rgba(254, 235, 177, 0.72);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-options,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-options,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .instrument-menu-popover {
  border-color: var(--button-border);
  background: rgba(255, 247, 252, 0.98);
  box-shadow:
    0 0.85rem 1.8rem rgba(95, 35, 70, 0.16),
    0 0 1.2rem rgba(241, 69, 145, 0.16);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-option,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-option,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu option,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu option,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu option {
  background: var(--button-bg);
  color: var(--button-text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-option:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-option:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-option:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-option:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu option:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu option:hover {
  border-color: var(--highlight);
  background: var(--button-hover-bg);
  color: var(--text-strong);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-option.is-selected,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-option.is-selected,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu option:checked,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu option:checked,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu option:checked {
  border-color: var(--active-border);
  background: linear-gradient(180deg, var(--highlight-soft), var(--active-bg));
  color: var(--active-text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-option:disabled,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #instrument-family-menu option:disabled,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #piano-area-menu option:disabled,
body.piano-app-page[data-page="piano"][data-theme="blessed"] #theme-menu option:disabled {
  color: var(--muted-soft);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .category-tabs button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .type-menu button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .root-menu button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .notation-toggle button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-control:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-icon-button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .card-actions button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-card button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-builder button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-customizer button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-scale-toggle button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-mobile-formula-button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-next-voicing:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-guitar-mode .guitar-play-mode-toggle:hover {
  border-color: var(--accent-strong);
  background: var(--button-hover-bg);
  color: var(--text-strong);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.74),
    0 0 16px rgba(241, 69, 145, 0.18);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .category-tabs button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .type-menu button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .root-menu button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .notation-toggle button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-control:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .header-icon-button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .card-actions button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-card button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .play-button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .octave-toggle:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-builder button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-customizer button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-scale-toggle button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-mobile-formula-button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-next-voicing:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-guitar-mode .guitar-play-mode-toggle:focus-visible {
  border-color: var(--focus-ring);
  outline-color: var(--focus-ring);
  box-shadow:
    0 0 0 3px rgba(239, 62, 142, 0.22),
    0 0 18px rgba(241, 69, 145, 0.24);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .category-tabs button.is-active,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .type-menu button.is-active,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .root-selector .root-menu button.is-active,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .root-menu button[aria-pressed="true"],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .notation-toggle button[aria-pressed="true"],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-builder button.is-active,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-builder button[aria-pressed="true"],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-customizer button.is-active,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-customizer button[aria-pressed="true"],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-scale-toggle button[aria-pressed="true"],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-mobile-formula-button.is-active {
  border-color: var(--active-border);
  background: linear-gradient(180deg, var(--highlight-soft), var(--active-bg));
  color: var(--active-text);
  text-shadow: 0 1px 0 var(--active-shadow);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.3),
    0 0 18px rgba(241, 69, 145, 0.32);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-option-select {
  border-color: var(--active-border);
  background: linear-gradient(180deg, var(--highlight-soft), var(--active-bg));
  color: #fff;
  text-shadow: 0 1px 0 var(--active-shadow);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.3),
    0 0 18px rgba(241, 69, 145, 0.32);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-option-select option:not(:checked) {
  background: #f14591;
  color: #fff;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .type-menu button:not(.is-active),
body.piano-app-page[data-page="piano"][data-theme="blessed"]:not(.is-home-progressions-mode) .selector-panel .chord-type-selector .type-menu button:not(.is-active):not([aria-pressed="true"]) {
  background: var(--button-bg);
  color: var(--button-text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .root-menu button[aria-pressed="false"],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .category-tabs button[aria-pressed="false"],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .type-menu button[aria-pressed="false"] {
  background-image: linear-gradient(180deg, #FFFFFF, #fddeec);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .stat-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .section-kicker,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .keyboard-legend,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-builder .selector-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-customizer .selector-label {
  color: var(--accent-deep);
  text-shadow: 0 0 8px rgba(254, 235, 177, 0.68);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-panel h2,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .card h2,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .card h3,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .section-heading-row h2,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-selector-panel h2,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-progressions-page .section-heading-row h2 {
  color: var(--text-strong);
  text-shadow: 0 0 8px rgba(252, 151, 196, 0.3);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .card p,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .helper-text,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-selector-panel .helper-text {
  color: var(--muted);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .formula-line,
body.piano-app-page[data-page="piano"][data-theme="blessed"] [data-dynamic-chord-notes-inline],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .scale-line,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-chords,
body.piano-app-page[data-page="piano"][data-theme="blessed"] [data-progression-chords],
body.piano-app-page[data-page="piano"][data-theme="blessed"] .note-line {
  color: var(--text-strong);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .chord-emblem {
  border-color: var(--active-border);
  background: var(--panel-warm);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.74),
    0 0 18px rgba(241, 69, 145, 0.22);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .chord-emblem img {
  background: transparent;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .chord-emblem .chord-symbol {
  color: var(--highlight);
  text-shadow:
    0 0 12px rgba(252, 151, 196, 0.54),
    3px 3px 0 var(--accent-glow);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-card-header,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-metric-row,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .note-line,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-welcome-heading,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-info-message-heading {
  border-color: rgba(246, 182, 96, 0.58);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-card-header,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-metric-row {
  border-bottom: 1px solid #f14591;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-welcome,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-info-message,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-builder-side,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-scale-card,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-mobile-formula-select,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-mobile-formula-list {
  border-color: var(--button-border);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.72), transparent 36%),
    linear-gradient(180deg, var(--panel-warm), var(--panel-strong));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.62),
    inset 0 -18px 38px rgba(254, 235, 177, 0.2),
    0 0 20px rgba(241, 69, 145, 0.16);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-welcome::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-info-message::before {
  background: repeating-linear-gradient(
    180deg,
    rgba(241, 69, 145, 0.05) 0,
    rgba(241, 69, 145, 0.05) 1px,
    transparent 1px,
    transparent 8px
  );
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-welcome h2,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-welcome-heading p,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-info-message h2 {
  color: var(--text-strong);
  text-shadow:
    0 0 10px rgba(255, 255, 255, 0.76),
    0 0 18px rgba(241, 69, 145, 0.24);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .selector-welcome > p,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-info-message > p {
  color: var(--text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .keyboard,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-card .keyboard,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-chord-grid .keyboard,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-keyboard {
  border-color: rgba(246, 182, 96, 0.5);
  background:
    linear-gradient(180deg, rgba(255, 248, 251, 0.8), rgba(255, 246, 251, 0.96));
  box-shadow: inset 0 0 18px rgba(232, 216, 223, 0.36);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-svg {
  background: transparent;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .white-key {
  fill: var(--piano-white-key);
  stroke: var(--piano-white-key-border);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .black-key {
  fill: var(--piano-black-key);
  stroke: var(--piano-black-key-highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-active.white-key,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-active.black-key {
  fill: var(--piano-active-key);
  stroke: var(--piano-active-key-light);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-svg.is-playing .key-active.white-key,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-svg.is-playing .key-active.black-key {
  fill: var(--play-highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-label {
  fill: var(--text-strong);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .black-label {
  fill: #FFFFFF;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-active + .key-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-active + .black-label {
  fill: var(--active-text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-fret,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-nut {
  stroke: #C2859C;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-fret.is-active-fret {
  stroke: var(--piano-active-key-light);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-string {
  stroke: var(--text-strong);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-fret-marker {
  fill: var(--highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-active-fret-range {
  fill: rgba(241, 69, 145, 0.14);
  stroke: rgba(246, 182, 96, 0.42);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-barre-line {
  stroke: var(--piano-active-key);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-barre-label-bg {
  fill: var(--panel);
  stroke: var(--accent);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-note {
  fill: var(--piano-active-key);
  stroke: var(--piano-active-key-light);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-open-note {
  fill: var(--piano-white-key);
  stroke: var(--highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-svg.is-playing .guitar-note {
  fill: var(--play-highlight);
  stroke: var(--play-highlight-soft);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-svg.is-playing.has-current-note .guitar-note {
  fill: var(--accent-glow);
  stroke: var(--active-border);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-svg.is-playing.has-current-note .guitar-note.is-current-note {
  fill: var(--play-highlight);
  stroke: #FFFFFF;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-note-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-open-note + .guitar-note-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-string-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-fret-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-base-fret-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-string-indicator,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-fallback-notes {
  fill: var(--text-strong);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-finger-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-barre-label {
  fill: #FFFFFF;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-muted {
  fill: var(--accent-deep);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .guitar-fallback-title {
  fill: var(--highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .keyboard-legend {
  color: var(--muted);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .keyboard-legend::before {
  border-color: var(--accent-strong);
  background: var(--piano-active-key);
  box-shadow: 0 0 10px rgba(241, 69, 145, 0.42);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .play-button::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button::before {
  background-color: transparent;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .play-button::before {
  background-image: var(--pv-play-button-image);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button::before {
  background-image: var(--pv-repeat-button-image);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .play-button:hover::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .play-button:focus-visible::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .play-button:active::before {
  background-image: var(--pv-play-button-hover-image);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button:hover::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button:focus-visible::before {
  background-image: var(--pv-repeat-button-hover-image);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button:active::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button.is-looping::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .repeat-button[aria-pressed="true"]::before {
  background-image: var(--pv-repeat-button-active-image);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .piano-card .repeat-button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .key-chord-grid .repeat-button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel .repeat-button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .octave-toggle,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button {
  border-color: var(--play-border);
  background:
    linear-gradient(180deg, var(--play-highlight-soft), var(--play-highlight));
  color: var(--active-text);
  box-shadow:
    inset 0 0 18px rgba(255, 255, 255, 0.24),
    0 0 18px rgba(241, 69, 145, 0.22);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .octave-toggle:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .octave-toggle:focus-visible {
  border-color: var(--accent);
  background:
    linear-gradient(180deg, #FDE2EE, var(--play-highlight));
  color: var(--active-text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button:focus-visible,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .sound-select-button:active {
  background-color: var(--accent);
  background-image: linear-gradient(180deg, #FEEBB1, #F6B660);
  color: var(--text-strong);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-list li,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel ol > li {
  border-color: rgba(249, 164, 203, 0.5);
  background:
    linear-gradient(90deg, rgba(252, 151, 196, 0.14), transparent 42%),
    linear-gradient(180deg, rgba(255, 247, 252, 0.92), rgba(252, 244, 247, 0.88));
  box-shadow: inset 0 0 16px rgba(254, 235, 177, 0.18);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-list li:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel ol > li:hover,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel ol > li.is-playing {
  border-color: var(--accent-strong);
  background:
    linear-gradient(90deg, rgba(254, 235, 177, 0.34), transparent 46%),
    linear-gradient(180deg, rgba(255, 247, 252, 0.96), rgba(253, 226, 238, 0.92));
  box-shadow:
    inset 3px 0 0 var(--accent),
    0 0 16px rgba(241, 69, 145, 0.18);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-list span:first-child,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .progressions-panel span,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .keyboard-legend [data-home-progression-step-label],
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-songs-label,
body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-songs-separator {
  color: var(--highlight);
  text-shadow: 0 0 8px rgba(252, 151, 196, 0.36);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-list span + span,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-page-counter,
body.piano-app-page[data-page="piano"][data-theme="blessed"] footer {
  color: var(--muted);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-list li button {
  border-color: var(--button-border);
  background: var(--button-bg);
  color: transparent;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.54),
    0 0 10px rgba(241, 69, 145, 0.12);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-list li button::before,
body.piano-app-page[data-page="piano"][data-theme="blessed"] [data-related-chord-type]::before {
  border-color: var(--highlight);
  box-shadow: 0 0 8px rgb(221 0 113);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .related-chords-list li button::after,
body.piano-app-page[data-page="piano"][data-theme="blessed"] [data-related-chord-type]::after {
  background: var(--highlight);
  box-shadow: 0 0 8px rgba(241, 69, 145, 0.36);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .github-icon-card {
  border-color: var(--button-border);
  background:
    radial-gradient(circle at 45% 38%, rgba(254, 235, 177, 0.44), transparent 3rem),
    linear-gradient(180deg, var(--panel-warm), var(--panel));
  box-shadow:
    0 0 0 1px rgba(249, 164, 203, 0.28),
    inset 0 0 0 1px rgba(255, 255, 255, 0.62),
    inset 0 0 14px rgba(241, 69, 145, 0.14),
    0 0 10px rgba(246, 182, 96, 0.14);
  color: #ffffff;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .github-icon-card::before {
  border-color: rgba(246, 182, 96, 0.34);
  box-shadow: inset 0 0 8px rgba(246, 182, 96, 0.12);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .github-icon-card svg,
body.piano-app-page[data-page="piano"][data-theme="blessed"] .mobile-github-link svg {
  fill: currentColor;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-utility-row [data-home-progression-utility] {
  background: linear-gradient(180deg, #FFFFFF, var(--button-bg));
  text-shadow: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-utility-row [data-home-progression-utility="add"] {
  border-color: var(--highlight);
  color: #A62D6B;
}

body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-utility-row [data-home-progression-utility="remove"] {
  border-color: var(--accent-strong);
  color: var(--accent-deep);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-utility-row [data-home-progression-utility="random"] {
  border-color: var(--accent);
  color: var(--accent-deep);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-utility-row [data-home-progression-utility="reset"] {
  border-color: var(--highlight-soft);
  color: var(--highlight);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-step {
  border-color: rgba(249, 164, 203, 0.48);
  background: rgba(255, 247, 252, 0.86);
  color: var(--muted);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .progression-animation.is-active .progression-step {
  border-color: var(--highlight);
  color: var(--text-strong);
  box-shadow:
    0 0 0 2px rgba(241, 69, 145, 0.18),
    0 0 16px rgba(241, 69, 145, 0.22);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .orientation-advisory {
  background:
    radial-gradient(circle at 50% 42%, rgba(252, 151, 196, 0.2), transparent 18rem),
    rgba(252, 236, 243, 0.88);
  color: var(--text);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .orientation-advisory__panel {
  border-color: var(--button-border);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.84), transparent 45%),
    linear-gradient(135deg, var(--panel), var(--panel-warm));
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.7),
    inset 0 -18px 42px rgba(254, 235, 177, 0.22),
    0 0 28px rgba(241, 69, 145, 0.22);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .orientation-advisory__panel::before {
  border-color: rgba(246, 182, 96, 0.34);
}

body.piano-app-page[data-page="piano"][data-theme="blessed"] .orientation-advisory__panel::after {
  background: repeating-linear-gradient(
    180deg,
    rgba(241, 69, 145, 0.04) 0,
    rgba(241, 69, 145, 0.04) 1px,
    transparent 1px,
    transparent 7px
  );
}

body.piano-app-page[data-page="piano"][data-theme="blessed"].is-home-progressions-mode .progression-scale-options {
  background: #f7c5de;
}
