/* Shared study tools (calculator + focus mode) for BOLO.Med and BOLO.IM. */
.st-calc {
  --st-panel: var(--med-panel, #0e1218);
  --st-panel-2: var(--med-panel-2, #161c26);
  --st-text: var(--med-text, var(--text-bold, #f3f6fc));
  --st-muted: var(--med-muted, var(--text-dim, #94a3b8));
  --st-border: var(--med-border, var(--border, rgba(148, 163, 184, .2)));
  --st-accent: var(--med-accent, var(--accent, #2dd4bf));
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 60;
  width: 268px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--st-accent) 40%, transparent);
  border-radius: 16px;
  background: var(--st-panel);
  color: var(--st-text);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
  font-family: inherit;
}
body[data-theme="CLASSIC"] .st-calc { --st-panel: #fff; --st-panel-2: #eef4ff; box-shadow: 0 20px 50px rgba(16, 42, 82, .18); }
.st-calc[hidden] { display: none !important; }
.st-calc-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; cursor: move; touch-action: none; user-select: none; }
.st-calc-head strong { font-size: .8rem; letter-spacing: .04em; }
.st-calc-close { min-width: 32px; min-height: 32px; border: 1px solid var(--st-border); border-radius: 8px; background: transparent; color: var(--st-muted); cursor: pointer; }
.st-calc-display { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; min-height: 64px; margin-bottom: 10px; padding: 9px 11px; border: 1px solid var(--st-border); border-radius: 10px; background: var(--st-panel-2); font-variant-numeric: tabular-nums; overflow: hidden; }
.st-calc-expr { min-height: 1.1em; max-width: 100%; overflow: hidden; color: var(--st-muted); font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.st-calc-value { max-width: 100%; overflow-x: auto; font-size: 1.5rem; font-weight: 800; white-space: nowrap; }
.st-calc-keys { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.st-key { min-height: 42px; border: 1px solid var(--st-border); border-radius: 9px; background: var(--st-panel-2); color: var(--st-text); cursor: pointer; font: 750 .95rem/1 inherit; }
.st-key:hover { border-color: var(--st-accent); }
.st-key-op { color: var(--st-accent); }
.st-key-eq { border-color: var(--st-accent); background: color-mix(in srgb, var(--st-accent) 22%, var(--st-panel-2)); }
.st-key:focus-visible, .st-calc-close:focus-visible { outline: 3px solid var(--st-accent); outline-offset: 2px; }
.st-calc-note { margin: 9px 0 0; color: var(--st-muted); font-size: .66rem; line-height: 1.45; }

/* Answer-choices-first stem placeholder (Tutor mode only). */
.st-stem-hidden { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 14px 0 18px; padding: 14px 16px; border: 1px dashed color-mix(in srgb, var(--med-accent, var(--accent, #2dd4bf)) 55%, transparent); border-radius: 13px; color: var(--med-muted, var(--text-dim, #94a3b8)); font-size: .84rem; line-height: 1.5; }
.st-stem-hidden strong { display: block; color: var(--med-text, var(--text-bold, #fff)); font-size: .9rem; }
.st-reveal-stem { min-height: 40px; padding: 8px 14px; border: 1px solid var(--med-accent, var(--accent, #2dd4bf)); border-radius: 999px; background: transparent; color: var(--med-accent, var(--accent, #2dd4bf)); cursor: pointer; font-size: .78rem; font-weight: 850; }
.st-toggle[aria-pressed="true"] { border-color: var(--med-accent, var(--accent, #2dd4bf)) !important; color: var(--med-accent, var(--accent, #2dd4bf)) !important; background: color-mix(in srgb, var(--med-accent, var(--accent, #2dd4bf)) 12%, transparent) !important; }

@media (max-width: 420px) {
  .st-calc { right: 8px; left: 8px; width: auto; }
}
@media print { .st-calc { display: none !important; } }