/* A character, a compact rack and a readable work plan share the forge room. */
body[data-chronicle] #chronicle-body .sp-icon--equipment{background-size:contain;background-position:center;background-repeat:no-repeat;border-radius:0}
body[data-chronicle] #chronicle-body .eq-room{position:relative;isolation:isolate;min-height:100%;display:grid;grid-template-columns:23% 25% minmax(0,1fr);grid-template-rows:minmax(0,1fr) 46px;gap:12px;padding:16px;background:linear-gradient(110deg,#162731d9,#162731bb),var(--scene) center/cover;color:#e9ddbe;font:13px/1.5 "Microsoft YaHei",sans-serif}
body[data-chronicle] #chronicle-body .eq-avatar,body[data-chronicle] #chronicle-body .eq-catalog,body[data-chronicle] #chronicle-body .eq-details{min-width:0;min-height:0}
body[data-chronicle] #chronicle-body .eq-avatar{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;border-right:1px solid #c7b78944;padding:0 10px}
body[data-chronicle] #chronicle-body .eq-avatar .sp-hero{position:absolute;width:180px;height:220px;max-width:100%;left:50%;top:0;transform:translateX(-50%);pointer-events:none}
body[data-chronicle] #chronicle-body .eq-person{position:relative;text-align:center;padding:220px 0 12px}
body[data-chronicle] #chronicle-body .eq-person strong,body[data-chronicle] #chronicle-body .eq-person small,body[data-chronicle] #chronicle-body .eq-person span{display:block}body[data-chronicle] #chronicle-body .eq-person strong{font:24px/1.6 "KaiTi",serif}body[data-chronicle] #chronicle-body .eq-person small{color:#bfb894}body[data-chronicle] #chronicle-body .eq-person span{font-size:10px;color:#b9c4be;margin-top:6px}
body[data-chronicle] #chronicle-body .eq-avatar nav{display:grid;gap:7px}body[data-chronicle] #chronicle-body .eq-avatar nav button{display:flex;gap:10px;align-items:center;padding:7px;background:#162a3499;text-align:left;border:1px solid #bdad7d55;border-radius:3px;font-size:10px}body[data-chronicle] #chronicle-body .eq-avatar nav b{display:block;font-size:12px;font-weight:500}
body[data-chronicle] #chronicle-body .eq-avatar .sp-icon{width:32px;height:32px;flex:none;margin:0}
body[data-chronicle] #chronicle-body .eq-catalog{display:flex;flex-direction:column;background:#172a33a8;border:1px solid #b2ad8755;border-radius:3px}
body[data-chronicle] #chronicle-body .eq-tabs{display:flex;padding:8px;gap:3px;border-bottom:1px solid #bdb18133}body[data-chronicle] #chronicle-body .eq-tabs button{flex:1;min-width:0;font-size:11px;padding:6px 3px;border:0;background:transparent}body[data-chronicle] #chronicle-body .eq-tabs button[aria-pressed=true]{color:#f0dab1;box-shadow:inset 0 -2px #cbb481;background:#bba27016}
body[data-chronicle] #chronicle-body .eq-items{padding:7px;overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0}body[data-chronicle] #chronicle-body .eq-items>button{display:flex;width:100%;align-items:center;gap:9px;text-align:left;padding:9px 7px;min-height:64px;border:1px solid #b8b29133;background:#21333ca3;border-radius:3px;margin-bottom:7px}body[data-chronicle] #chronicle-body .eq-items b,body[data-chronicle] #chronicle-body .eq-items small{display:block}body[data-chronicle] #chronicle-body .eq-items b{font-size:12px;font-weight:500}body[data-chronicle] #chronicle-body .eq-items small{font-size:10px;color:#aebbb5}body[data-chronicle] #chronicle-body .eq-items .sp-icon{width:37px;height:37px;flex:none;margin:0}body[data-chronicle] #chronicle-body .eq-items button[aria-pressed=true]{border-color:#d4bc85;background:#4d5b543d;box-shadow:inset 2px 0 #dbc391}body[data-chronicle] #chronicle-body .eq-mini-rune{margin-left:auto;font:15px "KaiTi",serif;color:#d9c28c;border:1px solid #c6ad7166;padding:1px 4px;font-style:normal}
body[data-chronicle] #chronicle-body .eq-pocket{padding:9px;border-top:1px solid #bdb18133;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:10px}body[data-chronicle] #chronicle-body .eq-pocket b{color:#dec89e;margin-left:4px}
body[data-chronicle] #chronicle-body .eq-details{background:linear-gradient(140deg,#e6dabbf5,#d2c4a7f5);border:1px solid #c3ad7b;border-radius:3px;color:#2b4046;padding:15px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#788b82 #c5b999}
body[data-chronicle] #chronicle-body .eq-details header{display:flex;align-items:center;gap:12px;border-bottom:1px solid #677c6855;padding-bottom:9px}body[data-chronicle] #chronicle-body .eq-details header>.sp-icon{width:64px;height:64px;flex:none;margin:0}body[data-chronicle] #chronicle-body .eq-details header h3{font:24px/1.5 "KaiTi",serif;margin:0!important;color:#2e4142}body[data-chronicle] #chronicle-body .eq-details header small{font-size:10px;color:#526c64}body[data-chronicle] #chronicle-body .eq-details header span{font-size:11px;color:#526b65;display:block}
body[data-chronicle] #chronicle-body .eq-comparison{padding:10px 0;border-bottom:1px solid #73816b44}body[data-chronicle] #chronicle-body .eq-comparison>small{display:block;color:#556e64;font-size:10px;margin-bottom:5px}body[data-chronicle] #chronicle-body .eq-comparison>div{display:grid;grid-template-columns:minmax(0,1fr) 65px 65px;gap:8px;font-size:11px;margin:4px 0}body[data-chronicle] #chronicle-body .eq-comparison b{text-align:right;font-variant-numeric:tabular-nums}body[data-chronicle] #chronicle-body .eq-comparison em{font-style:normal;text-align:right;font-size:10px}body[data-chronicle] #chronicle-body .eq-comparison .better{color:#2c7057}body[data-chronicle] #chronicle-body .eq-comparison .worse{color:#9a4e3e}body[data-chronicle] #chronicle-body .eq-comparison .same{color:#71806c}
body[data-chronicle] #chronicle-body .eq-main-actions{display:flex;flex-wrap:wrap;gap:6px;padding:10px 0}body[data-chronicle] #chronicle-body .eq-details button.eq-action{font-size:11px;padding:7px 9px;color:#263c40;border:1px solid #758575;background:#d2c89c;border-radius:3px;text-align:center;min-height:34px}body[data-chronicle] #chronicle-body .eq-details button.eq-action small{display:block;font-size:9px;font-weight:400;margin-top:2px}body[data-chronicle] #chronicle-body .eq-details button.eq-action:disabled{color:#677468;background:#c6c5ad;opacity:.78}body[data-chronicle] #chronicle-body .eq-details .eq-action:hover:not(:disabled){background:#bdcbaa!important;border-color:#4d7165!important}
body[data-chronicle] #chronicle-body .eq-plan{padding:9px 0;border-top:1px solid #76816944}body[data-chronicle] #chronicle-body .eq-details h4{font-size:12px;font-weight:500;margin:0 0 6px!important;color:#2c4545}body[data-chronicle] #chronicle-body .eq-plan>small{font-size:10px;display:block;color:#587066;margin-top:5px}body[data-chronicle] #chronicle-body .eq-materials{display:flex;flex-wrap:wrap;gap:6px;font-size:10px;margin:6px 0}body[data-chronicle] #chronicle-body .eq-materials>span{display:flex;align-items:center;gap:4px;padding:3px 5px;background:#b9b79833;border-radius:2px}body[data-chronicle] #chronicle-body .eq-materials .sp-icon{width:20px;height:20px;margin:0;flex:none}body[data-chronicle] #chronicle-body .eq-materials b{font-weight:400}body[data-chronicle] #chronicle-body .eq-materials .short{color:#975542}body[data-chronicle] #chronicle-body .eq-materials .ready{color:#40674f}
body[data-chronicle] #chronicle-body .eq-runes{border-top:1px solid #76816944;padding-top:10px}body[data-chronicle] #chronicle-body .eq-runes h4>small{margin-left:8px;color:#5c726b;font-size:10px}body[data-chronicle] #chronicle-body .eq-details .eq-runes>p{color:#566e64!important;font-size:10px;margin:0 0 7px!important}body[data-chronicle] #chronicle-body .eq-rune-options{display:grid;gap:6px}body[data-chronicle] #chronicle-body .eq-rune-options article{display:flex;align-items:center;gap:8px;padding:7px;border:1px solid #75877544;border-radius:3px}body[data-chronicle] #chronicle-body .eq-rune-options article.active{background:#a7bc9e44;border-color:#5e816c}body[data-chronicle] #chronicle-body .eq-rune-seal{font:22px "KaiTi",serif;display:grid;place-items:center;width:34px;height:34px;border:1px solid #81845d;color:#5c755d;background:#b4bba633;flex:none;font-style:normal}body[data-chronicle] #chronicle-body .eq-rune-options article>div{flex:1;min-width:0}body[data-chronicle] #chronicle-body .eq-rune-options article b,body[data-chronicle] #chronicle-body .eq-rune-options article small{display:block;font-size:11px}body[data-chronicle] #chronicle-body .eq-rune-options article small{font-size:10px;color:#597165;margin-top:3px}body[data-chronicle] #chronicle-body .eq-rune-options .eq-action{max-width:140px}
body[data-chronicle] #chronicle-body .eq-footer{grid-column:1/-1;display:flex;justify-content:flex-end;align-items:center;gap:8px;border-top:1px solid #b8aa7355;padding-top:6px}body[data-chronicle] #chronicle-body .eq-footer button{font-size:11px;border-radius:3px;background:#21353bd9;padding:7px 12px}body[data-chronicle] #chronicle-body .eq-footer button:last-child{color:#253e3f;background:#ccb98a;border-color:#ddca9c}
@media(orientation:landscape) and (max-height:520px){
 body[data-chronicle] #chronicle-body .eq-room{height:100%;grid-template-columns:19% 26% minmax(0,1fr);grid-template-rows:minmax(0,1fr) 34px;padding:8px;gap:7px}
 body[data-chronicle] #chronicle-body .eq-avatar .sp-hero{width:100px;height:125px;top:0}body[data-chronicle] #chronicle-body .eq-avatar{padding:0 5px}body[data-chronicle] #chronicle-body .eq-person{padding:125px 0 5px}body[data-chronicle] #chronicle-body .eq-person strong{font-size:17px}body[data-chronicle] #chronicle-body .eq-person span{display:none}body[data-chronicle] #chronicle-body .eq-avatar nav{gap:4px}body[data-chronicle] #chronicle-body .eq-avatar nav button{padding:4px;gap:6px}body[data-chronicle] #chronicle-body .eq-avatar nav .sp-icon{width:24px;height:24px}body[data-chronicle] #chronicle-body .eq-avatar nav b{font-size:10px}body[data-chronicle] #chronicle-body .eq-person small{font-size:9px}
 body[data-chronicle] #chronicle-body .eq-items>button{min-height:52px;padding:5px;gap:6px}body[data-chronicle] #chronicle-body .eq-items .sp-icon{width:29px;height:29px}body[data-chronicle] #chronicle-body .eq-items b{font-size:11px}body[data-chronicle] #chronicle-body .eq-details{padding:10px}body[data-chronicle] #chronicle-body .eq-details header>.sp-icon{width:42px;height:42px}body[data-chronicle] #chronicle-body .eq-details header h3{font-size:20px}body[data-chronicle] #chronicle-body .eq-rune-options article{flex-wrap:wrap}body[data-chronicle] #chronicle-body .eq-footer button{padding:5px 10px}body[data-chronicle] #chronicle-body .eq-comparison>div{grid-template-columns:minmax(0,1fr) 53px 52px;font-size:10px}body[data-chronicle] #chronicle-body .eq-details .eq-action{padding:5px 6px}
}
@media(orientation:portrait) and (max-width:600px){
 body[data-chronicle] #chronicle-body .eq-room{grid-template-columns:38% minmax(0,1fr);grid-template-rows:auto auto 44px;padding:10px;gap:8px}
 body[data-chronicle] #chronicle-body .eq-avatar{display:none}body[data-chronicle] #chronicle-body .eq-catalog{position:sticky;top:0;align-self:start;max-height:70vh}body[data-chronicle] #chronicle-body .eq-tabs{padding:5px;gap:0}body[data-chronicle] #chronicle-body .eq-tabs button{font-size:10px}body[data-chronicle] #chronicle-body .eq-items{padding:5px}body[data-chronicle] #chronicle-body .eq-items>button{flex-wrap:wrap;justify-content:center;gap:3px;text-align:center;padding:7px 4px}body[data-chronicle] #chronicle-body .eq-items>button>span{width:100%}body[data-chronicle] #chronicle-body .eq-items b{font-size:11px}body[data-chronicle] #chronicle-body .eq-items .sp-icon{width:42px;height:42px}body[data-chronicle] #chronicle-body .eq-mini-rune{position:relative;margin:auto}body[data-chronicle] #chronicle-body .eq-pocket{gap:4px;padding:6px}body[data-chronicle] #chronicle-body .eq-details{padding:10px;overflow:visible}body[data-chronicle] #chronicle-body .eq-details header{flex-direction:column;align-items:flex-start;gap:7px}body[data-chronicle] #chronicle-body .eq-details header h3{font-size:20px}body[data-chronicle] #chronicle-body .eq-details header>.sp-icon{width:50px;height:50px}body[data-chronicle] #chronicle-body .eq-comparison>div{grid-template-columns:minmax(0,1fr) 50px;gap:5px}body[data-chronicle] #chronicle-body .eq-comparison em{grid-column:2;font-size:10px}body[data-chronicle] #chronicle-body .eq-main-actions{flex-direction:column}body[data-chronicle] #chronicle-body .eq-rune-options article{flex-wrap:wrap;gap:6px}body[data-chronicle] #chronicle-body .eq-rune-options article>div{width:calc(100% - 42px)}body[data-chronicle] #chronicle-body .eq-rune-options .eq-action{width:100%;max-width:none}body[data-chronicle] #chronicle-body .eq-rune-options .eq-rune-seal{width:30px;height:30px}body[data-chronicle] #chronicle-body .eq-details .eq-runes h4>small{display:block;margin:2px 0 0}body[data-chronicle] #chronicle-body .eq-footer{grid-row:3}body[data-chronicle] #chronicle-body .eq-footer button{padding:7px 8px;font-size:10px}
}

