/*
 * Syncrota Interactive Wheel
 * Based on Syncrota source material associated with Universal Truth School / Santos Bonacci.
 * Interactive implementation © 2026 Imran Ali.
 * Syncrota / Universal Truth School source materials remain the property of their respective owner(s).
 * No ownership of third-party source material is claimed.
 */

/* Universal Truth School presentation theme.
   This changes the application chrome only; wheel/data colours remain source-driven. */

html[data-theme="uts"]{
 --wheel-hover-border:#3B82F6;
 --wheel-selected-border:#3B82F6;
 --wheel-hover-border-width:2;
 --wheel-selected-border-width:3;
 color:#eee8db;
 background:#0b0a09;
 font-family:Inter,sans-serif;
}

html[data-theme="uts"] body{background:#0b0a09;color:#eee8db}

html[data-theme="uts"] header{
 background:#0d0c0a;
 border-bottom-color:#3d3528;
 box-shadow:0 1px 0 rgba(210,176,105,.09);
}
html[data-theme="uts"] header h1{
 color:#f1eadc;
 font-family:Inter,sans-serif;
 font-weight:500;
 letter-spacing:.015em;
}
html[data-theme="uts"] header span{
 color:#a99f8f;
 font-family:Inter,Segoe UI,Arial,sans-serif;
}
html[data-theme="uts"] .theme-switcher{
 background:#17140f;
 border-color:#4d4232;
}
html[data-theme="uts"] .theme-switcher button{
 color:#a99f8f;
 font-family:Inter,Segoe UI,Arial,sans-serif;
}
html[data-theme="uts"] .theme-switcher button[aria-pressed="true"]{
 background:#c6a86b;
 color:#17130d;
 box-shadow:none;
}

html[data-theme="uts"] #wheelWrap{background:#0b0a09}
html[data-theme="uts"] #breadcrumb{
 background:rgba(18,16,13,.94);
 color:#eee8db;
 border-color:#5c4c34;
 box-shadow:0 3px 12px rgba(0,0,0,.16);
 font-family:Inter,Segoe UI,Arial,sans-serif;
}
html[data-theme="uts"] #resetWheelBtn{
 background:rgba(18,16,13,.94);
 color:#eee8db;
 border-color:#5c4c34;
 font-family:Inter,Segoe UI,Arial,sans-serif;
}
html[data-theme="uts"] #legendInfoBtn{
 background:#c6a86b;
 color:#17130d;
 border-color:#c6a86b;
 font-family:Inter,Segoe UI,Arial,sans-serif;
}

html[data-theme="uts"] .panel{
 background:#11100e;
 color:#e9e2d5;
 border-left-color:#3d3528;
}
html[data-theme="uts"] .panel h2{
 color:#f1eadc;
 font-family:Inter,sans-serif;
 font-weight:500;
 letter-spacing:.01em;
}
html[data-theme="uts"] .sub,
html[data-theme="uts"] .small{color:#a99f8f}
html[data-theme="uts"] #hint{
 background:#17140f;
 color:#b7ad9e;
 border-color:#3d3528;
}
html[data-theme="uts"] #closeDetailsBtn{color:#d8cdbb}

