.vault-drill-stage {
  --drill-green: #48db82;
  --drill-dim: #82958a;
  position: absolute;
  inset: 0;
  z-index: 7;
  display: flex;
  flex-direction: column;
  overflow: auto;
  background: radial-gradient(ellipse at 50% 38%, #122219 0, #09110d 68%);
  color: #e3eee6;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
.vault-drill-stage[hidden] { display: none !important; }
.vault-drill-header {
  min-height: 62px;
  flex: 0 0 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 0 clamp(16px, 3vw, 32px);
  border-bottom: 1px solid #24392b;
  background: #0c1510;
}
.vault-drill-kicker {
  margin: 0 0 2px;
  color: #71917b;
  font-size: 8px;
  font-weight: 750;
  letter-spacing: .16em;
}
.vault-drill-header h2 { margin: 0; color: #e5f3e9; font-size: 15px; font-weight: 650; }
.vault-drill-stage-state {
  padding: 6px 9px;
  border: 1px solid #34463a;
  border-radius: 99px;
  background: #17221a;
  color: #adc0b1;
  font: 750 8px ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .1em;
  white-space: nowrap;
}
.vault-drill-stage-state.is-active { border-color: #397d4d; background: #10271a; color: #8df0a6; }
.vault-drill-stage-state.is-warning { border-color: #705626; background: #292110; color: #f1c35f; }
.vault-drill-main {
  width: min(100%, 900px);
  flex: 1;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  align-content: stretch;
  gap: 13px;
  margin: 0 auto;
  padding: clamp(13px, 2.5vw, 27px);
}
.vault-drill-workarea { width: 100%; display: grid; align-content: center; gap: 13px; align-self: center; }
.vault-drill-machine {
  position: relative;
  width: min(100%, 720px);
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  touch-action: none;
  user-select: none;
  cursor: crosshair;
}
.vault-drill-stage .vault-drill-machine.is-box-transitioning .vault-drill-track { animation: vault-box-panel-exit .42s cubic-bezier(.45, 0, .8, .45) both; }
.vault-drill-stage .vault-drill-machine.is-box-transitioning::after,
.vault-drill-stage .vault-drill-machine.is-box-open-final::after { position: absolute; z-index: 8; inset: 0; display: grid; place-items: center; border: 1px solid #48db8270; background: radial-gradient(ellipse, #0c1a12f2 0, #07100ce8 66%, #07100cbb 100%); box-shadow: 0 0 22px #48db8220; color: #a1ffb9; content: "BOX OPEN"; font: 800 17px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .18em; text-shadow: 0 0 14px #48db8266; pointer-events: none; animation: vault-box-open-cue .92s ease both; }
.vault-drill-stage .vault-drill-machine.is-box-arriving .vault-drill-track { animation: vault-box-panel-enter .34s cubic-bezier(.15, .75, .25, 1) both; }
.vault-drill-stage .vault-drill-machine.is-box-transitioning .vault-drill-track,
.vault-drill-stage .vault-drill-machine.is-box-arriving .vault-drill-track { will-change: opacity, transform; }
@keyframes vault-box-panel-exit { to { opacity: 0; transform: translateX(-18px) scale(.97); } }
@keyframes vault-box-open-cue { 0% { opacity: 0; transform: translateY(6px) scale(.94); } 18%, 72% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 0; transform: translateY(-4px) scale(1.02); } }
@keyframes vault-box-panel-enter { from { opacity: 0; transform: translateX(18px) scale(.97); } to { opacity: 1; transform: translateX(0) scale(1); } }
@media (prefers-reduced-motion: reduce) {
  .vault-drill-stage .vault-drill-machine.is-box-transitioning .vault-drill-track,
  .vault-drill-stage .vault-drill-machine.is-box-arriving .vault-drill-track { animation: none; }
  .vault-drill-stage .vault-drill-machine.is-box-transitioning::after,
  .vault-drill-stage .vault-drill-machine.is-box-open-final::after { animation: none; opacity: 1; transform: none; }
}
.vault-drill-machine-head, .vault-drill-depth-row, .vault-drill-resource-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.vault-drill-machine-head {
  display: none;
  color: #91a39a;
  font: 750 9px ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .12em;
}
.vault-drill-machine-head strong { color: #d2e0d6; }
.vault-drill-depth-row { position: absolute; z-index: 5; left: 8px; bottom: 2px; display: flex; align-items: baseline; gap: 10px; margin: 0; color: #b2b9bb; font: 700 20px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .13em; }
.vault-drill-depth-row strong { color: #f3f5f4; font: 800 27px/.85 'Barlow Condensed', 'Arial Narrow', sans-serif; font-size: clamp(27px, 6.8cqw, 42px); letter-spacing: -.03em; }
.vault-drill-depth-row small { margin-left: 2.5px; color: #d1d7d8; font: 800 25px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: 0; }
.vault-drill-track {
  position: relative;
  aspect-ratio: 4.25 / 1;
  min-height: 86px;
  max-height: 170px;
  container-type: inline-size;
  overflow: hidden;
  border: 5px solid #05090b;
  border-radius: 2px;
  background: #11171a;
  box-shadow: 0 0 0 1px #20282c, inset 0 0 0 1px #303a3f;
}
.vault-drill-track::before {
  position: absolute;
  z-index: 0;
  inset: 0 0 0 34%;
  border: 1px solid #626c70;
  background: linear-gradient(180deg, #151b1e 0 38%, #252d31 39% 100%);
  content: "";
  pointer-events: none;
}
.vault-drill-track::after { position: absolute; z-index: 1; top: 39%; right: 9%; left: 39%; border-top: 1px dashed #c29b4970; content: ""; pointer-events: none; }
.vault-drill-bore {
  position: absolute;
  z-index: 4;
  inset: 0;
  background: transparent;
}
.vault-drill-shoulder {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 3px;
  width: 25px;
  width: clamp(25px, 6.4cqw, 38px);
  height: 19px;
  height: clamp(19px, 5cqw, 27px);
  transform: translateY(-50%);
  border: 1px solid #737c80;
  background: linear-gradient(90deg, #656e72 0 17%, #c6ccce 18% 29%, #737c80 30% 49%, #cbd1d2 50% 61%, #727b7f 62% 100%);
  box-shadow: inset 0 0 0 1px #9da6a9, 0 1px 3px #000a;
}
.vault-drill-shoulder i { position: absolute; top: 1px; bottom: 1px; width: 4px; border-left: 1px solid #e0e4e5; border-right: 1px solid #586165; background: linear-gradient(90deg, #cbd1d2, #919a9d); box-shadow: 1px 0 #6c7679; }
.vault-drill-shoulder i:nth-child(1) { left: 22%; }
.vault-drill-shoulder i:nth-child(2) { left: 53%; }
.vault-drill-shaft {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 25px;
  left: clamp(25px, 6.4cqw, 38px);
  width: var(--shaft-width, 25%);
  height: 11px;
  height: clamp(11px, 3cqw, 16px);
  --tip-length: clamp(12px, 3cqw, 18px);
  transform: translateY(-50%);
  transition: none;
  filter: drop-shadow(0 1px 2px #0009);
}
.vault-drill-shaft-stripes {
  position: absolute;
  inset: 1px 0;
  overflow: hidden;
  border: 1px solid #c0c8c9;
  background: repeating-linear-gradient(120deg, #141a1d 0 5px, transparent 5px 17px), linear-gradient(180deg, #e0e4e5, #aeb7ba 50%, #858e91);
  clip-path: polygon(0 0, calc(100% - var(--tip-length)) 0, 100% 50%, calc(100% - var(--tip-length)) 100%, 0 100%);
}
.vault-drill-shaft-stripes::before { position: absolute; z-index: 1; inset: 0 auto 0 0; width: 6px; border-right: 1px solid #667175; background: linear-gradient(180deg, #d2d8d9, #aeb7ba 50%, #858e91); content: ""; }
.vault-drill-machine.is-drilling .vault-drill-shaft-stripes { animation: vault-drill-spin .12s linear infinite; }
.vault-drill-debris { position: absolute; top: 50%; right: -10px; width: 16px; height: 22px; transform: translateY(-50%); }
.vault-drill-debris i { position: absolute; width: 6px; height: 6px; border-radius: 1px; background: #717a7e; box-shadow: 0 0 0 1px #343c3f; opacity: 0; }
.vault-drill-debris i:nth-child(1) { top: 1px; left: 2px; }
.vault-drill-debris i:nth-child(2) { top: 8px; left: 9px; }
.vault-drill-debris i:nth-child(3) { top: 15px; left: 1px; }
.vault-drill-machine.is-drilling .vault-drill-debris i { animation: vault-drill-spark .48s ease-out infinite; }
.vault-drill-machine.is-drilling .vault-drill-debris i:nth-child(2) { animation-delay: .12s; }
.vault-drill-machine.is-drilling .vault-drill-debris i:nth-child(3) { animation: vault-drill-spark-down .48s ease-out infinite; animation-delay: .24s; }
@keyframes vault-drill-spin { to { background-position: -16px 0; } }
@keyframes vault-drill-spark { 0% { opacity: 0; transform: translate(0, 0) scale(.75); } 25% { opacity: 1; transform: translate(0, 0) scale(1); } 100% { opacity: 0; transform: translate(-14px, -5px) scale(.2); } }
@keyframes vault-drill-spark-down { 0% { opacity: 0; transform: translate(0, 0) scale(.75); } 25% { opacity: 1; transform: translate(0, 0) scale(1); } 100% { opacity: 0; transform: translate(-14px, 5px) scale(.2); } }
.vault-drill-pin-bank {
  position: absolute;
  z-index: 3;
  inset: 2px 0 4px 34%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  gap: 0;
  padding: 0 15.6% 0 12%;
  border-right: 5px solid #3b4448;
  border-left: 5px solid #3b4448;
  background: linear-gradient(180deg, transparent 0 76%, #080c0e 76% 81%, transparent 81% 100%);
}
.vault-drill-pin-bank::before { position: absolute; z-index: 1; inset: 0 auto 0 0; width: 5.2%; border-right: 1px solid #505a5f; background: radial-gradient(circle at 50% 18%, #d4dbdc 0 2px, #667175 2.5px 5px, transparent 5.5px), radial-gradient(circle at 50% 82%, #d4dbdc 0 2px, #667175 2.5px 5px, transparent 5.5px), repeating-linear-gradient(130deg, #30383c 0 4px, #20272b 4px 8px); content: ""; }
.vault-drill-pin-bank::after { position: absolute; z-index: 3; inset: 0 0 0 auto; width: 13%; border-left: 1px solid #505a5f; background: repeating-linear-gradient(130deg, #30383c 0 4px, #20272b 4px 8px); content: ""; pointer-events: none; }
.vault-drill-pin { position: relative; z-index: 2; height: 66%; display: flex; flex-direction: column; align-items: center; filter: drop-shadow(0 1px 1px #000); transition: transform .14s ease-out; }
.vault-drill-pin.is-drilled { transform: translateY(-4px); }
.vault-drill-pin-head { width: 9px; width: clamp(9px, 3cqw, 18px); height: 27%; flex: 0 0 27%; border: 0; background: repeating-linear-gradient(180deg, #060809 0 2px, #242a2c 2px 3px, #080a0b 3px 5px, transparent 5px 7px); filter: drop-shadow(0 1px 1px #000); }
.vault-drill-pin-collar { width: 10px; width: clamp(10px, 3.2cqw, 19px); height: 18%; flex: 0 0 18%; border: 1px solid #5e686c; background: linear-gradient(90deg, #697376, #929a9c 50%, #687276); }
.vault-drill-pin-body { width: 8px; width: clamp(8px, 2.5cqw, 15px); height: 55%; flex: 0 0 55%; border: 1px solid #a6adaf; border-top: 0; background: linear-gradient(90deg, #b7bbbd, #d0d2d3 50%, #b7bbbd); clip-path: polygon(0 0, 100% 0, 100% 82%, 50% 100%, 0 82%); }
.vault-drill-resources { width: min(100%, 720px); justify-self: center; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.vault-drill-resource { min-width: 0; padding: 9px 10px 10px; border: 1px solid #26363a; border-radius: 5px; background: #0d1518; }
button.vault-drill-resource { appearance: none; width: 100%; color: inherit; font: inherit; text-align: left; cursor: pointer; touch-action: manipulation; }
button.vault-drill-resource.is-restoring .vault-drill-resource-track span { transition: none; }
button.vault-drill-resource.is-refillable:focus,
button.vault-drill-resource.is-refillable:focus-visible { outline: none; box-shadow: none; }
.vault-drill-resource.is-refillable:active { filter: none; }
.vault-drill-resource-label { margin-bottom: 7px; color: #a7b4b2; font: 750 8px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .1em; }
.vault-drill-resource-label strong { color: #e4ebea; font-size: 12px; letter-spacing: 0; }
.vault-drill-resource-track { position: relative; display: block; height: 17px; overflow: hidden; border: 1px solid #35434a; background: #071013; }
.vault-drill-resource-track::after { position: absolute; inset: 0; background: linear-gradient(90deg, transparent 0 calc(10% - 1px), #071013cc calc(10% - 1px) 10%, transparent 10% calc(20% - 1px), #071013cc calc(20% - 1px) 20%, transparent 20% calc(30% - 1px), #071013cc calc(30% - 1px) 30%, transparent 30% calc(40% - 1px), #071013cc calc(40% - 1px) 40%, transparent 40% calc(50% - 1px), #071013cc calc(50% - 1px) 50%, transparent 50% calc(60% - 1px), #071013cc calc(60% - 1px) 60%, transparent 60% calc(70% - 1px), #071013cc calc(70% - 1px) 70%, transparent 70% calc(80% - 1px), #071013cc calc(80% - 1px) 80%, transparent 80% calc(90% - 1px), #071013cc calc(90% - 1px) 90%, transparent 90% 100%); content: ""; pointer-events: none; }
.vault-drill-resource-track span { display: block; width: var(--resource-value, 100%); height: 100%; transition: width .12s linear; }
.is-lubricant .vault-drill-resource-track span { background: linear-gradient(90deg, #b77d14, #f4c13a); }
.is-coolant .vault-drill-resource-track span { background: linear-gradient(90deg, #267db1, #58c3ed); }
.is-condition .vault-drill-resource-track span { background: linear-gradient(90deg, #229141, #59dc72); }
.vault-drill-footer { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; border-top: 1px solid #1b3927; padding-top: 10px; color: #75a883; font: 10px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .06em; }
.vault-drill-controls { display: flex; gap: 14px; flex-wrap: wrap; }
.vault-drill-refill-scrim { position: absolute; inset: 0; z-index: 12; display: flex; align-items: center; justify-content: center; padding: 18px; background: #020607ed; backdrop-filter: blur(2px); }
.vault-drill-refill-scrim[hidden] { display: none !important; }
.vault-drill-refill-modal { width: min(100%, 460px); display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 24px; background: transparent; text-align: center; }
.vault-drill-refill-kicker { margin: 0; color: #48db82; font-size: 10px; letter-spacing: .24em; }
.vault-drill-refill-modal h2 { margin: 0; color: #d7ffe1; font: 800 18px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .08em; }
.vault-drill-gauge { position: relative; width: min(64vw, 300px); aspect-ratio: 1; display: flex; align-items: center; justify-content: center; flex: 0 1 auto; }
.vault-drill-gauge-ring { width: 100%; height: 100%; overflow: visible; transform: rotate(-90deg); }
.vault-drill-gauge-track, .vault-drill-gauge-fill { fill: none; stroke-width: 24; }
.vault-drill-gauge-track { stroke: #1b3927; }
.vault-drill-gauge-fill { stroke: var(--refill-accent, #48db82); stroke-linecap: butt; }
.vault-drill-gauge-readout { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.vault-drill-gauge-readout strong { display: none; }
.vault-drill-gauge-key { width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; border: 1px solid #285039; background: #0b1a10; color: var(--refill-accent, #48db82); font: 800 20px ui-monospace, SFMono-Regular, Consolas, monospace; cursor: pointer; pointer-events: auto; touch-action: manipulation; }
.vault-drill-gauge-key:active, .vault-drill-gauge-key.pressed { border-color: var(--refill-accent, #48db82); background: #123b25; }
.vault-drill-gauge-key svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.vault-drill-gauge-key .mouse-primary-click { fill: currentColor; stroke: none; opacity: .78; }
.vault-drill-gauge-key .touch-symbol { font-family: 'Material Symbols Outlined'; font-size: 30px; font-weight: 400; line-height: 1; font-feature-settings: 'liga'; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.vault-drill-gauge-pips { display: flex; justify-content: center; gap: 6px; margin-top: -12px; }
.vault-drill-gauge-pips span { width: 15px; height: 5px; border: 1px solid #31543b; background: #07100f; }
.vault-drill-gauge-pips span.is-active { border-color: #31543b; background: #07100f; }
.vault-drill-gauge-pips span.is-complete { border-color: var(--refill-accent, #48db82); background: var(--refill-accent, #48db82); }
.vault-drill-refill-instruction { margin: 0; color: #75a883; font: 500 10px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }
.vault-drill-refill-controls { width: min(100%, 440px); padding-top: 9px; border-top: 1px solid #24392b; color: #75a883; font: 500 10px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }
.drill-refill-touch-hint { display: none; }
.vault-drill-refill-modal small { color: #50685a; font: 700 8px ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .1em; }
.account-test-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 12px;
}
.account-test-shortcuts-label {
  flex: 1 0 100%;
  color: #718176;
  font: 700 7px ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .1em;
}
.account-test-vault {
  min-height: 28px;
  flex: 1 1 145px;
  padding: 0 9px;
  border: 1px solid #705a2b;
  background: #171a13;
  color: #d8b864;
  font: 700 7px Arial, sans-serif;
  letter-spacing: .08em;
  cursor: pointer;
}
.account-test-vault:hover, .account-test-vault:focus-visible { border-color: #d2a943; background: #352a12; color: #fff0bd; outline: 2px solid #d2a94340; outline-offset: 2px; }
@media (max-width: 640px) {
  .vault-drill-header { min-height: 54px; flex-basis: 54px; padding: 0 13px; }
  .vault-drill-main { gap: 10px; padding: 12px; }
  .vault-drill-workarea { gap: 10px; }
  .vault-drill-resources { gap: 6px; }
  .vault-drill-resource { padding: 7px 6px; }
  .vault-drill-resource-label { font-size: 7px; }
  .vault-drill-resource-label strong { font-size: 11px; }
}
@media (max-width: 520px) {
  .vault-screen-footer { flex-wrap: wrap; padding: 6px 0; }
  .vault-screen-warning { max-width: 100%; flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .vault-drill-machine.is-drilling .vault-drill-shaft-stripes,
  .vault-drill-machine.is-drilling .vault-drill-debris i { animation: none; }
}
@media (hover: none) and (pointer: coarse) {
  .drill-refill-keyboard-hint { display: none; }
  .drill-refill-touch-hint { display: inline; }
}
