/* KioskInteract brand layer for the immersive mechanics exhibit. */
:root{
  --bg:#101a30;
  --panel:#172139;
  --line:#3c4a68;
  --text:#f7f5f0;
  --muted:#abb6cc;
  --amber:#ffb36b;
  --mint:#8da7e0;
  --coral:#f4793b;
}
.masthead{background:#faf9f6;color:#172139;border-color:#dedfe5}
.identity{color:#172139}
.identity small{color:#626879}
.module-tabs{background:#eceff5;border-color:#d8dfeb}
.module-tab{color:#172139}
.module-tab small{color:#626879}
.module-tab.active{background:#fff;border-color:#c8d3e8;color:#172139;box-shadow:0 2px 8px #17213912}
.module-tab.hub-tab{color:#284fa6;border-color:#284fa655;background:#fff}
.module-tab.hub-tab:hover{border-color:#284fa6;background:#e8edf8}
.module-tab.quiz-tab-btn{color:#b64f20;border-color:#f4793b66;background:#fff3e9}
.module-tab.quiz-tab-btn:hover{background:#ffe5d1;border-color:#f4793b}
.round-button,.reset-button{color:#506079}
.round-button[aria-pressed="true"]{color:#284fa6;border-color:#284fa6}
.control-panel{background:linear-gradient(150deg,#1c2945,#131d33)}
.gear-selector button{background:#10192d}
#clutch-warn{background:#0e172b;border-left-color:#617bab}
.clutch-button{background:#223253;border-color:#4a608a}
.small-badge{background:#ffb36b16}
.stage{background:radial-gradient(ellipse at 50% 60%,#2b3d62,#0e172b 75%)}
.stage::before{background:linear-gradient(#0e172be8,#0e172b80 52%,transparent)}
.learning-panel{background:#172139}
.camera-buttons,.playback-buttons{background:#13203aeb;border-color:#52698f69}
.view-toolbar button.active{background:#42577d80;border-color:#687ca080}
.part-label{background:#111d36e8}
.part-label:hover{background:#28436e}
.part-card{background:#172847f5;border-color:#7890bb80}
.footer{background:#111b31;color:#abb6cc}
.mobile-gear-dock,.mobile-hydraulic-dock{background:#101a30f2;border-color:#596c92}
.mobile-gear-buttons button,.mobile-clutch,.mobile-hydraulic-dock button{background:#1d2b49;border-color:#465b82}
#quiz-dialog,dialog{background:#17243ff8;border-color:#53698f}
.quiz-option-btn{background:#1b2946;border-color:#3c5077}
.quiz-option-btn:hover:not(:disabled){background:#24375e}
.quiz-opt-letter{background:#2b3e64}
.quiz-feedback{background:#1a2947;border-color:#3c5077}
.masthead,.masthead>*{min-width:0}
.module-tab,.identity{overflow-wrap:anywhere}
@media(max-width:760px){
  .masthead{grid-template-columns:minmax(0,1fr) auto}
  .identity{white-space:normal;gap:8px;font-size:9px;letter-spacing:.7px}
  .identity-mark{flex-shrink:0}
  .module-tabs{grid-template-columns:repeat(3,minmax(0,1fr));min-width:0}
  .header-tools{min-width:0}
  .scene-heading{right:16px}
  .scene-heading h2{font-size:clamp(20px,5.6vw,27px);overflow-wrap:anywhere}
  .scene-metrics{top:165px;left:20px;right:20px;justify-content:flex-end}
  .mobile-clutch,.mobile-hitch-buttons button span{overflow-wrap:anywhere}
}
/* Readable controls with the same type family as the website. */
:root{font-family:"Plus Jakarta Sans",Arial,sans-serif}
.panel-intro h1,.scene-heading h2,.learning-panel h2,dialog h2{font-weight:600;letter-spacing:-.035em}
.panel-intro p,.learning-panel p,.part-card p,dialog p{font-size:14px;line-height:1.7}
.section-label,.section-label h2,.auto-clutch-option,.clutch-button,.segmented button,.shift-detail-button{font-size:14px}
.control-message,.fine-print,.pto-readout,.hydraulic-detail-tools p{font-size:12px}
.auto-clutch-option small,.clutch-button small,.tour-button small,.hydraulic-detail-button small{font-size:11px;line-height:1.5}
.tour-button,.hydraulic-detail-button,.quiz-option-btn,.quiz-feedback-text,.quiz-results-card-desc{font-size:14px}
.module-tab{font-size:14px;border-radius:20px}
.module-tabs{border-radius:24px}
.control-panel button,.tour-button,.hydraulic-detail-button{border-radius:12px}
@media(max-width:760px){.module-tab{font-size:12px}.module-tab.hub-tab{font-size:13px}.learning-panel p{font-size:14px}}