html[data-theme="uts"] .card{
 background:#17140f;
 border-color:#3d3528;
 border-radius:10px;
 color:#e9e2d5;
}
html[data-theme="uts"] .card h3{
 color:#c6a86b;
 letter-spacing:.08em;
}
html[data-theme="uts"] .value{color:#f1eadc}
html[data-theme="uts"] .chip{
 background:#211d16;
 border-color:#514530;
 color:#e9e2d5;
}
html[data-theme="uts"] .common-collapsible>.common-section-toggle{
 color:#eee8db;
}
html[data-theme="uts"] .common-collapsible>.common-section-toggle .common-section-chevron{
 color:#c6a86b;
}

html[data-theme="uts"] .layer-order-row{
 background:#15130f;
 border-color:#3d3528;
}
html[data-theme="uts"] .layer-order-row.layer-order-header{
 background:#211d16;
 color:#e9e2d5;
}
html[data-theme="uts"] .layer-order-index{color:#8f8576}
html[data-theme="uts"] .layer-order-name,
html[data-theme="uts"] .layer-example-note{color:#ddd4c5}

html[data-theme="uts"] .info-table .info-label{color:#d8cdbb}
html[data-theme="uts"] .info-table .info-value{color:#eee8db}

html[data-theme="uts"] #wheelTooltip{
 background:#11100e;
 color:#f1eadc;
 border-color:#5c4c34;
 box-shadow:0 5px 18px rgba(0,0,0,.35);
}

html[data-theme="uts"] .calibration-panel{
 background:#0d0c0a;
 border-color:#4d4232;
 color:#eee8db;
}
html[data-theme="uts"] .calibration-panel b{color:#f1eadc}
html[data-theme="uts"] .calibration-panel .small{color:#a99f8f}

@media(max-width:900px){
 html[data-theme="uts"] .panel{
  background:#11100e;
  border-top-color:#3d3528;
 }
 html[data-theme="uts"] .panel-title-row{
  background:#11100e;
 }
}
@media(max-width:900px) and (orientation:landscape){
 html[data-theme="uts"] .panel{border-left-color:#3d3528}
}

html[data-theme="uts"] .wheel-layer-legend .layer-badge,
html[data-theme="uts"] .wheel-layer-legend .celestial-badge,
html[data-theme="uts"] .wheel-layer-legend .zodiac-badge{
 color:#111;
}


/* UTS presentation refinement */
html[data-theme="uts"] .syncrota-brand{display:none}
html[data-theme="uts"] .uts-brand{display:flex}
html[data-theme="uts"] .uts-brand h1{
 font-size:19px;
 font-weight:700;
 letter-spacing:.18em;
}
html[data-theme="uts"] .uts-brand span{
 font-size:11px;
 letter-spacing:.08em;
 text-transform:uppercase;
}
html[data-theme="uts"] header{
 padding-top:12px;
 padding-bottom:12px;
}
html[data-theme="uts"] .theme-switcher{
 padding:3px;
 border-radius:4px;
}
html[data-theme="uts"] .theme-switcher button{
 border-radius:2px;
 padding:6px 9px;
 letter-spacing:.04em;
 text-transform:uppercase;
}

html[data-theme="uts"] .panel{
 background:#0f0e0c;
}
html[data-theme="uts"] .panel-title-row{
 margin-bottom:8px;
 padding-bottom:9px;
 border-bottom:1px solid #302a20;
}
html[data-theme="uts"] .panel h2{
 font-size:18px;
 font-weight:650;
 letter-spacing:.035em;
}
html[data-theme="uts"] .panel .sub{
 margin-top:2px;
 font-size:10px;
 letter-spacing:.055em;
 text-transform:uppercase;
}
html[data-theme="uts"] #hint{
 margin-bottom:8px;
 border-radius:3px;
 background:#15130f;
}
html[data-theme="uts"] .card{
 margin:7px 0;
 padding:9px 10px;
 border-radius:3px;
 background:#15130f;
 border-color:#352e23;
 box-shadow:none;
}
html[data-theme="uts"] .common-collapsible>.common-section-toggle .common-section-title{
 font-size:10px;
 font-weight:700;
 letter-spacing:.075em;
 text-transform:uppercase;
}
html[data-theme="uts"] .common-collapsible>.common-section-content{
 margin-top:8px;
}
html[data-theme="uts"] .layer-order-row{
 border-radius:2px;
 background:#12110e;
}
html[data-theme="uts"] .layer-order-row.layer-order-header{
 background:#1c1812;
}
html[data-theme="uts"] .project-attribution{
 margin-top:12px;
 padding:12px 2px 4px;
 border-top-color:#352e23;
 color:#8f8577;
 font-family:Inter,sans-serif;
}
html[data-theme="uts"] .project-attribution-brand{
 color:#c6a86b;
 letter-spacing:.18em;
}
html[data-theme="uts"] .project-attribution-small{
 color:#70685e;
}

@media(max-width:900px){
 html[data-theme="uts"] header{padding-top:8px;padding-bottom:8px}
 html[data-theme="uts"] .uts-brand{gap:4px;align-items:flex-start;flex-direction:column}
 html[data-theme="uts"] .uts-brand h1{font-size:15px;letter-spacing:.15em}
 html[data-theme="uts"] .uts-brand span{font-size:8px;letter-spacing:.055em}
 html[data-theme="uts"] .theme-switcher button{padding:4px 6px;font-size:8px}
 html[data-theme="uts"] .panel-title-row{
  border-bottom-color:#302a20;
  margin-bottom:7px;
 }
}

/* Keep the three primary info-pane sections visually consistent in UTS mode. */
html[data-theme="uts"] .info-pane-section{
 margin:7px 0;
 padding:9px 10px;
 border:1px solid #352e23;
 border-radius:3px;
 background:#15130f;
 color:#e9e2d5;
 box-shadow:none;
}
html[data-theme="uts"] .info-pane-section>.common-section-toggle .common-section-title{
 font-size:16px;
 font-weight:700;
 line-height:1.15;
 letter-spacing:0;
 text-transform:none;
}
html[data-theme="uts"] .info-pane-section>.common-section-toggle .common-section-subtitle{
 font-size:11px;
 font-weight:500;
 line-height:1.25;
 letter-spacing:0;
 text-transform:none;
 color:#a99f8f;
}