.checkpoint-overview{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:center}.checkpoint-map{margin:0;position:relative;overflow:hidden;border-radius:7px;border:1px solid #c1ceb2;aspect-ratio:900/650}.checkpoint-map>img{width:100%;height:100%;display:block;object-fit:cover}.checkpoint-map i{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800;width:21px;height:21px;border-radius:50%;background:#fbf6db;color:#175358;border:1px solid #e3bb68;box-shadow:0 1px 5px #15363b80}.checkpoint-summary h3{font-size:21px;margin:6px 0}.checkpoint-summary>.eyebrow{margin-bottom:5px!important}.checkpoint-summary>p:not(.eyebrow){font-size:11px!important;margin:0 0 10px!important}.checkpoint-summary dl{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 0}.checkpoint-summary dt{font-size:10px;color:#6b7964}.checkpoint-summary dd{font-weight:750;font-size:20px;margin:3px 0 0;font-variant-numeric:tabular-nums}.checkpoint-loadout{border:1px solid #bccbab;background:#e9efdd;padding:11px 13px;border-radius:6px;font-size:11px!important;margin:18px 0 10px!important}.checkpoint-limit{font-size:10px!important;color:#6a7968;margin:9px 0!important}.checkpoint-pause-status{font-size:10px!important;line-height:1.5;margin:10px 0!important;color:#4d705c;border-left:3px solid #8bab74;padding-left:9px}.checkpoint-pause-status[data-status=unavailable],.checkpoint-pause-status[data-status=superseded]{border-color:#d2a052;color:#8b5827}
.home-hub .checkpoint-shelf{grid-column:1/-1;border-top:1px solid #537c71;margin-top:22px;padding-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.checkpoint-shelf>.home-kicker,.checkpoint-shelf>.checkpoint-home-note{grid-column:1/-1}.home-hub .checkpoint-home-card{display:flex;gap:12px;align-items:center;text-align:left;min-width:0;border:1px solid #52796c;border-radius:6px;padding:9px;background:#244a48;color:#fbf4d9;transition:background .15s,transform .15s}.checkpoint-home-card:hover{background:#315e54;transform:translateY(-2px)}.checkpoint-home-card:focus-visible{outline:3px solid #f0c476;outline-offset:3px}.checkpoint-home-card img{object-fit:cover;flex:none;border-radius:4px}.checkpoint-home-card span{min-width:0;flex:1}.checkpoint-home-card strong{display:block;font-size:12px}.checkpoint-home-card small{display:block;font-size:9px;margin-top:6px;color:#c3d1ad}.checkpoint-home-card b{color:#f1c478;font-size:19px}.home-hub .checkpoint-home-note{font-size:10px;color:#b4c7af;line-height:1.6;margin:0}

#play .overlay.checkpoint-overlay .modal{
 display:flex;flex-direction:column;gap:10px;max-width:720px;padding:20px 26px;overflow:hidden;
}
.checkpoint-heading{position:relative;flex:none;padding-inline:48px}
.checkpoint-heading h2{margin:3px 0 6px}
.checkpoint-heading>p:last-child{color:#52685d;line-height:1.45;margin:0}
#checkpoint-close{
 position:absolute;inset-block-start:0;inset-inline-end:0;width:44px;height:44px;
 border:1px solid #99b19e;border-radius:6px;background:#e8efdd;color:#254e48;
 font-size:26px;line-height:1;cursor:pointer;
}
#checkpoint-close:hover,#checkpoint-close:focus-visible{background:#cde3cd}
.checkpoint-body{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:1px 3px}
.checkpoint-notes>small{font-size:10px;line-height:1.4;color:#566b59}
.checkpoint-actions{display:grid;grid-template-columns:1.35fr 1fr .85fr;gap:7px;flex:none;border-top:1px solid #b9c9ae;padding-top:8px}
#play .checkpoint-actions button{min-height:44px;min-width:0;margin:0!important;padding:7px!important;font-size:12px!important;line-height:1.25}
.checkpoint-actions .secondary{border:1px solid #a4b89c;border-radius:6px;background:#eef1e1;color:#28554b}
.checkpoint-actions .secondary:hover{background:#dcebd4}
@media(max-width:700px) and (orientation:portrait){
 #play .overlay.checkpoint-overlay .modal{padding:12px 14px;gap:8px}
 .checkpoint-heading{padding-inline-start:0;text-align:left}
 #play .checkpoint-heading h2{font-size:24px}
 .checkpoint-heading>p:last-child{font-size:11px!important}
 .checkpoint-overview{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:9px}
 .checkpoint-map i{width:16px;height:16px;font-size:10px}
 .checkpoint-summary dl{gap:7px}
 .checkpoint-summary h3{font-size:17px}
 .checkpoint-summary dt{font-size:9px}
 .checkpoint-summary dd{font-size:16px}
 .checkpoint-loadout{margin:10px 0 6px!important;padding:8px}
 .checkpoint-actions{grid-template-columns:1fr 1fr}
 .checkpoint-actions .primary{grid-column:1/-1}
 .home-hub .checkpoint-shelf{grid-template-columns:1fr}
}
@media(max-height:550px) and (orientation:landscape){
 #play .overlay.checkpoint-overlay .modal{padding:9px 14px;gap:6px;max-width:790px}
 #play .checkpoint-heading h2{font-size:22px}
 .checkpoint-heading>p:last-child{font-size:10px!important}
 .checkpoint-body{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:12px}
 .checkpoint-overview{grid-template-columns:minmax(0,.95fr) minmax(0,1fr);gap:9px}
 .checkpoint-summary h3{font-size:16px}
 .checkpoint-summary dl{gap:5px;margin-top:4px}
 .checkpoint-summary dt{font-size:8px}
 .checkpoint-summary dd{font-size:14px;margin:0}
 .checkpoint-loadout{margin:3px 0!important;padding:6px;font-size:10px!important}
 .checkpoint-limit{margin:5px 0!important;font-size:9px!important}
 .checkpoint-notes>small{font-size:9px}
}
@media(max-height:360px) and (orientation:landscape){
 #play .checkpoint-heading>.eyebrow{font-size:8px!important;margin:0 0 2px!important}
 #play .checkpoint-heading h2{font-size:20px;margin:0 0 3px}
 #play .checkpoint-heading>p:last-child{margin:0!important}
 .checkpoint-summary>.eyebrow{display:none}
 .checkpoint-summary h3{margin:0 0 2px}
 .checkpoint-summary>p:not(.eyebrow){margin:0 0 3px!important}
 .checkpoint-map{max-height:84px}
 .checkpoint-summary dl{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
 .checkpoint-notes>small{display:block;line-height:1.25}
}

.checkpoint-actions{grid-template-columns:repeat(4,minmax(0,1fr))}
#play #checkpoint-restart,#play #pause-restart{border:1px solid #a77c43;background:#f5e7c9;color:#614622}
.restart-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#play .restart-actions>button{min-height:44px;width:100%;min-width:0;margin:0;font-size:12px}
.restart-loadout{font-weight:750}
@media(max-width:700px) and (orientation:portrait){
 .checkpoint-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
 .checkpoint-actions .primary{grid-column:auto}
}
