/* The underground challenge is a bounded overlay; the field stays visible behind it. */
dialog.drill-dialog { width:min(800px,calc(100vw - 24px)); height:min(730px,calc(100dvh - 24px)); max-width:none; max-height:none; margin:auto; padding:0; overflow:hidden; border:1px solid #829b73; border-radius:14px; background:#142b2f; color:#f1f4e9; }
.drill-dialog::backdrop { background:#071d23b8; backdrop-filter:blur(2px); }
.drill-header { height:72px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 17px; border-bottom:1px solid #45615d; }
.drill-header small { display:block; color:#87d6ac; font-size:10px; font-weight:700; letter-spacing:1px; margin-bottom:3px; }
.drill-header h2 { margin:0; font-size:22px; }
.drill-dialog .drill-close { flex-shrink:0; padding:9px; font-size:12px; }
.drill-layout { height:calc(100% - 72px); display:grid; grid-template-columns:minmax(0,1fr) 220px; min-height:0; }
.drill-cutaway { position:relative; min-width:0; min-height:0; overflow:hidden; }
#drillCanvas { display:block; width:100%; height:100%; touch-action:none; cursor:crosshair; outline-offset:-4px; image-rendering:pixelated; background:#805d42; }
.drill-sidebar { padding:16px 14px; display:flex; flex-direction:column; gap:17px; min-width:0; min-height:0; border-left:1px solid #45615d; }
.drill-readouts { display:flex; justify-content:space-between; gap:14px; }
.drill-readouts span,.drill-heat span { display:block; font-size:10px; color:#b1c6bf; font-weight:700; letter-spacing:.6px; }
.drill-readouts strong { display:block; font-size:25px; color:#f5be57; font-variant-numeric:tabular-nums; margin-top:2px; }
.drill-heat > div { display:flex; align-items:center; justify-content:space-between; }
.drill-heat strong { font-size:12px; }
#drillHeat { width:100%; height:17px; display:block; margin:3px 0 0; accent-color:#f5be57; }
#drillHeat::-webkit-meter-bar { background:#2e4847; border:0; border-radius:5px; }
#drillHeat::-webkit-meter-optimum-value { background:#87d6ac; }
#drillHeat::-webkit-meter-suboptimum-value { background:#f5be57; }
#drillHeat::-webkit-meter-even-less-good-value { background:#fa9279; }
.drill-dialog p { margin:0; font-size:12px; line-height:1.5; color:#c8d8cc; }
.drill-directions b { color:#f1f4e9; }
.drill-keys { font-size:11px!important; color:#a2bbb5!important; }
.drill-live-controls { display:flex; flex-direction:column; align-items:stretch; gap:13px; }
.drill-button-row { display:flex; gap:6px; }
.drill-button-row button { flex:1; min-width:0; }
#drillToggle[aria-pressed=true] { background:#87d6ac; border-color:#87d6ac; }
.drill-live-controls button { min-height:38px; }
.drill-live-controls label { display:flex; align-items:center; gap:7px; font-size:12px; min-height:28px; cursor:pointer; }
.drill-live-controls input { accent-color:#f5be57; width:17px; height:17px; margin:0; }
.drill-footnote { margin-top:auto!important; font-size:10px!important; color:#a2bbb5!important; }
.drill-cover { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:28px; gap:16px; background:#142b2fe0; text-align:center; }
.drill-cover strong { font-size:22px; }
.drill-cover p { max-width:320px; font-size:14px; }
.drill-cover button { min-height:44px; padding:12px 26px; }
.drill-loadout { display:grid; justify-items:center; gap:9px; width:min(100%,460px); }
.drill-bit-chooser { width:min(100%,320px); padding:9px; border:1px solid #708b79; border-radius:8px; background:#173437ed; }
.drill-bit-chooser > span { display:block; font-size:9px; font-weight:700; color:#b8d7c7; letter-spacing:.7px; margin-bottom:6px; }
.drill-bit-options { display:flex; gap:4px; }
.drill-bit-options button { flex:1; min-width:0; min-height:34px; padding:7px 3px; font-size:12px; }
.drill-bit-options button[aria-pressed=true] { color:#203531; background:#f5be57; border-color:#f5be57; }
#drillBitDescription,#drillRouteDescription { display:block; margin-top:7px; min-height:26px; font-size:11px; line-height:1.3; color:#dbe7d2; }
.drill-callout { position:absolute; top:12px; left:50%; transform:translateX(-50%); background:#142b2fdc; color:#f1f4e9; padding:7px 10px; border-radius:7px; font-size:11px; text-align:center; white-space:nowrap; pointer-events:none; }
.drill-callout:empty { display:none; }
.drill-callout.hot { background:#5d3029ef; color:#ffe4b5; }
.drill-result { display:flex; flex-direction:column; gap:10px; }
.drill-result > strong { color:#f5be57; font-size:19px; }
.drill-result #drillBestStats { font-size:12px; line-height:1.5; background:#29423b; padding:9px; border-radius:7px; color:#cee9d4; }
.drill-result-actions { display:flex; flex-direction:column; gap:6px; }
.drill-result-actions button { min-height:38px; }
@media (max-width:600px) and (min-height:541px) {
  dialog.drill-dialog { width:calc(100vw - 16px); height:calc(100dvh - 16px); border-radius:10px; }
  .drill-header { height:64px; padding:10px 12px; }
  .drill-header h2 { font-size:19px; }
  .drill-header small { font-size:9px; letter-spacing:.5px; }
  .drill-dialog .drill-close { font-size:10px; }
  .drill-layout { height:calc(100% - 64px); grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; }
  .drill-sidebar { padding:11px 12px; display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; border-left:0; border-top:1px solid #45615d; }
  .drill-readouts strong { font-size:19px; }
  .drill-readouts span,.drill-heat span { font-size:9px; }
  .drill-readouts { gap:12px; justify-content:start; }
  .drill-heat { align-self:center; }
  .drill-directions { font-size:11px!important; align-self:center; }
  .drill-keys { display:none; }
  .drill-live-controls { gap:3px; }
  .drill-live-controls button { min-height:34px; padding:6px; }
  .drill-live-controls label { font-size:11px; min-height:26px; }
  .drill-footnote { grid-column:1/-1; font-size:9px!important; }
  .drill-result { grid-column:1/-1; grid-row:2; gap:6px; }
  .drill-sidebar:has(.drill-result:not([hidden])) .drill-live-controls { display:none; }
  .drill-result > strong { font-size:18px; }
  .drill-result #drillBestStats { font-size:11px; padding:7px; }
  .drill-result-actions { flex-direction:row; }
  .drill-result-actions button { flex:1; }
  .drill-cover { padding:20px; gap:12px; }
  .drill-cover p { font-size:12px; }
}
@media (max-height:540px) {
  dialog.drill-dialog { height:calc(100dvh - 12px); width:min(860px,calc(100vw - 12px)); border-radius:8px; }
  .drill-header { height:48px; padding:5px 12px; }
  .drill-header h2 { font-size:17px; }
  .drill-header small { font-size:8px; margin-bottom:1px; }
  .drill-layout { height:calc(100% - 48px); grid-template-columns:minmax(0,1fr) 240px; }
  .drill-sidebar { padding:9px 12px; gap:8px; }
  .drill-readouts strong { font-size:19px; }
  .drill-dialog p { font-size:10px; }
  .drill-keys,.drill-footnote { display:none; }
  .drill-live-controls { flex-direction:column; align-items:stretch; gap:4px; }
  .drill-live-controls button { min-height:32px; padding:5px 9px; }
  .drill-live-controls label { font-size:10px; }
  .drill-result { gap:5px; }
  .drill-result > strong { font-size:16px; }
  .drill-result #drillBestStats { font-size:10px; padding:6px; }
  .drill-result-actions { flex-direction:row; }
  .drill-result-actions button { font-size:11px; padding:6px; flex:1; min-height:32px; }
  .drill-sidebar:has(.drill-result:not([hidden])) .drill-live-controls { display:none; }
  .drill-cover { gap:9px; padding:18px; }
  .drill-cover p { font-size:12px; max-width:420px; }
  .drill-cover strong { font-size:18px; }
  .drill-loadout:has(#drillRouteChooser:not([hidden])) { grid-template-columns:1fr 1fr; gap:8px; }
  .drill-bit-chooser { width:100%; padding:6px 8px; }
  .drill-bit-chooser > span { margin-bottom:4px; font-size:8px; }
  .drill-bit-options button { min-height:30px; padding:5px 3px; font-size:11px; }
  #drillBitDescription,#drillRouteDescription { min-height:26px; margin-top:4px; font-size:10px; }
}