/* Physical field-pack interface. Only active while the solo game is paused. */
#modal-root .overlay.backpack-overlay{padding:16px;background:rgba(4,8,7,.8);backdrop-filter:blur(5px)}
#modal-root .modal.backpack-modal{--pack-thread:#a69c75;--pack-ink:#e4e0ce;--pack-muted:#b9bca5;width:min(1060px,96vw);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;overflow:hidden;border:1px solid #777a5a;border-top:0;border-radius:28px 28px 14px 14px;background:#272f26;box-shadow:0 20px 100px #000c,0 0 0 5px #101713,0 0 0 6px #525d48;color:var(--pack-ink)}
#modal-root .modal.backpack-modal .modal-header{flex:none;padding:16px 29px 12px;background:linear-gradient(90deg,#333b2d,#232d25);border-bottom:1px solid #111b13;min-height:65px}
#modal-root .modal.backpack-modal .modal-header .eyebrow{font:9px var(--mono,monospace);letter-spacing:.15em;color:#bac0a6;margin:0 0 4px}
#modal-root .modal.backpack-modal .modal-header h2{font:700 25px var(--display,Georgia,serif);letter-spacing:.02em;color:#e1e0cc;margin:0}
#modal-root .modal.backpack-modal .modal-header .close-btn,#modal-root .modal.backpack-modal .modal-header .modal-close,#modal-root .modal.backpack-modal .modal-header .icon-close{position:absolute;display:flex;align-items:center;justify-content:center;width:44px;height:44px;top:12px;right:18px;border:1px solid #64705b;border-radius:50%;background:#1d271f;color:#d6dbc7;font-size:22px}
#modal-root .modal.backpack-modal .modal-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0;scrollbar-color:#85886b #293126;line-height:1.45}
#modal-root .modal.backpack-modal .modal-footer{display:block;flex:none;padding:0;border-top:0;background:#19231d;box-shadow:0 -6px 16px #0005;z-index:1}
.field-pack{padding:0 24px 18px;background:repeating-linear-gradient(0deg,#ffffff03 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#00000005 0 1px,transparent 1px 4px),radial-gradient(ellipse at 45% 20%,#5b6045,#3b4835 60%,#2b372c);position:relative}
.field-pack::before,.field-pack::after{content:"";position:absolute;top:0;bottom:0;width:15px;border-inline:1px dashed #8e987266;box-shadow:0 0 8px #1118;pointer-events:none;background:linear-gradient(90deg,#303b2c,#647154 48%,#303b2c)}
.field-pack::before{left:3px}.field-pack::after{right:3px}
.pack-flap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 13px 19px;position:relative;border-bottom:1px dashed #a6a98388;text-shadow:0 1px 2px #0008}
.pack-flap::after{content:"";position:absolute;left:50%;bottom:-6px;width:45px;height:11px;border:3px solid #b0a57d;border-radius:3px;background:#3b412e;box-shadow:0 2px 3px #0008}
.pack-brand{font:10px var(--mono,monospace);line-height:1.4;letter-spacing:.16em;color:#d9d9c1}.pack-brand b{font-size:15px;font-weight:700;letter-spacing:.09em}
.pack-patch{padding:7px 16px;border:1px dashed #bfc2a166;background:#212c24a8;box-shadow:0 1px 4px #0007;transform:rotate(-2deg);font:8px var(--mono,monospace);letter-spacing:.12em;color:#aab69b;line-height:1.9;text-align:center}.pack-patch strong{color:#d1d6be;font-size:10px;letter-spacing:.08em}
.pack-capacity{font:600 28px Georgia,serif;display:flex;align-items:center;gap:5px;color:#e1d3a8}.pack-capacity small{font:8px var(--mono,monospace);line-height:1.5;letter-spacing:.04em;color:#bcc2a8}
.pack-tabs{display:flex;gap:8px;margin:17px 0 14px;padding-left:3px}.pack-tabs button{min-height:44px;min-width:132px;border:1px solid #202d22;border-bottom:3px solid #232e22;padding:9px 15px;background:#344330;color:#c7cbb4;font:700 11px var(--mono,monospace);letter-spacing:.025em;border-radius:5px 5px 2px 2px;box-shadow:0 2px 5px #0005}.pack-tabs button[aria-selected=true]{background:#c4b78c;color:#263025;border-color:#e0d3ac;box-shadow:0 2px 4px #0008}.pack-tabs span{display:inline-block;margin-left:7px;opacity:.75;font-size:10px}
.pack-equipment{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(210px,1fr);gap:18px}.pack-equipment[hidden],.pack-quest-pocket[hidden]{display:none}
.pack-pockets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;align-content:start}
.pack-pocket{position:relative;isolation:isolate;min-width:0;min-height:163px;padding:15px 8px 10px;display:flex;flex-direction:column;align-items:center;text-align:center;color:#cbd1bd;background:linear-gradient(175deg,#1b251dbb,#34432f 72%);border:1px solid #78836080;border-radius:7px 7px 13px 13px;box-shadow:inset 0 4px 9px #101c1699,0 2px 3px #0b170d88;overflow:hidden;touch-action:manipulation}
.pack-pocket::after{content:"";pointer-events:none;position:absolute;inset:4px;border:1px dashed #a8b28c4a;border-top:0;border-radius:3px 3px 10px 10px}
.pack-pocket:not(:disabled):hover{border-color:#d5c18a;background:linear-gradient(175deg,#263325,#4c5739 72%)}
.pack-pocket.is-selected{border:2px solid #edcf7d;padding:14px 7px 9px;background:radial-gradient(ellipse at center,#7c704137,#283321 75%);box-shadow:inset 0 0 20px #be9e2820,0 0 0 1px #e8be4d55,0 2px 5px #111}
.pack-pocket .pack-tool-art{width:min(100%,104px);height:91px;filter:drop-shadow(2px 6px 3px #0b140c);margin:0 0 1px}
.pack-pocket strong{font:600 10px var(--mono,monospace);line-height:1.35;min-height:28px;display:flex;align-items:center;justify-content:center;color:#e1e2cd;max-width:100%}
.pack-pocket-count{margin-top:3px;font:700 8px var(--mono,monospace);letter-spacing:.08em;color:#d4c68f}
.pack-pocket-slot{position:absolute;left:7px;top:5px;font:6px var(--mono,monospace);letter-spacing:.08em;color:#9fae91;z-index:1}.is-ready .pack-pocket-slot{color:#e3cb84}
.pack-pocket.is-locked{opacity:1;filter:saturate(.25);color:#9fa695;background:#2834299c;box-shadow:inset 0 4px 9px #101c1670}.pack-pocket.is-locked .pack-tool-art{opacity:.22;filter:brightness(.4)}.pack-pocket.is-locked strong{color:#9da990}.pack-pocket.is-locked .pack-pocket-count{color:#9eab91}.pack-pocket-lock{position:absolute;left:8px;right:8px;top:53px;font:8px var(--mono,monospace);line-height:1.45;color:#bbc2a8;text-shadow:0 1px 3px #000;background:#1a251ad9;padding:5px 2px;border-block:1px solid #84976e33}
.pack-inspector{min-width:0;display:flex;flex-direction:column;padding:10px 15px 12px;background:linear-gradient(150deg,#18251ed4,#15231fe3);border:1px dashed #9b9b7370;border-radius:5px;box-shadow:inset 0 2px 10px #0004}
.pack-inspect-window{height:128px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #8a9b742b;background:radial-gradient(ellipse at center,#76907814,transparent 66%)}.pack-inspect-window .pack-tool-art{height:127px;width:145px;filter:drop-shadow(4px 9px 5px #0007);transform:rotate(-5deg)}.pack-empty-art{font:70px Georgia;color:#93a383}
.pack-label{font:7px var(--mono,monospace);letter-spacing:.12em;color:#ccbd88}.pack-inspect-copy{padding-top:10px}.pack-inspector h3{font:600 18px Georgia,serif;letter-spacing:.01em;line-height:1.15;margin:6px 0 9px;color:#e8e4cd}.pack-inspector p{font:10px var(--body,Arial,sans-serif);line-height:1.6;color:#b6c1aa;margin:0}.pack-traits{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.pack-traits span{font:7px var(--mono,monospace);line-height:1.5;padding:4px 5px;border:1px solid #8a9c6b33;color:#bfcba9;background:#7182550d}
.pack-supplies{margin-top:auto;padding-top:16px;display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center}.pack-supplies>span{font:7px var(--mono,monospace);letter-spacing:.08em;color:#91a185}.pack-supplies b{font:600 15px var(--mono,monospace);color:#d8c98e}.pack-supplies small{display:block;font:6px var(--mono,monospace);letter-spacing:.07em;margin-top:2px;color:#9faf92}
.pack-loadout{padding:12px 23px 10px;background:repeating-linear-gradient(90deg,#ffffff03 0 1px,transparent 1px 5px),linear-gradient(#3a3024,#2b251e);border-top:1px dashed #9f8b6688;box-shadow:inset 0 5px 9px #0005}.pack-belt-heading{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:9px}.pack-belt-heading>span{font:700 9px var(--mono,monospace);letter-spacing:.09em;color:#dbcc9f;white-space:nowrap}.pack-belt-heading small{color:#a99c7d;font-size:7px;margin-left:8px}.pack-belt-heading p{font:9px var(--body,Arial,sans-serif);line-height:1.35;color:#c5bba0;min-height:12px;text-align:right;margin:0}
.pack-belt{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.pack-belt button{min-height:67px;position:relative;display:grid;grid-template-columns:46px 1fr;grid-template-rows:1fr auto;align-items:center;gap:0 4px;text-align:left;padding:6px 7px 6px 28px;border:1px solid #86765b;border-radius:4px;background:linear-gradient(#554735,#3b3025);color:#e0d5b7;box-shadow:inset 0 1px 0 #ad9a7066,0 3px 3px #0006;touch-action:manipulation;overflow:hidden}.pack-belt button::after{position:absolute;content:"";pointer-events:none;inset:3px;border:1px dashed #ac926948;border-radius:2px}.pack-belt button:hover:not(:disabled){background:#625237;border-color:#d7bc7d}.pack-belt button.is-selected{border-color:#d9c17a;background:linear-gradient(#6c5735,#443724)}.pack-belt button:disabled{opacity:.5}.pack-belt kbd{position:absolute;left:5px;top:8px;min-width:18px;width:auto;padding:3px 2px;text-align:center;font:700 9px var(--mono,monospace);color:#e1d3a8;background:#26231c;border:1px solid #a79065;border-radius:2px}.pack-belt-icon{grid-row:1/3;display:flex;align-items:center;justify-content:center}.pack-belt-icon .pack-tool-art{width:45px;height:48px;filter:drop-shadow(1px 3px 2px #0008)}.pack-belt-name{font:600 9px var(--mono,monospace);line-height:1.35}.pack-belt-verb{font:7px var(--mono,monospace);letter-spacing:.07em;color:#cdbb86;margin-top:4px}.pack-bottom-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}.pack-bottom-row>span{color:#b7a98c;font:8px var(--body,Arial,sans-serif)}.pack-return{min-height:44px;padding:8px 17px;border:1px solid #b4a274;border-radius:4px;background:#bdad80;color:#242a20;font:700 11px var(--mono,monospace);box-shadow:0 2px 3px #0005}.pack-return span{margin-left:16px;font-size:16px}
.pack-quest-pocket{min-height:350px;padding:5px 4px}.pack-quest-note,.pack-upgrade-note{font:10px var(--body,Arial,sans-serif);line-height:1.5;color:#ccd1b8;margin:0 0 15px}.pack-upgrade-note{font:9px var(--mono,monospace);color:#d9cea0;margin-top:15px}.pack-quest-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.pack-quest{padding:15px 13px;display:flex;gap:12px;border:1px dashed #a0ad7f66;border-radius:7px;background:#233323b8;box-shadow:inset 0 2px 5px #0004}.pack-quest-stamp{width:30px;height:30px;flex:none;border:1px solid #899b70;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#a5b38e;font:20px Georgia}.pack-quest.is-collected .pack-quest-stamp{background:#9eab7330;border-color:#c1ce91;color:#d3dda8}#modal-root .modal.backpack-modal .pack-quest h3{font:600 15px Georgia,serif;line-height:1.3;margin:5px 0 6px;color:#dde0c6}.pack-quest h3 small{font:11px var(--mono,monospace);color:#d2c895}.pack-quest p{font:10px var(--body,Arial,sans-serif);line-height:1.5;color:#b6c4a4;margin:0}.pack-quest b{display:block;font:7px var(--mono,monospace);letter-spacing:.08em;color:#8c9c80;margin-top:9px}.pack-quest.is-collected b{color:#d2c48a}
#modal-root .modal.backpack-modal button:focus-visible{outline:3px solid #f8d77a;outline-offset:3px;z-index:3}
@media(max-width:850px){.pack-equipment{grid-template-columns:minmax(0,1.7fr) minmax(170px,1fr);gap:11px}.pack-pockets{gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.pack-pocket{min-height:150px}.pack-inspector{padding:10px}.pack-pocket .pack-tool-art{height:79px}.pack-belt button{grid-template-columns:31px 1fr;padding-left:25px}.pack-belt-icon .pack-tool-art{width:31px;height:43px}.pack-belt-name{font-size:8px}.pack-belt-heading small{display:none}}
@media(max-width:600px){#modal-root .overlay.backpack-overlay{padding:8px}#modal-root .modal.backpack-modal{width:100%;max-height:calc(100dvh - 16px);border-radius:17px 17px 9px 9px;box-shadow:0 20px 60px #000c,0 0 0 3px #101713}#modal-root .modal.backpack-modal .modal-header{padding:11px 18px 10px;min-height:61px}#modal-root .modal.backpack-modal .modal-header .eyebrow{font-size:7px;margin-bottom:4px}#modal-root .modal.backpack-modal .modal-header h2{font-size:22px}#modal-root .modal.backpack-modal .modal-header .close-btn,#modal-root .modal.backpack-modal .modal-header .modal-close{right:12px;top:9px}.field-pack{padding:0 13px 14px}.field-pack::before,.field-pack::after{width:7px}.field-pack::before{left:1px}.field-pack::after{right:1px}.pack-flap{padding:11px 8px 16px;gap:8px}.pack-brand{font-size:7px}.pack-brand b{font-size:11px}.pack-patch{padding:5px 7px;font-size:6px;letter-spacing:.04em}.pack-patch strong{font-size:7px}.pack-capacity{font-size:23px}.pack-capacity small{font-size:6px}.pack-tabs{margin:13px 0 10px;gap:7px}.pack-tabs button{flex:1;padding:8px 9px;font-size:10px;min-width:0}.pack-equipment{display:flex;flex-direction:column;gap:11px}.pack-pockets{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.pack-pocket{min-height:125px;padding:14px 5px 7px;border-radius:5px 5px 8px 8px}.pack-pocket.is-selected{padding:13px 4px 6px}.pack-pocket .pack-tool-art{height:65px;width:100%;margin:0}.pack-pocket strong{font-size:7px;min-height:27px}.pack-pocket-count{font-size:6px;margin-top:2px}.pack-pocket-slot{font-size:5px;left:5px;top:6px}.pack-pocket-lock{left:4px;right:4px;top:36px;font-size:6px;padding:3px 1px;line-height:1.5}.pack-inspector{display:grid;grid-template-columns:66px 1fr;gap:4px 11px;padding:10px}.pack-inspect-window{height:90px;border:0}.pack-inspect-window .pack-tool-art{height:82px;width:76px}.pack-inspect-copy{padding:0}.pack-inspector h3{font-size:16px;margin:3px 0 5px}.pack-inspector p{font-size:10px;line-height:1.45}.pack-label{font-size:6px}.pack-traits{margin-top:6px;gap:4px}.pack-traits span{font-size:6px;padding:3px 4px}.pack-supplies{grid-column:1/-1;border-top:1px solid #8a9b742b;margin-top:6px;padding-top:8px;grid-template-columns:1fr auto auto}.pack-supplies b{font-size:12px;display:flex;gap:5px;align-items:center}.pack-supplies small{font-size:6px}.pack-loadout{padding:10px 10px 8px}.pack-belt-heading{display:block;margin-bottom:7px}.pack-belt-heading>span{font-size:8px}.pack-belt-heading small{display:inline;font-size:6px}.pack-belt-heading p{font-size:9px;text-align:left;margin-top:5px;line-height:1.35;min-height:24px}.pack-belt{gap:6px}.pack-belt button{padding:5px 4px 5px;min-height:79px;display:flex;flex-direction:column;justify-content:center;gap:0;text-align:center}.pack-belt kbd{left:4px;top:4px;min-width:16px;font-size:7px;padding:2px}.pack-belt-icon .pack-tool-art{width:40px;height:34px;margin-left:8px}.pack-belt-name{font-size:7px;line-height:1.2;min-height:18px;display:flex;align-items:center;justify-content:center}.pack-belt-verb{font-size:6px;letter-spacing:.03em;margin-top:3px}.pack-bottom-row{margin-top:7px;gap:8px}.pack-bottom-row>span{font-size:8px;line-height:1.4;max-width:145px}.pack-return{padding:8px 11px;font-size:10px;white-space:nowrap}.pack-return span{margin-left:8px;font-size:15px}.pack-quest-grid{grid-template-columns:1fr}.pack-quest-pocket{min-height:300px;padding:4px 0}.pack-quest{padding:12px 10px}.pack-quest-note,.pack-upgrade-note{font-size:9px}}
@media(max-height:500px) and (min-width:601px){#modal-root .overlay.backpack-overlay{padding:7px}#modal-root .modal.backpack-modal{max-height:calc(100dvh - 14px);border-radius:13px}#modal-root .modal.backpack-modal .modal-header{min-height:52px;padding:8px 22px}#modal-root .modal.backpack-modal .modal-header h2{font-size:21px}#modal-root .modal.backpack-modal .modal-header .eyebrow{font-size:7px}#modal-root .modal.backpack-modal .modal-header .close-btn,#modal-root .modal.backpack-modal .modal-header .modal-close{top:5px}.pack-flap{padding-top:9px;padding-bottom:12px}.pack-loadout{padding:7px 17px}.pack-belt-heading{margin-bottom:5px}.pack-belt button{min-height:56px}.pack-belt-icon .pack-tool-art{height:39px}.pack-bottom-row{margin-top:4px}.pack-return{min-height:44px}.pack-pockets{grid-template-columns:repeat(4,minmax(0,1fr))}.pack-pocket{min-height:133px}.pack-pocket .pack-tool-art{height:65px}.pack-inspect-window{height:92px}.pack-inspect-window .pack-tool-art{height:90px}}
@media(prefers-reduced-motion:reduce){#modal-root .modal.backpack-modal *{scroll-behavior:auto}}
@media(max-width:600px){#modal-root .modal.backpack-modal .modal-header .icon-close{top:9px;right:12px}.pack-pocket strong{font-size:9px;min-height:32px}.pack-pocket-count{font-size:7px}.pack-pocket-slot{font-size:6px}.pack-belt-name{font-size:8px}.pack-inspector p{font-size:11px}}
@media(max-height:500px) and (min-width:601px){#modal-root .modal.backpack-modal .modal-header .icon-close{top:4px;right:16px}}
/* In a short landscape viewport the belt lives beside the bag, leaving useful
   height for item pockets instead of squeezing them between two fixed bars. */
@media(max-height:500px) and (min-width:601px){
 #modal-root .modal.backpack-modal{height:calc(100dvh - 14px);display:grid;grid-template-columns:minmax(0,1fr) 220px;grid-template-rows:56px minmax(0,1fr)}
 #modal-root .modal.backpack-modal .modal-header{grid-column:1/-1;grid-row:1;min-height:0;padding:7px 22px}
 #modal-root .modal.backpack-modal .modal-body{grid-column:1;grid-row:2}
 #modal-root .modal.backpack-modal .modal-footer{grid-column:2;grid-row:2;min-height:0;border-left:1px dashed #9f8b6688;box-shadow:-4px 0 13px #0005}
 .field-pack{padding:0 16px 14px}.pack-flap{display:none}.pack-tabs{margin:9px 0 10px}.pack-tabs button{min-height:44px}
 .pack-equipment{display:block}.pack-pockets{gap:8px}.pack-pocket{min-height:129px}.pack-inspector{margin-top:12px;display:grid;grid-template-columns:86px 1fr;gap:10px}.pack-inspect-copy{padding:4px 0}.pack-inspect-window{height:96px}.pack-supplies{grid-column:1/-1;padding-top:0}
 .pack-loadout{height:100%;padding:9px 10px;display:flex;flex-direction:column;justify-content:flex-start;border-top:0}.pack-belt-heading{display:block;margin-bottom:7px}.pack-belt-heading p{text-align:left;font-size:9px;line-height:1.4;margin-top:5px;min-height:36px}.pack-belt{grid-template-columns:1fr 1fr;gap:7px}.pack-belt button{min-height:77px;padding:5px 6px 5px 23px;grid-template-columns:1fr;grid-template-rows:32px 1fr auto;text-align:center}.pack-belt-icon{grid-row:auto}.pack-belt-icon .pack-tool-art{height:32px;width:36px}.pack-belt-name{font-size:8px;line-height:1.25;min-height:20px}.pack-belt-verb{font-size:6px;margin-top:1px}.pack-belt kbd{top:6px;left:4px;min-width:16px;font-size:7px}
 .pack-bottom-row{margin-top:auto;display:flex;flex-direction:column;gap:5px;align-items:stretch}.pack-bottom-row>span{font-size:7px;text-align:center}.pack-return{min-height:44px;padding:8px 9px;font-size:10px}.pack-return span{float:right}
}
