body:has(.boot:not([hidden]):not(.finished)){overflow:hidden}
.boot{isolation:isolate;overflow:hidden}
.boot-tactical{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden;background:radial-gradient(ellipse at 67% 48%,#30343165,transparent 65%),linear-gradient(#b5bfa608 1px,transparent 1px),linear-gradient(90deg,#b5bfa608 1px,transparent 1px);background-size:auto,64px 64px,64px 64px}
.boot-tactical:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse,transparent 20%,#101310cc 90%)}
.boot-map{position:absolute;inset:12% 0 12% 24%;width:76%;height:76%;opacity:.18;fill:none;stroke:#69745e;stroke-width:1;vector-effect:non-scaling-stroke}
.boot-map .map-route{stroke:#d6ef77;stroke-dasharray:6 14;opacity:.8;animation:boot-route 12s linear infinite}
.boot-map .map-node{fill:#d6ef77;stroke:none}
.boot-tag{position:absolute;color:#b5bfa6;font:8px/1.8 Arial,sans-serif;letter-spacing:2px;opacity:.32;animation:boot-tag 5.8s ease-in-out infinite}
.boot-tag-one{right:6%;top:16%;animation-delay:-2s}.boot-tag-two{right:7%;bottom:22%;animation-delay:-4s}.boot-tag-three{left:37%;top:21%;animation-delay:-1s}
.boot-classification{position:absolute;right:5%;top:8%;padding:8px 11px;border:1px solid #69745e44;color:#d3d3cd77;font:9px/1.5 Arial,sans-serif;letter-spacing:3px}
.boot-classification small{display:block;font-size:6px;letter-spacing:1.8px;color:#69745e;margin-top:3px}
.boot-reticle{position:absolute;left:57%;top:50%;width:min(37vw,480px);aspect-ratio:1;border:1px solid #69745e20;border-radius:50%;transform:translate(-50%,-50%)}
.boot-reticle:before,.boot-reticle:after{content:'';position:absolute;inset:12%;border:1px dashed #69745e33;border-radius:50%}.boot-reticle:after{inset:38%;border-style:solid}
.boot #rifle-canvas{position:absolute;left:23%;top:0;width:77%;height:100%;z-index:1}
.boot-components{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:220px;z-index:2;pointer-events:none}
.boot-components h2{font:11px/1.5 Arial,sans-serif;letter-spacing:2px;margin:0 0 8px;color:#d3d3cd}
.boot-component-caption{font:7px/1.5 Arial,sans-serif;letter-spacing:1.3px;color:#69745e;margin:0 0 23px}
#boot-components{list-style:none;padding:0;margin:0}
#boot-components li{display:flex;gap:11px;align-items:center;padding:9px 0;border-bottom:1px solid #69745e26;color:#69745e;transition:color .25s}
#boot-components input{appearance:none;width:13px;height:13px;padding:0;flex-shrink:0;border:1px solid #69745e66;margin:0;border-radius:0;opacity:1;position:relative}
#boot-components input:checked{background:#d6ef77;border-color:#d6ef77}
#boot-components input:checked:after{content:'';position:absolute;left:3px;top:1px;width:4px;height:7px;border:solid #101310;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
#boot-components li>div{display:grid;gap:3px}.boot-component-tag{font:6px/1.2 Arial,sans-serif;letter-spacing:1.6px}.boot-component-name{font:10px/1.4 Arial,sans-serif}
.boot-component-state{margin-left:auto;font:7px/1 Arial,sans-serif;letter-spacing:1px}
#boot-components li[data-state=assembling]{color:#d3d3cd}#boot-components li[data-state=assembling] input{border-color:#d6ef77;box-shadow:inset 0 0 0 3px #101310;background:#d6ef7780}
#boot-components li[data-state=complete]{color:#b5bfa6}#boot-components li[data-state=complete] .boot-component-state{color:#d6ef77}
.boot-percent{position:absolute;bottom:14px;right:5%;z-index:2;color:#d6ef77;font:22px/1 Anton,Arial,sans-serif;letter-spacing:1px;font-variant-numeric:tabular-nums}
.boot-percent:before{content:'SEQUÊNCIA / ';font:7px/1 Arial,sans-serif;letter-spacing:1.4px;color:#69745e;margin-right:12px;vertical-align:middle}
.boot-top,.boot-bottom{z-index:3}.boot-top{color:#b5bfa6}.boot.finished .boot-tactical *{animation:none!important}
@keyframes boot-route{to{stroke-dashoffset:-160}}
@keyframes boot-tag{0%,100%{opacity:.14}30%,70%{opacity:.45}}
@media(max-width:900px) and (min-width:721px){.boot-components{width:170px;left:4%}.boot #rifle-canvas{left:25%;width:75%}.boot-component-name{font-size:9px}}
@media(max-width:720px){
  .boot #rifle-canvas{left:0;top:10%;width:100%;height:48%}
  .boot-components{left:6%;right:6%;top:auto;bottom:145px;transform:none;width:auto}
  .boot-components h2{font-size:8px;letter-spacing:1.3px}.boot-component-caption{font-size:6px;margin-bottom:10px}
  #boot-components{display:grid;grid-template-columns:1fr 1fr;column-gap:18px}
  #boot-components li{padding:6px 0;gap:8px}.boot-component-name{font-size:9px}.boot-component-tag{font-size:5px}.boot-component-state{font-size:6px}
  .boot-bottom{bottom:54px;gap:15px}.boot-bottom p{max-width:100%}.boot-percent{font-size:19px;bottom:13px}
  .boot-classification{top:9%;right:6%;font-size:7px;padding:5px 7px}.boot-classification small{font-size:5px}
  .boot-tag-one{top:20%;font-size:6px}.boot-tag-two{top:45%;bottom:auto;font-size:6px}.boot-tag-three{display:none}.boot-map{inset:10% 0 42%;width:100%;height:48%}.boot-reticle{left:50%;top:33%;width:70vw}
}
@media(max-width:720px) and (max-height:650px){.boot #rifle-canvas{top:7%;height:41%}.boot-components{bottom:129px}.boot-component-caption{margin-bottom:5px}#boot-components li{padding:4px 0}.boot-bottom{bottom:49px;gap:12px}.boot-top{top:20px}.boot-classification{top:12%}.boot-reticle{top:28%}}
@media(max-height:500px) and (min-width:721px){.boot-components{top:51%;width:190px}.boot-component-caption{margin-bottom:8px}#boot-components li{padding:4px 0}.boot-top{top:20px}.boot-bottom{bottom:42px}}
@media(prefers-reduced-motion:reduce){.boot-tactical *{animation:none!important}#boot-components li{transition:none}}