.weapon-role { display:inline-block; margin:5px 0 7px; padding:3px 7px; color:#badfce; background:#1d3b3d; font-size:10px; border-radius:3px; }
.weapon-catalog-card .weapon-use { color:#c6d7df; margin:8px 0; font-size:11px; line-height:1.7; }
.weapon-catalog-card .weapon-preview-button { display:block; min-height:44px; margin-top:12px; padding:8px 13px; border:1px solid #67868c; border-radius:4px; background:#253d49; color:#e4f0e7; font-size:12px; cursor:pointer; }
.weapon-catalog-card.new-weapon { border-top-color:#b5d9c6; }
.weapon-catalog-card .new-weapon-tag { color:#e2c681; font:10px var(--mono); margin-left:8px; }
.weapon-preview-dialog { width:min(680px,calc(100vw - 28px)); max-height:calc(100dvh - 28px); padding:20px; border:1px solid #6a8191; border-radius:9px; color:#e9e9dd; background:#182b3b; box-shadow:0 20px 60px #0008; overflow:auto; }
.weapon-preview-dialog::backdrop { background:#071221ce; backdrop-filter:blur(4px); }
.weapon-preview-heading { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.weapon-preview-heading canvas { width:52px; height:52px; image-rendering:pixelated; }
.weapon-preview-heading h2 { margin:0 0 5px; font-size:20px; }
.weapon-preview-heading p { margin:0; color:#b8d6cb; font-size:12px; }
#close-weapon-preview { margin-left:auto; min-height:44px; min-width:44px; border:1px solid #69818e; border-radius:5px; color:#e9f0eb; background:#243e4e; }
#weapon-demo-canvas { display:block; width:100%; height:auto; aspect-ratio:640/380; border:1px solid #516a76; border-radius:5px; image-rendering:pixelated; }
.weapon-demo-tiers { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:14px 0; }
.weapon-demo-tiers button { min-width:0; min-height:44px; padding:7px 3px; border:1px solid #506a7e; border-radius:4px; background:#203649; color:#c5d3dd; font-size:12px; cursor:pointer; }
.weapon-demo-tiers button[aria-pressed=true] { border-color:#a5d9bf; background:#31534e; color:#eff7db; }
.weapon-demo-description { font-size:13px; line-height:1.8; margin:12px 0; }
.weapon-demo-note { color:#9cb5c3; font-size:11px; line-height:1.7; margin:10px 0 0; }
.weapon-preview-dialog button:focus-visible { outline:2px solid #f1d69b; outline-offset:3px; }
@media(max-width:400px){.weapon-preview-dialog{padding:12px}.weapon-preview-heading{gap:8px;margin-bottom:10px}.weapon-preview-heading h2{font-size:17px}.weapon-preview-heading canvas{width:40px;height:40px}.weapon-demo-tiers{gap:5px;margin:10px 0}.weapon-demo-description{font-size:12px;line-height:1.6}.weapon-demo-note{font-size:10px}.weapon-catalog-card .weapon-preview-button{width:100%}}
@media(orientation:landscape) and (max-height:500px){.weapon-preview-dialog{width:min(820px,calc(100vw - 28px))}.weapon-demo-layout{display:grid;grid-template-columns:minmax(240px,1fr) minmax(210px,.7fr);gap:16px;align-items:start}.weapon-preview-heading{margin-bottom:8px}.weapon-demo-tiers{margin-top:0}.weapon-demo-description{font-size:12px}.weapon-demo-note{font-size:10px}}