/* Keep the hero in its own grid row, and give every touch action a full target. */
body[data-chronicle] #chronicle-panel[data-panel=equipment] #chronicle-title{font-size:22px;letter-spacing:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-chronicle] #chronicle-body .eq-room{height:100%;grid-template-rows:minmax(0,1fr) 50px}
body[data-chronicle] #chronicle-body .eq-room section{margin:0}
body[data-chronicle] #chronicle-body .eq-avatar{display:grid;grid-template-rows:minmax(0,1fr) auto auto;gap:8px}
body[data-chronicle] #chronicle-body .eq-avatar .sp-hero{position:relative;left:auto;top:auto;transform:none;align-self:center;justify-self:center;width:auto;height:100%;aspect-ratio:1;max-width:100%;max-height:280px}
body[data-chronicle] #chronicle-body .eq-person{padding:0 0 6px}
body[data-chronicle] #chronicle-body .eq-avatar nav button{min-width:0;min-height:48px}
body[data-chronicle] #chronicle-body .eq-avatar nav button>span{color:#bfccc5;font-size:11px}
body[data-chronicle] #chronicle-body .eq-avatar nav b{color:#e9ddbe}
body[data-chronicle] #chronicle-body .eq-catalog{overflow:hidden}
body[data-chronicle] #chronicle-body .eq-tabs{padding:4px}
body[data-chronicle] #chronicle-body .eq-tabs button{min-height:44px;font-size:12px;padding:5px 3px;color:#bfcac4;box-shadow:none}
body[data-chronicle] #chronicle-body .eq-tabs button[aria-pressed=true]{color:#f0dab1;box-shadow:inset 0 -2px #cbb481}
body[data-chronicle] #chronicle-body .eq-items{scrollbar-width:thin;scrollbar-color:#c5b07b88 #162831}
body[data-chronicle] #chronicle-body .eq-items button>span{color:#e9ddbe;font-size:12px;min-width:0}
body[data-chronicle] #chronicle-body .eq-items small{font-size:11px}
body[data-chronicle] #chronicle-body .eq-details button.eq-action{min-height:44px;font-size:12px;box-shadow:inset 0 1px #fff3cf88}
body[data-chronicle] #chronicle-body .eq-details button.eq-action small{color:inherit;font-size:10px}
body[data-chronicle] #chronicle-body .eq-details button.eq-action:disabled{color:#586553;background:#c6c5ad;border-color:#78857966;opacity:1;box-shadow:none}
body[data-chronicle] #chronicle-body .eq-details p{color:#566e64;font-size:12px;line-height:1.6;margin:0 0 7px}
body[data-chronicle] #chronicle-body .eq-details h4{font-size:13px}
body[data-chronicle] #chronicle-body .eq-details header small,body[data-chronicle] #chronicle-body .eq-comparison>small,body[data-chronicle] #chronicle-body .eq-plan>small,body[data-chronicle] #chronicle-body .eq-runes h4>small,body[data-chronicle] #chronicle-body .eq-rune-options article small{font-size:11px}
body[data-chronicle] #chronicle-body .eq-comparison>div{font-size:12px}
body[data-chronicle] #chronicle-body .eq-comparison .same{color:#53654f}
body[data-chronicle] #chronicle-body .eq-comparison em{font-size:11px}
body[data-chronicle] #chronicle-body .eq-rune-options article b{font-size:12px}
body[data-chronicle] #chronicle-body .eq-footer button{min-height:44px;font-size:12px}
@media(orientation:landscape) and (max-height:520px){
 body[data-chronicle] #chronicle-body .eq-room{grid-template-rows:minmax(0,1fr) 44px}
 body[data-chronicle] #chronicle-body .eq-avatar{gap:3px}
 body[data-chronicle] #chronicle-body .eq-avatar .sp-hero{max-height:125px}
 body[data-chronicle] #chronicle-body .eq-person{padding:0 0 3px}
 body[data-chronicle] #chronicle-body .eq-person strong{line-height:1.3}
 body[data-chronicle] #chronicle-body .eq-avatar nav{gap:3px}
 body[data-chronicle] #chronicle-body .eq-avatar nav button{min-height:44px}
 body[data-chronicle] #chronicle-body .eq-avatar nav b{font-size:11px}
 body[data-chronicle] #chronicle-body .eq-items>button{margin-bottom:5px}
 body[data-chronicle] #chronicle-body .eq-footer{padding-top:0}
 body[data-chronicle] #chronicle-body .eq-comparison>div{font-size:11px}
}
@media(orientation:landscape) and (max-width:640px){
 body[data-chronicle] #chronicle-body .eq-room{grid-template-columns:33% minmax(0,1fr)}
 body[data-chronicle] #chronicle-body .eq-avatar{display:none}
}
@media(orientation:portrait) and (max-width:600px){
 body[data-chronicle] #chronicle-panel[data-panel=equipment] #chronicle-title{font-size:18px;letter-spacing:0}
 body[data-chronicle] #chronicle-body .eq-room{height:auto;grid-template-rows:auto 44px}
 body[data-chronicle] #chronicle-body .eq-avatar{display:none}
 body[data-chronicle] #chronicle-body .eq-tabs{padding:3px}
 body[data-chronicle] #chronicle-body .eq-tabs button{font-size:11px}
 body[data-chronicle] #chronicle-body .eq-footer{grid-row:2}
 body[data-chronicle] #chronicle-body .eq-footer button{font-size:11px}
}

