.purchase-toast{position:fixed;z-index:170;top:max(22px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:15px;width:max-content;max-width:calc(100vw - 24px);padding:15px 44px 15px 15px;border:1px solid #e2c380;border-radius:9px;background:linear-gradient(115deg,#23483f,#15373cf5);box-shadow:0 10px 35px #071e3280,inset 0 0 0 3px #b69b6033;color:#f4e6c1;animation:purchase-arrive .2s ease-out}
.purchase-toast>span{width:52px;height:52px;display:grid;place-items:center;flex:none;color:#d9edc3}
.purchase-toast svg{width:34px;height:34px}
.purchase-toast small{display:block;font-size:10px;letter-spacing:.14em;color:#c8d7ba}
.purchase-toast strong{display:block;font:22px/1.2 Georgia,serif;margin:5px 0}
.purchase-toast p{font-size:12px;color:#c1d5c8;margin:0;line-height:1.45}
.purchase-toast>button{position:absolute;right:5px;top:5px;width:36px;height:36px;border:0;background:none;color:#ead5a2;font-size:25px}
@keyframes purchase-arrive{from{opacity:0;translate:0 -8px}to{opacity:1;translate:0 0}}
.item-detail-hero{display:flex;align-items:center;gap:24px;padding:18px;background:radial-gradient(ellipse at 20% 50%,#577b6044,transparent 65%),#dacaab;border:1px solid #a58a59;border-radius:7px}
.item-detail-hero>span{width:145px;height:145px;display:block;flex:none;filter:drop-shadow(0 7px 8px #41504444)}
.item-detail-hero h3{font:30px/1.15 Georgia,serif;color:#2c584a;margin:8px 0 13px}
.item-detail-hero small{color:#6c653f;font-size:14px}
.item-detail-hero p{margin:4px 0;color:#586d55;font-size:14px}
.item-detail-hero[data-rarity="legendary"]{border-color:#b68635;background:radial-gradient(ellipse at 20% 50%,#c9984655,transparent 65%),#e2d2a7}
.item-detail-hero[data-rarity="epic"]{border-color:#8d729e}
.item-detail-stats{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:16px 0}
.item-detail-stats>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 15px;border:1px solid #b09a6e66;border-radius:4px;background:#f4e9cb88}
.item-detail-stats dt{font-size:15px;color:#3b5b4a}
.item-detail-stats dd{margin:0;font:600 20px Georgia,serif;color:#28644d;white-space:nowrap}
.item-detail-affixes,.item-detail-value{font-size:14px;color:#6b704f;line-height:1.6}
.hero-gender{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:20px 0 14px;color:#36594b}
.hero-gender>span{font-size:14px;margin-right:5px}
.hero-gender button{padding:11px 22px;min-height:44px;border:1px solid #9e8559;border-radius:5px;background:#e1d1aa;color:#36594b}
.hero-gender [aria-pressed="true"]{background:#315b50;color:#f5e2b8;border-color:#c1a064;box-shadow:inset 0 0 0 2px #a58b5444}
.hero-gender-note{font-size:13px;line-height:1.5;color:#68775c}
@media(max-width:600px){.purchase-toast{gap:10px;padding:12px 38px 12px 10px}.purchase-toast>span{width:40px;height:40px}.purchase-toast strong{font-size:18px}.purchase-toast p{font-size:11px}.item-detail-hero{gap:15px;padding:13px}.item-detail-hero>span{width:100px;height:110px}.item-detail-hero h3{font-size:24px}.item-detail-stats{grid-template-columns:1fr}.item-detail-stats>div{padding:12px 14px}.item-detail-stats dt{font-size:15px}.item-detail-stats dd{font-size:21px}}

.touch-active .purchase-toast>button{width:44px;height:44px}
.touch-active .purchase-toast{padding-right:52px}

.touch-active #modal-layer[data-kind="itemDetails"] .journal-heading{padding:12px 18px}
.touch-active #modal-layer[data-kind="itemDetails"] #modal-title{font-size:22px;line-height:1.15;margin-top:6px}
.touch-active .item-detail-hero{padding:10px 12px;gap:14px}
.touch-active .item-detail-hero>span{width:78px;height:86px}
.touch-active .item-detail-hero h3{font-size:20px;line-height:1.15;margin:4px 0 7px}
.touch-active .item-detail-hero small,.touch-active .item-detail-hero p{font-size:12px;line-height:1.3}
.touch-active #modal-layer[data-kind="itemDetails"] .modal-body>h3{font-size:18px;margin:12px 0 8px}
.touch-active .item-detail-stats{margin:9px 0;gap:6px}
.touch-active .item-detail-stats>div{padding:8px 11px}
.touch-active .item-detail-stats dt{font-size:14px}
.touch-active .item-detail-stats dd{font-size:18px}
@media(orientation:landscape){.touch-active #modal-layer[data-kind="itemDetails"] .modal-actions{gap:7px;margin-top:12px;padding:9px 18px}}