.item-stars{display:inline-flex;align-items:center;gap:1px;vertical-align:middle;color:#a56b0a;line-height:1}
.item-stars svg{width:15px;height:15px;fill:#ebbf5e;stroke:#a56b0a;stroke-width:1.3}
.character-item-art{position:relative;isolation:isolate}
.character-item-art[class*="item-art-tier-"]{--item-metal:#bd8454;--item-highlight:#ffe0b4;--item-edge:#64412c;--item-badge:#39291f}
.character-item-art.item-art-tier-2{--item-metal:#9aaec8;--item-highlight:#edf6ff;--item-edge:#465d78;--item-badge:#24364c}
.character-item-art.item-art-tier-3{--item-metal:#dbad48;--item-highlight:#fff0b0;--item-edge:#79541c;--item-badge:#443017}
.character-item-art[class*="item-art-tier-"]:before{content:"";position:absolute;inset:0;z-index:1;border:2px solid var(--item-metal);border-radius:inherit;box-shadow:inset 0 0 0 1px var(--item-highlight);pointer-events:none}
.character-item-art.item-art-tier-2:before{border:4px double var(--item-metal);box-shadow:inset 0 0 0 1px var(--item-edge)}
.character-item-art.item-art-tier-3:before{border:3px solid var(--item-metal);box-shadow:inset 0 0 0 1px var(--item-edge),inset 0 0 0 3px var(--item-highlight);background:linear-gradient(135deg,var(--item-highlight) 0 6px,transparent 6px) top left,linear-gradient(225deg,var(--item-highlight) 0 6px,transparent 6px) top right;background-size:15px 15px;background-repeat:no-repeat}
.character-item-art:is(.item-art-tier-2,.item-art-tier-3):after{content:"";position:absolute;top:0;left:calc(50% - 7px);width:14px;height:9px;z-index:2;background:var(--item-metal);clip-path:polygon(0 0,100% 0,50% 100%);pointer-events:none}
.character-item-art>.item-stars{position:absolute;z-index:3;bottom:3px;left:50%;transform:translateX(-50%);gap:1px;padding:2px 4px;border:1px solid var(--item-metal);border-radius:5px;background:var(--item-badge);white-space:nowrap;pointer-events:none}
.character-item-art>.item-stars svg{width:13px;height:13px;fill:#ffe08a;stroke:#976425;stroke-width:1.2;flex:none}
.hero-cell .item-stars svg,.craft-candidate-art .item-stars svg,.trade-piece .item-stars svg{width:10px;height:10px}
.hero-cell strong,.craft-slot .craft-level{top:3px;bottom:auto;z-index:4}
.hero-detail-head>.character-item-art{height:auto;aspect-ratio:3/4;align-self:start}
.inventory-tabs{margin:0 16px 16px}
.craft{background:#fff;color:#243b34;padding:2px 20px 24px;border-radius:14px;--muted:#60706b;--green:#087657}
.craft-heading{text-align:center;margin:10px 0 18px}
.craft-heading h2{font-size:28px;line-height:1.2;letter-spacing:-.02em;margin:0 0 6px;color:#233d34}
.craft-heading p{font-size:13px;color:#60706b;margin:0}
.craft-tiers{display:flex;justify-content:center;gap:8px}
.craft-tiers button{display:flex;align-items:center;justify-content:center;min-width:80px;min-height:44px;border:1px solid #dce4e0;border-radius:10px;background:#fff}
.craft-tiers button[aria-pressed=true]{border-color:#087657;background:#edf7f1;box-shadow:inset 0 0 0 1px #087657}
.craft-recipe{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;margin:14px 0 18px;font-size:12px;color:#566960}
.craft-workbench{position:relative;max-width:480px;margin:0 auto;isolation:isolate}
.craft-inputs{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:0 12px;z-index:1}
.craft-input{text-align:center;min-width:0}
.craft-slot{position:relative;width:100%;aspect-ratio:1;max-width:108px;border:1px solid #d9e2de;border-radius:13px;background:#fff;padding:5px;box-shadow:0 5px 12px #243b340b;vertical-align:top;text-align:center}
.craft-slot[aria-pressed=true]{border-color:#087657;outline:2px solid #087657;outline-offset:2px}
.craft-slot:disabled{opacity:1;background:#f7f9f8;color:#89978f;border-style:dashed;box-shadow:none}
.craft-slot.has-item{background:#f2f7f4}
.craft-slot>svg{width:28px;height:28px;fill:none;stroke:#779086;stroke-width:1.5}
.craft-slot-caption{display:block;font-size:11px;line-height:1.4;margin-top:8px;color:#596d63;overflow-wrap:anywhere}
.craft-level{position:absolute;bottom:3px;right:5px;background:#fff;border-radius:4px;padding:1px 3px;font-size:10px;color:#355747}
.craft-unused{font-size:24px;color:#81948a}
.craft-input:after{content:"";display:block;width:1px;height:21px;background:#c8d7d0;margin:5px auto -8px}
.craft-anvil{display:block;position:relative;width:calc(100% + 22px);max-width:none;margin:-10px -11px 0;z-index:-1}
.craft-result{position:absolute;top:58%;left:14%;right:14%;text-align:center;display:flex;align-items:center;flex-direction:column}
.craft-result-piece{width:80px;height:80px;position:relative;border:1px solid #c79c47;border-radius:13px;padding:4px;background:#fffdf7;box-shadow:0 5px 14px #53401412}
.craft-result-piece>.item-stars{position:absolute;left:0;right:0;bottom:3px;justify-content:center}
.craft-result-piece>svg{width:35px;height:35px;margin:8px auto;fill:#f5e4b8;stroke:#bc913c;stroke-width:1.1}
.craft-result>span{font-size:12px;font-weight:650;margin-top:6px;max-width:100%;text-wrap:balance;line-height:1.3}
.craft-result>small{font-size:10px;color:#60706b;margin-top:3px}
.craft-terms{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:25px 0 0;padding:16px 0;border-top:1px solid #e4eae6;border-bottom:1px solid #e4eae6}
.craft-terms>div{display:flex;flex-direction:column;gap:5px;text-align:center}
.craft-terms span{font-size:12px;color:#60706b}
.craft-terms strong{font-size:22px;font-variant-numeric:tabular-nums;line-height:1.1}
.craft-terms strong small{display:block;margin-top:4px;font-size:11px;font-weight:400;color:#60706b}
.craft-chance{color:#087657}
.craft-bonus{text-align:center;padding:17px 0;display:flex;flex-direction:column;gap:6px}
.craft-bonus strong{font-size:14px;color:#087657}
.craft-bonus span{font-size:11px;line-height:1.7}
.craft-bonus small{font-size:11px;color:#60706b}
.craft-picker{margin:3px 0 18px}
.craft-picker h3{font-size:15px;margin:0 0 5px}
.craft-picker p{font-size:12px;line-height:1.5;margin:0 0 10px;color:#60706b}
.craft-candidates{max-height:230px;overflow:auto;border-top:1px solid #e3e9e6;overscroll-behavior:contain}
.craft-candidates button{display:flex;align-items:center;gap:10px;width:100%;min-height:64px;padding:8px 0;border-bottom:1px solid #e3e9e6;text-align:left;color:#243b34}
.craft-candidates button:disabled{opacity:.45}
.craft-candidate-art{width:46px;height:46px;flex:none;border-radius:8px;background:#f1f6f3}
.craft-candidates button>span:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.craft-candidates strong{font-size:12px;overflow-wrap:anywhere}
.craft-candidates small{font-size:11px;color:#60706b}
.craft-candidates button>svg{width:20px;height:20px;fill:none;stroke:#087657;stroke-width:1.5;flex:none}
.craft-empty{padding:12px;background:#f6f8f7;border-radius:10px}
.craft .craft-submit{width:100%;min-height:48px;background:#087657;color:#fff}
.craft .craft-submit:disabled{background:#edf1ee;color:#67796e;opacity:1;cursor:default}
.craft-balance{text-align:center;color:#60706b;font-size:11px;margin:9px 0 14px;overflow-wrap:anywhere}
.craft-risk{font-size:12px;line-height:1.6;color:#60706b;margin:0;text-align:center;text-wrap:pretty}
.craft-notice,.craft-error{padding:12px;border-radius:10px;font-size:13px;line-height:1.5;margin:0 0 16px}
.craft-notice{background:#edf7f1;color:#086348}
.craft-error{background:#fff0ed;color:#a43324}
.craft button:focus-visible{outline:2px solid #087657;outline-offset:3px}
@media(hover:hover){.craft-slot:not(:disabled):hover,.craft-tiers button:not(:disabled):hover,.craft-candidates button:not(:disabled):hover{background:#edf7f1}}
@media(max-width:360px){.craft{padding-inline:12px}.craft-inputs{gap:14px;padding-inline:7px}.craft-result-piece{width:67px;height:67px}.craft-result>span{font-size:11px}.craft-terms{margin-top:34px}.craft-slot-caption{font-size:10px}}
