:root {
  --bg-viewport: #2b2926;
  --bg-page: #ffffff;
  --text-main: #212529;
  --text-body: #3b362e;
  --accent-color: #996515;
  --accent-hover: #724b0f;
  --border-color: #d3ccbc;
  --bg-input: #fcfcfc;
  --bg-input-focus: #ffffff;
}

body.theme-classic {
  --bg-viewport: #2b2926;
  --bg-page: #ffffff;
  --text-main: #212529;
  --text-body: #3b362e;
  --accent-color: #996515;
  --accent-hover: #724b0f;
  --border-color: #d3ccbc;
  --bg-input: #fcfcfc;
  --bg-input-focus: #ffffff;
}

body.theme-vintage {
  --bg-viewport: #332922;
  --bg-page: #f4eee1;
  --text-main: #2c221e;
  --text-body: #3d322b;
  --accent-color: #8c6239;
  --accent-hover: #6b4a2b;
  --border-color: #c8b9a6;
  --bg-input: #eae1d0;
  --bg-input-focus: #f4eee1;
}

body.theme-midnight {
  --bg-viewport: #1a2228;
  --bg-page: #f8f9fa;
  --text-main: #1e293b;
  --text-body: #334155;
  --accent-color: #b38636;
  --accent-hover: #926c2a;
  --border-color: #cbd5e1;
  --bg-input: #f1f5f9;
  --bg-input-focus: #ffffff;
}

body.theme-forest {
  --bg-viewport: #232824;
  --bg-page: #fdfbf7;
  --text-main: #222823;
  --text-body: #363d37;
  --accent-color: #786c3b;
  --accent-hover: #5d532e;
  --border-color: #d0c8b4;
  --bg-input: #f5f2eb;
  --bg-input-focus: #fdfbf7;
}

body.theme-sepia {
  --bg-viewport: #2e2621;
  --bg-page: #faebd7;
  --text-main: #3a2e2b;
  --text-body: #4a3d38;
  --accent-color: #a0522d;
  --accent-hover: #803e1e;
  --border-color: #d7b899;
  --bg-input: #f2e2cb;
  --bg-input-focus: #faebd7;
}

body.theme-slate {
  --bg-viewport: #111827;
  --bg-page: #1f2937;
  --text-main: #f9fafb;
  --text-body: #e5e7eb;
  --accent-color: #38bdf8;
  --accent-hover: #0ea5e9;
  --border-color: #374151;
  --bg-input: #374151;
  --bg-input-focus: #4b5563;
}

body{margin:0;background:var(--bg-viewport);color:var(--text-main);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.5}
.page{max-width:1040px;margin:0 auto 48px;padding:32px 48px 40px;background:var(--bg-page);border-radius:0 0 6px 6px;box-shadow:0 8px 24px rgba(0,0,0,0.25);border:1px solid var(--border-color);border-top:none}

header{border-bottom:1px solid var(--border-color);padding-bottom:16px;margin-bottom:28px;display:flex;flex-direction:column}
.header-top {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-bottom: 20px;
  width: 100%;
}

.site-brand-container{text-align:center;padding-top:2px}
.site-title{font-family:'EB Garamond', serif;font-size:46px;font-weight:700;letter-spacing:0.01em;color:var(--accent-color);margin:0 0 8px 0;line-height:1}
.site-subhead{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:15.5px;font-weight:600;text-transform:uppercase;letter-spacing:0.15em;color:var(--text-main);margin:0}

.site-navigation {
  position: absolute;
  left: 0;
  top: 2px;
}
.burger-toggle {background: none;color: var(--accent-color);padding: 0;font-size: 20px;font-weight: 700;border: none;cursor: pointer;font-family: inherit;line-height: 1;display: block;}
.burger-toggle:hover {color: var(--accent-hover);}
.menu-dropdown {display: none;position: absolute;left: 0;top: 100%;background-color: var(--bg-page);width: max-content;min-width: 140px;box-shadow: 0 8px 16px rgba(0,0,0,0.15);border: 1px solid var(--border-color);border-radius: 4px;z-index: 10;padding: 8px 0;text-align: left;}
.site-navigation.is-open .menu-dropdown {display: block;}
.menu-dropdown ul {list-style: none;margin: 0;padding: 0;}
.menu-dropdown li a {color: var(--accent-color);padding: 6px 16px;text-decoration: none;display: block;font-size: 13px;font-weight: 500;text-align: left;white-space: nowrap;}
.menu-dropdown li a:hover {background-color: rgba(0,0,0,0.03);color: var(--accent-hover);}

