/* US science page only (/the-science/#exposure). The other editions still use dose.css. */
#tgr-dose-glass{--dg-paper:#f7f8f8;--dg-ink:#151b1e;--dg-sub:#566267;--dg-line:#d8dfe2;--dg-blue:#0078a8;--dg-pale:#eaf0f3;background:var(--dg-paper);color:var(--dg-ink);font:400 15px/1.6 Instrument,Arial,sans-serif;width:100%;min-width:0;container-type:inline-size;color-scheme:light}
#tgr-dose-glass *{box-sizing:border-box}
#tgr-dose-glass [hidden]{display:none!important}
#tgr-dose-glass h3,#tgr-dose-glass p,#tgr-dose-glass figure{margin:0}
#tgr-dose-glass button,#tgr-dose-glass input{font:inherit}
#tgr-dose-glass button{cursor:pointer}
#tgr-dose-glass .dg-top{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding-bottom:14px;border-bottom:1px solid var(--dg-line)}
#tgr-dose-glass h3{font:500 24px/1.2 Instrument,Arial,sans-serif;letter-spacing:-.035em}
#tgr-dose-glass .dg-target{font-size:14px;color:var(--dg-sub);text-align:right}
#tgr-dose-glass .dg-target em{color:var(--dg-ink)}
/* Columns in the ratio of the two viewBox widths (220:380) so both drawings render at the same height and line up. */
#tgr-dose-glass .dg-scenes{display:grid;grid-template-columns:minmax(0,220fr) minmax(0,380fr);gap:24px;padding-top:18px}
#tgr-dose-glass .dg-scene{min-width:0}
#tgr-dose-glass figcaption{font-size:15px;font-weight:500;line-height:1.5}
#tgr-dose-glass .dg-scene svg{display:block;width:100%;height:auto;overflow:visible}
#tgr-dose-glass .dg-readouts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:6px;padding-top:14px;border-top:1px solid var(--dg-line);font-variant-numeric:tabular-nums}
#tgr-dose-glass .dg-label{font-size:13px;color:var(--dg-sub);line-height:1.4}
#tgr-dose-glass .dg-value{font-size:34px;line-height:1.2;letter-spacing:-.05em;margin-top:4px}
#tgr-dose-glass .dg-value small{font-size:14px;letter-spacing:0;color:var(--dg-sub);margin-left:6px}
#tgr-dose-glass .dg-approx{margin-right:.14em}
#tgr-dose-glass .dg-sub{font-size:13px;color:var(--dg-sub);line-height:1.45;margin-top:2px;min-height:19px}
#tgr-dose-glass[data-reached=true] [data-dg-reduction]{color:var(--dg-blue)}
#tgr-dose-glass .dg-control{margin-top:18px;border-top:1px solid var(--dg-line);padding-top:14px}
#tgr-dose-glass .dg-control-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:14px}
#tgr-dose-glass .dg-control-head output{color:var(--dg-blue);font-variant-numeric:tabular-nums}
#tgr-dose-glass .dg-control-row{display:flex;align-items:flex-start;gap:24px;margin-top:6px}
#tgr-dose-glass .dg-slider{flex:1;min-width:0}
#tgr-dose-glass input[type=range]{display:block;width:100%;margin:0;height:44px;background:none;appearance:none;-webkit-appearance:none;cursor:ew-resize;touch-action:pan-y}
#tgr-dose-glass input[type=range]::-webkit-slider-runnable-track{height:2px;background:#adbec7}
#tgr-dose-glass input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--dg-blue);background:var(--dg-paper);margin-top:-8px}
#tgr-dose-glass input[type=range]::-moz-range-track{height:2px;background:#adbec7}
#tgr-dose-glass input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;border:2px solid var(--dg-blue);background:var(--dg-paper)}
#tgr-dose-glass .dg-ticks{display:flex;justify-content:space-between;font-size:12px;color:var(--dg-sub);margin-top:-6px;padding:0 3px;font-variant-numeric:tabular-nums}
#tgr-dose-glass .dg-playback{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;flex:0 0 110px;padding:8px 13px;border:1px solid #aabdc6;color:var(--dg-ink);background:none;font-size:14px;line-height:1.5}
#tgr-dose-glass .dg-playback:hover:not(:disabled){background:var(--dg-pale)}
#tgr-dose-glass .dg-playback:disabled{opacity:.45;cursor:default}
#tgr-dose-glass .dg-playback svg{width:15px;height:15px}
#tgr-dose-glass .dg-log{margin-top:16px;border-top:1px solid var(--dg-line);padding-top:12px;font-size:14px}
#tgr-dose-glass .dg-log summary{cursor:pointer;min-height:32px;display:flex;align-items:center;gap:8px;list-style:none}
#tgr-dose-glass .dg-log summary::-webkit-details-marker{display:none}
#tgr-dose-glass .dg-log summary::before{content:'';width:7px;height:7px;border-right:1.5px solid var(--dg-ink);border-bottom:1.5px solid var(--dg-ink);transform:rotate(-45deg);transition:transform .2s;margin:0 4px 0 2px}
#tgr-dose-glass .dg-log[open] summary::before{transform:rotate(45deg)}
#tgr-dose-glass .dg-log p{margin:8px 0 10px;color:var(--dg-sub)}
#tgr-dose-glass .dg-log table{border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums;min-width:260px}
#tgr-dose-glass .dg-log th,#tgr-dose-glass .dg-log td{text-align:left;padding:6px 24px 6px 0;border-bottom:1px solid var(--dg-line)}
#tgr-dose-glass .dg-log th{font-weight:500;color:var(--dg-sub)}
#tgr-dose-glass .dg-source{margin-top:16px;font-size:12px;line-height:1.65;color:var(--dg-sub)}
#tgr-dose-glass .dg-source cite{font-style:normal}
#tgr-dose-glass .dg-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Glass marks: one per tested dose. */
#tgr-dose-glass .dg-mark-line{stroke:#9fb3bd;stroke-width:1;stroke-dasharray:3 3}
#tgr-dose-glass .dg-mark-fill{stroke:#9fb3bd;stroke-width:1.2}
#tgr-dose-glass .dg-mark-dot{fill:#fff;stroke:#9fb3bd;stroke-width:1.4;transition:fill .25s,stroke .25s}
#tgr-dose-glass .dg-mark-log{font-size:13px;fill:var(--dg-sub);transition:fill .25s}
#tgr-dose-glass .dg-mark-dose,#tgr-dose-glass .dg-axis{font-size:12px;fill:#8698a1;font-variant-numeric:tabular-nums}
#tgr-dose-glass .dg-axis{font-size:11px}
#tgr-dose-glass .dg-mark.is-reached .dg-mark-line,#tgr-dose-glass .dg-mark.is-reached .dg-mark-fill{stroke:var(--dg-blue);stroke-dasharray:none}
#tgr-dose-glass .dg-mark.is-reached .dg-mark-dot{fill:var(--dg-blue);stroke:var(--dg-blue)}
#tgr-dose-glass .dg-mark.is-reached .dg-mark-log{fill:var(--dg-ink);font-weight:500}
#tgr-dose-glass .dg-mark.is-reached .dg-mark-dose{fill:var(--dg-blue)}
#tgr-dose-glass .dg-mark.is-new .dg-mark-dot{animation:dg-pop .5s ease-out}
@keyframes dg-pop{0%{r:5}40%{r:9}100%{r:5}}

@container(max-width:560px){
  #tgr-dose-glass .dg-top{display:block}
  #tgr-dose-glass .dg-target{text-align:left;margin-top:4px}
  #tgr-dose-glass .dg-scenes{grid-template-columns:1fr;gap:6px}
  /* Stacked: both drawings at one height, centred, so neither dominates. */
  #tgr-dose-glass .dg-scene svg{width:auto;height:250px;max-width:100%;margin-inline:auto}
  /* The glass artwork carries its dose scale on the left, so its visible content sits left of
     the SVG centre; nudge it onto the same centre line as the lamp. */
  #tgr-dose-glass .dg-scene:not(.dg-scene-lamp) svg{transform:translateX(5.5%)}
  #tgr-dose-glass .dg-value{font-size:30px}
  #tgr-dose-glass .dg-control-row{gap:14px}
  #tgr-dose-glass .dg-playback{flex-basis:96px}
}
@media(prefers-reduced-motion:reduce){#tgr-dose-glass .dg-mark.is-new .dg-mark-dot{animation:none}}

/* Side copy: three sections with one, clearly larger gap between them than between paragraphs. */
#exposure .science-section-copy>div+div{margin-top:44px}
