/* Approved unified Bag concepts, 29 October 2026. Web sample only. */
.eq-demo{--eq-ink:#172c4b;--eq-gold:#d8ae61;--eq-paper:#fffbf2;container-type:inline-size;min-width:0;color:var(--eq-ink);font:600 calc(15px * var(--body-scale,1))/1.45 Nunito,system-ui,sans-serif;--eq-card-min:142px}
.eq-demo *{box-sizing:border-box}.eq-demo :where(button,input,select){font:inherit;color:inherit}.eq-demo button{cursor:pointer}.eq-demo button:disabled{cursor:default}.eq-demo :where(h3,h4,h5,p){margin:0}.eq-demo [hidden]{display:none!important}.eq-demo img{display:block;max-width:100%}.eq-demo :where(button,input,select,canvas):focus-visible{outline:3px solid #1b83c4;outline-offset:3px}.eq-icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.eq-sr{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.eq-stage{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.17fr) minmax(0,1fr);align-items:stretch;gap:12px;min-height:700px;padding:18px;background:#b7d9e8 url('assets/inventory-concept/temple-terrace.webp') center/cover;border-radius:24px;box-shadow:0 12px 35px #1c526121;overflow:hidden}
.eq-paper{position:relative;min-width:0;padding:18px 17px;border:2px solid #d3b477;border-radius:21px;background:radial-gradient(ellipse at 30% 0,#fffefa,transparent 70%),linear-gradient(110deg,#fffaf0fa,#fbf5e7fc);box-shadow:inset 0 0 0 3px #fff9eb,inset 0 0 0 5px #e8d7b5,0 4px 0 #b49a6d40;z-index:1;align-self:stretch}
.eq-paper::after{content:'❧';position:absolute;right:16px;bottom:4px;transform:rotate(145deg);color:#d6bd8e50;font:50px Lora,serif;pointer-events:none}
.eq-heading{display:flex;align-items:center;gap:17px;margin-bottom:18px}.eq-heading h3{font:600 clamp(30px,4.2cqi,49px)/1.1 Lora,Georgia,serif;letter-spacing:-.025em}.eq-round{display:inline-grid;place-items:center;border-radius:50%;width:46px;height:46px;min-width:46px;padding:8px;flex-shrink:0;border:2px solid #c4a16a;box-shadow:inset 0 0 0 2px #fff9e3,0 2px 0 #9f835b33}.eq-round .eq-icon{width:25px;height:25px}.eq-back{background:linear-gradient(#419cdb,#2479b7);color:#fffbed!important}.eq-close{margin-left:auto;background:linear-gradient(#fffdf7,#eee0c4);color:#896134}.eq-feather-mark{font-size:32px;color:#dbc494;margin-left:-8px}
.eq-route-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:16px}.eq-route{position:relative;min-width:0;min-height:46px;padding:9px 6px;border:1px solid #cfc2ac;border-radius:20px;background:linear-gradient(#f8f4ed,#e8e2d8);font:600 clamp(13px,1.65cqi,20px)/1.2 Lora,Georgia,serif!important;box-shadow:inset 0 1px 0 #fff}.eq-route[aria-selected=true]{border:2px solid #d6a54d;background:linear-gradient(#35a7ed,#1582c9);color:#fff9e9;box-shadow:inset 0 0 0 2px #b8e8ff,0 0 0 1px #fff3d0}
.eq-filters{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}.eq-filter{flex:1 0 auto;min-height:44px;padding:7px 8px;border:1px solid #d5ccbd;border-radius:9px;background:linear-gradient(#fffdf7,#edeae4);font-size:clamp(11px,1.12cqi,14px)!important;white-space:nowrap}.eq-filter[aria-pressed=true]{background:linear-gradient(#32a7ef,#1482ce);border-color:#cda254;color:#fffdf2;box-shadow:inset 0 0 0 2px #c3e7fa}.eq-filter:hover:not([aria-pressed=true]),.eq-item:hover{border-color:#be9c5c}
.eq-tools{display:flex;gap:8px;align-items:center;min-width:0;margin-bottom:10px}.eq-count{flex:0 0 auto;font-size:.78em;white-space:nowrap}.eq-search{display:flex;align-items:center;gap:7px;flex:1;min-width:60px;border:1px solid #cabda8;border-radius:10px;background:#f1eee9;padding:0 9px}.eq-search .eq-icon{width:19px;height:19px}.eq-search input{min-height:42px;min-width:0;width:100%;border:0;background:transparent;font-size:.8em;padding:5px 0}.eq-sort{min-width:0}.eq-sort select{min-height:44px;max-width:130px;width:100%;border:1px solid #cabda8;border-radius:10px;background:#f1eee9;padding:5px 7px;font-size:.75em}.eq-demo input::placeholder{color:#6e7580;opacity:1}
.eq-scroll-wrap{position:relative;border:1px solid #e6d4b3;border-radius:13px;background:#fff9ee;overflow:hidden}.eq-list{position:relative;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--eq-card-min)),1fr));gap:12px;height:clamp(360px,42cqi,500px);overscroll-behavior:contain;scrollbar-width:auto;scrollbar-color:#258ccd #eae2d2;padding:9px 10px 22px;align-content:start;scroll-padding:8px;grid-auto-rows:max-content;overflow-x:hidden;overflow-y:auto}.eq-list::-webkit-scrollbar{width:11px}.eq-list::-webkit-scrollbar-track{background:#eee5d4;border-radius:8px}.eq-list::-webkit-scrollbar-thumb{background:#278ed3;border:2px solid #eee5d4;border-radius:8px}.eq-scroll-hint{position:absolute;bottom:0;left:0;right:13px;height:19px;background:linear-gradient(transparent,#fff9eef0);pointer-events:none;display:flex;align-items:center;justify-content:center;color:#157bc0}.eq-scroll-hint .eq-icon{height:17px;width:17px;background:#fff9edc9;border-radius:50%}
.eq-item{position:relative;min-width:0;padding:0;overflow:hidden;border:1px solid #c4bbae;border-radius:10px;background:#fffaf0;box-shadow:inset 0 0 0 2px #fffdf6,0 2px 0 #a9a08c1a;display:grid;text-align:center;grid-template-rows:auto minmax(48px,auto);align-self:start}.eq-item-art{display:block;width:100%;aspect-ratio:1 / 1;background:linear-gradient(145deg,#eef3f0,#dce9ed);overflow:hidden;border-radius:9px 9px 0 0;position:relative;height:auto;min-height:0;flex-shrink:0}.eq-item-art img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0;padding:7px}.eq-item>b{display:flex;align-items:center;justify-content:center;min-height:48px;padding:9px 6px;font:600 clamp(14px,1.35cqi,17px)/1.25 Lora,Georgia,serif;overflow-wrap:anywhere}.eq-item[aria-pressed=true]{border-color:#d7a02c;box-shadow:0 0 0 2px #efbc4a,inset 0 0 0 2px #fff9d8}.eq-selected-mark{position:absolute;right:5px;top:5px;display:grid;place-items:center;width:25px;height:25px;border:1px solid #fff7c8;border-radius:50%;background:#dba025;color:#fff;box-shadow:0 1px 2px #6e48152b}.eq-selected-mark .eq-icon{width:18px;height:18px}.eq-badge{position:absolute;bottom:7px;right:7px;padding:2px 7px;border:1px solid #dfd9cd;border-radius:7px;background:#fffaf0ed;color:#344c5b;font-size:12px;line-height:1.4}.eq-positive{background:#e5f9cb;color:#315e24;border-color:#bad58b}.eq-collectible{position:absolute;left:5px;top:5px;display:grid;place-items:center;width:21px;height:21px;color:#a06d17;background:#fff7deed;border-radius:50%}.eq-collectible .eq-icon{width:14px;height:14px;fill:#f4cb77}
.eq-empty{grid-column:1/-1;padding:50px 12px;text-align:center}.eq-empty h4{font:600 23px Lora,serif}.eq-empty p{margin:8px 0 15px}
.eq-details{position:relative;margin-top:13px;display:grid;grid-template-columns:clamp(96px,12cqi,132px) minmax(0,1fr);gap:15px;min-width:0;padding:13px;border:1px solid #e2cd9f;border-radius:15px;background:linear-gradient(120deg,#fdfaf1,#fff8e9);box-shadow:inset 0 0 0 2px #fffdf5}.eq-detail-art{min-width:0;align-self:center;aspect-ratio:1 / 1;border-radius:10px;background:#dce6ec;overflow:hidden;position:relative;min-height:96px}.eq-detail-art img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0;padding:5px}.eq-detail-copy{min-width:0}.eq-details h4,.eq-right-details h4{font:600 clamp(20px,2.35cqi,31px)/1.2 Lora,Georgia,serif;letter-spacing:-.02em}.eq-stat{display:inline-flex;gap:7px;align-items:center;padding:4px 9px;margin:7px 0;border:1px solid #dfd7c9;border-radius:16px;background:#f0ede8;font-size:.75em;line-height:1.4}.eq-stat .eq-icon{width:16px;height:16px;color:#43799f}.eq-demo .eq-description{font-size:.76em;line-height:1.45;color:#5f6f7b;margin:6px 0 10px}.eq-detail-actions{display:flex;gap:8px;align-items:stretch}.eq-compact{min-height:102px}.eq-compact .eq-detail-art{aspect-ratio:1 / 1}.eq-left-footer{padding:17px 7px 3px;border-top:1px solid #dac49a;margin-top:12px}.eq-left-footer strong{font:600 22px Lora,serif}.eq-left-footer p{font-size:.78em;color:#5b6b77;margin-top:5px}
.eq-demo .eq-button,.eq-demo .eq-secondary{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:48px;min-width:90px;width:100%;padding:9px 13px;border:2px solid #d7a74c;border-radius:20px;background:linear-gradient(#32a6ed,#1485ce);color:#fff9e9;box-shadow:inset 0 0 0 2px #b4e2fb,0 2px 0 #a77c3e55;font:600 clamp(16px,1.85cqi,23px)/1.2 Lora,Georgia,serif;text-shadow:0 1px 1px #12497260}.eq-demo .eq-button:disabled{background:linear-gradient(#c8c7c4,#aaa9a6);border-color:#96938d;box-shadow:inset 0 0 0 2px #e7e4dd;color:#fffdfa;text-shadow:none}.eq-demo .eq-secondary{font-family:Nunito,system-ui,sans-serif;font-size:.82em;background:#fffaf1;color:#2f6486;border:1px solid #c0cbd0;box-shadow:none;text-shadow:none;border-radius:12px}.eq-remove{min-height:46px;border:1px solid #cfbd9f;border-radius:13px;background:#fffaf0;padding:8px 11px;color:#736048;font-size:.75em!important}.eq-link-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:7px 9px;border:0;border-radius:8px;background:transparent;color:#176e9f!important;text-decoration:underline;text-underline-offset:3px;font-size:.78em!important}.eq-return{display:flex;width:100%;margin-top:8px}.eq-button:active:not(:disabled),.eq-round:active{transform:translateY(1px)}
.eq-character{display:flex;flex-direction:column;min-width:0;position:relative}.eq-hero-display{display:flex;flex:1;min-height:550px;min-width:0;position:relative}.eq-character-art.eq-character-live{flex:1;min-height:550px;min-width:0;position:relative}.eq-loadout{width:90px;flex:0 0 90px;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 2px}.eq-slot{position:relative;display:flex;flex-direction:column;align-items:center;min-height:108px;width:100%;padding:5px 3px;background:#fff9ebee;border:1px solid #d3ad65;border-radius:12px;box-shadow:inset 0 0 0 2px #fffaf1;overflow:hidden;line-height:1.2}.eq-slot>b{font-size:12px}.eq-slot img{width:100%;height:62px;object-fit:contain;border-radius:6px;margin:3px 0}.eq-slot small{font-size:11px;overflow-wrap:anywhere}.eq-slot-empty{display:grid;place-items:center;min-height:62px;font-size:27px;color:#78949d}.eq-character-footer{text-align:center;padding:12px 10px;background:#fff8e9e6;border:1px solid #e2c283;border-radius:17px;margin-top:8px}.eq-character-footer h4{font:600 29px/1.2 Lora,Georgia,serif}.eq-character-footer p{font-size:.8em;margin-top:3px}.eq-character-footer small{display:block;font-size:.68em;line-height:1.45;color:#5e707c;margin-top:6px}
.eq-object-panel{display:flex;flex-direction:column;min-width:0;align-self:stretch}.eq-object-preview{display:flex;align-items:center;justify-content:center;min-height:260px;max-height:370px;flex:1;overflow:hidden;border-radius:15px;background:#eaf1ecc7;border:1px solid #e4d2ad}.eq-object-preview img{width:100%;height:100%;max-height:370px;object-fit:contain}.eq-object-preview:not(.eq-scene-preview) img{max-width:85%;max-height:290px;aspect-ratio:1.3;object-fit:contain;border-radius:14px}.eq-scene-preview{background:transparent}.eq-scene-preview img{align-self:stretch;object-fit:cover;object-position:center}.eq-right-details{background:#fffaf0f5;padding:19px 17px;min-width:0;border:2px solid #d4b579;border-radius:19px;margin-top:12px;box-shadow:inset 0 0 0 3px #fffaf0,inset 0 0 0 4px #ead8b1}.eq-right-details>p{font-size:.85em;line-height:1.55;margin:8px 0 13px}.eq-right-details .eq-in-bag{font-size:1.08em;margin:18px 0 12px}.eq-object-panel:not(.eq-craft-panel) .eq-right-details{min-height:235px}.eq-material-heading{display:flex;align-items:center;justify-content:space-between;gap:5px;margin:14px 0 9px;border-top:1px solid #dac9a8;padding-top:12px}.eq-material-heading h5{font:600 20px Lora,serif}.eq-ingredients{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,148px),1fr));gap:9px}.eq-ingredient{min-width:0;position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);gap:8px;align-items:center;border:1px solid #dfcdac;border-radius:10px;background:#fffdf7;padding:10px 8px}.eq-ingredient>img{width:52px;height:52px;object-fit:contain;border-radius:6px}.eq-ingredient>span:nth-child(2){min-width:0}.eq-ingredient b{display:block;font-size:13px;line-height:1.3;overflow-wrap:anywhere}.eq-ingredient strong{font-size:17px;line-height:1.3}.eq-ingredient>span:nth-child(3){position:absolute;top:1px;right:3px;font-size:10px;font-weight:900}.eq-ingredient .eq-link-button{grid-column:1/-1;min-height:44px;padding:4px;font-size:12px!important!important}.eq-met{color:#337645}.eq-short{color:#a35a17}.eq-ingredient.eq-short{border-color:#d6ae73;background:#fff7e8}.eq-requirement{display:flex;align-items:center;gap:6px;font-size:.78em!important;margin:9px 0!important;line-height:1.35!important}.eq-requirement .eq-icon{width:18px;height:18px}.eq-requirement .eq-link-button{margin-left:auto;flex-shrink:0}.eq-craft-status{font-weight:900;border-top:1px solid #dac9a8;padding-top:10px}.eq-craft-actions{display:flex;gap:8px;align-items:stretch;flex-wrap:wrap}.eq-craft-actions>*{flex:1 1 135px}.eq-complete{display:flex;gap:7px;align-items:center;justify-content:center;min-height:48px;color:#2f7148;background:#e4f2d8;border:1px solid #bfcea5;border-radius:13px}.eq-batch{display:flex;align-items:center;gap:6px;font-size:.74em}.eq-step{display:grid;place-items:center;width:36px;min-height:40px;border:1px solid #cebd9c;background:#fffaf0;border-radius:10px;font-size:20px!important}.eq-step:disabled{color:#9b978f;background:#ede8df}
.eq-3d-view{display:grid;grid-template-rows:minmax(0,1fr) 44px;gap:0;width:100%;height:100%;position:absolute;inset:0;min-width:0;min-height:0}.eq-3d-viewport{position:relative;width:100%;height:100%;min-width:0;min-height:0}.eq-3d-canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab;border-radius:14px}.eq-3d-canvas:active{cursor:grabbing}.eq-demo .eq-3d-message{position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center;font-size:.85em;line-height:1.5;color:#355d72;background:#edf5f2bd;border-radius:14px}.eq-3d-turn{display:flex;gap:5px;justify-content:center;align-items:center}.eq-demo .eq-3d-turn button{min-width:44px;min-height:44px;padding:5px 9px;background:#fff8e8bd;border:1px solid #ddc798;border-radius:22px;color:#6a5e45;font-size:.7em}.eq-3d-turn button:first-child,.eq-3d-turn button:last-child{font-size:1.4em}
.eq-demo-context{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 0 0;font-size:.75em;color:#5c7481}.eq-demo-context label{display:flex;align-items:center;gap:6px;min-height:35px}.eq-demo-context input{width:18px;height:18px;accent-color:#238ac8}.eq-demo-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px}.eq-demo .eq-status{min-height:23px;font-size:.8em;line-height:1.45;color:#4f6975}.eq-demo-actions{display:flex;gap:7px;flex-shrink:0}.eq-reset{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:44px;padding:7px 9px;border:1px solid #c9d7d8;border-radius:10px;background:#fffdf5;color:#536e7b;font-size:.72em!important}.eq-reset .eq-icon{width:16px;height:16px}.eq-closed{grid-column:1/-1;align-self:center;justify-self:center;display:grid;gap:24px;background:#fffaf0ed;padding:38px;border:2px solid #d4b273;border-radius:22px}.eq-closed h3{font:600 30px Lora,Georgia,serif}.game-screen:has(.eq-demo){overflow:visible;min-width:0}
@container(max-width:900px){.eq-stage{padding:12px;gap:9px}.eq-paper{padding:15px 11px}.eq-heading{gap:10px}.eq-tools{flex-wrap:wrap}.eq-count{flex:0 0 100%}.eq-sort select{max-width:104px}.eq-details{gap:9px;padding:10px}.eq-right-details{padding:15px 11px}.eq-demo-footer{align-items:flex-start}.eq-demo-actions{flex-direction:column}.eq-craft-actions>*{flex-basis:100%}.eq-material-heading{flex-wrap:wrap}}
@container(max-width:690px){.eq-stage{padding:12px;gap:16px}.eq-paper{padding:17px 13px}.eq-heading h3{font-size:37px}.eq-route{font-size:17px!important}.eq-filter{font-size:13px!important}.eq-count{flex-basis:auto}.eq-tools{flex-wrap:nowrap}.eq-item>b{font-size:14px}.eq-details h4,.eq-right-details h4{font-size:26px}.eq-demo .eq-button{font-size:21px}.eq-character-art.eq-character-live{min-height:370px}.eq-hero-display{min-height:370px}.eq-object-preview{min-height:220px;max-height:310px}.eq-right-details{padding:18px 15px}.eq-badge{font-size:11px}.eq-demo-footer{flex-wrap:wrap}.eq-demo-actions{flex-direction:row}.eq-craft-actions>*{flex-basis:140px}.eq-sort select{max-width:125px}}
@container(max-width:430px){.eq-stage{padding:8px;border-radius:17px}.eq-paper{padding:14px 9px;border-radius:16px}.eq-heading h3{font-size:31px}.eq-feather-mark{display:none}.eq-heading .eq-round{width:44px;min-width:44px;height:44px}.eq-route{font-size:13px!important;padding:8px 3px}.eq-filters{gap:4px}.eq-filter{font-size:12px!important;padding:6px 8px;flex-basis:27%}.eq-tools{flex-wrap:wrap}.eq-count{flex-basis:100%}.eq-search{flex-basis:50%}.eq-item>b{font-size:14px}.eq-details{gap:9px;padding:10px}.eq-details h4{font-size:22px}.eq-stat{font-size:11px}.eq-demo .eq-button{font-size:19px;padding-inline:8px}.eq-right-details h4{font-size:26px}.eq-craft-actions>*{flex-basis:100%}.eq-character-art.eq-character-live,.eq-hero-display{min-height:375px}.eq-demo-footer{gap:8px}.eq-demo-actions{flex-wrap:wrap}.eq-left-footer strong{font-size:20px}}
@media(prefers-reduced-motion:reduce){.eq-demo *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.eq-demo button:active{transform:none}}
/* Reflow the two panes before either pane can squeeze its item cards. */
@container(max-width:980px){.eq-stage{grid-template-columns:minmax(0,1fr)}.eq-hero-display{max-width:720px;width:100%;margin-inline:auto}}
@container(max-width:430px){.eq-details{grid-template-columns:minmax(0,1fr)}.eq-detail-art{width:124px;min-height:124px;justify-self:center}.eq-hero-display{display:block}.eq-character-art.eq-character-live{min-height:350px}.eq-loadout{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,88px),1fr));padding:10px 0 0;gap:9px}.eq-slot{min-height:110px}.eq-slot img{height:62px}.eq-slot small{display:block}.eq-demo .eq-description{font-size:13px}.eq-stat{font-size:12px}}
.eq-svg-assets{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:15px;font:700 13px/1.5 Nunito,system-ui,sans-serif;color:#4f6d79}
.eq-svg-assets a{display:inline-flex;align-items:center;min-height:44px;color:#176e9f;text-underline-offset:3px}

/* One selected item inspector; cards stay lightweight images of the model. */
.eq-inspector-switch{display:flex;gap:8px;min-height:44px;margin:0 0 10px}.eq-inspector-mode{flex:1;min-height:44px;padding:9px 13px;border:1px solid #ccb990;border-radius:14px;background:#fff9eced;color:#345a73;font-weight:800!important}.eq-inspector-mode[aria-pressed=true]{background:linear-gradient(#36a5e7,#1987c8);border-color:#d1a149;color:#fff9ea;box-shadow:inset 0 0 0 2px #b5def6}.eq-object-preview.eq-live-item{position:relative;display:block;flex:none;height:clamp(320px,35cqi,420px);min-height:320px;max-height:420px;background:linear-gradient(145deg,#f7fbf2d9,#cfe5e9d9)}