.menu-dropdown a.active {
  font-weight: bold;
  color: var(--text-main);
  pointer-events: none;
}

.menu-dropdown a.active:hover {
  background-color: transparent;
  color: var(--text-main);
}

.header-bottom{display:flex;justify-content:flex-end;align-items:flex-end;width:100%}
.sub-nav{font-size:13.5px;display:flex;gap:12px;align-items:center}
.sub-nav a{color:var(--accent-color);text-decoration:none;font-weight:600;transition:color 0.15s ease}
.sub-nav a:hover{color:var(--accent-hover);text-decoration:underline}
.sub-nav span{color:var(--accent-color);font-weight:600}

a{color:var(--accent-color);text-decoration:none;font-weight:600}
a:hover{text-decoration:underline}

h1{font-size:20px;font-weight:500;margin:0 0 8px;color:var(--text-main);letter-spacing:-0.01em}
.label-description{font-size:14px;color:var(--text-body);margin-bottom:24px;line-height:1.5}

.header-thumbnails {
    display: flex;
    justify-content: center;
    gap: 0;
    margin-bottom: 32px;
    overflow-x: auto;
    padding-bottom: 4px;
}
.header-thumbnails img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border: 1px solid var(--border-color);
    border-left: none;
    background: var(--bg-input);
    display: block;
    pointer-events: none;
}
.header-thumbnails img:first-child {
    border-left: 1px solid var(--border-color);
}

.page-title-container {
    text-align: center;
    margin-top: 4px;
    margin-bottom: 38px;
}
.page-main-title {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 32px;
    font-weight: 500;
    color: var(--text-main);
    letter-spacing: -0.01em;
    margin: 0;
    line-height: 1;
}

.content-container {
    max-width: 800px;
    margin: 0 auto;
    font-size: 15px;
    color: var(--text-body);
    line-height: 1.7;
}
.content-container p {
    margin-bottom: 24px;
    text-align: left;
}
.content-container h2 {
    font-size: 20px;
    font-weight: 600;
    color: var(--text-main);
    margin-top: 36px;
    margin-bottom: 16px;
    text-align: left;
}
.content-container ul {
    padding-left: 0;
    margin-left: 0;
    list-style-position: inside;
}
.content-container li {
    margin-bottom: 12px;
    text-align: left;
}

.contact-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 20px;
}
.form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-align: left;
}
.form-group label {
    font-weight: 600;
    font-size: 14px;
    color: var(--text-main);
}
.form-group input,
.form-group textarea {
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    font-family: inherit;
    font-size: 15px;
    color: var(--text-main);
    background: var(--bg-input);
}
.form-group input:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--accent-color);
    background: var(--bg-input-focus);
}
.form-submit {
    align-self: flex-start;
    background-color: var(--accent-color);
    color: #ffffff;
    border: none;
    border-radius: 4px;
    padding: 10px 20px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}
.form-submit:hover {
    background-color: var(--accent-hover);
}

/* FAQ Accordion Styles */
.content-container .faq-list {
    padding-left: 0;
    margin-left: 0;
    list-style: none;
}
.content-container .faq-item {
    margin-bottom: 12px;
    text-align: left;
}
.content-container details {
    cursor: pointer;
}
.content-container summary {
    font-weight: 600;
    color: var(--accent-color);
}
.content-container summary:hover {
    text-decoration: underline;
}
.content-container .faq-answer {
    margin-top: 6px;
    margin-bottom: 0;
    color: var(--text-body);
}

