#store-dialog{width:min(1000px,94vw);max-width:1000px;max-height:88vh;overflow:auto;resize:both;padding:24px;background:#101d28;color:#e9e7dd;border:1px solid #8c9b94;border-radius:10px} .store-header{display:flex;justify-content:space-between;gap:16px;align-items:start}.store-header h2{margin:6px 0}#store-wallet{color:#ffd27d;font-size:18px}#store-goods{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.store-good{display:flex;flex-direction:column;padding:18px;border:1px solid #405665;background:#182b38;border-radius:8px}.store-good h3{margin:8px 0}.store-good p{line-height:1.5}.store-good button{margin-top:14px}.store-good small{margin-top:auto;color:#e7c78c}#store-message{color:#a3e7c2;min-height:24px}#gate-dialog{max-width:540px}#gate-copy{line-height:1.7}.door-modes button[data-all-doors]{font-size:11px}
.battle-theatre{margin:12px 0;overflow:hidden}.battle-theatre canvas{display:block;width:100%;height:280px}@media(max-width:700px){.battle-theatre canvas{height:220px}}

/* A dockside storeroom: goods on metal shelving, with paper price tickets. */
#store-dialog{background:radial-gradient(ellipse at 25% 0,#51453255,transparent 65%),repeating-linear-gradient(0deg,#ffffff03 0 1px,transparent 1px 5px),#172326;border:5px solid #58615b;border-radius:3px;padding:22px;box-shadow:0 20px 80px #000b,inset 0 0 60px #0006}
.store-header{border-bottom:2px solid #a18c59;padding-bottom:12px}.store-header h2{font:700 28px/1.2 "Segoe UI",sans-serif;color:#f2dba7}.store-header .eyebrow{color:#a6b7a8;letter-spacing:2px}
#store-wallet{font:600 14px/1.5 "Segoe UI",sans-serif;background:#0c1519;padding:10px 14px;border-left:3px solid #e3b65f}
#store-goods{display:block}.shop-shelf{margin:20px 0 30px}.shop-shelf>header{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 18px;padding:0 8px 8px;color:#9faeaa}.shop-shelf>header h3{margin:0;font:600 20px "Segoe UI",sans-serif;color:#edcf90}.shop-shelf>header span{font:12px "Segoe UI",sans-serif}
.shelf-stock{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 0;border-left:7px solid #52605d;border-right:7px solid #52605d;background:linear-gradient(90deg,#0004,transparent 12% 88%,#0004)}
.store-good{display:flex;min-width:0;padding:0 12px 12px;border:0;border-radius:0;background:none;position:relative}
.shelf-display{height:128px;position:relative;display:flex;align-items:end;justify-content:center;margin:0 -12px 0;background:linear-gradient(0deg,#0005,transparent 65%);border-bottom:9px solid #758078;box-shadow:0 5px 0 #303e3d,0 9px 8px #0006}
.shelf-display:after{content:'';position:absolute;bottom:-7px;left:5%;width:8px;height:3px;background:#b7b49b;box-shadow:0 0 2px #000}
.shop-prop{width:150px;max-width:85%;height:116px;fill:#4e716d;stroke:#afc2ae;stroke-width:2;stroke-linejoin:round;filter:drop-shadow(5px 6px 2px #0007);transform:rotate(-4deg)}
.store-good:nth-child(2n) .shop-prop{transform:rotate(4deg)}.store-good:nth-child(3n) .shop-prop{transform:rotate(-1deg)}
.shop-prop .glow{fill:#a7ddc1;stroke:#c5f9cf}.shop-prop .label{fill:#d5ba7d;stroke:#8f815b}.prop-fuel{fill:#a78242;stroke:#e0c889}.prop-supplies{fill:#77684c;stroke:#c9b78c}.prop-missiles{fill:#5b6771;stroke:#b7c5ca}.prop-crew .paper{fill:#cab88b;stroke:#7a725e}.prop-crew{fill:#526264;stroke:#67746b}
.stock-sticker{position:absolute;right:9px;bottom:7px;transform:rotate(-3deg);padding:3px 6px;background:#d9bc7e;color:#282820;font:700 10px/1.3 "Segoe UI",sans-serif;box-shadow:2px 2px 0 #0004}
.shelf-ticket{display:flex;flex-direction:column;flex:1;margin:16px 0 0;padding:12px;background:#d1c49f;color:#253232;box-shadow:2px 3px 0 #0005;border-top:3px solid #ece0bc;font-family:"Segoe UI",sans-serif}
.store-good h3{font:700 16px/1.2 "Segoe UI",sans-serif;margin:0 0 6px;color:#213334}.store-good p{font:12px/1.45 "Segoe UI",sans-serif;margin:0 0 12px;color:#3b4846}.shop-price{margin-top:auto;font-size:12px;border-top:1px dashed #7d806b;padding-top:8px}.shop-price b{font-size:17px}.shop-price em{font-style:normal;color:#747760}
.store-good button{margin-top:10px;white-space:normal;min-height:32px;font:600 12px/1.3 "Segoe UI",sans-serif;background:#314946;color:#fff1c8;border:1px solid #53665b;box-shadow:0 2px 0 #152c27}.store-good button:disabled{opacity:1;color:#575c54;background:#b4b398;border-color:#8e9481;box-shadow:none}
.sold-out .shop-prop{opacity:.18;filter:grayscale(1)}.sold-out .stock-sticker{background:#713e34;color:#fff0ce}.sold-out .shelf-ticket{background:#aaa58c}
#store-message:empty{display:none}#store-message{position:sticky;top:0;z-index:2;background:#16362e;padding:9px;border:1px solid #7fbca4}
@media(max-width:650px){#store-dialog{padding:12px}.shelf-stock{grid-template-columns:repeat(2,minmax(0,1fr))}.store-good{padding-left:8px;padding-right:8px}.shelf-display{margin-left:-8px;margin-right:-8px}.store-header h2{font-size:23px}}
@media(max-width:380px){.shelf-stock{grid-template-columns:1fr}}

/* Browse one shelf at a time, with room for its tickets and page controls. */
#store-dialog{width:min(1240px,calc(100vw - 32px));max-width:1240px;box-sizing:border-box;max-height:calc(100dvh - 24px);resize:none;padding:16px 22px}
.store-header{padding-bottom:8px}.store-header h2{font-size:25px;margin:3px 0}
#store-wallet{margin:10px 0 6px;padding:7px 12px}
#store-dialog>p:not(#store-wallet):not(#store-message){font:12px/1.4 "Segoe UI",sans-serif;margin:6px 0}
.shop-shelf{margin:12px 0 8px}.shop-shelf>header{padding-bottom:5px}.shop-shelf>header h3{font-size:17px}
.shelf-display{height:74px}.shop-prop{width:94px;height:70px}.stock-sticker{font-size:10px}
.shelf-stock{gap:0}.shelf-ticket{margin-top:12px;padding:10px}.store-good{padding-bottom:8px}.store-good p{margin-bottom:8px}.store-good button{margin-top:8px}
#store-message{position:static;margin:6px 0;padding:6px 10px;font:12px/1.4 "Segoe UI",sans-serif;min-height:0}
.store-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #708072;padding-top:10px;margin-top:6px}
.store-pagination button{min-width:100px;padding:7px 12px;font:600 13px "Segoe UI",sans-serif}.store-pagination span{font:13px "Segoe UI",sans-serif;color:#e7cd92}
@media(max-width:650px){#store-dialog{padding:12px;width:calc(100vw - 20px)}.shelf-stock{grid-template-columns:1fr}.shop-shelf>header span{display:none}.store-header h2{font-size:21px}.store-header .eyebrow{font-size:9px;letter-spacing:1px}.store-pagination button{min-width:80px;padding:7px}}

/* Each shelf belongs to a different corner of the exchange. */
#store-dialog[data-theme=provisions]{--shop-accent:#d7b879;--shop-metal:#847b60;--shop-paper:#d1c49f;background-color:#292c25}
#store-dialog[data-theme=workshop]{--shop-accent:#8dd4bb;--shop-metal:#608780;--shop-paper:#b7c6b4;background-color:#1b3031}
#store-dialog[data-theme=shipyard]{--shop-accent:#b8a6d2;--shop-metal:#7d778f;--shop-paper:#c1bacb;background-color:#282735}
#store-dialog .store-header{border-bottom-color:var(--shop-accent)}
#store-dialog .shop-shelf>header h3{color:var(--shop-accent)}
#store-dialog .shelf-stock{border-color:var(--shop-metal)}
#store-dialog .shelf-display{border-bottom-color:var(--shop-metal)}
#store-dialog .shelf-ticket{background:var(--shop-paper)}
#store-dialog .stock-sticker{background:var(--shop-accent)}
#store-dialog .shop-prop{width:96px;height:72px;max-width:none;stroke:none;filter:drop-shadow(3px 3px 0 #0005);transform:none;image-rendering:pixelated}
#store-dialog .sold-out .shop-prop{opacity:.18}
#store-dialog .sold-out .stock-sticker{background:#713e34}
#store-dialog[data-theme=workshop] .shelf-display{background:repeating-linear-gradient(90deg,transparent 0 23px,#8dd4bb08 23px 24px),linear-gradient(0deg,#0005,transparent)}
#store-dialog[data-theme=shipyard] .shelf-display:after{width:42px;height:4px;bottom:-7px;background:repeating-linear-gradient(90deg,#d7b879 0 6px,#353944 6px 12px);box-shadow:none}