/* Cangjian manor UI: generated parchment, ginkgo fittings and illustrated sword seals. */
:root{--manor-dark:#53432d;--manor-gold:#c49a45;--manor-paper:#fff4d9;--manor-mint:#6f9580}
.codex-tabs button{display:flex;align-items:center;gap:7px}.codex-skill-icon{width:30px;height:30px;display:inline-block;background:var(--skill-art) center/contain no-repeat;flex:none}
.dialog{border:28px solid transparent;border-image:url('assets/battle/ui-panel.webp') 210 fill / 34px / 0 stretch;background:none;border-radius:28px;padding:25px 27px;box-shadow:0 16px 55px #3e3a324d;color:var(--manor-dark);isolation:isolate}
.dialog:before{display:none}.dialog h2{color:#635035;font-size:30px;letter-spacing:2px}.dialog .eyebrow{color:#9a7838;letter-spacing:4px}.dialog .sub{color:#847258}.dialog .footnote{color:#918168}.overlay{background:#4b513e7d;backdrop-filter:blur(6px)}
.loadout-dialog{width:min(1080px,96vw);padding:14px 22px 19px}.loadout-dialog h2{font-size:29px}.loadout-dialog .eyebrow{margin-bottom:10px}.loadout-dialog .sub{margin-bottom:14px}.loadout-groups{gap:22px}.loadout-groups h3{color:#705939;border-bottom:1px dashed #c7ad78;padding-bottom:10px;letter-spacing:1px}.loadout-groups h3 small{border:1px solid #c9ac6c;background:#f9e9b4;border-radius:9px;padding:3px 9px;margin-top:-2px;color:#9b752e}.loadout-card{background:#fff8e7;border:2px solid #baa579;border-radius:14px;box-shadow:0 3px 0 #d4ba8955;min-height:161px;padding:13px 12px}.loadout-card.picked{background:#fff0be;border:2px solid #b38b38;box-shadow:0 3px 0 #b18b48,inset 0 0 0 2px #fff9df}.loadout-card .glyph{float:left;margin:0 10px 9px 0;min-width:48px;width:48px;height:48px;font-size:0;border-radius:10px;background-color:transparent;padding:0}.loadout-card strong{font-size:16px;color:#5a4b32;margin-top:4px}.loadout-card em{color:#92794c;font-size:10px}.loadout-card p{color:#806f52;font-size:11px;line-height:1.65}.loadout-card small{font-size:10px;color:#9b804d}.pick-check{background:#5c7550;border:1px solid #47633b;color:#fff2c8;width:18px;height:18px;line-height:16px;top:6px;right:6px}.presets button{background:#eae8cd;border:1px solid #b8b994;color:#788165}.loadout-combos{background:#eee8cd;border:1px dashed #c8b685;border-left:4px solid #b89448;color:#827044}.loadout-combos b{color:#84662d}.loadout-combos span{color:#84795b}
.skill-icon,.loadout-card .glyph,.choice[data-art-skill] .glyph{background-image:var(--skill-art);background-repeat:no-repeat;background-position:center;background-size:100% 100%;display:block;flex:none;box-shadow:none;outline:none;border:0;border-radius:8px;color:transparent}
/* Repainted from original JX3 skill compositions; original artwork is reference only. */
[data-art-skill="hupao"]{--skill-art:url('assets/battle/skills/hupao.webp')}[data-art-skill="tinglei"]{--skill-art:url('assets/battle/skills/tinglei.webp')}[data-art-skill="duanchao"]{--skill-art:url('assets/battle/skills/duanchao.webp')}[data-art-skill="jiuxi"]{--skill-art:url('assets/battle/skills/jiuxi.webp')}[data-art-skill="fengche"]{--skill-art:url('assets/battle/skills/fengche.webp')}[data-art-skill="fengcha"]{--skill-art:url('assets/battle/skills/fengcha.webp')}[data-art-skill="yunfei"]{--skill-art:url('assets/battle/skills/yunfei.webp')}[data-art-skill="hegui"]{--skill-art:url('assets/battle/skills/hegui.webp')}
.primary{border:2px solid #8b6b32;border-radius:12px;background:linear-gradient(#f4d270,#eabd4e);color:#624923;box-shadow:0 5px 0 #b28a43,inset 0 0 0 2px #ffe7a3;font-weight:800;letter-spacing:1px}.primary:before{content:'';display:inline-block;width:10px;height:10px;margin-right:9px;background:#9d7427;clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%)}.secondary{background:#f6edcf;border-color:#bbaf84;box-shadow:0 3px 0 #d2c296;color:#7e7050;border-radius:12px}.primary:hover{background:#ffdb80;box-shadow:0 6px 0 #b28a43}.primary:active{box-shadow:0 2px 0 #b28a43}
.choice{border:2px solid #bca678;background:#fff6df;border-radius:14px;padding:22px 19px;color:#7d6f53}.choice:nth-child(2){background:#eff0d9;border-color:#a4b191}.choice:nth-child(3){background:#fae9d3;border-color:#c6a584}.choice .glyph{font-size:32px;color:#a9843b}.choice[data-art-skill] .glyph{width:62px;height:62px;font-size:0;margin-bottom:18px}.choice strong{font-weight:800;color:#695438}.choice .category{color:#937b51}.choice .rank{color:#977d54}.choice .mastery{color:#a4782d}.camp-choices .choice{background:#fff6df}.camp-choices [data-camp="heal"] .glyph{color:#618570}.camp-choices [data-camp="focus"] .glyph{color:#b18833}.camp-choices [data-camp="insight"] .glyph{color:#ad7f66}
.top-hud{padding:23px 25px;background:linear-gradient(#eee7c7aa,transparent)}.player-card{width:292px;gap:10px;background:#fff6deeb;border:2px solid #b0955c;border-radius:14px;box-shadow:0 4px 0 #86704426;padding:10px 12px}.player-seal{width:54px;height:54px;border-radius:12px;border:2px solid #a28a53;background:#e5c46e url('assets/battle/hero-light.webp') 45% 42% / 145% no-repeat;font-size:0;color:transparent}.name-line strong{color:#665333;font-size:15px}.name-line>span{color:#a27a32}.bar{border-color:#aa9870;background:#dbceb0;box-shadow:inset 0 1px 2px #746b4d2c}.hp i{background:linear-gradient(#a1c786,#83ab70)}.bar>span{color:#3d5836}.qi i{background:linear-gradient(#f8d86a,#dab14e)}.qi-line{color:#8c733c}.journey{background:#fff3d8ed;border:2px solid #a88d59;border-top:0;border-radius:0 0 20px 20px;padding:12px 24px;margin-top:-23px;box-shadow:0 4px 0 #8e795633}.journey small{color:#8c723f}.journey strong{color:#665638;font-size:24px}.journey>span{color:#96825d}.hud-actions button{background:#efcf77;border:2px solid #ae8c4f;color:#7c622e;box-shadow:0 3px 0 #b3955955}.kill-count{background:#fff6dfdd;border:1px solid #c0ac79;color:#917540;border-radius:10px}.kill-count b{color:#7c5e31}.xp-track{height:5px;background:#d9cbb1}.xp-track>i{background:#bb9853}.stage-track{background:#d7debd66}.stage-track>i{background:#94ac80}
.build{background:#fff4d6e8;border:1.5px solid #bfa776;border-radius:10px;padding:12px;box-shadow:0 3px 0 #af97632b;color:#846b3c}.build p{border-bottom:1px dashed #cbb882;letter-spacing:2px;color:#907039}.build .empty-build{color:#9d8a63}.build .badge{color:#8b7447;background:#f9eabf;border:1px solid #c8ad6f}.build .badge.mastered{background:#efd38a;border-color:#ac8338;color:#745a2d}.boss-hud{top:120px}.boss-hud>div:first-child{color:#9b583c;text-shadow:0 1px #fff0cd}.boss{border:1.5px solid #a57753;height:9px;background:#efddbd}.boss i{background:linear-gradient(#ebad73,#d68b58)}.boss-hud small{color:#9b7550}
.bottom-hud{bottom:max(23px,env(safe-area-inset-bottom));left:25px;right:25px}.skills{gap:11px;background:#fff1ccbf;border:1px solid #c5ae72;border-radius:18px;padding:9px;box-shadow:0 4px 0 #b59a5e33}.skill{min-height:84px;box-shadow:0 3px 0 #ac8f514d;border:2px solid #b09a66;border-radius:12px;color:#695633;background:#fbefc9}.skill.ultimate{width:174px;background:#fff1c7;border-color:#b49652;padding:12px 9px 10px 65px;text-align:left}.skill-icon{position:absolute;left:9px;top:15px;width:48px;height:48px}.skill strong{color:#74572c;font-size:15px}.skill small{color:#978052;font-size:9px}.skill kbd{color:#87704a;background:#fff9e1;z-index:1;border:1px solid #c9b47b}.skill.utility{background:#efeacb;width:101px;padding:12px 7px}.skill.utility strong{font-size:13px}.skill>i{height:4px;background:#b29448}.skill.proc-ready{border-color:#f1be43;box-shadow:0 0 0 2px #fff5bf,0 0 17px #e3ae4977}.skill.unready{filter:saturate(.65);opacity:.76}.skill.queued:after{background:#f7efcfed;color:#91713a}
.stance{background:#fff1cde6;border:2px solid #baa06b;border-radius:15px;box-shadow:0 4px 0 #ae92523d;padding:12px}.stance>span{background:#d7b76d;border:2px solid #8a7545;color:#725627;border-radius:11px;font-size:24px;font-weight:800}.stance strong{color:#796032;letter-spacing:1px}.stance small{color:#97845a}.combat-note{bottom:144px;color:#8b7850;background:#fff6d9ed;border:1px solid #d5bf8f;font-size:10px;text-shadow:none}.target-info{bottom:174px;background:#eceecfe8;border:1px solid #b3bc8a;color:#697b4c}.combo-hint.active{background:#fff1bded;border:1.5px solid #ad8d45;color:#927133;box-shadow:0 3px 0 #bea76d44;top:171px}.cast-bar{border-color:#a3833e;background:#efe3bb}.cast-bar span{color:#81652f}.cast-bar i{background:#d6ad3e}.toast{background:#fff3d5f5;border:2px solid #b49958;color:#846837;box-shadow:0 4px 0 #8a73452e}.joystick{background:#fff0c677;border:2px solid #b29c6388;box-shadow:inset 0 0 0 6px #fffae333,0 3px 0 #98834d22}.joystick>div{background:#d0b678bf;border:2px solid #fff4cc;box-shadow:0 2px 5px #75663c33}.joystick>span{color:#8f7643}
@media(max-width:1100px) and (min-width:761px){.stance small{display:none}.skill.ultimate{width:151px}.skill.utility{width:88px}.bottom-hud{left:16px;right:16px}.skills{gap:7px}}
@media(max-width:760px){
  .dialog{border-width:20px;border-image-width:27px;padding:18px 10px;max-height:92dvh;width:100%;border-radius:18px}.dialog h2{font-size:24px}.dialog .sub{font-size:11px;line-height:1.7}.dialog .eyebrow{font-size:9px;letter-spacing:2px}.loadout-dialog{padding:14px 8px}.loadout-dialog h2{font-size:23px}.loadout-groups{gap:3px}.loadout-groups h3{font-size:16px;margin:13px 0 10px;padding-bottom:8px}.loadout-groups h3 small{font-size:10px;padding:2px 7px}.loadout-cards{gap:8px}.loadout-card{min-height:182px;padding:10px 9px}.loadout-card .glyph{width:37px;height:37px;min-width:37px;float:none;margin-bottom:7px}.loadout-card strong{font-size:14px;margin-top:0}.loadout-card em{font-size:9px;line-height:1.5}.loadout-card p{font-size:10px;margin:8px 0;line-height:1.65}.loadout-card small{font-size:8px}.presets{gap:5px}.presets button{font-size:8px;padding:7px}.loadout-dialog .dialog-actions{gap:10px}.loadout-dialog .primary{min-width:160px}.primary:before{font-size:10px;margin-right:5px}.choice{padding:16px 11px 14px 71px;min-height:117px}.choice[data-art-skill] .glyph{position:absolute;left:13px;top:22px;width:46px;height:46px;margin:0}.choice .category{right:9px;top:8px;font-size:8px}.choice strong{font-size:17px}.choice p{font-size:11px}.choice .rank{font-size:9px}.choice .mastery{font-size:9px}.help-grid{grid-template-columns:1fr}.help-grid strong{font-size:16px}.help-grid p{font-size:11px}.result-stats{gap:18px}.result-stats strong{font-size:23px}.result-stats span{font-size:10px}
  .top-hud{padding:13px 10px;gap:5px}.player-card{width:173px;gap:6px;padding:8px;border-radius:12px}.player-seal{width:34px;height:41px;min-width:34px;background-size:173%;background-position:46% 36%;border-radius:9px}.name-line strong{font-size:12px;letter-spacing:0}.name-line>span{font-size:8px}.journey{margin-top:-13px;padding:9px 9px;max-width:110px;border-width:1.5px}.journey small{font-size:9px;letter-spacing:0}.journey strong{font-size:20px}.journey>span{font-size:8px}.hud-actions{width:45px}.hud-actions button{padding:6px 10px;font-size:13px}.kill-count{font-size:8px;padding:4px}.build{top:112px;left:11px;width:108px;padding:9px}.build p{font-size:9px}.build .empty-build{font-size:8px}.build .badge{font-size:8px}.boss-hud{top:110px;right:10px;width:52vw}.boss-hud>div:first-child{font-size:11px}.boss-hud small{font-size:7px}.combo-hint.active{top:173px;font-size:10px;padding:8px 10px;max-width:94vw;white-space:normal;text-align:center}
  .bottom-hud{right:10px;left:auto;bottom:max(17px,env(safe-area-inset-bottom))}.skills{grid-template-columns:82px 82px;gap:7px;padding:7px;border-radius:16px}.skill.utility{width:82px;min-height:43px;padding:7px 3px 5px}.skill.ultimate{width:82px;min-height:91px;padding:47px 3px 5px;text-align:center}.skill-icon{left:23px;top:6px;width:35px;height:35px;border-radius:7px}.skill.ultimate strong{font-size:12px;letter-spacing:0}.skill.ultimate small{font-size:8px;line-height:1.4;margin-top:4px}.skill.utility strong{font-size:11px}.skill.utility small{font-size:8px}.skill kbd{font-size:7px}.combat-note{bottom:190px;font-size:8px;padding:6px 10px;white-space:normal;width:max-content;max-width:90%;text-align:center}.target-info{bottom:222px;font-size:9px}.joystick{bottom:max(44px,calc(env(safe-area-inset-bottom) + 26px));left:18px;width:100px;height:100px}.joystick>div{left:27px;top:27px}.joystick>span{font-size:9px}
}
@media(max-width:360px){.top-hud{padding-left:7px;padding-right:7px;gap:3px}.player-card{width:157px;padding:6px;gap:5px}.player-seal{width:28px;min-width:28px;height:36px}.journey{max-width:96px;padding:8px 7px}.journey small{font-size:8px}.journey>span{max-width:80px;font-size:7px}.hud-actions{width:36px}.hud-actions button{padding:6px 8px}.skill.utility,.skill.ultimate{width:75px}.skills{grid-template-columns:75px 75px;gap:6px;padding:6px}.skill-icon{left:19px}.joystick{width:88px;height:88px;left:14px}.joystick>div{left:21px;top:21px}.loadout-card{padding:10px 7px;min-height:198px}.loadout-card strong{font-size:13px}.dialog .primary{min-width:145px}.loadout-groups h3{font-size:14px}}
@media(max-height:500px){.top-hud{padding-top:10px}.journey{margin-top:-10px}.build{top:102px}.bottom-hud{bottom:12px;right:14px}.skills{display:flex;padding:6px;gap:7px}.skill.utility{width:79px;min-height:58px}.skill.ultimate{width:130px;min-height:58px;padding:10px 5px 8px 48px}.skill-icon{left:7px;top:10px;width:34px;height:34px}.skill strong,.skill.ultimate strong{font-size:12px}.skill small{font-size:8px}.stance{display:none}.combat-note{bottom:91px}.target-info{bottom:120px}.combo-hint.active{top:130px}.boss-hud{top:101px}.choice{min-height:190px;padding:15px}.choice[data-art-skill] .glyph{position:static;width:44px;height:44px;margin-bottom:10px}.dialog{padding:17px}.loadout-card{min-height:164px}.loadout-cards{gap:8px}.loadout-groups{grid-template-columns:1fr 1fr}.joystick{bottom:28px}}
@media(prefers-reduced-motion:reduce){.skill,.choice,.primary{transition:none}}