#glucosolo2Wrap{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:#000;color:#fff;max-width:560px;margin:auto;padding:12px;border-radius:12px}
.mode-toggle button{background:#222;color:#fff;border:1px solid #444;padding:8px 10px;border-radius:8px;margin-right:6px}
.mode-toggle button.active{background:#0073aa}
#liveVideo{width:100%;border-radius:12px;border:1px solid #444;background:#000}
.guides{opacity:.8;font-size:.9em;margin:6px 0}
.indicators span{display:inline-block;margin-right:8px;font-size:.85em}
.controls button{margin:8px 6px 0 0;padding:8px 10px;border-radius:8px;border:1px solid #444;background:#222;color:#fff}
.controls button:disabled{opacity:.5}
.refline{margin-top:10px}
#refInput{background:#fff;color:#000;border-radius:8px;border:1px solid #888;padding:8px;width:100%;box-sizing:border-box}
#estTxt{font-size:1.1em;margin:8px 0 4px}
#metricsChart{margin-top:8px;background:#111;border-radius:12px;border:1px solid #333}

#roiCircle {
  position: absolute;
  border: 2px solid white;
  border-radius: 50%;
  pointer-events: none;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 8px rgba(0,0,0,0.5);
}
#livePane {
  position: relative;
}

#videoWrap{position:relative;width:100%;border-radius:12px;overflow:hidden}
#videoWrap > #liveVideo{display:block;width:100%;height:auto;border-radius:12px}
#videoWrap > #roiCircle{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:200px;
  height:200px;
  border-radius:50%;
  border:2px solid #fff;
  box-shadow:0 0 6px rgba(0,0,0,.5);
  pointer-events:none;
  z-index:10;
}

#videoWrap{position:relative;border-radius:12px;overflow:hidden}
#videoWrap > #liveVideo{display:block;width:100%;height:auto;border-radius:12px}
#videoWrap > #roiCircle,
#livePane > #roiCircle{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:200px;
  height:200px;
  border-radius:50%;
  border:2px solid #fff;
  pointer-events:none;
  z-index:10;
}

#glucosolo2Wrap > h2{color:#568203}

/* v4.0.1 auto UI */
.gs2-bars{ margin-top:10px; }
.gs2-bar{ margin:10px 0; }
.gs2-barlabel{ font-size:14px; opacity:.9; margin-bottom:4px; }
.gs2-bars input[type=range]{ width:100%; }
.gs2-result{ margin-top:10px; font-size:18px; font-weight:600; }


#signalCanvas{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:20;mix-blend-mode:screen;opacity:.95;}


/* === Measurement history + trend (v4.0.7) === */
.gs2-history{ margin-top:12px; }
.gs2-panel-title{
  font-size:14px;
  opacity:.9;
  margin:8px 0 6px;
}
.gs2-tablewrap{
  border:1px solid #333;
  background:#0b0b0b;
  border-radius:12px;
  padding:8px;
  max-height:170px;
  overflow:auto;
}
.gs2-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.gs2-table thead th{
  text-align:left;
  font-weight:600;
  padding:6px 6px;
  border-bottom:1px solid #2a2a2a;
  position:sticky;
  top:0;
  background:#0b0b0b;
}
.gs2-table tbody td{
  padding:6px 6px;
  border-bottom:1px solid #171717;
  opacity:.95;
}
.gs2-table tbody tr:last-child td{ border-bottom:none; }
.gs2-chartwrap{
  border:1px solid #333;
  background:#0b0b0b;
  border-radius:12px;
  padding:10px;
}
#gs2TrendCanvas{ width:100%; height:220px; display:block; }
.gs2-note{ font-size:12px; opacity:.75; margin-top:8px; }


/* === Voice prompt (ask-once) v4.1.4 === */
/* === Age band (initial calibration) v4.1.8 === */
.gs2-age{
  margin-top:10px;
  border:1px solid #333;
  background:#0b0b0b;
  border-radius:12px;
  padding:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.gs2-age-label{ font-size:13px; opacity:.9; }
.gs2-age-select{
  background:#111;
  color:#fff;
  border:1px solid #444;
  border-radius:10px;
  padding:8px 10px;
  font-size:13px;
}

/* v4.4.4 fasting toggle */
#gs2FastingWrap{display:flex;align-items:center;gap:10px;margin-top:8px;user-select:none}
#gs2FastingWrap label{font-size:13px;opacity:.9}
#gs2FastingToggle{width:22px;height:22px;accent-color:#7fbf3f}

/* v4.4.5 Manual Start Button */
#gs2ManualStartBtn{
  margin-top:10px;
  padding:10px 14px;
  font-size:14px;
  font-weight:600;
  background:#7fbf3f;
  border:none;
  border-radius:6px;
  cursor:pointer;
}


/* ===== v4.7.2 Advanced panel (optional reference) ===== */
.gs2-advanced-wrap{margin-top:10px}
.gs2-advanced-btn{width:100%}
.gs2-advanced-panel{margin-top:10px;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:12px}
.gs2-field{margin-bottom:10px}
.gs2-field-label{display:block;font-size:14px;margin-bottom:6px;opacity:.95}
.gs2-field-input{width:100%;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:#0b0d12;color:#fff;font-size:16px}
.gs2-field-input::placeholder{color:rgba(255,255,255,.55)}
.gs2-field-hint{font-size:12px;opacity:.7;margin-top:6px;line-height:1.35}
.gs2-optional{font-size:12px;opacity:.7}


/* v4.9.36: Main controls (e.g., Fasting toggle) */
#glucosolo2Wrap .gs2-main-controls{ margin-top:10px; margin-bottom:6px; }
#glucosolo2Wrap #gs2FastingWrap{ display:flex; align-items:center; gap:10px; font-size:14px; opacity:0.95; }
#glucosolo2Wrap #gs2FastingWrap label{ cursor:pointer; }


/* GlucoSense360 v1.6.2 */
#gs360InsightsPanel{margin-top:14px;background:#111;border:1px solid #333;border-radius:12px;padding:12px}
.gs360-panel-title{font-weight:700;margin-bottom:8px}
.gs360-insights-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.gs360-insight-card{background:#0a0a0a;border:1px solid #2a2a2a;border-radius:10px;padding:10px}
.gs360-insight-label{font-size:.85em;opacity:.8;margin-bottom:4px}
.gs360-insight-value{font-size:1.05em;font-weight:700}
.gs360-meal-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.gs360-field-label{display:block;margin-bottom:6px;font-size:.9em}
.gs360-field-input{background:#fff;color:#000;border-radius:8px;border:1px solid #888;padding:8px;width:100%;box-sizing:border-box}
@media (max-width:520px){.gs360-insights-grid,.gs360-meal-row{grid-template-columns:1fr}}


/* GlucoSense360 v1.6.2 context additions */
.gs360-context-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
@media (max-width:520px){.gs360-context-grid{grid-template-columns:1fr}}