body[data-chronicle] #chronicle-body .eq-avatar .sp-hero[data-gender="女"]{background-image:url('./assets/formal-hero-female.webp')}
body[data-chronicle] #chronicle-body .eq-details .eq-item-description{margin:2px 0 0;font-size:11px;color:#526b65}
body[data-chronicle] #chronicle-body .eq-details .eq-branch{display:block;margin:4px 0;color:#356760;font-size:11px;font-weight:600}
#game .skill.weapon-focus{border-color:#a2e0dd;box-shadow:inset 0 0 0 2px #a2e0dd77,0 0 10px #a2e0dd55}
body[data-chronicle] #chronicle-body .eq-details .eq-runes>p{font-size:12px}

body[data-chronicle] #chronicle-body .relic-tradeoff{border-top:1px solid #94834f55;border-bottom:1px solid #94834f55;padding:10px 0;margin:10px 0}
body[data-chronicle] #chronicle-body .relic-tradeoff p{display:flex;gap:10px;margin:0 0 7px;color:#315b54}
body[data-chronicle] #chronicle-body .relic-tradeoff p:nth-child(2){color:#8a503d}
body[data-chronicle] #chronicle-body .relic-tradeoff b{flex:none;font-size:11px}
body[data-chronicle] #chronicle-body .relic-tradeoff small{display:block;color:#597165;font-size:11px;line-height:1.6}
body[data-chronicle] #chronicle-body .eq-relic-room .eq-details header>.sp-icon{width:100px;height:100px;flex:none}
@media(orientation:landscape) and (max-height:520px){body[data-chronicle] #chronicle-body .eq-relic-room .eq-details header>.sp-icon{width:68px;height:68px}}
@media(orientation:portrait) and (max-width:600px){body[data-chronicle] #chronicle-body .eq-relic-room .eq-details header>.sp-icon{width:95px;height:95px}.relic-tradeoff p{flex-wrap:wrap}}

@media(max-width:640px){body[data-chronicle] #chronicle-body .eq-tabs{display:grid;grid-template-columns:repeat(2,minmax(44px,1fr));gap:0}body[data-chronicle] #chronicle-body .eq-tabs button{min-width:44px}}

@media(orientation:landscape) and (max-width:640px){body[data-chronicle] #chronicle-body .eq-room{grid-template-columns:38% minmax(0,1fr)}body[data-chronicle] #chronicle-body .eq-tabs{display:flex}body[data-chronicle] #chronicle-body .eq-tabs button{flex:1;min-width:44px}}

body[data-chronicle] #chronicle-body .eq-receipt{min-height:18px;line-height:1.5;margin:4px 0 8px;color:#356760;font-size:11px;overflow-wrap:anywhere}
.eq-material-source{min-height:44px!important;margin:5px 0;padding:7px 10px;border:1px solid #a58d6099!important;background:#f0dfb6!important;color:#30433b!important;font-size:12px;line-height:1.4}