/* Quiet panels and consistent spacing keep equipment, storage and actions readable. */
#inventory-dialog,.bank-dialog{box-sizing:border-box;width:min(1180px,96vw);max-height:94vh;padding:22px;background:radial-gradient(ellipse at 15% 15%,#203840,#101d28 60%);color:#dbe5e8;border:1px solid #a88d59;border-radius:14px;box-shadow:0 30px 100px #000b;overflow:auto}
.bank-dialog::backdrop{background:#07100ddd;backdrop-filter:blur(5px)}
#inventory-dialog .bag-header,.bank-dialog .bag-header{padding:0 0 16px;border-bottom:1px solid #53636b}
#inventory-dialog .bag-header h2,.bank-dialog h2{font-size:23px;letter-spacing:.5px;text-transform:none;color:#efdbad}
.armory-layout{grid-template-columns:minmax(310px,.8fr) minmax(0,1.2fr);gap:20px;margin-top:20px}
.armory-character{min-height:0;background:radial-gradient(ellipse at 50% 35%,#304d57,#152633 65%);border:1px solid #455964;border-radius:10px}
#equipment-slots{position:relative;grid-template-columns:86px minmax(0,1fr) 86px;grid-template-rows:repeat(5,76px);gap:9px;margin:16px;padding:0;background:none;border:none}
#equipment-slots .equipment-slot{min-height:0;padding:6px;border:1px solid #58656b;border-radius:7px;background:#101e2bdc;box-shadow:none;align-items:center;gap:2px;overflow:hidden}
#equipment-slots .equipment-slot small{font-size:9px;letter-spacing:.5px}
#equipment-slots .equipment-slot b{font-size:9px;color:var(--item-color,#8ea3ac)}
#equipment-slots .equipment-slot:has(.equipment-slot-icon canvas){border-color:var(--item-color,#58656b)}
#equipment-slots::after{border:0;background:none;content:'GEAR';color:#758b98}
#armor-preview{top:60px;bottom:auto;height:310px;left:108px;right:108px;gap:8px}
#armor-preview canvas{width:100%;max-width:240px;height:auto;image-rendering:auto}
#armor-preview>small{font-size:10px;line-height:1.5}
#character-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px;padding:14px;border:1px solid #405664;border-radius:8px;background:#111f2a}
#character-stats>div{display:flex;flex-direction:column;gap:3px}#character-stats small{font-size:10px;color:#9eb4bf}#character-stats b{font:18px Georgia,serif;color:#ebd8ab}
.material-summary{grid-column:1/-1;margin:4px 0 0;font-size:10px;line-height:1.7;color:#9cb0bb}
.armory-bag{padding:0;border:0;background:none;box-shadow:none}
#inventory-dialog .bag-toolbar{padding:0 0 12px;margin:0;border:0;background:none;color:#bbccd5}
#inventory-filter{border:1px solid #4c626f;border-radius:5px;background:#152734}
#inventory-items{grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:91px;min-height:0;max-height:310px;padding:10px;border:1px solid #405764;border-radius:8px;background:#0d1b26;gap:8px}
#inventory-items .bag-item,.bank-grid .bag-item{border:1px solid #405764;border-bottom:2px solid var(--item-color);border-radius:6px;background:linear-gradient(145deg,#223747,#132331);overflow:hidden!important}
.bag-item:hover,.bag-item.chosen{background:#314c5b!important;border-color:var(--item-color)!important;box-shadow:inset 0 0 0 1px var(--item-color)}
.bag-item b{font-size:10px;font-weight:500}.empty-slot{display:grid;place-items:center;border:1px dashed #2e4351;border-radius:6px;color:#465c68;font-size:11px}
#item-detail{max-height:none;min-height:150px;padding:18px;border:1px solid #405764;border-top:2px solid var(--item-color,#657881);border-radius:8px;background:#132431}
#item-detail h2{line-height:1.3}#item-detail button,.bank-detail button{min-height:38px;background:#2c4350;border:1px solid #798373;border-radius:5px}
#gear-message{border-top:1px solid #405764;margin-top:16px;color:#c7b78d}
.bank-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.bank-columns h3{font-size:16px;color:#e3d1a8}.bank-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;max-height:350px;min-height:180px;overflow:auto;padding:8px;background:#0d1b26;border:1px solid #405764;border-radius:8px;align-content:start}.bank-grid .bag-item{min-height:95px;min-width:0}.bank-grid .bag-item small{display:block}.bank-status{font-size:13px;color:#b8ccd1}.bank-detail{padding:16px;margin-top:20px;border:1px solid #405764;border-radius:8px;background:#142633}.bank-item-description{white-space:pre-line;line-height:1.7;font-size:12px}.empty-state{grid-column:1/-1;padding:24px;color:#93aab6;font-size:13px;line-height:1.7}.bank-detail .item-icon{float:right}
button:focus-visible,select:focus-visible{outline:2px solid #f0d69a;outline-offset:3px}
@media(max-width:800px){.armory-layout,.bank-columns{grid-template-columns:1fr}.armory-character{min-height:0}#inventory-dialog,.bank-dialog{padding:16px}#armor-preview{left:112px;right:112px}#item-detail{max-height:none}.bank-grid{max-height:280px}}
@media(max-width:430px){#inventory-items,.bank-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#equipment-slots{grid-template-columns:72px minmax(0,1fr) 72px;margin:10px;gap:6px}#armor-preview{left:89px;right:89px;top:95px;height:235px}.bag-header h2,#inventory-dialog .bag-header h2{font-size:18px}.bag-header button{font-size:11px}}

#armor-preview canvas{aspect-ratio:4/5;flex-shrink:0;object-fit:contain}
#inventory-dialog canvas,.bank-dialog canvas{image-rendering:auto}
#game{image-rendering:auto}
#inventory-items .bag-item,#equipment-slots .equipment-slot:is(.normal,.magic,.rare),#item-detail:is(.normal,.magic,.rare){box-shadow:none}

#inventory-dialog.shopping{width:min(1640px,98vw)}
.shopping .merchant-layout{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(0,1.3fr);gap:24px;margin-top:20px;align-items:start}
.shop-panel[hidden]{display:none}
.shop-panel{min-width:0;padding:18px;background:#132431;border:1px solid #53636b;border-radius:10px}
.shop-panel h2{margin:5px 0;color:#efdbad;font-size:22px}
.shop-wallet{color:#e6cb8e;font-size:13px;line-height:1.6}
.shop-panel>button,.shop-detail button{padding:10px 14px;background:#2c4350;border:1px solid #798373;border-radius:5px;color:#efdbad}
.shop-panel button:disabled{opacity:.5;cursor:not-allowed}
.shop-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:350px;margin-top:16px}
.shop-grid .bag-item{display:flex;flex-direction:column;align-items:center;gap:5px;min-height:145px;padding:9px;text-align:center}
.shop-grid .bag-item b{line-height:1.4}.shop-grid .bag-item small{font-size:10px;line-height:1.5;color:#aebec5}
.shop-grid .bag-item strong{margin-top:auto;font-size:12px;color:#efcf88}
.shop-detail{margin-top:14px;min-height:150px;max-height:320px;overflow:auto}
.shop-detail h3{margin-top:0;line-height:1.4}.shop-notice{font-size:12px;color:#c7b78d;line-height:1.6}
.shopping .armory-layout{margin-top:0;grid-template-columns:1fr}
.shopping .armory-bag{grid-row:1}
.shopping .armory-character{margin-top:0}
@media(min-width:1550px){.shopping .armory-layout{grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr)}.shopping .armory-bag{grid-row:auto}}
@media(max-width:760px){.shopping .merchant-layout{grid-template-columns:1fr;gap:18px}.shop-panel{padding:12px}.shop-grid{max-height:270px}.shop-detail{max-height:260px}}
@media(max-width:430px){.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

#character-stats{grid-template-columns:repeat(3,minmax(0,1fr))}#character-stats>div{min-width:0}#character-stats b{font-variant-numeric:tabular-nums}
.attribute-allocation{grid-column:1/-1;border-top:1px solid #405664;padding-top:12px}.attribute-allocation h3{margin:0;font-size:15px;color:#ebd8ab}.attribute-points{margin:5px 0 12px;color:#e8c773;font-size:12px}.attribute-row{display:grid;grid-template-columns:minmax(0,1fr) 32px 44px;gap:10px;align-items:center;padding:10px 0;border-top:1px solid #2d414d}.attribute-row>div{display:flex;flex-direction:column;gap:4px}.attribute-row strong{font-size:12px}.attribute-row>b{text-align:right}.attribute-row button{min-height:40px;padding:6px;border:1px solid #ac945d;border-radius:5px;background:#304652;color:#ffe1a0}.attribute-row button:disabled{opacity:.35;cursor:default}.attribute-help{font-size:10px;line-height:1.6;color:#9eb4bf;margin:10px 0 0}
/* Compact item inspection: small portrait, tight copy, and wrapping actions. */
#item-detail{padding:12px;min-height:0}
#item-detail .item-detail-art{float:right;width:52px;height:52px;margin:0 0 6px 10px}
#item-detail .item-detail-art canvas{width:52px;height:52px;object-fit:contain}
#item-detail .eyebrow{font-size:9px;letter-spacing:1.3px}
#item-detail h2{font-size:16px;line-height:1.25;margin:4px 0 6px}
#item-detail p{font-size:12px;line-height:1.4;margin:5px 0}
#item-detail .item-rule{font-size:11px;line-height:1.4}
#item-detail .affixes{clear:both;display:flex;flex-wrap:wrap;gap:2px 20px;margin:7px 0;padding-left:16px;font-size:12px;line-height:1.4}
#item-detail button{display:inline-block;width:auto;min-height:32px;padding:6px 12px;margin:5px 6px 0 0;font-size:11px;line-height:1.25}
#item-detail h3{clear:both;font-size:13px;margin:12px 0 5px}
#item-detail .skill-detail{padding:8px;margin-top:5px}
#item-detail .skill-detail b{font-size:12px}
#item-detail .skill-detail small{margin-top:3px;font-size:10px}
@media(pointer:coarse){#item-detail button{min-height:40px}}