@media(max-width:860px){
body{background:var(--bg-page)}
.page{margin:0;padding:16px;border-radius:0;box-shadow:none;border:none}
.index-grid{display:block}
.page-title-container{margin-bottom:28px}
.header-top{display:flex;flex-direction:column;align-items:center}
.site-navigation{position:relative;left:auto;top:auto;margin-bottom:16px}
.header-bottom{flex-direction:column;align-items:center;gap:12px}
.content-container ul {margin-left: 0;}
.content-container .faq-list {margin-left: 0;}
}

/* Home Page Specific Layouts */
.index-grid{display:grid;grid-template-columns:400px 1fr;gap:48px;align-items:start}
.hero-container{display:flex;justify-content:center;align-items:center;width:100%;aspect-ratio:1/1;margin-bottom:0;overflow:hidden;background:var(--bg-page);border:1px solid var(--border-color);border-radius:4px;padding:4px;box-sizing:border-box}
.hero-image{width:100%;height:100%;object-fit:cover;display:block}
.hero-link{display:block;width:100%;height:100%}
.intro{padding:0 0 20px;margin-bottom:20px;font-size:14px;color:var(--text-body)}
.intro p{margin:0 0 16px 0}
.intro p:last-child{margin-bottom:0}
.doors{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 24px}
.door{font-size:14px;padding-top:4px}
.door a{font-weight:600;font-size:15px}
.door p{margin:4px 0 0;font-size:13px;color:var(--text-body)}

@media(max-width:860px){
.hero-container{max-width:400px;margin-bottom:24px}
.doors{grid-template-columns:1fr}
}

/* Filter Bar Layouts */
.filter-bar{
    margin-bottom:24px;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    font-size:15px;
}
.filter-bar select{
    padding:4px 8px;
    font-size:14px;
    border:1px solid var(--border-color);
    border-radius:4px;
    background:var(--bg-input);
    color:var(--text-main);
}
.filter-bar select:focus {
    outline: none;
    border-color: var(--accent-color);
    background: var(--bg-input-focus);
}

.filter-bar.centered {
    justify-content: center;
}
.filter-bar.centered select {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.sub-nav .current-door{color:var(--text-main);font-weight:600}

/* Composer Index Specific Layouts */
.accordion-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px 24px;
    align-items: start;
}
.composer-item {
    margin-bottom: 2px;
}
.composer-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 4px;
    background-color: transparent;
    user-select: none;
    border-radius: 4px;
}
.composer-left {display: flex; align-items: center; gap: 6px;}
.composer-name {font-size: 14px; font-weight: 600; color: var(--accent-color); text-decoration: none;}
.composer-name:hover {text-decoration: underline;}

@media(max-width:860px){
.accordion-grid{grid-template-columns:1fr;}
}

/* Label Index Specific Layouts */
.results-list{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 12px;list-style:none;padding:0;margin:0}
.results-list li{margin-bottom:0}
.results-list a{font-size:14px;font-weight:600;display:block}

@media(max-width:860px){
.results-list{grid-template-columns:repeat(2,1fr)}
}

/* Performer Index Specific Layouts */
.section-title{font-size:15px;font-weight:700;color:var(--text-main);text-transform:uppercase;letter-spacing:0.05em;border-bottom:2px solid var(--accent-color);padding-bottom:6px;margin-bottom:16px}
.results-columns-inner{display:grid;grid-template-columns:repeat(2,1fr);gap:32px}
.results-column{min-width:0;margin-bottom:0}
.results-column:last-child{margin-bottom:0}
.results-section{margin-bottom:20px}

/* Override global .results-list behavior specifically for the performer columns */
.results-column .results-list.performer-list {
    display: block !important;
}
.results-column .results-list.performer-list li {
    display: block !important;
    margin-bottom: 8px !important;
}
.results-column .results-list.performer-list a {
    display: inline-block !important;
    white-space: normal !important;
}

@media(max-width:860px){
.results-columns-inner{display:block}
.results-column{margin-bottom:24px}
}

/* Release Year Index Specific Layouts */
.release-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 30px;
}
.release-item {
    text-align: center;
}
.release-image-container {
    width: 100%;
    max-width: 300px;
    margin: 0 auto 12px;
    aspect-ratio: 1/1;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 2px;
    background: var(--bg-input);
}
.release-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.release-caption {
    font-size: 14px;
    font-weight: 600;
}