:root{color-scheme:dark;--bg:#0c181c;--panel:#132429;--ink:#e8e5d5;--muted:#91a6a4;--line:#304448;--gold:#dab477;--blue:#91d4e0;--red:#dd8b72}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.65 "Microsoft YaHei","PingFang SC",sans-serif}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);background:#15272d;border-radius:4px;transition:border-color .15s,background .15s}button:hover{border-color:var(--gold);background:#26363a}button:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{cursor:default;opacity:.42}button:disabled:hover{border-color:var(--line);background:#15272d}button,kbd{user-select:none}button:active{transform:translateY(1px)}[hidden]{display:none!important}h1,h2,h3,p{margin:0}small{font-size:11px}kbd{font:10px/1.6 inherit;padding:1px 5px;color:#bbcbc8;background:#08171c;border:1px solid #385057;border-radius:3px}.ambient{position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 25% 0%,#2b47454d,transparent 60%),radial-gradient(ellipse at 92% 80%,#23353266,transparent 50%)}.shell{max-width:1540px;margin:auto;padding:0 35px 22px}.topbar{height:100px;display:flex;align-items:center;gap:55px;border-bottom:1px solid var(--line);margin-bottom:24px}.brand{display:flex;align-items:center;gap:12px;min-width:170px}.brand-mark{display:grid;place-items:center;width:40px;height:44px;color:#e3b77b;border:1px solid #a48253;clip-path:polygon(50% 0,100% 20%,100% 80%,50% 100%,0 80%,0 20%);background:#2b3028;font:22px Georgia,serif}.brand strong{font-size:19px;letter-spacing:4px}.brand small{display:block;letter-spacing:3px;color:var(--muted);font-size:9px}.chapter-heading h1{font-size:19px;font-weight:500;letter-spacing:2px;line-height:1.6}.chapter-heading h1 i{font-style:normal;color:var(--gold);margin:0 4px}.eyebrow{color:var(--gold);font-size:10px;letter-spacing:3px}.chapter-heading .eyebrow{font-size:8px}.topbar nav{margin-left:auto;display:flex;gap:9px;align-items:center}.topbar nav button{padding:8px 13px;font-size:11px}.topbar .map-button{border-color:#7b6a4d;color:#e7c696}.topbar kbd{margin-left:8px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 255px;gap:22px}.play-column{min-width:0}.location-bar{height:34px;display:flex;justify-content:space-between;align-items:start;font-size:11px;color:var(--muted)}.location-bar>span:first-child{display:flex;align-items:center;gap:11px}.location-bar strong{font-size:12px;color:var(--ink);font-weight:500}.live-dot{display:inline-block;width:5px;height:5px;background:var(--gold);box-shadow:0 0 8px #dab47766}.arena-wrap{position:relative;border:1px solid #57706a;background:#132426;box-shadow:0 15px 40px #0005;aspect-ratio:680/384;overflow:hidden}#game{display:block;width:100%;height:100%;image-rendering:pixelated;outline:none;cursor:crosshair;touch-action:none}.arena-wrap:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 30px #081a2422;pointer-events:none}.room-banner{position:absolute;top:17px;left:20px;pointer-events:none;text-shadow:0 2px 4px #000;color:#fff1d2}.room-banner strong{font-size:18px;font-weight:500;letter-spacing:3px;display:block}.room-banner small{color:#e0d9bc;font-size:10px}.toast{position:absolute;top:85px;left:50%;transform:translateX(-50%);white-space:nowrap;max-width:95%;padding:6px 17px;background:#10262be8;border:1px solid #788771;border-radius:3px;opacity:0;transition:opacity .25s;font-size:12px;pointer-events:none}.toast.show{opacity:1}.interact-hint{position:absolute;bottom:17px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#0f2027ed;border:1px solid #8c7958;padding:6px 15px;border-radius:4px;font-size:12px;display:none}.interact-hint.active{display:block}.boss-bar{position:absolute;top:17px;left:24%;right:24%;text-shadow:0 2px #000;font-size:12px}.boss-bar>div:first-child{display:flex;justify-content:space-between;margin-bottom:5px}.boss-bar small{font-size:9px;color:#d2b0e3}.bar{height:6px;background:#07151a;border:1px solid #435050;overflow:hidden}.bar i{display:block;height:100%;width:100%;transition:width .1s;background:#b2c08f}.bar.boss{height:7px;border-color:#977caf}.bar.boss i{background:linear-gradient(90deg,#88679b,#c49bd4)}.bar.ally i{background:#87c6d1}.pause-badge{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#091a22b5;font-size:27px;letter-spacing:5px;backdrop-filter:blur(2px)}.pause-badge span{font-size:12px;letter-spacing:1px;margin-top:10px}.action-deck{display:flex;align-items:center;gap:17px;padding:18px 0 12px;border-bottom:1px solid var(--line)}.player-card{display:flex;gap:11px;align-items:center;flex:1;min-width:200px}.portrait{width:57px;height:58px;background:linear-gradient(135deg,#42332e,#243239);border:1px solid #79614b;overflow:hidden}.portrait canvas{width:64px;height:64px;image-rendering:pixelated}.player-card>div:last-child{flex:1}.hero-line{display:flex;align-items:center;gap:9px;margin-bottom:7px}.hero-line b{font-size:17px;font-weight:500}.hero-line span{font-size:10px;color:var(--gold)}.hero-line small{margin-left:auto;font-size:9px;color:var(--muted)}.movement{display:block;margin-top:5px;color:var(--muted);font-size:9px}.skill-row{display:flex;gap:6px}.skill{position:relative;width:60px;height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;overflow:hidden;background:#15292e}.skill kbd{position:absolute;top:3px;left:4px;border:0;padding:0;font-size:8px;background:none;color:#9ba9a3}.skill b{font-size:13px;font-weight:500;margin-top:8px}.skill span{font-size:8px;color:#98aba6}.skill.fire b{color:#ecc19c}.skill.green b{color:#bdcca7}.skill i{position:absolute;bottom:0;left:0;width:100%;height:0;background:#0b131bbb;pointer-events:none}.skill .cooldown-number{position:absolute;inset:0;display:grid;place-items:center;font-size:15px;color:#f4dfc0;background:#081a2670}.play-footer{display:flex;justify-content:space-between;color:#7f9795;font-size:9px;padding-top:10px;gap:10px}.play-footer em{font-style:normal;color:#415959;margin:0 5px}.play-footer kbd{font-size:8px}.sidebar{padding-top:34px;display:flex;flex-direction:column;gap:12px}.panel{padding:15px;background:linear-gradient(120deg,#172b2f,#122329);border:1px solid #30464a;border-radius:4px}.section-label{font-size:10px;color:var(--gold);letter-spacing:1.5px;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.section-label span{font-size:8px;color:var(--muted);letter-spacing:1px}.mission-panel h2{font-size:16px;font-weight:500;margin-bottom:8px}.mission-panel p{color:#a9b9b4;font-size:11px;line-height:1.9;min-height:39px}.objective-state{margin-top:12px;padding-top:10px;border-top:1px solid #2e4546;font-size:10px;color:#b9b894}.next-button{padding:7px 10px;width:100%;text-align:left;margin-top:11px;background:#3b3d2b;border-color:#7c7553;font-size:11px;color:#e0d7aa}.next-button span{float:right}.minimap-panel{padding-bottom:11px}#minimap{display:block;width:100%;height:auto;image-rendering:pixelated;border:1px solid #3c5356;background:#102024}.map-legend{display:flex;gap:13px;justify-content:center;margin-top:7px;color:#8ca3a1;font-size:8px}.map-legend span:before{content:"";display:inline-block;width:4px;height:4px;background:var(--gold);margin-right:5px}.map-legend .blue-dot:before{background:var(--blue)}.map-legend .red-dot:before{background:var(--red)}.companion-head{display:flex;gap:8px;align-items:center}.companion-head canvas{image-rendering:pixelated;width:42px;height:42px;border:1px solid #47616a;background:#1d353f}.companion-head>div{flex:1}.companion-head h2{font-size:15px;font-weight:500;margin-bottom:7px}.companion-head h2 small{font-size:9px;margin-left:10px;color:#9eb9bd}.ally-intent{font-size:11px;color:#b6d3d6;border-left:2px solid #568c9a;padding-left:9px;margin:13px 0;min-height:36px;line-height:1.8}.command-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.command-grid button{font-size:10px;padding:5px;display:flex;gap:12px;align-items:center}.command-grid kbd{font-size:8px}.command-grid .active{background:#23444b;border-color:#719aa0;color:#d5e7e5}.memory{margin-top:11px;color:#849c9b;font-size:9px;line-height:1.8}.memory.learned{color:#c4d59e}.chapter-strip{display:flex;gap:20px;align-items:center;margin-top:20px;padding:13px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:10px;color:var(--muted)}.chapter-strip>span{color:var(--gold);letter-spacing:2px;white-space:nowrap}.chapter-strip>small{margin-left:auto;white-space:nowrap;font-size:9px}#route-strip{display:flex;gap:6px;align-items:center;flex-wrap:wrap}#route-strip button{background:transparent;border:0;padding:3px 6px;color:#839894;font-size:10px}#route-strip button.current{color:#efd1a1;background:#2f3c33}#route-strip button.done{color:#aac3a1}#route-strip .route-arrow{color:#3d5558;font-size:10px}.build-note{color:#5f797a;font-size:9px;margin-top:12px;text-align:center}.overlay{position:fixed;inset:0;background:#132b2b;z-index:30;overflow:auto}.intro-art{position:absolute;inset:0;background-position:center;background-size:cover;image-rendering:pixelated;opacity:.8}.intro-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0a1b21fa 0%,#0c2328ed 28%,#10272b90 58%,#0e212650),linear-gradient(0deg,#081c22e8,transparent 60%)}.intro-content{position:relative;max-width:600px;margin:10vh 0 80px 10vw}.intro-kicker{color:#b8c7bc;margin-top:35px;font-size:13px;letter-spacing:3px}.intro-content h2{font-family:"STSong","SimSun",serif;font-size:45px;font-weight:400;letter-spacing:13px;margin:10px 0 25px;color:#d3dfd6}.intro-content h2 span{display:block;font-size:88px;line-height:1.2;color:#efd6a5;letter-spacing:18px;margin-top:8px;text-shadow:0 5px 35px #050f16}.intro-content>p:not(.intro-kicker){color:#a9c1bb;font-size:13px;line-height:2.2;letter-spacing:1px}.intro-tags{display:flex;gap:10px;margin:25px 0;color:#a9bcb4;font-size:10px}.intro-tags span{padding:2px 9px;border:1px solid #445a52;background:#152c2c70}.primary{padding:13px 27px;background:#c7a572;color:#142329;border:1px solid #e2c292;font-size:14px;letter-spacing:1px;box-shadow:0 8px 25px #0002}.primary:hover{background:#dfbd88;border-color:#f3dab2}.primary span{margin-left:40px}.text-button{display:block;border:0;background:transparent;font-size:11px;color:#9fb8b5;padding:10px 0}.text-button:hover{background:transparent}.intro-content>small{display:block;color:#849c97;font-size:10px;margin-top:12px}.intro-bottom{position:absolute;bottom:30px;left:10vw;right:7vw;display:flex;justify-content:space-between;color:#b1bda7;font-size:10px;letter-spacing:2px}.modal-backdrop{position:fixed;inset:0;background:#04151bdd;backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;padding:25px;z-index:40;overflow:auto}.modal{background:#13272d;border:1px solid #5a6d62;box-shadow:0 20px 100px #0008;border-radius:6px;padding:30px;max-height:94vh;overflow:auto;width:780px}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.modal-head h2{font-size:25px;font-weight:500;letter-spacing:2px}.modal-head>button{font-size:18px;border:0;background:transparent;padding:8px}.modal>p{color:#9bb2ad;font-size:12px}.map-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:22px 0}.map-card{padding:0;text-align:left;overflow:hidden;position:relative;border-radius:3px}.map-card img{width:100%;display:block;aspect-ratio:680/384;object-fit:cover;image-rendering:pixelated}.map-card .card-copy{display:block;padding:9px 12px}.map-card b{font-size:13px;font-weight:500}.map-card small{display:block;color:#abc0b9;font-size:9px;margin-top:3px}.map-card.current{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}.map-card .map-status{position:absolute;top:7px;right:7px;background:#10272ee8;border:1px solid #7d8967;padding:1px 6px;color:#dfdfb5;font-size:8px}.route-summary{font-size:12px;color:#d0c7a2;line-height:2}.route-summary span{display:block;font-size:11px;color:#8ca9a7}.modal-foot{font-size:10px!important;margin-top:13px}.help-columns{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:24px}.help-columns h3{font-size:14px;color:var(--gold);font-weight:500;margin-bottom:13px}.help-columns p{color:#b6c8c2;font-size:12px;margin-bottom:10px;line-height:1.9}.help-note{padding:15px 0;border-top:1px solid var(--line);margin-top:15px;margin-bottom:15px}.result-modal{width:580px;text-align:center;padding:40px}.result-modal h2{font-family:"STSong","SimSun",serif;font-size:43px;font-weight:400;letter-spacing:6px;color:#eddbb4;margin:14px 0}.result-modal p{line-height:2}.result-stats{display:flex;justify-content:center;gap:35px;margin:25px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0}.result-stats b{display:block;font-size:27px;font-weight:400;color:#d2dcb4}.result-stats small{font-size:10px;color:#8ca7a7}.result-memory{font-size:12px;color:#a8c8bf!important;margin-bottom:23px}.result-modal .primary{width:100%}.result-modal .text-button{margin:auto}
@media(min-width:1550px){.shell{padding-top:10px}.topbar{margin-bottom:30px}.game-layout{grid-template-columns:minmax(0,1fr) 275px}.panel{padding:17px}.sidebar{gap:17px}.skill{width:67px}.action-deck{gap:25px}.player-card{max-width:375px}.skill-row{margin-left:auto}.mission-panel p{font-size:12px}.companion-panel{margin-top:auto}}
@media(max-width:1100px){.shell{padding:0 18px 20px}.topbar{gap:20px;height:82px}.game-layout{grid-template-columns:minmax(0,1fr) 220px;gap:15px}.panel{padding:11px}.sidebar{gap:9px}.skill{width:49px;height:55px}.skill b{font-size:11px}.skill span{font-size:7px}.player-card{min-width:165px;gap:7px}.portrait{width:43px;height:50px}.hero-line span{display:none}.action-deck{gap:9px}.companion-panel .section-label{margin-bottom:5px}.ally-intent{margin:8px 0}.movement{font-size:8px}.chapter-strip{gap:10px}.topbar nav button{padding:6px 8px}.topbar kbd{display:none}.chapter-heading h1{font-size:16px}.topbar .brand{min-width:150px}}
@media(max-width:850px){.topbar{gap:16px;flex-wrap:wrap;height:auto;padding:16px 0;margin-bottom:17px}.chapter-heading{margin-left:auto}.topbar nav{width:100%;justify-content:flex-end}.brand strong{font-size:17px}.game-layout{display:flex;flex-direction:column}.sidebar{display:grid;grid-template-columns:1fr 1fr;padding-top:0}.companion-panel{grid-column:2;grid-row:1/3}.minimap-panel{display:none}.skill{width:55px}.play-footer>span:first-child{display:none}.play-footer{justify-content:center}.chapter-strip{flex-wrap:wrap}.chapter-strip>small{display:none}.intro-content{margin-left:7vw;margin-top:9vh}.intro-content h2{font-size:33px}.intro-content h2 span{font-size:65px}.intro-bottom{left:7vw;right:7vw;font-size:8px}.intro-bottom>span:last-child{display:none}.map-cards{gap:8px}.modal{padding:20px}.map-card .card-copy{padding:7px}.map-card b{font-size:11px}.map-card small{font-size:8px}.help-columns{gap:15px}.action-deck{gap:9px}.player-card{min-width:140px}.movement{display:none}}
@media(max-width:580px){.shell{padding:0 10px 15px}.action-deck{flex-wrap:wrap}.player-card{width:100%}.skill-row{width:100%;justify-content:space-between}.skill{width:18%}.sidebar{grid-template-columns:1fr}.companion-panel{grid-column:auto;grid-row:auto}.map-cards{grid-template-columns:1fr 1fr}.help-columns{grid-template-columns:1fr}.modal-head h2{font-size:20px}.room-banner strong{font-size:12px}.room-banner small{font-size:8px}.room-banner{top:9px;left:10px}.interact-hint{font-size:9px;bottom:8px}.boss-bar{top:8px;left:28%;right:10%;font-size:9px}.toast{top:54px;font-size:9px}.chapter-heading h1{font-size:13px}.intro-content h2 span{font-size:56px}.intro-content h2{font-size:30px}.intro-tags{font-size:9px;gap:5px}.intro-content{margin-top:8vh}.intro-kicker{font-size:10px}.intro-content>p:not(.intro-kicker){font-size:11px}.modal-backdrop{padding:12px}.result-modal{padding:25px}.result-modal h2{font-size:34px}}
.map-caption{display:block;font-size:9px;color:var(--muted);margin-top:6px}

.preview-strip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0;color:var(--muted);font-size:11px}.preview-strip button{padding:7px 12px}.preview-strip #preview-exit{margin-left:auto;color:var(--gold)}.intro-preview{position:absolute;right:8vw;bottom:16vh;width:220px;display:grid;gap:10px;background:#10252bea;padding:20px;border:1px solid #6b7256;box-shadow:0 15px 50px #0005}.intro-preview>span{font-size:11px;color:var(--gold);letter-spacing:2px;margin-bottom:5px}.intro-preview button{padding:12px 10px;font-size:12px;text-align:left}@media(max-width:850px){.intro-preview{right:5vw;width:190px;bottom:12vh}}@media(max-width:580px){.intro-preview{position:relative;right:auto;bottom:auto;width:auto;margin:20px 7vw 70px;grid-template-columns:1fr 1fr;padding:12px}.intro-preview>span{grid-column:1/-1}.overlay#intro{overflow:auto}.intro-preview button{padding:8px;font-size:10px}.intro-bottom{position:fixed;background:#10252b;padding:5px}.intro-content{margin-top:4vh}}

/* The same dark timber / warm brass palette as the equipment workspace. */
#help-modal .traveler-help{width:min(920px,94vw);max-width:920px;height:min(760px,90dvh);max-height:90dvh;display:flex;flex-direction:column;gap:16px;padding:28px;background-color:#14272d;color:#d4dacc;text-align:left}
#help-modal .modal-head{display:flex;align-items:center;justify-content:space-between;flex:none}
#help-modal h2{margin:0;color:#f0d69e}#help-modal h3{font-size:20px;margin:6px 0 14px;color:#e9cb92}
#help-tabs{display:flex;gap:8px;flex-wrap:wrap;flex:none;border-bottom:1px solid #8d795448;padding-bottom:14px}
#help-tabs button{padding:8px 13px;color:#c6d6d2;background:#1b333a;border:1px solid #72827b;cursor:pointer}
#help-tabs button[aria-pressed=true]{background:#c6ac72;color:#16252b;border-color:#ead3a1}
#help-content{min-height:0;flex:1;overflow:auto;padding:6px 14px 16px 2px;font-size:15px;line-height:1.85;scrollbar-color:#9b865c #12232a}
#help-content p{font-size:inherit;color:inherit;line-height:inherit;margin:10px 0 18px}
#help-content details{margin:14px 0;padding:12px 16px;border:1px solid #69817b55;background:#0b1d2455}
#help-content summary{cursor:pointer;color:#d9c599;font-size:16px}
.help-quality{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0}.help-quality span{border:1px solid currentColor;padding:8px 15px}.help-quality b{display:block;font-size:12px;font-weight:normal}
.help-definitions{display:grid;grid-template-columns:130px 1fr;gap:12px 16px}.help-definitions dt{color:#e0c393}.help-definitions dd{margin:0}
.help-affixes{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin:15px 0}.help-affixes>div{padding:10px 0;border-bottom:1px solid #71867c33}.help-affixes b,.help-affixes span,.help-affixes small{display:block}.help-affixes b{color:#ead4ac}.help-affixes small{color:#91aaa8;font-size:12px}
.help-keys{display:grid;grid-template-columns:1fr 1fr;gap:12px}.help-keys kbd{display:inline-block;min-width:65px;margin-right:8px;color:#ead3a1}
#help-modal footer{display:flex;align-items:center;justify-content:space-between;flex:none;border-top:1px solid #8d795448;padding-top:12px}#help-modal footer span{color:#8ea6a3;font-size:13px}#help-modal footer button{padding:8px 28px}
button.help-link{font-size:12px;padding:3px 9px;color:#d9c18d;border:1px solid #7d795d;background:#172c32;cursor:pointer}#bag-stats h4 .help-link{float:right}
.item-story{color:#a6b8b2;font-size:12px;margin:12px 0}.item-story summary{cursor:pointer}
@media(max-width:600px){#help-modal .traveler-help{padding:18px;gap:12px}.help-definitions{grid-template-columns:1fr;gap:4px}.help-definitions dd{margin-bottom:12px}.help-affixes,.help-keys{grid-template-columns:1fr}#help-tabs button{padding:6px 9px}}

.collection-new-filter{display:flex;gap:14px;align-items:center;margin:14px 0}.collection-new-filter button[aria-pressed=true]{background:#b69b65;color:#10242a}.collection-new-filter span{color:#b6c2b8;font-size:12px}

#equipment-button,#character-equipment-button{display:inline-flex!important;color:#f0d9a8;border:1px solid #ab8c52;background:#263c3b;white-space:nowrap}
/* Item instances, equipment requirements and shared adventure progression. */
#gear-progression{margin:0 0 12px;padding:10px 12px;background:#101e24;border:1px solid #615c46;font-size:11px}#gear-progression>div{display:flex;justify-content:space-between;gap:8px;color:#e4c58b}#gear-progression progress{display:block;width:100%;height:6px;margin:9px 0;accent-color:#cba768}#gear-progression small{color:#9eadab;font-size:10px}
#game-root #inventory-panel #bag-detail{max-height:46%;scrollbar-width:thin;scrollbar-color:#aa936f #171b24}#game-root #inventory-panel #bag-detail .requirement-locked,#game-root #inventory-panel .bag-item .requirement-locked{color:#e7a396}
#game-root .gear-set{margin:10px 0;padding:10px 12px;background:#152c29;border:1px solid #587b63;font-size:11px}#game-root .gear-set>b{color:#b5d8a4}#game-root .gear-set p.active{color:#b5d8a4}#game-root .gear-set p.inactive{color:#9aaba6}#game-root .gear-set p{margin:5px 0;font-size:11px}
#bag-detail .item-stat-block{padding:10px;background:#151d22;border-left:2px solid #9f8c63}#bag-detail .item-stat-block small{color:#b7a177}#bag-detail .gear-affixes{padding-left:16px;margin:4px 0;color:#90c4dc}#bag-detail .gear-compare{line-height:1.8}
#bag-action{flex-shrink:0;display:flex;gap:8px;align-items:center;padding-top:8px}#bag-action:empty{display:none}#bag-action>button{flex:1;font-size:12px}#bag-action label{font-size:10px;white-space:nowrap}#bag-action select{font-size:10px;padding:5px}
@media(min-width:701px) and (max-height:850px){#game-root #equipment-modal.gear-workspace .gear-panel{height:calc(100dvh - 126px)}#game-root #equipment-modal .character-panel>header{min-height:50px;padding:7px 14px}#game-root #equipment-modal #character-panel #gear-name{margin:6px 0}#game-root #equipment-modal #character-panel #gear-name h3{font-size:22px}#game-root #equipment-modal #character-panel #gear-progression{padding:6px 9px;margin-bottom:7px}#game-root #equipment-modal #character-panel #gear-progression small{display:none}#game-root #equipment-modal #character-panel #gear-progression progress{margin:5px 0;height:4px}#game-root #equipment-modal #character-panel .gear-model-wrap{min-height:235px}#game-root #equipment-modal #character-panel .gear-model-wrap canvas{max-height:228px;width:auto;max-width:100%}#game-root #equipment-modal #character-panel .gear-slot>button:first-child{min-height:41px;height:41px;padding:4px}#game-root #equipment-modal #character-panel .gear-slots{gap:4px}#game-root #equipment-modal #character-panel #bag-roster img{height:25px;width:27px}#game-root #equipment-modal #inventory-panel #bag-detail{min-height:130px;max-height:42%}}
#game-root #inventory-panel .bag-item.legendary::after{background:#edbe62}.gear-slot .legendary{border-bottom:2px solid #edbe62!important}#game-root .quality-legendary :is(h3,b,small){color:#edbe62}#game-root .quality-epic :is(h3,b,small){color:#d0a3ee}#game-root .quality-rare :is(h3,b,small){color:#91c4eb}#game-root .quality-fine :is(h3,b,small){color:#9acaa7}#clear-loot-equipment small{display:block;font-size:10px;margin-top:3px}
#game-root #equipment-modal #inventory-panel .bag-storage{min-height:70px;flex:1 1 140px}#game-root #equipment-modal #inventory-panel #bag-detail{flex:1.2 1 180px;min-height:100px;max-height:47%;margin-top:8px}#game-root #equipment-modal #inventory-panel #bag-action{min-height:34px;padding-top:6px}
#equipment-modal.gear-workspace{z-index:110;display:block;padding:0;background:#04121755;backdrop-filter:none;overflow:auto;color:#e5dcc7}#equipment-modal[hidden],.gear-panel[hidden]{display:none!important}
.bag-secondary-filters,.craft-controls{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:8px 0;font-size:11px;color:#d5c29c}.bag-secondary-filters select,.craft-controls select{padding:5px!important;max-width:100%}.bag-secondary-filters input{accent-color:#d9b16e}.bag-item.limited,.gear-slot .limited{border-bottom-color:#f2a5a0!important;box-shadow:inset 0 0 0 1px #a06e67!important}.limited h3,.item-heading.limited small,.quality-legend .limited{color:#f3b9a5!important}.gear-affinity{color:#dfc385!important}.collection-dialog{max-width:1050px!important;width:94vw!important;max-height:88dvh;display:flex;flex-direction:column;overflow:hidden!important}.collection-scroll{overflow:auto;padding:20px;min-height:0;color:#b7c6c1;font-size:13px}.collection-dialog footer{font-size:11px;padding:12px 20px;border-top:1px solid #7b6950;color:#d5c29c}.quality-legend{display:flex;flex-wrap:wrap;gap:8px}.quality-legend span{padding:6px 9px;border:1px solid currentColor;font-size:11px}.quality-common{color:#bec8c4}.quality-fine{color:#9ccdaf}.quality-rare{color:#8fbde5}.quality-epic{color:#d1a3ea}.quality-legendary{color:#edbe62}#collection-roster{display:flex;flex-wrap:wrap;gap:6px;margin:18px 0}#collection-roster [aria-pressed=true]{background:#4b4936;border-color:#dbb67a}#collection-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.collection-card{min-width:0;padding:16px;background:linear-gradient(135deg,#293a37,#15252d);border:1px solid #776348;box-shadow:inset 0 0 0 3px #0c1b22}.collection-card.limited{border-color:#c7957a;background:linear-gradient(135deg,#3d302e,#18252c)}.collection-card h3{font-size:19px;margin:5px 0;color:#ead3a6}.collection-card b{color:#d3bc86;font-size:12px}.collection-card small{font-size:11px;color:#a2b3ab}.collection-card p{line-height:1.8}.collection-source{border-top:1px solid #5c6051;padding-top:10px;font-size:12px;color:#d8c399}.craft-controls select{background:#172b32;color:#e4d8b7;border:1px solid #917853}.craft-controls label{display:flex;align-items:center;gap:8px}#collection-modal{z-index:120}
@media(max-width:650px){#collection-list{grid-template-columns:1fr}.collection-scroll{padding:12px}.collection-card{padding:12px}.bag-secondary-filters{gap:4px;font-size:10px}.gear-workspace-tools{gap:4px!important;flex-wrap:wrap}.gear-workspace-tools button{padding:5px!important;font-size:11px!important}.craft-controls{align-items:flex-start;flex-direction:column}}
.gear-workspace-tools{height:50px;display:flex;align-items:center;justify-content:center;gap:10px;background:#111e25d9;border-bottom:1px solid #665f47}
.gear-workspace button,.gear-workspace select,.town-service button,.town-service select{font:inherit;color:#e1d6b9;background:#22363d;border:1px solid #5b6865;border-radius:3px;cursor:pointer;padding:7px 10px}.gear-workspace button:disabled,.town-service button:disabled{opacity:.42;cursor:default}.gear-workspace button:focus-visible,.town-service button:focus-visible{outline:2px solid #eac684;outline-offset:2px}
.gear-desktop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(10px,3vw,56px);padding:16px 20px 40px;min-height:calc(100% - 50px);align-items:start}.gear-panel{height:calc(100dvh - 120px);max-height:850px;min-height:260px;border:1px solid #9b875c;box-shadow:0 12px 30px #0008,inset 0 0 0 4px #111c25;background:linear-gradient(145deg,#20343a,#101a25 75%);display:flex;flex-direction:column;min-width:0;border-radius:5px}.inventory-panel{grid-column:1;max-width:570px}.character-panel{grid-column:2;justify-self:end;width:100%;max-width:590px}
.gear-panel header{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid #746749;background:#192830}.gear-panel h2{font-size:24px;margin:3px 0!important;font-family:serif;color:#e5c88f}.gear-panel header small{font-size:9px;letter-spacing:2px;color:#b19a70}.gear-panel footer{font-size:11px;padding:10px 16px;border-top:1px solid #455555;color:#a9b4ac}.gear-panel-scroll{padding:14px;overflow:auto;flex:1;min-height:0}.gear-panel header button{font-size:18px}
.bag-wallet{display:flex;justify-content:space-between;font-size:12px;align-items:center}.bag-wallet b{color:#f1ce7d;font-size:17px}#bag-filters{display:flex;gap:4px;flex-wrap:wrap;margin:12px 0}#bag-filters button{font-size:11px;padding:6px 8px}#bag-filters [aria-pressed=true],#bag-roster [aria-pressed=true],.bag-item[aria-pressed=true]{border-color:#e6c183;background:#3d493f}
#bag-items{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;align-content:start}.bag-item{display:flex;flex-direction:column;align-items:center;padding:5px 2px!important;min-width:0;min-height:90px;border-bottom:2px solid #667d7d!important}.bag-item b{font-size:10px;font-weight:500}.bag-item small{font-size:8px;color:#98aca8;margin-top:4px}.gear-pixel-icon{image-rendering:pixelated;object-fit:contain;pointer-events:none;width:44px;height:44px}.bag-item.fine,.gear-slot .fine{border-bottom-color:#7bb79a!important}.bag-item.rare,.gear-slot .rare{border-bottom-color:#83b9e4!important}.bag-item.epic,.gear-slot .epic{border-bottom-color:#c39be5!important}.material-symbol{height:44px;line-height:44px;font-size:32px;color:#a5c7b0}.material-crystal .material-symbol{color:#aeb8ef}.material-scrap .material-symbol{color:#b8b9ad}.gear-item-detail{padding:14px 3px 0;margin-top:14px;border-top:1px solid #586462;font-size:12px;line-height:1.7}.gear-item-detail h3{margin:2px 0;font-size:19px;color:#ead5a5}.gear-item-detail p{margin:8px 0;color:#b7c6c1}.item-heading{display:flex;gap:10px;align-items:center}.item-heading .gear-pixel-icon{width:58px;height:58px}.item-heading small{color:#a49c7e}.gear-compare{border:1px solid #45555b;padding:8px;margin:8px 0}.gain{color:#a4d3a4}.loss{color:#e4a58c}#bag-equip,#bag-use{display:block;width:100%;margin-top:10px;background:#cfb879;color:#18252d;font-weight:bold}#ring-target{margin-left:10px}.bag-empty{grid-column:1/-1;font-size:13px}
#bag-roster{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px}#bag-roster button{padding:4px 0;font-size:10px}#bag-roster img{width:30px;height:32px;object-fit:cover;display:block;margin:auto}#bag-roster span{display:block;margin-top:3px}#gear-name{display:flex;align-items:center;gap:10px;margin:10px 0}#gear-name h3{font-size:24px;color:#ead7b4;margin:0}#gear-name span,#gear-name small{font-size:11px;color:#a8bcb8}#gear-name small{margin-left:auto;color:#c7b788}
.gear-paperdoll{display:grid;grid-template-columns:105px minmax(80px,1fr) 105px;gap:4px;align-items:center;background:radial-gradient(ellipse at 50% 65%,#50606945,transparent 70%)}.gear-slots{display:grid;gap:8px}.gear-slot{position:relative}.gear-slot>button:first-child{width:100%;min-height:67px;display:flex;align-items:center;padding:4px 3px;text-align:left;border-bottom-width:2px}.gear-slot .gear-pixel-icon{width:34px;height:38px;flex:none}.gear-slot small{display:block;font-size:9px;color:#9cafa9}.gear-slot b{font-size:10px;font-weight:500;display:block}.gear-slot .gear-unequip{position:absolute;bottom:-5px;right:2px;padding:1px 3px;font-size:8px;background:#34413a}.slot-ghost{width:30px;flex:none;text-align:center;color:#6f817b;font-size:24px}.gear-model-wrap{text-align:center;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center}.gear-model-wrap canvas{width:100%;height:auto;max-height:355px;object-fit:contain;image-rendering:pixelated}.gear-model-wrap span{color:#8e9d94;font-size:10px}
#bag-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #52625e;padding-top:12px;margin-top:18px;gap:8px;text-align:center}#bag-stats span{font-size:11px;color:#a5b6b1;display:block}#bag-stats b{font-size:19px;display:block;margin-top:5px}#bag-stats small{font-size:10px;color:#a3c9a1}#gear-rule{font-size:11px;color:#a3b3af;text-align:center}#bag-status{position:fixed;bottom:8px;left:50%;transform:translateX(-50%);margin:0;background:#172933f0;color:#e1c794;padding:6px 16px;border-radius:3px;font-size:12px;pointer-events:none}#bag-status:empty{display:none}
@media(min-width:1400px){.gear-desktop{padding:24px 3vw 40px}.gear-panel{height:calc(100dvh - 140px)}}
@media(max-width:1050px){.gear-desktop{gap:10px;padding:10px 8px 32px}.gear-panel-scroll{padding:9px}#bag-items{grid-template-columns:repeat(4,minmax(0,1fr))}.gear-paperdoll{grid-template-columns:82px minmax(65px,1fr) 82px}.gear-slot>button:first-child{min-height:58px}.gear-slot .gear-pixel-icon{width:26px}.gear-slot b{font-size:9px}#bag-roster img{display:none}#bag-roster button{padding:7px 0}.gear-panel header{padding:8px 12px}.gear-panel h2{font-size:20px}.gear-panel{height:calc(100dvh - 100px)}}
@media(max-width:600px){.gear-desktop{gap:5px;padding:8px 4px 35px}.gear-workspace-tools{gap:4px}.gear-workspace-tools button{font-size:11px}.gear-panel header{padding:8px}.gear-panel header small{letter-spacing:0;font-size:7px}.gear-panel h2{font-size:18px}#bag-items{grid-template-columns:repeat(3,minmax(0,1fr))}.bag-item{min-height:70px}.bag-item b{font-size:8px}.bag-item small{font-size:7px}.gear-pixel-icon{width:32px;height:32px}.gear-paperdoll{grid-template-columns:48px minmax(48px,1fr) 48px}.gear-slot>button:first-child{display:block;text-align:center;min-height:62px;padding:2px}.gear-slot .gear-pixel-icon{height:24px}.gear-slot b{display:none}.gear-slot small{font-size:8px}.slot-ghost{display:block;margin:auto;height:32px}#bag-roster{grid-template-columns:repeat(4,1fr)}#gear-name{flex-wrap:wrap;gap:4px}#gear-name small{display:none}#gear-name h3{font-size:20px}#bag-stats{grid-template-columns:1fr;text-align:left}#bag-stats>div{display:flex;justify-content:space-between}#bag-stats b{font-size:14px;margin:0}.gear-panel footer{font-size:9px;padding:6px}.bag-wallet{display:block}.bag-wallet b{font-size:14px}.bag-wallet span{display:block;font-size:10px}.gear-item-detail h3{font-size:15px}.item-heading .gear-pixel-icon{width:36px;height:36px}}
@media(max-height:500px) and (min-width:601px){.gear-workspace-tools{height:34px}.gear-workspace-tools button{padding:5px 9px;font-size:12px}.gear-desktop{padding:5px 8px 18px;min-height:calc(100% - 34px)}.gear-panel{height:calc(100dvh - 52px);min-height:240px}.gear-panel header{padding:3px 9px}.gear-panel header small{display:none}.gear-panel h2{font-size:17px}.gear-panel header button{padding:3px 9px}.gear-panel footer{padding:4px 9px;font-size:9px}.gear-panel-scroll{padding:6px}#bag-roster button{padding:3px 0}#gear-name{margin:4px 0}#gear-name h3{font-size:18px}.gear-paperdoll{grid-template-columns:78px minmax(70px,1fr) 78px}.gear-slots{gap:3px}.gear-slot>button:first-child{min-height:38px;height:38px}.gear-slot .gear-pixel-icon{width:24px;height:28px}.slot-ghost{font-size:18px;width:22px}.gear-model-wrap canvas{max-height:190px}.gear-model-wrap span{font-size:8px}#bag-stats{margin-top:8px;padding-top:6px}#bag-stats b{font-size:15px}}

#town-services-button{color:#ebd7ae;border:1px solid #776b4e;background:#263b3b}
.town-service{width:min(960px,95vw);max-height:92dvh;background:linear-gradient(140deg,#20353a,#111d28);color:#ddd5bf;border:1px solid #aa8e5c;box-shadow:0 20px 80px #000a;overflow:auto;border-radius:5px;padding:20px;font-family:inherit}.town-service header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #736546;padding-bottom:14px}.town-service header small{color:#bda779;font-size:11px;letter-spacing:2px}.town-service h2{font-size:29px;font-family:serif;margin:6px 0}.service-body{display:grid;grid-template-columns:210px 1fr;gap:24px;margin-top:18px}.service-body aside{background:#101f294f;padding:14px;text-align:center;align-self:start}.service-body aside>img{height:180px;width:120px;object-fit:contain;image-rendering:pixelated;background:radial-gradient(ellipse at 50% 80%,#9c8a4c22,transparent 70%)}.service-body aside h3{font-size:20px;color:#e4cea0}.service-body p{font-size:12px;line-height:1.85;color:#afc0ba}.service-body strong{color:#efd191;font-size:19px}.service-main{min-width:0}#service-tabs{display:flex;gap:8px;margin-bottom:12px}#service-tabs [aria-pressed=true]{background:#565940;border-color:#d2b77a}#service-list{max-height:58dvh;overflow:auto;padding-right:8px}.service-row{display:flex;align-items:center;gap:12px;background:#22363b;border:1px solid #41595a;padding:10px;margin:8px 0}.service-row>.gear-pixel-icon{width:58px;height:58px;flex:none}.service-row>div{flex:1;min-width:0}.service-row h3{margin:0;font-size:15px;color:#ddcea8}.service-row p{font-size:11px;margin:4px 0}.service-row button{font-size:11px;min-width:100px;line-height:1.8;color:#efd391;border-color:#9d885e}.service-note{font-size:11px!important;color:#b6ad8f!important}.service-story{padding:24px;border:1px solid #56635d;background:#1b2f35;line-height:1.8}.order-seal{font-family:serif;font-size:30px;color:#c5a05e;width:58px;text-align:center}#service-status{color:#edce94;min-height:24px}.town-directory>p,.town-directory footer{font-size:12px;color:#aebeb4;line-height:1.8}.town-directory{width:min(820px,95vw)}#directory-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}#directory-list button{display:flex;text-align:left;align-items:center;gap:10px}#directory-list img{width:40px;height:64px;object-fit:contain;image-rendering:pixelated}#directory-list span{flex:1}#directory-list b,#directory-list small,#directory-list em{display:block}#directory-list b{color:#e7cea1;font-size:15px}#directory-list small{font-size:10px;color:#a1b7b0;margin:4px 0}#directory-list em{font-size:11px;font-style:normal}#directory-list i{font-size:11px;color:#c9b485;font-style:normal}
@media(max-width:800px){.town-service{padding:12px}.service-body{grid-template-columns:145px 1fr;gap:12px}.service-body aside{padding:8px}.service-body aside>img{height:100px;width:70px}.service-body aside h3{margin:8px 0}.service-body p{font-size:11px}.service-row{gap:7px;padding:7px}.service-row>.gear-pixel-icon{width:40px;height:40px}.service-row h3{font-size:13px}.service-row button{min-width:80px;font-size:10px}.town-service h2{font-size:24px}}
@media(max-width:550px){.service-body{grid-template-columns:1fr}.service-body aside{display:grid;grid-template-columns:70px 1fr;gap:5px;text-align:left}.service-body aside>img{grid-row:span 3}.service-body aside h3,.service-body aside p{margin:0}#service-wallet{grid-column:1/-1}#service-wallet p{display:none}#directory-list{grid-template-columns:1fr}.service-body{margin-top:10px}.service-row button{min-width:65px}}

/* Party selection: readable native portraits, keyboard controls, explicit departure. */
#party-modal .modal{width:min(1060px,94vw);max-width:1060px;max-height:92dvh;overflow:auto;background:#122429;border:1px solid #738078;padding:24px;color:#e9dfc7;box-sizing:border-box}
.party-lede{color:#a8bcb7;font-size:13px;line-height:1.7;margin:8px 0 18px}
.party-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #485a57;border-bottom:1px solid #485a57;padding:12px 0;margin-bottom:18px}.party-summary strong{font-size:21px;color:#e4c18a}.party-summary span{font-size:13px;color:#bbc9c3}
.party-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.party-choice{position:relative;display:flex;flex-direction:column;align-items:stretch;text-align:left;border:1px solid #485956;background:#192d31;padding:12px;color:#e6ddc8;cursor:pointer;min-width:0;transition:background .15s,border-color .15s}
.party-choice:hover,.party-choice:focus-visible{border-color:#e3c28e;outline:2px solid #e3c28e;outline-offset:2px}.party-choice[aria-pressed=true]{background:#263d3b;border-color:#dcc18e}.party-choice:disabled{cursor:default;opacity:.85}
.party-choice canvas{width:100%;height:105px;object-fit:contain;image-rendering:pixelated;background:radial-gradient(ellipse at center bottom,#54736b44,transparent 70%)}
.party-choice h3{margin:7px 0 5px;font-size:21px;letter-spacing:3px}.party-choice small{color:var(--member-color);font-size:11px}.party-choice p{font-size:11px;line-height:1.65;color:#b9c7c0;margin:8px 0;min-height:36px}.party-choice .selection-mark{font-size:10px;color:#e0c28e;align-self:flex-end}
.party-footer{display:flex;justify-content:flex-end;gap:12px;align-items:center;margin-top:18px;flex-wrap:wrap}.party-footer button,#party-button,#town-return{background:#25413e;border:1px solid #738078;color:#efdfb9;padding:9px 16px;cursor:pointer}.party-footer .primary{background:#d2b17b;color:#192b2d}.party-error{color:#f1b388;font-size:12px;flex:1;margin:0;min-height:18px}
#party-vitals{position:absolute;z-index:6;top:100px;left:18px;display:grid;gap:7px;width:190px;pointer-events:none}.party-health{background:#0e2028e8;border-left:2px solid var(--member-color);padding:7px 10px;font-size:11px;color:#e1ddce}.party-health>div{display:flex;justify-content:space-between;gap:10px}.party-health small{font-size:9px;color:#b9c8c0}.party-health .party-meter{display:block;height:3px;background:#364441;margin:5px 0}.party-health .party-meter i{display:block;height:100%;background:var(--member-color)}.party-health.down{opacity:.55}.party-empty{color:#c7cab8;font-size:11px;background:#15262bcc;padding:10px}
.town-overview{grid-column:1/-1;border:1px solid #51635b;padding:10px}.town-overview canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.town-locations{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.town-locations button{padding:8px 12px;border:1px solid #59685b;background:#213838;color:#e8d8b6;cursor:pointer}
body .ally-card,body .frost-status{display:none!important}
@media(max-width:760px){.party-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#party-modal .modal{padding:16px}.party-choice canvas{height:80px}.party-choice h3{font-size:18px}.party-choice p{min-height:0}.party-summary{align-items:flex-start;flex-direction:column;gap:7px}#party-vitals{top:82px;left:8px;width:133px}.party-health{padding:4px 6px;font-size:10px}.party-health small{font-size:8px}#party-button,#town-return{padding:5px 8px;font-size:11px}}
@media(max-height:650px) and (min-width:761px){.party-choice canvas{height:64px}.party-choice p{margin:5px 0}.party-lede{margin-bottom:9px}.party-summary{margin-bottom:10px}.party-choice{padding:8px}.party-choice h3{font-size:18px}}

body #ally-vital{display:none!important}

/* Emberworld · Homeward Light. The base sheet owns game state and layout hooks. */
:root {
 --bg:#101716; --panel:#19201d; --ink:#e7e3d5; --muted:#9ca89e;
 --line:#394239; --gold:#d1ac70; --blue:#99c9cc; --red:#d89178;
 --serif:"STSong","Songti SC","SimSun",serif;
}
body { background:var(--bg); font-size:14px; }
button { border-radius:2px; background:#1c2521; transition:background .2s,border-color .2s,color .2s; }
button:hover { background:#30372b; border-color:#a18c61; }
button:disabled { opacity:.45; }
button:disabled:hover { background:#1c2521; }
button:focus-visible,canvas:focus-visible { outline:2px solid #f3cc87; outline-offset:4px; }
kbd { background:#101916; border-color:#475045; color:#bac3b5; border-radius:2px; font:10px/1.6 Consolas,monospace; }
.pixel-art { image-rendering:pixelated; object-fit:contain; pointer-events:none; }
.ambient { background:radial-gradient(ellipse at 10% 0%,#71634719,transparent 55%),radial-gradient(ellipse at 100% 90%,#46665716,transparent 55%); }
.shell { max-width:1580px; padding:0 40px 22px; }
.shell[inert] { display:none; }
.topbar { height:104px; gap:48px; margin-bottom:25px; border-bottom-color:#71624755; }
.brand { gap:12px; min-width:190px; }
.brand-mark { width:46px; height:54px; border:0; clip-path:none; background:none; }
.brand strong { display:block; font-family:var(--serif); font-size:23px; font-weight:600; letter-spacing:5px; line-height:1.5; color:#e4ddc5; }
.brand small { font:9px/1.6 Georgia,serif; letter-spacing:4px; color:#a79573; }
.chapter-heading { border-left:1px solid #625a405c; padding-left:30px; }
.chapter-heading h1 { font-family:var(--serif); font-size:20px; letter-spacing:3px; }
.chapter-heading .eyebrow { font:9px/1.7 Georgia,serif; letter-spacing:3px; }
.topbar nav { gap:10px; }
.topbar nav button { padding:9px 13px; background:transparent; border-color:transparent; color:#acb4a8; }
.topbar nav button:hover { color:#f1d5a3; background:#a18c6112; }
.topbar nav .map-button { border-color:#766444; background:#ae8a4d15; color:#dbc49d; }
.game-layout { grid-template-columns:minmax(0,1fr) 276px; gap:25px; }
.location-bar { height:36px; font-size:10px; letter-spacing:1px; }
.location-bar strong { font-size:13px; color:#dcdccf; }
.live-dot { width:6px; height:6px; transform:rotate(45deg); background:#d1ac70; }
#room-tag { color:#89988b; border-left:1px solid #4a5144; padding-left:12px; }
#chapter-progress { font:11px/1.8 Consolas,"Microsoft YaHei",monospace; color:#c1b38f; }
.arena-wrap { border:4px solid #282c24; outline:1px solid #89734d; outline-offset:3px; box-shadow:0 20px 55px #0006; }
.arena-wrap:after { border:1px solid #dac1905c; box-shadow:inset 0 0 36px #10171133; }
.room-banner { top:20px; left:22px; padding:8px 13px; border-left:2px solid #d4b77d; background:linear-gradient(90deg,#111c1dcc,transparent); }
.room-banner strong { font-family:var(--serif); font-size:21px; letter-spacing:4px; }
.room-banner small { font-size:10px; }
.toast { background:#17201ef2; border-color:#947c51; white-space:normal; text-align:center; width:max-content; }
.interact-hint { background:#171f1af2; border-color:#b89a60; border-radius:2px; }
.pause-badge { background:#101a17bf; font-family:var(--serif); color:#efdab2; }
.pause-badge span { font-family:"Microsoft YaHei",sans-serif; color:#b8c3b7; }
.action-deck { margin-top:13px; padding:16px 16px; gap:24px; background:#1a211d; border:1px solid #544d365c; position:relative; }
.action-deck:before { content:""; position:absolute; height:2px; width:38px; top:-1px; left:15px; background:#b4945c; }
.player-card { gap:13px; min-width:200px; }
.portrait { width:60px; height:64px; background:radial-gradient(ellipse at bottom,#664b2b,#272a21); border:1px solid #90774e; }
.portrait canvas { width:64px; height:64px; }
.hero-line b { font-family:var(--serif); font-size:24px; color:#e4c18a; }
.hero-line span { font-size:10px; color:#baa17c; }
.hero-line small { color:#c9c9b9; font:10px Consolas,monospace; }
.bar { height:7px; border-color:#4e5748; background:#101713; }
.health i { background:linear-gradient(90deg,#8a9660,#bdca8f); }
.bar.ally i { background:linear-gradient(90deg,#5c8b8d,#a3d3d0); }
.movement { font-size:9px; color:#879581; letter-spacing:.5px; }
.skill-row { margin-left:auto; gap:8px; }
.skill { width:65px; height:70px; border-color:#555b43; background:linear-gradient(150deg,#303629,#1b241e); }
.skill kbd { left:5px; top:3px; font:9px Consolas,monospace; color:#aab49e; }
.skill b { font-family:var(--serif); font-size:17px; margin-top:10px; color:#e4dfc6; }
.skill span { font-size:9px; color:#9da992; }
.skill.fire { background:linear-gradient(145deg,#3d3023,#241f1b); border-color:#6d5135; }
.skill.fire b { color:#e3b27d; }
.skill.green { background:linear-gradient(145deg,#303c29,#1b271e); }
.skill.green b { color:#b9cba1; }
.skill .cooldown-number { background:#11191199; color:#ffe3b1; }
.skill i { background:#0d1514c9; }
.play-footer { font-size:10px; padding-top:14px; color:#879587; }
.play-footer em { color:#4d574a; }
.sidebar { padding-top:36px; gap:14px; }
.panel { position:relative; padding:18px; border-radius:2px; border-color:#554f3c; background:linear-gradient(130deg,#25291e,#19221d 75%); }
.panel:before,.panel:after { content:""; position:absolute; width:6px; height:6px; border-color:#b19765; border-style:solid; pointer-events:none; }
.panel:before { top:-1px; left:-1px; border-width:1px 0 0 1px; }
.panel:after { bottom:-1px; right:-1px; border-width:0 1px 1px 0; }
.section-label { font-size:11px; letter-spacing:2px; color:#bea77a; margin-bottom:13px; }
.section-label span { font:8px Georgia,serif; color:#9c9e88; letter-spacing:1.4px; }
.mission-panel { padding-right:18px; overflow:hidden; }
.mission-panel .section-label { padding-right:52px; }
.mission-lantern { position:absolute; right:6px; top:3px; width:64px; height:80px; opacity:.8; filter:drop-shadow(0 0 12px #b97a2733); }
.mission-panel h2 { font-family:var(--serif); font-size:20px; font-weight:500; line-height:1.55; color:#e2d4b3; padding-right:34px; margin:8px 0 13px; }
.mission-panel p { color:#b0baa8; font-size:12px; line-height:1.9; }
.objective-state { font-size:10px; border-color:#6b634038; color:#c4b889; margin-top:15px; padding-top:12px; }
.next-button { padding:9px 11px; border-color:#a18c61; background:#78633b33; color:#e7cf9f; }
.minimap-panel { background:#19221e; }
#minimap { border-color:#5b6048; }
.map-legend { font-size:9px; color:#acb6a6; margin-top:9px; }
.map-caption { font-size:9px; color:#899681; }
.companion-panel { background:linear-gradient(145deg,#1c2c29,#19221f 70%); margin-top:0; }
.companion-panel .section-label { padding-right:33px; }
.companion-keepsake { position:absolute; right:4px; top:6px; width:47px; height:63px; opacity:.7; }
.companion-head { gap:12px; }
.companion-head canvas { width:48px; height:48px; background:radial-gradient(ellipse at bottom,#3a5653,#182722); border-color:#5f7d75; }
.companion-head h2 { font:22px var(--serif); color:#cce2d9; margin-bottom:8px; }
.companion-head h2 small { color:#a5beb5; font:10px "Microsoft YaHei",sans-serif; }
.ally-intent { color:#b7cfc0; border-left-color:#648c80; line-height:1.8; font-size:12px; margin:14px 0; }
.command-grid { gap:7px; }
.command-grid button { padding:7px 9px; font-size:11px; background:#17231f; border-color:#3f5448; gap:11px; }
.command-grid .active { background:#38554966; border-color:#8baa89; color:#e0ead1; }
.memory { font-size:10px; color:#8faaa0; border-top:1px solid #40504670; padding-top:10px; }
.chapter-strip { margin-top:24px; padding:15px 0; border-color:#635a3d60; gap:25px; }
.chapter-strip>span { font-size:11px; }
#route-strip { gap:8px; }
#route-strip button { font-size:11px; padding:6px 8px; border:1px solid transparent; }
#route-strip button.current { color:#e5cb98; background:#b6955620; border-color:#9d85515c; }
#route-strip button.done { color:#bacba4; }
#route-strip button:disabled { opacity:.65; }
.preview-strip { margin:15px 0; font-size:10px; gap:9px; }
.preview-strip>span { margin-right:12px; color:#9aab95; letter-spacing:2px; }
.preview-strip button { font-size:10px; padding:6px 13px; border-color:#4a513e; background:transparent; color:#b6bcaa; }
.build-note { color:#7b8877; font-size:9px; letter-spacing:1px; margin-top:18px; }
.build-note span { margin:0 9px; color:#786b4e; }

/* Chapter opening: a quiet illustrated folio, with three playable glimpses. */
.overlay { padding:0 5vw; background:#101916; }
.intro-top { height:90px; display:flex; align-items:center; gap:35px; max-width:1520px; margin:auto; border-bottom:1px solid #75684455; }
.intro-top-caption { padding-left:30px; border-left:1px solid #665c3a; font-family:var(--serif); letter-spacing:3px; font-size:12px; color:#96a28d; }
.edition { margin-left:auto; color:#c6c8ad; font-size:10px; letter-spacing:2px; }
.edition i { display:inline-block; width:5px; height:5px; background:#c3ab73; margin-right:9px; box-shadow:0 0 9px #ccac5f44; }
.intro-stage { position:relative; max-width:1520px; margin:0 auto; min-height:570px; height:calc(100vh - 290px); max-height:780px; border-bottom:1px solid #75684455; isolation:isolate; }
.intro-art { inset:0 -5vw 0 21%; opacity:1; background-position:68% center; background-size:cover; }
.intro-shade { inset:0 -5vw 0 -5vw; background:linear-gradient(90deg,#101916 3%,#101916f7 23%,#101916c4 35%,#10191636 55%,#10191608 80%),linear-gradient(0deg,#101916 0%,#10191600 28%,#10191600 80%,#10191640); }
.intro-stage:after { content:""; position:absolute; inset:0; z-index:2; pointer-events:none; border-right:1px solid #b2934d22; }
.intro-content { margin:0; max-width:560px; padding:44px 0 28px 30px; position:relative; z-index:3; }
.eyebrow { font:10px/1.7 Georgia,serif; letter-spacing:2.6px; color:#c7aa76; }
.intro-content>.eyebrow { display:flex; align-items:center; gap:13px; font-size:9px; }
.intro-content>.eyebrow i { width:25px; height:1px; background:#8f784a; }
.intro-kicker { font-family:var(--serif); color:#c0c7af; font-size:13px; letter-spacing:3px; margin-top:28px; }
.intro-content h2 { font-family:var(--serif); font-size:31px; line-height:1.2; letter-spacing:10px; margin:16px 0 22px; color:#d0d5c3; font-weight:400; }
.intro-content h2>span { display:block; font-size:83px; line-height:1.25; color:#eddbb3; letter-spacing:10px; margin-top:7px; text-shadow:0 4px 35px #0005; }
.intro-content h2 .title-period { display:inline; font-size:48px; letter-spacing:0; color:#bba16a; margin-left:-9px; }
.intro-content>.intro-story { font-size:12px; line-height:2.15; color:#aebca9; letter-spacing:1.5px; }
.intro-tags { display:flex; gap:13px; margin:21px 0; font-size:10px; color:#b7bea3; letter-spacing:2px; }
.intro-tags span { border:0; padding:0; background:none; }
.intro-tags b { font-weight:400; color:#907e51; }
.primary { padding:14px 25px; background:#d6b67c; border:1px solid #f0d6a0; border-radius:1px; color:#263025; font-size:13px; font-weight:600; letter-spacing:2px; box-shadow:inset 0 0 0 3px #a48a5d55,0 8px 22px #0003; }
.primary:hover { background:#edcd91; border-color:#f8e4b9; }
.primary:disabled { background:#b0a183; }
.primary span { margin-left:45px; font-size:18px; font-weight:400; }
.text-button { color:#c2c5b1; font-size:11px; letter-spacing:1px; }
.text-button:hover { color:#f3d196; }
.intro-content>small { font-size:9px; color:#8f9c87; letter-spacing:.5px; margin-top:13px; }
.intro-chapter-mark { position:absolute; right:27px; top:33px; writing-mode:vertical-rl; display:flex; align-items:center; gap:15px; color:#d4d0ae; letter-spacing:6px; font:12px var(--serif); z-index:3; text-shadow:0 2px 6px #000; }
.intro-chapter-mark span { display:grid; place-items:center; width:32px; height:42px; border:1px solid #b19962; background:#24352988; font-size:21px; }
.lantern-vignette { position:absolute; bottom:80px; right:10%; z-index:2; display:flex; align-items:center; gap:7px; pointer-events:none; }
.lantern-vignette:before { content:""; position:absolute; width:230px; height:230px; left:-30px; background:radial-gradient(ellipse,#efb8562b,transparent 65%); }
.lantern-vignette img { width:150px; height:188px; position:relative; filter:drop-shadow(0 5px 15px #0008); animation:lantern-breathe 5s ease-in-out infinite; }
.lantern-vignette>span { writing-mode:vertical-rl; font:13px var(--serif); letter-spacing:5px; color:#dfd1a6; text-shadow:0 2px 5px #000; }
.scene-caption { position:absolute; right:28px; bottom:27px; z-index:3; text-align:right; color:#d1cfb6; font:12px var(--serif); letter-spacing:3px; }
.scene-caption small { display:block; font:8px Georgia,serif; color:#a0ad91; margin-top:9px; letter-spacing:2px; }
.intro-experiences { display:grid; grid-template-columns:290px minmax(0,1fr); gap:32px; max-width:1520px; margin:auto; padding:28px 0 23px; align-items:center; }
.preview-heading .eyebrow { font-size:8px; color:#8f9a7e; letter-spacing:2px; }
.preview-heading h3 { font:18px/1.7 var(--serif); font-weight:400; letter-spacing:1px; color:#d7d4bc; margin:7px 0; }
.preview-heading p { font-size:10px; color:#89977e; letter-spacing:1px; }
.intro-preview { position:static; width:auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:0; background:transparent; border:0; box-shadow:none; margin:0; }
.intro-preview button { padding:20px 15px; min-height:92px; display:flex; gap:12px; align-items:center; border:1px solid #77704d66; background:linear-gradient(120deg,#29332588,#17221b); text-align:left; position:relative; }
.intro-preview button:hover { background:#34412e; border-color:#b3a06a; }
.intro-preview button:before { content:""; position:absolute; width:16px; height:1px; top:-1px; left:12px; background:#ba9b60; }
.preview-number { align-self:flex-start; font:16px Georgia,serif; color:#a99871; padding-top:2px; }
.intro-preview b { display:block; font:17px var(--serif); color:#ddd9bc; letter-spacing:2px; white-space:nowrap; }
.intro-preview small { display:block; font-size:9px; color:#94a28b; margin-top:9px; white-space:nowrap; }
.preview-arrow { margin-left:auto; font-size:18px; color:#b9a474; align-self:flex-start; }
.intro-bottom { position:static; max-width:1520px; margin:auto; min-height:58px; border-top:1px solid #75684444; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:9px; letter-spacing:1px; color:#8d9c83; }
.intro-bottom>span:first-child { font-family:var(--serif); font-size:12px; letter-spacing:3px; }
.intro-bottom i { font-style:normal; margin:0 9px; color:#536049; }
.intro-bottom kbd { border:0; padding:0; background:none; color:#b9bda4; font-size:9px; }
@keyframes lantern-breathe { 50% { filter:drop-shadow(0 0 18px #dba85566); transform:translateY(-4px); } }

/* Map, instructions and chapter ending share the folio materials. */
.modal-backdrop { background:#0b1512de; backdrop-filter:blur(8px); }
.modal { background:linear-gradient(145deg,#252d22,#18241e 65%); border:1px solid #9f895c; border-radius:2px; box-shadow:0 30px 100px #0009,inset 0 0 0 5px #a9915f0a; padding:32px; }
.modal-head h2 { font-family:var(--serif); color:#e5d6b5; font-weight:400; font-size:27px; }
.modal>p { color:#b3bea7; line-height:1.9; }
.map-card { background:#18251e; border-color:#687051; }
.map-card.current { border-color:#d4b77b; box-shadow:0 0 0 1px #d4b77b; }
.map-card .card-copy { padding:12px; }
.map-card b { font-family:var(--serif); font-size:16px; }
.map-card small { color:#a8b89c; margin-top:6px; }
.map-card .map-status { background:#142019eb; border-color:#928257; color:#e3d2a7; font-size:9px; }
.route-summary { color:#d0c097; }
.route-summary span,.modal-foot { color:#9cab93; }
.help-columns h3 { font-family:var(--serif); font-size:18px; }
.help-columns p { color:#c0cbb5; }
.help-note { border-color:#6f6c4444; }
.result-modal { padding:42px; }
.result-modal:before { content:"◇"; display:block; color:#d5b477; font-size:25px; margin-bottom:10px; }
.result-modal h2 { color:#ecd9b0; }
.result-stats { border-color:#706b464d; }
.result-stats b { color:#d8c491; font-family:Georgia,serif; }
.result-memory { color:#c4d0ba!important; white-space:pre-line; }
@media(min-width:1550px) { .shell { padding-top:0; } .sidebar { gap:18px; } .companion-panel { margin-top:auto; } .intro-content { padding-top:60px; } .intro-content h2>span { font-size:96px; } .intro-content h2 { margin-bottom:27px; } .intro-tags { margin:26px 0; } }
@media(max-width:1200px) {
 .shell { padding:0 25px 20px; } .topbar { gap:24px; } .game-layout { grid-template-columns:minmax(0,1fr) 246px; gap:20px; }
 .panel { padding:15px; } .mission-panel h2 { font-size:18px; } .action-deck { gap:14px; padding:13px 10px; } .player-card { min-width:155px; } .hero-line span { display:none; }
 .skill { width:52px; height:66px; } .skill b { font-size:15px; } .skill span { font-size:8px; } .skill-row { gap:6px; }
 .intro-experiences { grid-template-columns:220px minmax(0,1fr); gap:20px; } .preview-heading h3 { font-size:15px; } .intro-preview { gap:9px; } .intro-preview button { padding:17px 11px; gap:9px; } .preview-arrow { display:none; } .intro-preview small { font-size:8px; }
}
@media(max-width:950px) {
 .brand { min-width:175px; } .topbar { gap:20px; } .chapter-heading { padding-left:20px; } .chapter-heading h1 { font-size:17px; } .topbar nav button { padding:8px; font-size:10px; }
 .action-deck { flex-wrap:wrap; } .player-card { width:100%; max-width:none; } .skill-row { width:100%; } .skill { flex:1; } .hero-line span { display:inline; }
 .intro-top-caption { display:none; } .intro-content { padding-left:6px; } .intro-art { left:10%; background-position:57% center; }
 .intro-experiences { grid-template-columns:1fr; gap:18px; padding:22px 0; } .preview-heading { display:flex; flex-wrap:wrap; gap:8px 20px; align-items:baseline; } .preview-heading .eyebrow { display:none; } .preview-heading h3 { margin:0; font-size:18px; }
 .intro-preview button { padding:17px; } .intro-preview small { font-size:9px; } .preview-arrow { display:block; } .lantern-vignette { right:5%; }
 .intro-bottom { font-size:8px; } .intro-bottom i { margin:0 4px; }
}
@media(max-width:850px) {
 .shell { padding:0 22px 20px; } .topbar { height:auto; padding:18px 0; gap:14px; margin-bottom:21px; } .chapter-heading { margin-left:auto; } .topbar nav { width:100%; gap:12px; }
 .game-layout { display:flex; flex-direction:column; gap:22px; } .action-deck { flex-wrap:nowrap; } .player-card { min-width:180px; width:auto; } .skill-row { width:auto; } .skill { flex:auto; }
 .sidebar { display:grid; grid-template-columns:1fr 1fr; padding-top:0; gap:16px; } .minimap-panel { display:block; } .companion-panel { grid-column:2; grid-row:1/3; } .mission-panel { min-height:190px; }
 .chapter-strip { flex-wrap:wrap; gap:12px; } .chapter-strip>small { display:none; } #route-strip { gap:4px; } #route-strip button { font-size:10px; padding:5px; }
 .map-cards { gap:10px; } .modal { padding:24px; } .modal-head h2 { font-size:23px; } .map-card b { font-size:13px; }
 .intro-content h2>span { font-size:72px; } .intro-content h2 { font-size:30px; } .intro-bottom>span:last-child { display:block; } .intro-top { height:82px; }
}
@media(max-width:600px) {
 .overlay { padding:0 22px; } .intro-top { height:80px; gap:8px; } .intro-top .brand { min-width:0; gap:6px; } .intro-top .brand-mark { width:34px; height:44px; } .intro-top .brand strong { font-size:19px; letter-spacing:3px; } .intro-top .brand small { font-size:8px; letter-spacing:2px; } .edition { font-size:8px; letter-spacing:.5px; }
 .intro-stage { min-height:620px; height:auto; max-height:none; } .intro-art { inset:0 -22px; background-position:61% 45%; } .intro-shade { inset:0 -22px; background:linear-gradient(90deg,#101916f2,#101916af 65%,#10191633),linear-gradient(0deg,#101916,transparent 50%); }
 .intro-content { padding:36px 0 100px; max-width:100%; } .intro-content>.eyebrow { font-size:8px; gap:8px; letter-spacing:1.8px; } .intro-content>.eyebrow i { width:16px; } .intro-kicker { font-size:11px; letter-spacing:2px; margin-top:32px; }
 .intro-content h2 { font-size:30px; margin:18px 0 23px; } .intro-content h2>span { font-size:64px; letter-spacing:7px; } .intro-content h2 .title-period { font-size:35px; }
 .intro-content>.intro-story { font-size:11px; line-height:2.1; } .intro-tags { font-size:9px; gap:9px; margin:24px 0; } .primary { padding:14px 20px; font-size:12px; }
 .intro-chapter-mark { display:none; } .lantern-vignette { right:0; bottom:7px; } .lantern-vignette img { width:85px; height:107px; } .lantern-vignette>span { display:none; } .lantern-vignette:before { width:110px; height:110px; left:-12px; }
 .scene-caption { left:0; right:auto; bottom:28px; text-align:left; font-size:10px; } .scene-caption small { font-size:7px; }
 .intro-preview { grid-template-columns:1fr; gap:12px; } .intro-preview button { padding:17px 18px; min-height:78px; } .intro-preview b { font-size:18px; } .intro-preview small { font-size:10px; margin-top:6px; } .preview-number { font-size:22px; align-self:center; min-width:30px; }
 .preview-heading { display:block; } .preview-heading h3 { font-size:18px; } .preview-heading p { margin-top:7px; } .intro-bottom { position:static; background:none; display:block; padding:18px 0; } .intro-bottom>span { display:block; } .intro-bottom>span:last-child { margin-top:14px; line-height:2; }
 .shell { padding:0 14px 20px; } .topbar .brand { min-width:0; gap:5px; } .topbar .brand-mark { width:30px; height:42px; } .topbar .brand strong { font-size:18px; letter-spacing:3px; } .topbar .brand small { font-size:7px; letter-spacing:2px; } .chapter-heading { padding-left:12px; } .chapter-heading h1 { font-size:14px; letter-spacing:1px; } .chapter-heading .eyebrow { font-size:7px; }
 .topbar nav { justify-content:space-between; gap:8px; } .topbar nav button { font-size:11px; } .location-bar { font-size:9px; letter-spacing:0; } .location-bar>span:first-child { gap:7px; } .location-bar strong { font-size:11px; } #room-tag { padding-left:7px; font-size:9px; } #chapter-progress { font-size:9px; }
 .arena-wrap { border-width:2px; outline-offset:2px; } .room-banner { top:8px; left:8px; padding:3px 7px; } .room-banner strong { font-size:13px; letter-spacing:2px; } .room-banner small { font-size:8px; }
 .action-deck { flex-wrap:wrap; margin-top:12px; padding:12px; gap:14px; } .player-card { width:100%; min-width:0; } .portrait { width:48px; height:51px; } .portrait canvas { width:55px; height:55px; } .hero-line b { font-size:22px; } .movement { display:block; font-size:8px; }
 .skill-row { width:100%; gap:6px; } .skill { flex:1; min-width:0; width:auto; height:66px; } .skill b { font-size:15px; } .skill span { font-size:8px; }
 .play-footer { font-size:8px; } .sidebar { grid-template-columns:1fr; } .companion-panel { grid-column:auto; grid-row:auto; } .mission-panel { min-height:0; } .minimap-panel { display:block; } #minimap { max-height:180px; object-fit:contain; } .panel { padding:18px; }
 .chapter-strip { margin-top:20px; gap:10px; } #route-strip { gap:4px; } #route-strip button { font-size:10px; } .chapter-strip>span { width:100%; } .build-note { font-size:8px; line-height:2; } .preview-strip>span { width:100%; }
 .modal-backdrop { padding:12px; } .modal { padding:20px; max-height:92vh; } .modal-head h2 { font-size:20px; } .map-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } .map-card .card-copy { padding:9px; } .map-card b { font-size:12px; } .help-columns { grid-template-columns:1fr; } .result-modal h2 { font-size:32px; } .result-stats { gap:25px; }
}
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { animation:none!important; transition:none!important; } }

/* PixelLab side-action HUD. The generated frame contains no baked labels. */
.sidebar .panel{background-color:#11272b;background-image:var(--pixel-panel);background-size:100% 100%;background-repeat:no-repeat;border-color:#526053;border-radius:0;padding:19px 17px;image-rendering:pixelated}
.skill-row{background-image:var(--pixel-skillbar);background-size:100% 100%;background-repeat:no-repeat;padding:12px 22px;image-rendering:pixelated;gap:4px}
.skill-row .skill{background:#11292bc9;border-color:#68705488;border-radius:0}
.portrait{position:relative;border:0;background:#1c3437}
.portrait:after{content:"";position:absolute;inset:0;background-image:var(--pixel-portrait-frame);background-size:100% 100%;image-rendering:pixelated;pointer-events:none}
.portrait canvas{width:100%;height:100%}
.arena-wrap{border-color:#ab9163}
@media(min-width:1100px){.game-layout{grid-template-columns:minmax(0,1fr) 235px;gap:18px}.shell{max-width:1600px;padding-left:25px;padding-right:25px}.topbar{height:76px;margin-bottom:14px}}
@media(max-width:580px){.skill-row{padding:10px 15px}.sidebar .panel{padding:17px}.skill-row .skill{min-width:0}}

.skill-row .skill{flex:1;min-width:0}
@media(max-width:580px){.skill-row .skill b{font-size:12px}.skill-row .skill span{font-size:7px}.skill-row{padding:9px 10px;gap:3px}}

/* v11 restrained combat HUD. Scoped so the chapter opening and saved gameplay stay independent. */
.combat-shell { --metal:#242529; --steel:#72716a; --brass:#b59a61; --hud-ink:#ece2cb; width:calc(100% - 32px); max-width:min(1560px,calc((100dvh - 302px)*680/384)); margin:auto; padding:0; color:var(--hud-ink); }
.combat-shell .topbar { height:43px; padding:0; margin:0; gap:24px; border-bottom:1px solid #514b3c; flex-wrap:nowrap; }
.combat-shell .brand { min-width:154px; gap:7px; }
.combat-shell .brand-mark { width:29px; height:32px; }
.combat-shell .brand strong { font-size:16px; letter-spacing:3px; }
.combat-shell .brand small { font-size:6px; letter-spacing:2.8px; }
.combat-shell .chapter-heading { display:flex; align-items:center; gap:12px; margin:0; padding-left:22px; }
.combat-shell .chapter-heading h1 { font:13px var(--serif); letter-spacing:2px; }
.combat-shell .chapter-heading .eyebrow { font:8px Georgia,serif; letter-spacing:1.4px; }
.combat-shell .topbar nav { width:auto; gap:4px; margin-left:auto; }
.combat-shell .topbar nav button { font-size:10px; padding:4px 8px; border:1px solid transparent; border-radius:0; }
.combat-shell .topbar nav button:hover { background:#39392d; border-color:#8b794d; }
.combat-shell .topbar nav .map-button { color:#dfc591; border-color:#71613f; background:#56482a33; }
.combat-shell .topbar nav kbd { display:inline; font-size:8px; margin-left:5px; }
.combat-shell .game-layout { display:block; }
.combat-shell .location-bar { height:26px; align-items:center; font-size:10px; letter-spacing:.5px; }
.combat-shell .location-bar strong { font-size:11px; }
.combat-shell .location-bar>span:first-child { gap:9px; }
.combat-shell #room-tag { font-size:9px; padding-left:9px; }
.area-counter { display:flex; align-items:center; gap:12px; font:9px Consolas,"Microsoft YaHei",sans-serif; color:#bbb09b; }
.area-counter i { color:#766344; font-style:normal; }
.combat-shell #chapter-progress { font-size:9px; }
.combat-shell .arena-wrap { border:1px solid #46524f; outline:none; box-shadow:0 12px 40px #0003; overflow:hidden; aspect-ratio:680/384; background:#101619; }
.combat-shell .arena-wrap:after { border:0; box-shadow:none; pointer-events:none; }
.combat-shell #game { width:100%; height:100%; }
.combat-shell .room-banner { left:16px; top:auto; bottom:16px; max-width:43%; padding:0; border:0; background:none; text-shadow:0 2px 8px #000; z-index:1; pointer-events:none; }
.combat-shell .room-banner strong { font:16px/1.6 var(--serif); letter-spacing:2px; color:#d2d9cf; }
.combat-shell .room-banner small { font-size:9px; color:#b0bbb4; }
.combat-shell .stage-hud { position:absolute; top:12px; right:12px; width:176px; display:flex; flex-direction:column; gap:8px; padding:0; z-index:2; }
.combat-shell .minimap-panel { display:block; padding:7px; border:1px solid #9aafa226; background:#111b1be0; box-shadow:none; }
.hud-caption { display:flex; justify-content:space-between; font-size:9px; color:#d9c8a6; letter-spacing:1px; margin-bottom:5px; }
.hud-caption>span:last-child { font:9px Consolas,monospace; color:#b1aa94; }
.combat-shell #minimap { display:block; width:100%; height:auto; max-height:none; border:1px solid #666853; opacity:.94; }
.combat-shell .map-legend { margin:4px 0 0; font-size:8px; color:#c6c9ba; gap:12px; }
.combat-shell .mission-panel { min-height:0; padding:0; background:#111b1be0; border:1px solid #9aafa226; overflow:visible; }
.mission-panel summary { display:flex; justify-content:space-between; cursor:pointer; padding:7px 9px; font-size:10px; color:#ddc590; letter-spacing:1px; list-style:none; background:#282b2455; }
.mission-panel summary::-webkit-details-marker { display:none; }
.mission-panel summary:focus-visible { outline:2px solid #ebd097; outline-offset:2px; }
.mission-panel:not([open]) summary>span { transform:rotate(-90deg); }
.mission-body { padding:0 9px 9px; }
.combat-shell .mission-panel h2 { font:14px/1.6 var(--serif); letter-spacing:.5px; padding:0; margin:6px 0; color:#f0e2bf; }
.combat-shell .mission-panel p { font-size:10px; line-height:1.7; min-height:0; color:#c3c9ba; }
.combat-shell .objective-state { margin-top:7px; padding-top:6px; font-size:9px; line-height:1.7; border-color:#aca17b33; color:#d3c594; }
.combat-shell .next-button { font-size:9px; padding:5px 7px; margin-top:6px; background:#a58b4533; border-color:#9e8a50; }
.combat-shell .cinematic .stage-hud,.combat-shell .cinematic .combo-display { position:absolute; left:22px; top:40%; z-index:2; pointer-events:none; text-shadow:0 2px 6px #0d1718; }
.combat-shell .toast { top:auto; bottom:57px; background:#121820ed; color:#f1e6cb; border-color:#897349; z-index:3; font-size:11px; padding:6px 13px; max-width:75%; }
.combat-shell .interact-hint { bottom:13px; font-size:12px; color:#f5ddb3; border-color:#b3955c; background:#171b1ff2; z-index:3; padding:7px 16px; }
.combat-shell .pause-badge { z-index:8; font:30px var(--serif); background:#0a1118b8; color:#e8d2a6; }
.combat-shell .pause-badge span { font-size:12px; }
.combat-shell .boss-bar { left:max(232px,27%); right:23%; top:15px; z-index:4; font-size:12px; padding:7px 10px 9px; background:#161e20e0; border:1px solid #9aafa226; }
.combat-shell .boss-bar>div:first-child { align-items:center; gap:10px; }
.combat-shell #boss-phase { margin-left:auto; color:#d7b9d8; font-size:9px; }
.combat-shell #boss-health-text { font:9px Consolas,monospace; color:#eed6cf; }
.combat-shell .bar.boss { height:10px; border-color:#b49581; background:#1a1020; }
.combat-shell .bar.boss i { background:#ad7372; box-shadow:none; }
.combo-display { position:absolute; left:25px; top:38%; z-index:2; pointer-events:none; text-shadow:3px 3px #261608,0 0 16px #0d1118; transform:skewY(-5deg); }
.combo-display strong { display:block; font:38px/1 Consolas,monospace; color:#e4d3b4; }
.combo-display>span { display:block; font:9px Consolas,monospace; color:#b9c3b8; letter-spacing:2px; margin-top:4px; }
.combo-display small { display:none; }

/* Dark metal console with live red/blue vitality globes and a two-tier hotbar. */
.combat-shell .action-deck { display:grid; grid-template-columns:210px minmax(0,1fr); align-items:center; gap:24px; padding:14px 22px; margin:0; position:relative; border:1px solid #a6b6a91c; border-top:0; background:#141d1e; box-shadow:none; }
.combat-shell .action-deck:before,.combat-shell .action-deck:after { display:none; }
.combat-shell .action-deck:before { left:9px; }.combat-shell .action-deck:after { right:9px; }
.combat-shell .vital-card { display:flex; align-items:center; gap:13px; min-width:0; max-width:none; width:auto; border:0; padding:0; margin:0; background:none; }

.vital-orb { --fill:100%; --liquid-light:#c88b74; --liquid-mid:#9a554e; --liquid-deep:#492b2b; flex-shrink:0; position:relative; width:68px; height:68px; padding:4px; border:1px solid #acb5a74d; border-radius:50%; background:#151e1d; box-shadow:none; }
.vital-orb:before,.vital-orb:after { display:none; }
.vital-orb:before { top:-6px; }.vital-orb:after { bottom:-6px; width:9px; height:9px; left:calc(50% - 4px); }
.orb-glass { position:relative; width:100%; height:100%; border-radius:50%; overflow:hidden; background:#222b2a; border:0; box-shadow:none; }
.orb-glass:after { display:none; }
.orb-liquid { position:absolute; bottom:0; left:0; width:100%; height:var(--fill); background:linear-gradient(180deg,#aa7062,#764c47); border:0; transition:height .22s ease; box-shadow:none; }
.orb-liquid:before { display:none; }
.orb-readout { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:1; text-shadow:none; }
.orb-readout b { font:20px/1 Consolas,monospace; color:#f0e7dd; }
.orb-readout small { font:8px Consolas,monospace; letter-spacing:1px; margin-top:4px; color:#e6c9bf; }
.orb-name { display:none; }
.vital-orb.low { border-color:#d48c7b; box-shadow:0 0 0 2px #b6654e33; }
.vital-orb.down .orb-glass { filter:grayscale(1); }
.fighter-info { min-width:0; width:115px; }
.fighter-heading { display:flex; gap:8px; align-items:center; margin-bottom:5px; }
.combat-shell .portrait { width:32px; height:36px; border:0; background:#b3c5b60a; flex-shrink:0; }
.combat-shell .portrait:after { display:none; }
.combat-shell .portrait canvas { width:100%; height:100%; image-rendering:pixelated; }
.fighter-heading b { font:17px/1.1 var(--serif); color:#cdd5cb; }
.fighter-heading small { display:block; font-size:8px; color:#b8aa8d; margin-top:5px; }
.companion-panel .fighter-heading b { color:#cce5ee; }.companion-panel .fighter-heading small { color:#a4bcca; }
.combat-shell #hp-text,.combat-shell #ally-hp-text { font:9px/1.7 Consolas,monospace; color:#d5cbb9; }
.combat-shell .bar.health,.combat-shell .bar.ally { height:5px; border:1px solid #5a554b; background:#0a0e14; }
.combat-shell .bar.health i { background:linear-gradient(90deg,#b74443,#ef8c70); }.combat-shell .bar.ally i { background:linear-gradient(90deg,#3b7e9c,#a2dae0); }
.fighter-state { display:block; margin-top:6px; font-size:9px; color:#b8b9a2; }
.fighter-state.danger { color:#ffab89; }
.frost-status { display:flex; gap:6px; align-items:center; margin-top:6px; }
.frost-status img { width:26px; height:26px; border:1px solid #647b92; }
.frost-status>span { font-size:9px; color:#b3ccd8; }.frost-status small { display:block; font-size:8px; color:#96a8b8; }
.frost-status.cooling img { filter:saturate(.45); }
.hotbar { min-width:0; }
.hotbar-heading { display:flex; justify-content:space-between; padding:0 2px 5px; font-size:9px; color:#b6ac95; letter-spacing:2px; }
.hotbar-heading small { font-size:9px; letter-spacing:1px; color:#d5ba8b; }
.combat-shell .skill-row { display:flex; width:auto; margin:0; padding:0; gap:7px; background:none; image-rendering:auto; }
.combat-shell .skill { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:0; width:56px; height:auto; min-width:0; flex:none; padding:0; overflow:visible; border:0; border-radius:0; background:none; color:#d7cfbe; }
.combat-shell .skill-icon { position:relative; display:block; width:56px; height:56px; padding:3px; border:1px solid #89988d55; background:#1e2827; box-shadow:none; overflow:hidden; }
.combat-shell .skill-icon img { display:block; width:48px; height:48px; max-width:100%; object-fit:cover; filter:saturate(.65); }
.combat-shell .skill kbd { position:absolute; top:-3px; left:3px; z-index:3; padding:0 4px; border:1px solid #7d8d8055; border-radius:1px; background:#151e1df5; color:#cbd4c9; font:10px/15px Consolas,"Microsoft YaHei",monospace; box-shadow:none; }
.combat-shell .skill b { display:block; margin:4px 0 0; font:10px/1.4 "Microsoft YaHei",sans-serif; color:#d9ccb0; white-space:nowrap; }
.combat-shell .skill i { position:absolute; left:3px; bottom:3px; width:calc(100% - 6px); max-height:calc(100% - 6px); background:#0a0d16cc; pointer-events:none; border-top:1px solid #dfc89455; }
.combat-shell .skill .cooldown-number { position:absolute; inset:3px; display:grid; place-items:center; background:transparent; color:#fff5e1; font:bold 21px Georgia,serif; text-shadow:0 2px 4px #000; z-index:2; }
.combat-shell .skill:hover { background:none; border:0; }.combat-shell .skill:hover .skill-icon,.combat-shell .skill:focus-visible .skill-icon { border-color:#c5b599; box-shadow:0 0 0 1px #c5b59944; }
.combat-shell .skill[aria-disabled="true"] .skill-icon img { filter:saturate(.5) brightness(.65); }
.combat-shell .skill.spent .skill-icon { border-color:#645f55; }
.combat-shell .skill.used .skill-icon { border-color:#e2c4a3; box-shadow:inset 0 0 0 1px #e2c4a3; }
.combat-shell .skill-tooltip { display:none; position:absolute; left:50%; bottom:calc(100% + 12px); transform:translateX(-50%); z-index:15; width:235px; padding:13px 15px; border:1px solid #b59c6b; background:linear-gradient(130deg,#26282fee,#0f141bf5); box-shadow:0 6px 25px #0009; color:#ddd9ce; text-align:left; font:11px/1.8 "Microsoft YaHei",sans-serif; pointer-events:none; }
.combat-shell .skill:hover .skill-tooltip,.combat-shell .skill:focus-visible .skill-tooltip { display:block; }
.combat-shell .skill-tooltip strong { display:block; font:17px/1.6 var(--serif); color:#efd8a7; border-bottom:1px solid #77674477; padding-bottom:6px; margin-bottom:7px; }
.combat-shell .skill-tooltip em { float:right; font:11px/1.8 Consolas,monospace; color:#b7bdc2; }
.combat-shell .skill-tooltip>span { display:block; font-size:11px; color:#cbd0d1; }
.combat-shell .skill-tooltip small { display:block; font-size:10px; color:#c5ac7a; margin-top:8px; }
.command-row { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:6px; }
.command-row>span { font-size:8px; color:#9aaeb7; white-space:nowrap; }
.combat-shell .command-grid { display:flex; gap:4px; }
.combat-shell .command-grid button { display:flex; gap:4px; align-items:center; padding:3px 5px; font-size:9px; border:1px solid #505c60; background:#192128; color:#b6c5cc; border-radius:0; }
.combat-shell .command-grid kbd { padding:0 3px; font:8px/1.5 Consolas,monospace; border-color:#4d5860; color:#c5d6dc; background:#101820; }
.combat-shell .command-grid .active { background:#294453; border-color:#a5c4ca; color:#eff4e9; box-shadow:inset 0 -2px #97babc55; }
.battle-status { display:flex; gap:16px; align-items:center; min-height:27px; padding:5px 9px; border:0; background:#141d1e; font-size:9px; color:#92a49f; }
.battle-status #ally-intent { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.combat-shell .battle-status .memory { font-size:8px; padding:0; margin:0; border:0; color:#8fa3aa; }
.combat-shell .battle-status .memory.learned { color:#c3cda1; }
.combat-shell .battle-status .movement { display:block; margin:0; font-size:8px; white-space:nowrap; color:#b2b5ab; }
.battle-status kbd { padding:0 3px; font-size:8px; background:#11161b; border-color:#4d5354; }
.combat-shell .chapter-strip { min-height:29px; margin:0; padding:3px 6px; gap:16px; border-top:0; border-bottom:1px solid #514b3b55; font-size:9px; }
.combat-shell .chapter-strip>span { font-size:9px; letter-spacing:1px; }
.combat-shell #route-strip { gap:5px; }.combat-shell #route-strip button { font-size:9px; padding:3px 5px; }
.combat-shell .chapter-strip>small { font-size:8px; }
.combat-shell .preview-strip { min-height:26px; margin:0; padding:3px 6px; gap:9px; font-size:9px; }
.combat-shell .preview-strip>span { font-size:9px; margin-right:4px; letter-spacing:1px; }
.combat-shell .preview-strip button { font-size:8px; padding:1px 7px; border-color:#514e3d; }
.combat-shell .preview-strip>small { margin-left:auto; font-size:8px; color:#839086; }
.combat-shell .preview-strip #preview-exit { margin-left:0; border-color:#a58a56; }
.combat-shell:fullscreen { width:100%; max-width:100%; height:100dvh; padding:0 max(16px,calc((100vw - (100dvh - 268px)*680/384)/2)); overflow:auto; background:#0c1015; }
@media(min-width:1600px) and (min-height:950px) { .combat-shell { max-width:min(1560px,calc((100dvh - 316px)*680/384)); }.combat-shell .skill,.combat-shell .skill-icon { width:64px; }.combat-shell .skill-icon { height:64px; }.combat-shell .skill-icon img { width:56px; height:56px; }.combat-shell .skill b { font-size:11px; }.combat-shell .action-deck { padding:11px 26px; }.vital-orb { width:76px; height:76px; }.fighter-info { width:145px; } }
@media(max-width:1100px), (max-height:820px) { .combat-shell { width:calc(100% - 24px); }.combat-shell .action-deck { gap:12px; padding:9px 12px; }.vital-orb { width:64px; height:64px; }.orb-readout b { font-size:22px; }.fighter-info { width:90px; }.combat-shell .vital-card { gap:10px; }.combat-shell .stage-hud { width:150px; right:9px; top:9px; }.combat-shell .room-banner strong { font-size:17px; }.combat-shell .mission-panel p { font-size:9px; }.combat-shell .skill,.combat-shell .skill-icon { width:52px; }.combat-shell .skill-icon { height:52px; }.combat-shell .skill-icon img { width:44px; height:44px; }.combat-shell .skill-row { gap:6px; }.combat-shell .topbar { gap:14px; }.combat-shell .chapter-heading .eyebrow { display:none; } }
@media(max-height:680px) { .combat-shell { max-width:1000px; } }
@media(max-width:800px) {
 .combat-shell { width:calc(100% - 16px); }.combat-shell .topbar { gap:8px; }.combat-shell .brand { min-width:125px; }.combat-shell .brand strong { font-size:14px; }.combat-shell .chapter-heading { padding-left:12px; }.combat-shell .chapter-heading h1 { font-size:11px; letter-spacing:0; }.combat-shell .topbar nav button { padding:4px; font-size:9px; }.combat-shell .topbar nav kbd { display:none; }
 .combat-shell .action-deck { grid-template-columns:100px minmax(0,1fr); gap:10px; padding:10px 12px 13px; }.combat-shell .fighter-info { display:none; }.combat-shell .vital-card { width:auto; }.combat-shell .skill-row { justify-content:center; }.hotbar-heading { padding-left:max(0px,calc((100% - 342px)/2)); padding-right:max(0px,calc((100% - 342px)/2)); }.combat-shell .battle-status .memory { display:none; }
 .combat-shell .stage-hud { width:134px; }.combat-shell .mission-panel p { display:none; }.combat-shell .mission-panel h2 { font-size:12px; }.combat-shell .room-banner { left:10px; top:9px; }.combat-shell .room-banner small { font-size:8px; }.combat-shell .toast { font-size:10px; bottom:45px; }.combo-display { left:15px; }.combo-display strong { font-size:43px; }
 .combat-shell .chapter-strip { flex-wrap:wrap; gap:5px 12px; }.combat-shell .chapter-strip>span { width:auto; }.combat-shell .chapter-strip>small { display:none; }.combat-shell .preview-strip>small { display:none; }
}
@media(max-width:580px) {
 .combat-shell { width:calc(100% - 16px); }.combat-shell .topbar { height:auto; min-height:66px; flex-wrap:wrap; gap:4px 12px; padding:6px 0; }.combat-shell .chapter-heading { margin-left:auto; }.combat-shell .topbar nav { width:100%; justify-content:flex-end; gap:12px; }.combat-shell .topbar nav button { padding:3px 5px; }.combat-shell .location-bar { height:25px; }.combat-shell #room-tag { font-size:8px; }.area-counter { gap:5px; font-size:8px; }.combat-shell #chapter-progress { font-size:8px; }.combat-shell .location-bar strong { font-size:10px; }
 .combat-shell .stage-hud { width:100px; top:5px; right:5px; gap:4px; }.combat-shell .minimap-panel { padding:4px; }.hud-caption { margin-bottom:3px; font-size:7px; }.combat-shell .map-legend { display:none; }.mission-panel summary { font-size:8px; padding:4px 5px; }.mission-body { padding:0 5px 5px; }.combat-shell .mission-panel h2 { font-size:10px; margin:3px 0; }.combat-shell .objective-state { display:none; }.combat-shell .next-button { font-size:8px; padding:4px; }.combat-shell .mission-panel p { display:none; }
 .combat-shell .room-banner { max-width:53%; top:7px; left:6px; padding:3px 6px; }.combat-shell .room-banner strong { font-size:13px; letter-spacing:1px; }.combat-shell .room-banner small { display:none; }.combat-shell .toast { max-width:92%; font-size:9px; padding:4px 8px; bottom:32px; }.combat-shell .interact-hint { font-size:9px; padding:4px 8px; bottom:5px; }.combat-shell .boss-bar { left:6px; right:112px; top:38px; padding:4px 6px; font-size:10px; }.combat-shell #boss-phase { display:none; }.combat-shell #boss-health-text { font-size:8px; }.combat-shell .bar.boss { height:7px; }.combo-display { top:43%; left:10px; }.combo-display strong { font-size:30px; }.combo-display>span { font-size:9px; }.combo-display small { display:none; }
 .combat-shell .action-deck { grid-template-columns:1fr; gap:9px 12px; padding:11px 12px 9px; }.combat-shell .player-card { grid-column:1; grid-row:1; justify-content:flex-start; }.combat-shell .hotbar { grid-column:1/-1; grid-row:2; padding-top:6px; border-top:1px solid #5c574166; }.combat-shell .fighter-info { display:block; width:80px; }.combat-shell .fighter-heading { margin-bottom:3px; gap:6px; }.combat-shell .fighter-heading b { font-size:17px; }.combat-shell .portrait { width:27px; height:29px; }.fighter-heading small { font-size:7px; }.fighter-state { font-size:8px; }.frost-status { gap:4px; margin-top:4px; }.frost-status img { width:21px; height:21px; }.frost-status>span { font-size:8px; }.frost-status small { font-size:7px; }
 .vital-orb { width:63px; height:63px; padding:6px; }.orb-readout b { font-size:17px; }.orb-readout small { font-size:7px; margin-top:3px; }.orb-name { font-size:7px; padding:0 6px; bottom:-9px; letter-spacing:1px; }.vital-orb:before { width:10px; height:10px; left:calc(50% - 5px); top:-4px; }.combat-shell .vital-card { gap:9px; }
 .hotbar-heading { padding:0 2px 7px; }.combat-shell .skill-row { justify-content:space-between; gap:5px; }.combat-shell .skill,.combat-shell .skill-icon { width:49px; }.combat-shell .skill-icon { height:49px; }.combat-shell .skill-icon img { width:41px; height:41px; }.combat-shell .skill b { font-size:9px; }.combat-shell .skill kbd { font-size:8px; line-height:13px; }.command-row { margin-top:8px; }.combat-shell .command-grid button { font-size:10px; padding:4px 7px; }.combat-shell .skill-tooltip { width:200px; }.combat-shell .skill:nth-child(-n+2) .skill-tooltip { left:0; transform:none; }.combat-shell .skill:nth-last-child(-n+2) .skill-tooltip { left:auto; right:0; transform:none; }
 .battle-status { display:block; padding:6px 8px; font-size:9px; }.battle-status #ally-intent { display:block; }.combat-shell .battle-status .movement { margin-top:5px; font-size:8px; }.combat-shell .chapter-strip { padding:6px 3px; }.combat-shell #route-strip { gap:2px; }.combat-shell #route-strip button { font-size:8px; padding:3px 2px; }.combat-shell .preview-strip { padding:6px 3px; flex-wrap:wrap; gap:6px; }.combat-shell .preview-strip>span { width:auto; font-size:8px; }
}
@media(max-width:350px) { .combat-shell .fighter-info { width:65px; }.combat-shell .vital-card { gap:6px; }.vital-orb { width:55px; height:55px; }.combat-shell .action-deck { padding:10px 8px; gap:8px; }.combat-shell .portrait { display:none; }.combat-shell .skill,.combat-shell .skill-icon { width:42px; }.combat-shell .skill-icon { height:42px; }.combat-shell .skill-icon img { width:34px; height:34px; }.combat-shell .skill-row { gap:4px; }.command-row { gap:5px; }.combat-shell .command-grid button { padding:4px 5px; } }
@media(prefers-reduced-motion:reduce) { .orb-liquid { transition:none; } }

/* Party status lives in the arena; keep it clear of the boss bar and stage title. */

.combat-shell .party-status { position:absolute; top:14px; left:14px; z-index:3; display:flex; gap:9px; width:204px; padding:9px 10px; background:#111b1be0; border:1px solid #9aafa226; border-radius:2px; }
.party-details { min-width:0; flex:1; }
.party-heading { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:7px; }
.party-heading b { font:13px var(--serif); color:#dae0d7; }
.party-heading b small { font:8px "Microsoft YaHei",sans-serif; color:#829790; margin-left:6px; }
.combat-shell .party-status #ally-hp-text { font:9px Consolas,monospace; color:#b1c7c2; }
.combat-shell .party-status .bar.ally { height:4px; border:0; background:#41504b; }
.combat-shell .party-status .bar.ally i { background:#8cbbb1; }
.combat-shell .party-status.low .bar.ally i { background:#cb9381; }
.combat-shell .party-status.down { filter:grayscale(1); }
.combat-shell .party-status .frost-status { margin-top:6px; gap:5px; }
.combat-shell .party-status .frost-status img { width:17px; height:17px; border:0; filter:saturate(.55); }
.combat-shell .party-status .frost-status>span { font-size:8px; color:#a9bbb4; }
.combat-shell .party-status .frost-status small { display:inline; font-size:8px; margin-left:4px; color:#8ba79d; }
.combat-shell .cinematic .party-status { visibility:hidden; pointer-events:none; }
.combat-shell .hotbar { width:max-content; max-width:100%; justify-self:center; }
.combat-shell .skill b { color:#bfc8bd; font-weight:400; }
.hotbar-heading { color:#82958e; letter-spacing:1px; }.hotbar-heading small { color:#afbaac; }
.combat-shell .bar.health { border:0; height:3px; background:#3c4440; }.combat-shell .bar.health i { background:#b37c6a; }
.combat-shell .command-grid button { background:transparent; border-color:#8ca39726; color:#99afa5; }
.combat-shell .command-grid .active { background:#263b35; border-color:#799f8c77; color:#c3d7c7; box-shadow:none; }
.combat-shell .skill-tooltip { border-color:#74877977; background:#162121f5; box-shadow:0 8px 24px #0006; }
.combat-shell .skill-tooltip strong { color:#d0c6ae; }.combat-shell .skill-tooltip small { color:#a5b3a5; }
.combat-shell .topbar,.combat-shell .chapter-strip { border-color:#8ca39726; }
.combat-shell .topbar nav .map-button { color:#bcc9b9; border-color:#8ca3973b; background:transparent; }
.combat-shell .mission-panel summary { color:#bcc9b9; background:none; }
.combat-shell .mission-panel h2 { color:#d0d7c8; }.combat-shell .objective-state { color:#a7b5a5; }
.combat-shell #minimap { border-color:#8ca39733; opacity:.82; }
@media(max-width:1100px), (max-height:820px) { .combat-shell .action-deck { grid-template-columns:185px minmax(0,1fr); } }
@media(max-width:800px) { .combat-shell .action-deck { grid-template-columns:74px minmax(0,1fr); }.combat-shell .party-status { top:10px; left:10px; width:185px; padding:7px 8px; }.combat-shell .room-banner { top:auto; bottom:14px; left:12px; } }
@media(max-width:580px) {
 .combat-shell .action-deck { grid-template-columns:1fr; gap:12px; padding:12px; }
 .combat-shell .player-card { grid-column:1; grid-row:1; }.combat-shell .player-card .fighter-info { width:auto; flex:1; }.combat-shell .player-card .fighter-heading { display:none; }
 .combat-shell .hotbar { width:100%; grid-column:1; grid-row:2; border-color:#8ca39726; }
 .combat-shell .party-status { top:7px; left:7px; width:170px; padding:6px; gap:6px; }
 .combat-shell .party-status .portrait { display:block; width:26px; height:30px; }
 .party-heading { margin-bottom:5px; }.party-heading b { font-size:11px; }
 .combat-shell .party-status .frost-status { margin-top:4px; }.combat-shell .party-status .frost-status img { width:13px; height:13px; }
 .combat-shell .party-status .frost-status>span { font-size:7px; }.combat-shell .party-status .frost-status small { font-size:7px; margin-left:2px; }
 .combat-shell .room-banner { top:auto; bottom:9px; left:10px; padding:0; }.combat-shell .room-banner strong { font-size:11px; }
 .combat-shell .boss-bar { top:75px; left:7px; right:112px; }
 .combo-display { top:auto; bottom:33px; }.combo-display strong { font-size:25px; }
 .vital-orb { width:47px; height:47px; padding:3px; }.orb-readout b { font-size:16px; }.orb-readout small { display:none; }
}
@media(max-width:350px) { .combat-shell .action-deck { padding:10px 8px; }.combat-shell .party-status { width:165px; gap:4px; }.combat-shell .skill-row { gap:4px; } }

/* Ember Arena combat extension: actual command routes and resources. */
.arena-try{display:block;background:#d4ac61;color:#1b2425;border:1px solid #f3d798;padding:12px 22px;margin:14px 0;font-weight:700;font-size:15px;cursor:pointer}
.fighting-gauges{display:flex;gap:18px;margin:6px 0 8px;font-size:10px;color:#dec99e}.fighting-gauges>span{flex:1}.fighting-gauges b{float:right;font-size:9px}.fighting-gauges i{display:block;background:#17252c;height:4px;margin-top:3px}.fighting-gauges em{display:block;height:100%;background:#e3b35c;width:40%}#guard-fill{background:#8cbfc6}
.arena-actions{display:flex;gap:4px;flex-wrap:wrap}.arena-actions button{flex:1;min-width:64px;padding:5px 3px;background:#17262b;border:1px solid #7f704c;color:#ead8b5;font-size:10px;cursor:pointer}.arena-actions button[aria-disabled=true]{opacity:.45}.arena-actions small{display:block;font-size:8px;color:#bdbaa3}.arena-actions button.active{background:#725d31}.combo-route{font-size:9px;color:#dcb97e;margin-top:5px;min-height:12px}
@media(min-width:1000px){.combat-shell{max-width:min(1560px,calc((100dvh - 350px)*680/384))}.combat-shell .action-deck{padding-top:10px;padding-bottom:10px}}
@media(max-width:700px){.arena-actions button{font-size:9px;min-width:45px}.fighting-gauges{gap:8px}.combo-route{font-size:8px}}

.trial-controls{display:flex;gap:8px;margin-top:5px}.trial-controls[hidden]{display:none}.trial-controls button{border:1px solid #a38b58;background:#263535;color:#e3d2a8;font-size:10px;padding:3px 9px;cursor:pointer}

/* All combat controls share the canvas frame, in windowed and fullscreen modes. */
#game-root { width:100%; min-height:100dvh; background:#101918; }
.combat-shell { width:100%; max-width:none; height:100dvh; margin:0; padding:0; overflow:hidden; }
.combat-shell .game-layout,.combat-shell .play-column { width:100%; height:100%; margin:0; padding:0; display:block; }
.combat-shell .arena-wrap { position:relative; width:100%; height:100%; aspect-ratio:auto; border:0; box-shadow:none; overflow:hidden; isolation:isolate; }
.combat-shell #game { position:absolute; inset:0; display:block; width:100%; height:100%; outline:none; }
.combat-shell .arena-wrap:after { inset:0; border:0; background:linear-gradient(180deg,#07151460,transparent 18%,transparent 72%,#07151488); z-index:1; pointer-events:none; }
#game-root:fullscreen,#game-root.immersive { width:100vw; height:100dvh; overflow:hidden; background:#101918; }
#game-root.immersive { position:fixed; inset:0; z-index:100; }
#game-root:fullscreen .combat-shell { width:100%; height:100%; padding:0; max-width:none; }
body:has(.combat-shell:not([inert])) { overflow:hidden; }
.combat-shell .topbar { position:absolute; top:12px; right:14px; left:auto; z-index:20; height:28px; min-height:0; padding:0; margin:0; border:0; background:#111b1bd9; border-radius:3px; gap:0; flex-wrap:nowrap; }
.combat-shell .topbar .brand,.combat-shell .topbar .chapter-heading { display:none; }
.combat-shell .topbar nav { width:auto; gap:2px; justify-content:flex-end; }
.combat-shell .topbar nav button { padding:5px 8px; font-size:10px; border:0; background:transparent; color:#d1d9cc; }
.combat-shell .topbar nav button:hover { background:#3d514477; }
.combat-shell .location-bar { position:absolute; z-index:3; top:13px; left:14px; right:auto; height:25px; padding:0 8px; max-width:42%; background:#111b1bc9; border-radius:2px; }
.combat-shell .location-bar .area-counter { margin-left:10px; }.combat-shell #room-tag { display:none; }
.combat-shell .party-status { top:52px; left:14px; width:204px; margin:0; }
.combat-shell .stage-hud { top:52px; right:14px; width:156px; }
.combat-shell .mission-panel p { display:none; }
.combat-shell .mission-panel h2 { font-size:12px; }
.combat-shell .boss-bar { top:54px; left:26%; right:24%; padding:7px 10px; }
.combat-shell .room-banner { display:none; }
.combat-shell .action-deck { position:absolute; z-index:10; left:18px; right:18px; bottom:30px; display:grid; grid-template-columns:minmax(170px,1fr) auto minmax(170px,1fr); align-items:end; gap:18px; padding:0; margin:0; border:0; background:none; box-shadow:none; pointer-events:none; }
.combat-shell .action-deck .player-card { grid-column:1; grid-row:1; width:max-content; min-width:0; max-width:100%; gap:10px; background:#111b1bd9; padding:10px; border:1px solid #9aafa226; border-radius:3px; pointer-events:auto; }
.combat-shell .player-card .fighter-info { display:block; width:100px; flex:none; }
.combat-shell .fighter-heading { margin-bottom:5px; }.combat-shell .fighter-heading b { font-size:15px; }.combat-shell .player-card .portrait { width:26px; height:28px; }
.combat-shell .vital-orb { width:58px; height:58px; padding:4px; }.combat-shell .orb-readout b { font-size:19px; }
.combat-shell .hotbar { grid-column:2; grid-row:1; width:max-content; max-width:100%; padding:10px 12px 8px; border:1px solid #9aafa226; border-radius:3px; background:#111b1be0; pointer-events:auto; }
.combat-shell .hotbar-heading { padding:0 1px 6px; }
.combat-shell .skill-row { width:auto; gap:6px; justify-content:center; }
.combat-shell .skill,.combat-shell .skill-icon { width:48px; }.combat-shell .skill-icon { height:48px; padding:2px; }.combat-shell .skill-icon img { width:42px; height:42px; }.combat-shell .skill b { font-size:9px; margin-top:3px; }
.combat-shell .fighting-gauges { gap:14px; margin:5px 0; font-size:8px; color:#b8c5b5; }.combat-shell .fighting-gauges b { font-size:8px; }.combat-shell .fighting-gauges i { height:3px; margin-top:2px; }
.combat-shell .arena-actions { gap:4px; flex-wrap:nowrap; }.combat-shell .arena-actions button { flex:1; min-width:0; padding:4px 3px; border-color:#8ca39736; color:#c2cdbb; font-size:8px; background:#26382d88; }.combat-shell .arena-actions small { display:none; }.combat-shell .arena-actions kbd { font-size:8px; }
.combat-shell .combo-route { margin-top:4px; min-height:10px; font-size:8px; color:#b8bda5; }
.combat-shell .command-row { margin-top:5px; }.combat-shell .command-grid button { font-size:9px; padding:3px 6px; }
.combat-shell .battle-status { position:absolute; z-index:3; left:18px; right:18px; bottom:6px; min-height:18px; padding:0; background:none; pointer-events:none; color:#c3d0c2; text-shadow:0 1px 4px #000; }
.combat-shell .battle-status .memory { display:none; }
.combat-shell .battle-status .movement { color:#c3d0c2; }
.combat-shell .toast { top:auto; bottom:var(--hud-bottom,230px); max-width:60%; z-index:5; }
.combat-shell .interact-hint { bottom:calc(var(--hud-bottom,230px) - 30px); z-index:5; }
.combat-shell .combo-display { top:35%; bottom:auto; }
.combat-shell .pause-badge { z-index:8; pointer-events:none; }
.combat-shell .arena-wrap>.player-card { position:absolute; z-index:10; bottom:30px; left:18px; width:max-content; min-width:0; max-width:210px; padding:10px; gap:10px; border:1px solid #9aafa226; background:#111b1bd9; border-radius:3px; }
.combat-shell .cinematic>.player-card { visibility:hidden; pointer-events:none; }
.combat-shell .cinematic .action-deck,.combat-shell .cinematic .battle-status { visibility:hidden; pointer-events:none; }.combat-shell .cinematic .action-deck * { pointer-events:none; }
.journey-modal .chapter-strip,.journey-modal .preview-strip { display:flex; flex-wrap:wrap; margin:16px 0; padding:12px 0; gap:10px; font-size:12px; }
.journey-modal .chapter-strip>span,.journey-modal .preview-strip>span { width:100%; }.journey-modal .preview-strip>small { width:100%; font-size:10px; }
.journey-modal .preview-strip button { padding:7px 10px; font-size:12px; }.journey-modal #route-strip button { font-size:12px; }
@media(min-width:1600px) and (min-height:850px) {
 .combat-shell .skill,.combat-shell .skill-icon { width:56px; }.combat-shell .skill-icon { height:56px; }.combat-shell .skill-icon img { width:50px; height:50px; }
 .combat-shell .action-deck { bottom:34px; }.combat-shell .arena-actions button { font-size:10px; }.combat-shell .stage-hud { width:180px; }
}
@media(max-width:1000px) {
 .combat-shell .action-deck { grid-template-columns:minmax(90px,1fr) auto minmax(0,1fr); left:12px; right:12px; gap:12px; }
 .combat-shell .player-card .fighter-info { display:none; }.combat-shell .action-deck .player-card { padding:8px; }
 .combat-shell .arena-wrap>.player-card { left:12px; }
 .combat-shell .party-status { width:185px; }.combat-shell .stage-hud { width:135px; }.combat-shell .boss-bar { left:218px; right:170px; }
}
@media(max-width:600px) {
 .combat-shell .topbar { top:8px; left:8px; right:8px; height:28px; }.combat-shell .topbar nav { width:100%; justify-content:space-between; gap:0; }.combat-shell .topbar nav button { padding:4px 6px; font-size:9px; }.combat-shell .topbar nav kbd { display:none; }
 .combat-shell .location-bar { top:42px; left:8px; padding:0; background:none; max-width:65%; height:20px; }.combat-shell .location-bar strong { font-size:10px; }.combat-shell .area-counter { gap:5px; }.combat-shell #chapter-progress { display:none; }
 .combat-shell .party-status { top:69px; left:8px; width:170px; padding:6px; gap:6px; }.combat-shell .party-status .portrait { width:26px; height:30px; display:block; }
 .combat-shell .stage-hud { top:43px; right:8px; width:102px; gap:5px; }.combat-shell .minimap-panel { padding:4px; }.combat-shell .mission-panel h2 { font-size:10px; }.combat-shell .mission-panel summary { font-size:8px; padding:4px 5px; }.combat-shell .mission-body { padding:0 5px 5px; }.combat-shell .objective-state { display:none; }
 .combat-shell .boss-bar { top:139px; left:8px; right:122px; padding:5px; font-size:10px; }
 .combat-shell .action-deck { left:8px; right:8px; bottom:27px; grid-template-columns:1fr; gap:8px; }
 .combat-shell .action-deck .player-card { grid-row:1; width:100%; max-width:none; padding:5px 8px; gap:8px; }.combat-shell .player-card .fighter-info { display:block; flex:1; width:auto; }.combat-shell .player-card .fighter-heading { display:none; }.combat-shell #hero-state { display:none; }
 .combat-shell .arena-wrap>.player-card { top:130px; bottom:auto; left:8px; width:170px; max-width:none; padding:5px 7px; gap:7px; }
 .combat-shell .boss-bar { top:185px; }
 .combat-shell .vital-orb { width:36px; height:36px; padding:2px; }.combat-shell .orb-readout b { font-size:14px; }.combat-shell .orb-readout small { display:none; }
 .combat-shell .hotbar { grid-column:1; grid-row:2; width:100%; padding:8px; }.combat-shell .hotbar-heading { padding-bottom:5px; }.combat-shell .skill-row { justify-content:space-between; gap:4px; }
 .combat-shell .skill,.combat-shell .skill-icon { width:42px; }.combat-shell .skill-icon { height:42px; }.combat-shell .skill-icon img { width:36px; height:36px; }.combat-shell .skill b { font-size:8px; }
 .combat-shell .command-row { gap:5px; }.combat-shell .command-grid button { padding:3px 5px; font-size:9px; }.combat-shell .command-row>span { font-size:7px; }
 .combat-shell .combo-route { display:none; }.combat-shell .arena-actions button { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
 .combat-shell .battle-status { left:8px; right:8px; bottom:4px; display:block; font-size:8px; }.combat-shell .battle-status .movement { display:none; }
 .combat-shell .toast { max-width:90%; font-size:10px; }.combat-shell .interact-hint { max-width:90%; font-size:10px; }
 .combat-shell .skill-tooltip { width:190px; }.combat-shell .skill:nth-child(3) .skill-tooltip { left:-65px; transform:none; }.combat-shell .skill:nth-child(4) .skill-tooltip { left:auto; right:-65px; transform:none; }
}
@media(max-height:540px) and (min-width:601px) {
 .combat-shell .topbar { top:7px; }.combat-shell .location-bar { top:8px; }.combat-shell .party-status { top:42px; padding:5px; }.combat-shell .stage-hud { top:42px; width:112px; }.combat-shell .map-legend,.combat-shell .objective-state,.combat-shell .mission-body { display:none; }
 .combat-shell .action-deck { bottom:22px; }.combat-shell .hotbar { padding:6px 9px; }.combat-shell .skill,.combat-shell .skill-icon { width:38px; }.combat-shell .skill-icon { height:38px; }.combat-shell .skill-icon img { width:32px; height:32px; }.combat-shell .skill b { display:none; }.combat-shell .hotbar-heading { padding-bottom:4px; }.combat-shell .combo-route { display:none; }
 .combat-shell .boss-bar { top:43px; left:215px; right:150px; }.combat-shell .interact-hint { font-size:9px; padding:3px 8px; }.combat-shell .toast { font-size:9px; padding:4px 8px; }
}

/* Pause menu is part of the fullscreen root, including all nested dialogs. */
.game-menu { width:min(440px,calc(100vw - 28px)); padding:30px; background:linear-gradient(145deg,#17282b,#0d191e); border:1px solid #b9a47280; box-shadow:0 20px 90px #000b; }
.game-menu h2 { margin:10px 0; color:#f1dbb0; font-size:28px; }.game-menu #menu-location { color:#9fb6b7; font-size:12px; margin-bottom:22px; }.game-menu>.primary { width:100%; display:flex; justify-content:space-between; }
.menu-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; }.menu-options button { padding:14px 8px; color:#dce7df; border:1px solid #667f7855; background:#29413c55; }.menu-options button:hover { border-color:#d5b574; background:#46625b66; }.menu-display-status { color:#99c3d0; font-size:12px; }
.combat-shell .topbar nav #help-button,.combat-shell .topbar nav #journey-button,.combat-shell .topbar nav #sound-button { display:none; }
.energy-potion .pixel-art { filter:hue-rotate(165deg) saturate(1.3); }.skill.energy-potion { --skill-color:#7bcef2; }.fighting-gauges #energy-fill { background:linear-gradient(90deg,#3879b5,#83d5ef); }
@media(max-width:600px){.game-menu { padding:22px; }.menu-options button { padding:12px 6px; }.combat-shell .topbar nav { justify-content:flex-end; gap:10px; }}

/* PixelLab classic-v13 skins. The 144px panel has a 22px transparent margin:
   36px source slices / 22px outset retain the original 14px bevel at any size. */
.classic-ui { --slot:50px; --hud-text:#d7d7d9; --hud-muted:#a1a4b0; font-family:"Microsoft YaHei",sans-serif; }
.classic-ui .action-deck,.classic-ui .minimap-panel,.classic-ui .skill-tooltip {
 border:14px solid transparent; border-image:var(--skin-panel) 36 fill / 36px / 22px stretch;
 background:none; border-radius:0; image-rendering:pixelated; box-shadow:none;
}
.classic-ui .action-deck { left:50%; right:auto; bottom:25px; transform:translateX(-50%); width:760px; max-width:calc(100% - 24px); display:grid; grid-template-columns:210px 270px minmax(0,1fr); gap:16px; align-items:center; padding:4px 7px; margin:0; pointer-events:auto; }
.classic-ui .action-deck .player-card { position:static; display:flex; flex-direction:column; align-items:stretch; grid-column:1; grid-row:1; width:100%; max-width:none; min-width:0; padding:0 10px 0 0; gap:7px; border:0; border-right:1px solid #454753; border-radius:0; background:none; }
.classic-ui .player-card .fighter-heading { display:flex; align-items:center; gap:8px; margin:0; height:30px; }
.classic-ui .player-card .portrait { display:block; width:29px; height:32px; background:#252736; border:1px solid #535766; }
.classic-ui .fighter-heading b { font:15px/1.2 var(--serif); color:#edddc9; }.classic-ui .fighter-heading small { display:inline; margin-left:8px; color:#aaa8ae; font-size:9px; }
.classic-ui .fighter-heading #hero-state { margin-left:auto; font-size:9px; color:#c2beb3; }
.classic-ui .player-card .fighter-info { display:block; width:100%; flex:none; }
.classic-ui .hero-orb { display:block; width:100%; height:auto; border:0; border-radius:0; background:none; padding:0; box-shadow:none; }
.classic-ui .resource-label { display:flex; justify-content:space-between; font-size:9px; color:#c6a9a3; line-height:14px; }
.classic-ui #hp-text { display:inline; color:#f0dbd4; font:10px/14px Consolas,monospace; margin:0; }
.classic-ui .bar.health { height:10px; padding:1px; border:1px solid #5a4045; background:#18151d; box-shadow:inset 0 1px #080b13; }
.classic-ui .bar.health i { background:linear-gradient(#d8826f 0 20%,#a84942 20% 75%,#713033 75%); box-shadow:none; }
.classic-ui .hero-orb.low .bar.health { border-color:#ec9b7d; box-shadow:0 0 7px #c84c4144; }.classic-ui .hero-orb.down .bar.health { filter:grayscale(1); }
.classic-ui .fighting-gauges { display:flex; gap:10px; margin:5px 0 0; font-size:9px; color:#b7b6be; line-height:12px; }
.classic-ui .fighting-gauges b { font:9px/12px Consolas,monospace; }.classic-ui .fighting-gauges i { height:6px; margin-top:3px; background:#080d16; border:1px solid #494553; }.classic-ui #energy-fill { background:#c5a56b; }.classic-ui #guard-fill { background:#84a8b1; }
.classic-ui .hotbar { grid-column:2; grid-row:1; width:100%; max-width:none; padding:0; margin:0; background:none; border:0; border-radius:0; }
.classic-ui .skill-row { display:grid; grid-template-columns:repeat(5,var(--slot)); width:100%; gap:6px 5px; justify-content:center; }
.classic-ui .skill { display:block; position:relative; width:var(--slot); height:var(--slot); padding:0; border:0; border-radius:0; background:none; overflow:visible; }
.classic-ui .skill-icon { width:var(--slot); height:var(--slot); padding:6px; border:0; background:var(--skin-slot) center / 112% 112% no-repeat; image-rendering:pixelated; overflow:hidden; box-shadow:none; }
.classic-ui .skill-icon img { width:100%; height:100%; max-width:none; object-fit:cover; filter:saturate(.88); }
.classic-ui .skill>b { display:none; }.classic-ui .skill kbd { top:auto; bottom:3px; left:3px; padding:0 3px; border:1px solid #545463; background:#12131be8; color:#eee3ce; font:10px/13px Consolas,"Microsoft YaHei",sans-serif; text-shadow:0 1px #000; }
.classic-ui .skill:hover .skill-icon,.classic-ui .skill:focus-visible .skill-icon { box-shadow:inset 0 0 0 1px #d8c29a; filter:brightness(1.22); }
.classic-ui .skill.used .skill-icon { box-shadow:inset 0 0 0 2px #f1d3a0; }.classic-ui .skill[aria-disabled="true"] .skill-icon img { filter:saturate(.35) brightness(.5); }
.classic-ui .skill-icon>i { width:calc(100% - 12px); left:6px; bottom:6px; max-height:calc(100% - 12px); background:#080b14b8; }.classic-ui .skill .cooldown-number { inset:6px; background:none; color:#fff5dd; font:16px Consolas,monospace; text-shadow:1px 1px 2px #000; }
.classic-ui .skill-tooltip { bottom:calc(100% + 13px); width:230px; padding:8px; z-index:30; color:#ddd; font:11px/1.8 "Microsoft YaHei",sans-serif; }
.classic-ui .skill-tooltip strong { font-size:15px; color:#efdfc8; border-color:#454651; }.classic-ui .skill-tooltip>span { color:#bbc1c8; }.classic-ui .skill-tooltip small { color:#b5a278; }
.classic-ui .deck-utility { grid-column:3; grid-row:1; min-width:0; padding-left:4px; }
.classic-ui .utility-top { display:flex; align-items:center; justify-content:space-between; gap:6px; margin-bottom:6px; }
.classic-ui #guard-button { display:flex; align-items:center; gap:5px; padding:3px 6px 3px 3px; border:1px solid #4b4f60; border-radius:0; background:#20212d; font-size:10px; height:31px; }
.classic-ui #guard-button img { width:23px; height:23px; filter:saturate(.7); }.classic-ui #guard-button kbd { border:0; background:none; color:#e0cead; padding:0; font:10px Consolas,monospace; }
.classic-ui #guard-button.active { border-color:#9cb6c3; background:#344a59; }.classic-ui #potions { font:9px Consolas,"Microsoft YaHei",sans-serif; color:#b3ac9a; white-space:nowrap; }
.classic-ui .command-row { display:block; padding:0; margin:0; border:0; }.classic-ui .command-row>span { display:block; font-size:8px; letter-spacing:1px; color:#828997; margin-bottom:3px; }
.classic-ui .command-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:4px; }.classic-ui .command-grid button { display:block; padding:2px 4px; min-width:0; border:1px solid #424551; border-radius:0; background:#1a1b25; color:#a8adb8; font-size:9px; line-height:15px; }
.classic-ui .command-grid kbd { border:0; padding:0 4px 0 0; background:none; color:#b9b4a8; font:9px Consolas,monospace; }.classic-ui .command-grid button.active { background:#313b4a; border-color:#71869b; color:#e1e4e9; }
.classic-ui .combo-route { position:absolute; left:0; right:0; bottom:-28px; margin:0; text-align:center; color:#b6b4ac; font:9px/16px Consolas,"Microsoft YaHei",sans-serif; text-shadow:0 1px 3px #000; }
.classic-ui .trial-controls { position:absolute; right:1px; bottom:calc(100% + 20px); margin:0; padding:0; gap:5px; }.classic-ui .trial-controls button { padding:4px 8px; border:1px solid #5d6171; border-radius:0; background:#181c28e8; color:#d5cec0; font-size:10px; }
.classic-ui .party-status { top:43px; left:0; width:256px; height:80px; padding:15px 24px 14px 24px; gap:11px; border:0; background:var(--skin-party) center / 256px 80px no-repeat; border-radius:0; image-rendering:pixelated; }
.classic-ui .party-status .portrait { display:block; width:42px; height:44px; margin:0; border:0; background:none; }
.classic-ui .party-heading { margin:0 0 4px; gap:3px; line-height:15px; }.classic-ui .party-heading b { font-size:12px; color:#dadfea; }.classic-ui .party-heading b small { margin-left:5px; color:#8d9aa8; }
.classic-ui .party-status #ally-hp-text { font:9px Consolas,monospace; color:#c1d5dd; }.classic-ui .party-status .bar.ally { height:7px; border:1px solid #263748; background:#111724; padding:1px; }.classic-ui .party-status .bar.ally i { background:#7eafc0; }
.classic-ui .party-status .frost-status { margin-top:3px; gap:4px; }.classic-ui .party-status .frost-status img { width:12px; height:12px; }.classic-ui .party-status .frost-status>span,.classic-ui .party-status .frost-status small { font-size:8px; }
.classic-ui .topbar { top:12px; right:14px; height:28px; border:1px solid #4b4f5a; border-radius:0; background:#171a24d9; }.classic-ui .topbar nav button { color:#c4c6cb; font-size:10px; padding:5px 8px; }.classic-ui .topbar nav button:hover { background:#383c49; }
.classic-ui .location-bar { top:16px; left:24px; height:20px; padding:0; background:none; color:#969ba8; text-shadow:0 1px 3px #000; }.classic-ui .location-bar strong { color:#e1d4bc; }.classic-ui .location-bar .live-dot { display:none; }
.classic-ui .stage-hud { top:50px; right:16px; width:174px; gap:12px; }.classic-ui .minimap-panel { padding:0; }.classic-ui .hud-caption { font:9px/12px "Microsoft YaHei",sans-serif; letter-spacing:1px; color:#aab2bf; margin:0 0 5px; }.classic-ui #minimap { border:0; opacity:.95; }.classic-ui .map-legend { margin-top:5px; font-size:8px; }
.classic-ui .mission-panel { background:linear-gradient(90deg,#111823c9,#11182318); border:0; border-left:2px solid #817159; }.classic-ui .mission-panel summary { color:#a9a8a5; font-size:10px; padding:4px 7px; }.classic-ui .mission-panel h2 { font:13px/1.6 var(--serif); color:#dfd3bb; margin:2px 0; }.classic-ui .mission-body { padding:0 7px 6px; }.classic-ui .objective-state { border:0; padding:0; margin-top:3px; font-size:9px; color:#a7b6aa; }
.classic-ui .boss-bar { top:48px; left:50%; right:auto; transform:translateX(-50%); width:min(384px,calc(100% - 490px)); padding:0; border:0; background:none; }
.classic-ui .boss-bar>div:first-child { margin:0 15px -1px; gap:6px; font:12px var(--serif); color:#dfcac0; }.classic-ui #boss-phase { font:9px "Microsoft YaHei",sans-serif; color:#aba2af; }
.classic-ui .bar.boss { position:relative; height:30px; padding:7px 24px; background:var(--skin-boss) center / 100% 100% no-repeat; border:0; overflow:visible; image-rendering:pixelated; }
.classic-ui .bar.boss i { height:100%; background:linear-gradient(#c38479,#9b575c 40%,#6b3745); box-shadow:inset 0 1px #f1b8a077; }
.classic-ui .battle-status { bottom:7px; left:16px; right:16px; font-size:9px; color:#a5adaf; }.classic-ui .battle-status .movement { font-size:8px; margin:0; color:#a5adaf; }.classic-ui .battle-status kbd { background:#121823a8; border-color:#414959; }
.classic-ui #party-vitals { left:0; top:43px; width:256px; gap:0; }
.classic-ui .party-health { position:relative; width:256px; height:80px; border:0; padding:15px 24px 12px 78px; background:var(--skin-party) center / 100% 100% no-repeat; image-rendering:pixelated; color:#d5dbe5; font-size:11px; }
.classic-ui .party-health>div>span { font:10px/18px Consolas,monospace; color:#bccdd9; }.classic-ui .party-health small { font-size:8px; color:#a2b0bf; }.classic-ui .party-health .party-meter { height:7px; border:1px solid #354657; padding:1px; margin:4px 0; background:#101822; }.classic-ui .party-health .party-meter i { background:var(--member-color); opacity:.8; }
.classic-ui .party-portrait { position:absolute; left:25px; top:15px; width:42px; height:48px; object-fit:contain; }
.classic-ui .party-health.down { opacity:.75; filter:grayscale(1); }.classic-ui .party-empty { margin:12px 16px; font-size:10px; background:#141c29bb; }
#game-root:has(.classic-ui) .modal { border:14px solid transparent; border-image:var(--skin-panel) 36 fill / 36px / 22px stretch; border-radius:0; background:none; image-rendering:pixelated; box-shadow:0 15px 60px #0008; }
@media(max-width:800px) { .classic-ui .action-deck { width:700px; grid-template-columns:180px 250px minmax(0,1fr); gap:10px; --slot:46px; }.classic-ui .skill-row { gap:6px 4px; }.classic-ui .fighter-heading #hero-state { display:none; }.classic-ui .fighter-heading small { margin-left:5px; }.classic-ui .stage-hud { width:140px; }.classic-ui .boss-bar { width:calc(100% - 410px); }.classic-ui .topbar nav button { font-size:9px; padding:5px 6px; } }
@media(max-width:600px) {
 .classic-ui #party-vitals { top:65px; width:190px; }.classic-ui .party-health { width:190px; height:65px; padding:12px 18px 10px 56px; font-size:10px; }.classic-ui .party-portrait { left:18px; top:13px; width:31px; height:37px; }.classic-ui .party-health>div>span { font-size:8px; line-height:15px; }.classic-ui .party-health small { font-size:7px; }.classic-ui .party-health .party-meter { height:6px; margin:3px 0; }
 .classic-ui .topbar { left:8px; right:8px; top:8px; height:28px; }.classic-ui .location-bar { top:42px; left:15px; max-width:65%; height:20px; }.classic-ui .area-counter { margin-left:5px; }.classic-ui .location-bar strong { font-size:10px; }
 .classic-ui .party-status { top:65px; left:0; width:190px; height:68px; padding:13px 18px; gap:7px; background-size:190px 68px; }.classic-ui .party-status .portrait { width:31px; height:35px; }.classic-ui .party-heading { margin-bottom:3px; }.classic-ui .party-heading b { font-size:10px; }.classic-ui .party-heading b small { display:none; }.classic-ui .party-status #ally-hp-text { font-size:8px; }.classic-ui .party-status .frost-status>span { font-size:7px; }.classic-ui .party-status .frost-status small { margin-left:2px; font-size:7px; }.classic-ui .party-status .frost-status img { display:none; }
 .classic-ui .stage-hud { top:43px; right:9px; width:112px; gap:8px; }.classic-ui .minimap-panel { border-width:10px; border-image-width:26px; border-image-outset:16px; }.classic-ui .hud-caption { font-size:7px; margin-bottom:3px; }.classic-ui .mission-panel h2 { font-size:11px; }.classic-ui .mission-panel summary { font-size:8px; }.classic-ui .mission-body { display:block; }.classic-ui .boss-bar { top:144px; width:calc(100% - 24px); }.classic-ui .boss-bar>div:first-child { font-size:10px; }.classic-ui .bar.boss { height:24px; padding:6px 20px; }
 .classic-ui .action-deck { width:360px; max-width:calc(100% - 18px); grid-template-columns:minmax(0,1fr) 100px; gap:8px 10px; bottom:24px; padding:0 1px; --slot:42px; }
 .classic-ui .action-deck .player-card { grid-row:1; grid-column:1; padding:0; border:0; gap:4px; }.classic-ui .player-card .fighter-heading { display:flex; height:21px; gap:5px; }.classic-ui .player-card .portrait { width:20px; height:23px; }.classic-ui .fighter-heading b { font-size:12px; }.classic-ui .fighter-heading small { font-size:8px; }.classic-ui .fighter-heading #hero-state { display:none; }.classic-ui .resource-label { font-size:8px; line-height:12px; }.classic-ui #hp-text { font-size:9px; line-height:12px; }.classic-ui .bar.health { height:8px; }.classic-ui .fighting-gauges { font-size:8px; margin-top:4px; gap:6px; }.classic-ui .fighting-gauges b { font-size:8px; }.classic-ui .fighting-gauges i { height:5px; margin-top:2px; }
 .classic-ui .hotbar { grid-row:2; grid-column:1 / -1; padding:0; }.classic-ui .skill-row { grid-template-columns:repeat(5,var(--slot)); gap:5px; justify-content:space-between; }.classic-ui .skill-icon { padding:5px; }.classic-ui .skill kbd { font-size:9px; line-height:11px; }.classic-ui .skill-tooltip { position:fixed; left:50%!important; right:auto!important; bottom:calc(100% + 15px); transform:translateX(-50%)!important; width:250px; }
 .classic-ui .deck-utility { grid-column:2; grid-row:1; padding:0; }.classic-ui .utility-top { margin-bottom:4px; gap:4px; }.classic-ui #guard-button { height:24px; padding:1px 3px; gap:2px; font-size:8px; }.classic-ui #guard-button img { width:19px; height:19px; }.classic-ui #guard-button>span { display:none; }.classic-ui #potions { font-size:8px; }.classic-ui .command-row>span { display:none; }.classic-ui .command-grid { gap:3px; }.classic-ui .command-grid button { font-size:8px; line-height:14px; padding:1px 2px; }.classic-ui .command-grid kbd { font-size:8px; padding-right:2px; }.classic-ui .combo-route { display:none; }.classic-ui .battle-status { font-size:8px; bottom:4px; }.classic-ui .trial-controls { bottom:calc(100% + 20px); right:0; }.classic-ui .trial-controls button { font-size:9px; }
}
@media(max-height:540px) and (min-width:601px) {
 .classic-ui .action-deck { --slot:38px; bottom:20px; width:660px; grid-template-columns:190px 210px minmax(0,1fr); gap:10px; padding:0 4px; }.classic-ui .skill-row { gap:4px 5px; }.classic-ui .skill-icon { padding:5px; }.classic-ui .player-card .fighter-heading { height:24px; }.classic-ui .fighter-heading #hero-state { display:none; }.classic-ui .player-card .portrait { width:23px; height:25px; }.classic-ui .action-deck .player-card { gap:4px; }.classic-ui .combo-route { display:none; }.classic-ui .stage-hud { width:122px; top:45px; }.classic-ui .party-status { top:37px; }.classic-ui .boss-bar { top:45px; width:calc(100% - 425px); }.classic-ui .command-row>span { display:none; }.classic-ui .utility-top { margin-bottom:4px; }
}

/* Twelve aligned slots: nine moves, guard, and the two separate bottle types. */
.classic-ui .action-deck { width:820px; grid-template-columns:210px 325px minmax(0,1fr); }
.classic-ui .skill-row { grid-template-columns:repeat(6,var(--slot)); }
.classic-ui #guard-button { display:block; width:var(--slot); height:var(--slot); padding:0; border:0; background:none; }
.classic-ui #guard-button img { width:100%; height:100%; filter:saturate(.88); }
.classic-ui #guard-button kbd { position:absolute; bottom:3px; left:3px; padding:0 3px; border:1px solid #545463; background:#12131be8; color:#eee3ce; font:10px/13px Consolas,"Microsoft YaHei",sans-serif; }
.classic-ui #guard-button.active .skill-icon { box-shadow:inset 0 0 0 2px #b8d8e6; filter:brightness(1.2); }
.classic-ui #guard-button>.skill-icon { display:block; }
.classic-ui #guard-button>.skill-tooltip { display:none; }
.classic-ui #guard-button:hover>.skill-tooltip,.classic-ui #guard-button:focus-visible>.skill-tooltip { display:block; }
.classic-ui .energy-potion .skill-icon img { filter:saturate(.88); }
.classic-ui .utility-top { margin-bottom:9px; }.classic-ui #potions { white-space:normal; font:10px/1.7 "Microsoft YaHei",sans-serif; }
.classic-ui .command-row>span { font-size:9px; margin-bottom:5px; }.classic-ui .command-grid button { font-size:10px; padding:3px 5px; }
.classic-ui #energy-fill { background:linear-gradient(90deg,#467fa8,#8ec8dc); }
@media(max-width:1000px) and (min-width:701px) { .classic-ui .action-deck { --slot:44px; width:760px; grid-template-columns:180px 284px minmax(0,1fr); gap:12px; }.classic-ui .skill-row { gap:6px 4px; } }
@media(max-width:800px) and (min-width:701px) { .classic-ui .action-deck { --slot:42px; width:700px; grid-template-columns:160px 272px minmax(0,1fr); gap:10px; } }
@media(max-width:700px) and (min-width:601px) { .classic-ui .action-deck { --slot:38px; width:620px; grid-template-columns:145px 248px minmax(0,1fr); gap:8px; padding:0; }.classic-ui .skill-row { gap:5px 4px; }.classic-ui .fighter-heading small { display:none; }.classic-ui #hero-state { display:none; }.classic-ui .command-grid button { font-size:9px; padding:3px; }.classic-ui #potions { font-size:8px; } }
@media(max-width:600px) {
 .classic-ui .action-deck { width:360px; --slot:38px; grid-template-columns:minmax(0,1fr) 100px; gap:8px 10px; }
 .classic-ui .skill-row { grid-template-columns:repeat(6,var(--slot)); gap:5px 3px; }.classic-ui #guard-button kbd { font-size:9px; line-height:11px; }.classic-ui .utility-top { margin-bottom:3px; }.classic-ui #potions { font-size:8px; line-height:12px; }.classic-ui .command-grid button { font-size:8px; line-height:14px; padding:1px 2px; }.classic-ui .command-row>span { display:none; }
 .classic-ui .topbar nav { justify-content:space-between; gap:2px; }.classic-ui .topbar nav button { padding:4px 9px; font-size:10px; }.classic-ui .topbar #sound-button,.classic-ui .topbar #help-button,.classic-ui .topbar #map-button,.classic-ui .topbar #journey-button { display:none; }
 .classic-ui .boss-bar { top:270px; }.classic-ui .stage-hud { width:112px; }
}
@media(max-height:540px) and (min-width:701px) { .classic-ui .action-deck { --slot:38px; width:680px; grid-template-columns:175px 253px minmax(0,1fr); gap:10px; }.classic-ui .skill-row { gap:4px 5px; }.classic-ui #potions { font-size:9px; }.classic-ui .command-row>span { display:none; } }

/* v15: hero identity, independent status cluster, action-only hotbar. */
[data-hero="0"] { --identity-frame:var(--hero-frame-0); --identity:#eaa17b; --identity-dark:#8a392f; }
[data-hero="1"] { --identity-frame:var(--hero-frame-1); --identity:#a1dce6; --identity-dark:#426c92; }
[data-hero="2"] { --identity-frame:var(--hero-frame-2); --identity:#98d8b6; --identity-dark:#3e8063; }
[data-hero="3"] { --identity-frame:var(--hero-frame-3); --identity:#c3a4df; --identity-dark:#7a508d; }
[data-hero="4"] { --identity-frame:var(--hero-frame-4); --identity:#d4c6ed; --identity-dark:#6e6aab; }
[data-hero="5"] { --identity-frame:var(--hero-frame-5); --identity:#e9d89c; --identity-dark:#a0824b; }
[data-hero="6"] { --identity-frame:var(--hero-frame-6); --identity:#e8b286; --identity-dark:#a66c46; }
[data-hero="7"] { --identity-frame:var(--hero-frame-7); --identity:#c4ddb4; --identity-dark:#6e8c5f; }
.hero-ui .arena-wrap>.player-card { position:absolute; z-index:7; top:42px; left:0; bottom:auto; width:336px; height:110px; max-width:none; display:block; margin:0; padding:18px 26px 16px 101px; border:0; border-radius:0; background:var(--identity-frame) center / 100% 100% no-repeat; image-rendering:pixelated; }
.hero-ui .player-card .fighter-heading { display:flex; height:22px; gap:0; margin:0 0 4px; }
.hero-ui .player-card .fighter-heading>.portrait { position:absolute; left:25px; top:21px; width:65px; height:69px; border:0; background:#191c24; overflow:hidden; clip-path:polygon(6px 0,100% 0,100% 100%,0 100%,0 6px); }
.hero-ui .hero-headshot { display:block; width:100%; height:100%; object-fit:cover; }
.hero-ui .fighter-heading b { font:19px/22px var(--serif); color:#f3d3b5; }.hero-ui .fighter-heading small { display:inline; font-size:9px; margin-left:9px; color:#d39b7c; }
.hero-ui .fighter-heading #hero-state { position:absolute; top:87px; left:100px; width:200px; display:block; margin:0; font-size:8px; text-align:right; color:#b9a697; white-space:nowrap; }
.hero-ui .player-card .fighter-info { display:block; width:100%; }
.hero-ui .resource-label { font-size:9px; color:#d9b8a0; line-height:12px; }.hero-ui #hp-text { font:11px/12px Consolas,monospace; }
.hero-ui .bar.health { height:9px; border-color:#643b35; }.hero-ui .bar.health i { background:linear-gradient(#f1a079 0 16%,#ba5743 16% 75%,#79342c 75%); }
.hero-ui .fighting-gauges { margin-top:3px; font-size:8px; gap:10px; line-height:10px; }.hero-ui .fighting-gauges b { font:8px/10px Consolas,monospace; }.hero-ui .fighting-gauges i { height:4px; margin-top:1px; border:0; }.hero-ui #energy-fill { background:#e5a45e; }.hero-ui #guard-fill { background:#b7a68a; }
.hero-ui #party-vitals { top:152px; left:8px; width:256px; gap:1px; }.hero-ui .party-health { background-image:var(--identity-frame); color:var(--identity); height:76px; padding-top:14px; padding-bottom:10px; }.hero-ui .party-health .party-meter { border-color:var(--identity-dark); }.hero-ui .party-health .party-meter i { background:var(--identity); opacity:.95; }
.hero-ui .party-portrait { top:16px; left:25px; width:42px; height:43px; object-fit:cover; background:#191c24; clip-path:polygon(4px 0,100% 0,100% 100%,0 100%,0 4px); }
.hero-ui .arena-wrap>.player-card,.hero-ui .party-health { background-image:var(--identity-frame),linear-gradient(#11151cf5,#11151cf5); background-size:100% 100%,calc(100% - 30px) calc(100% - 20px); background-position:center; background-repeat:no-repeat; }
.hero-ui .party-health[data-hero="5"] { color:#49391e; }.hero-ui .party-health[data-hero="5"]>div>span,.hero-ui .party-health[data-hero="5"] small { color:#4d412e; }.hero-ui .party-health[data-hero="5"] .party-meter { background:#352e23; }.hero-ui .party-health[data-hero="5"] .party-meter i { background:#a47c38; }
.hero-ui .party-health>div>b { font-size:12px; font-weight:500; }.hero-ui .party-health small { color:#b5b5b9; }
.hero-ui .action-deck { --slot:50px; width:379px; max-width:calc(100% - 24px); left:50%; right:auto; bottom:26px; display:block; padding:6px 12px 8px; border-image-source:var(--hero-fire-panel); background:#15151df2; background-clip:padding-box; }
.hero-ui .action-deck .hotbar { width:100%; display:block; padding:0; }
.hero-ui .skill-row { display:grid; grid-template-columns:repeat(6,var(--slot)); justify-content:center; gap:7px 5px; }
.hero-ui .skill-icon { background-image:var(--hero-fire-slot); }.hero-ui .skill kbd,.hero-ui #guard-button kbd { border-color:#59423c; color:#ead0b3; background:#201719ed; }
.hero-ui .skill-tooltip { border-image-source:var(--hero-fire-panel); }
.hero-ui .bottle-counts { display:block; margin-top:8px; font:9px/12px "Microsoft YaHei",sans-serif; color:#b8a593; text-align:right; }
.hero-ui .combo-route { display:none; }.hero-ui .battle-status .movement { color:#bdc0bb; }
.hero-ui .boss-bar { width:min(384px,calc(100% - 540px)); top:50px; }
.hero-ui .cinematic>.player-card,.hero-ui .cinematic #party-vitals { visibility:hidden; }
/* All trial navigation is inside the pause menu. */
#pause-modal #trial-controls { position:static; display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0 0; padding:16px 0 0; border-top:1px solid #4a4445; }
#pause-modal #trial-controls button { padding:12px 8px; font-size:12px; border:1px solid #735346; border-radius:0; background:#2b2021; color:#e5c4a6; }
#pause-modal #trial-controls button:hover { border-color:#d8a677; background:#3b2a26; }
/* Choices are made before play or confirmed with a town party selection. */
.behavior-choice { min-width:0; border:0; margin:18px 0; padding:0; }
.behavior-choice legend { font-size:11px; color:#ddc6a7; letter-spacing:2px; padding:0; margin-bottom:8px; }
.behavior-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.behavior-options button { position:relative; text-align:left; padding:10px 12px; border:1px solid #5c5954; border-radius:0; background:#151f23d9; color:#aebbb8; }
.behavior-options b { display:block; font-size:12px; font-weight:500; }.behavior-options small { display:block; margin-top:4px; font-size:10px; line-height:1.7; color:#98aaa6; }
.behavior-options button[aria-pressed="true"] { background:#352c25ed; border-color:#d5ac76; color:#f0d4ac; box-shadow:inset 0 -2px #c78b4f; }
.behavior-options button[aria-pressed="true"]::after { content:'✓'; position:absolute; top:6px; right:8px; color:#e0b479; font-size:10px; }
.behavior-note { font-size:9px; color:#95a59f; margin-top:7px; }
.intro-behavior { max-width:480px; margin:18px 0 12px; }.intro-behavior .behavior-options small { display:none; }.intro-behavior .behavior-options button { padding:9px 10px; }.intro-behavior .behavior-note { color:#b5bca9; }
#intro .intro-stage { height:auto; min-height:650px; max-height:none; }#intro .intro-content { padding-top:32px; padding-bottom:36px; }#intro .intro-content h2 { margin-top:12px; margin-bottom:14px; }#intro .intro-tags { margin:16px 0; }
#party-modal .party-choice { border-color:var(--identity-dark); background:linear-gradient(150deg,#181d26,#172327); padding:10px 12px; }
#party-modal .party-choice[aria-pressed="true"] { border-color:var(--identity); box-shadow:inset 0 -2px var(--identity-dark); }
#party-modal .party-choice-head { width:92px; height:92px; display:block; object-fit:cover; align-self:center; border:2px solid var(--identity-dark); margin:6px auto 3px; }
#party-modal .party-choice h3 { font-size:18px; color:var(--identity); margin-top:5px; }.party-choice p { min-height:0; }
#party-modal .party-summary { margin-bottom:8px; padding:8px 0; }#party-modal .party-lede { margin:8px 0 10px; }#party-modal .party-behavior { margin:12px 0 16px; }
@media(min-width:1000px) {
 #party-modal .modal { padding:22px 24px; }
 #party-modal .party-choice { display:grid; grid-template-columns:80px minmax(0,1fr); grid-template-rows:18px 35px 45px auto; column-gap:10px; }
 #party-modal .selection-mark { grid-column:1/-1; text-align:right; }
 #party-modal .party-choice-head { grid-column:1; grid-row:2/4; width:80px; height:80px; margin:0; }
 #party-modal .party-choice h3 { grid-column:2; grid-row:2; align-self:end; margin:0; }
 #party-modal .party-choice small { grid-column:2; grid-row:3; align-self:center; font-size:10px; }
 #party-modal .party-choice p { grid-column:1/-1; margin:9px 0 2px; min-height:36px; }
 #party-modal .party-footer { margin-top:12px; }
}
@media(max-width:1000px) { .hero-ui .action-deck { --slot:46px; width:355px; }.hero-ui .skill-row { gap:6px 5px; }.hero-ui .arena-wrap>.player-card { width:306px; height:104px; padding-left:93px; padding-right:24px; }.hero-ui .player-card .fighter-heading>.portrait { width:59px; height:65px; left:24px; top:19px; }.hero-ui .fighter-heading #hero-state { top:84px; left:93px; width:187px; }.hero-ui #party-vitals { top:146px; }.hero-ui .boss-bar { width:calc(100% - 490px); } }
@media(max-width:700px) { .hero-ui .boss-bar { top:44px; width:calc(100% - 380px); }.hero-ui .boss-bar #boss-phase { display:none; } }
@media(max-width:600px) {
 .hero-ui .arena-wrap>.player-card { left:0; top:65px; width:208px; height:92px; padding:15px 16px 12px 66px; }
 .hero-ui .player-card .fighter-heading { height:17px; margin-bottom:3px; }.hero-ui .player-card .fighter-heading>.portrait { left:16px; top:19px; width:43px; height:50px; }.hero-ui .fighter-heading b { font-size:15px; line-height:17px; }.hero-ui .fighter-heading small { font-size:7px; margin-left:6px; }.hero-ui .fighter-heading #hero-state { display:none; }
 .hero-ui .resource-label { font-size:8px; line-height:11px; }.hero-ui #hp-text { font-size:9px; line-height:11px; }.hero-ui .bar.health { height:8px; }.hero-ui .fighting-gauges { gap:7px; font-size:7px; margin-top:4px; }.hero-ui .fighting-gauges b { font-size:7px; }
 .hero-ui #party-vitals { top:157px; left:4px; width:190px; gap:1px; }.hero-ui .party-health { width:190px; height:61px; padding:12px 18px 9px 56px; }.hero-ui .party-portrait { left:18px; top:13px; width:31px; height:34px; }.hero-ui .party-health>div>b { font-size:10px; }.hero-ui .party-health small { font-size:7px; }.hero-ui .party-health .party-meter { margin:2px 0; height:5px; }
 .hero-ui .action-deck { --slot:38px; width:294px; bottom:22px; max-width:calc(100% - 16px); padding:4px 7px 5px; }.hero-ui .skill-row { grid-template-columns:repeat(6,var(--slot)); gap:5px 3px; }.hero-ui .bottle-counts { font-size:8px; line-height:11px; margin-top:5px; }
 .hero-ui .boss-bar { top:46px; left:auto; right:8px; transform:none; width:104px; }.hero-ui .boss-bar>div:first-child { flex-wrap:wrap; gap:0; margin:0 7px; font-size:8px; }.hero-ui .boss-bar #boss-health-text { font-size:7px; }.hero-ui .bar.boss { height:18px; padding:4px 10px; }.hero-ui .stage-hud { top:91px; width:106px; }
 .hero-ui .battle-status #ally-intent { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.hero-ui .party-empty { font-size:8px; max-width:180px; }
 .behavior-options { gap:5px; }.behavior-options button { padding:9px 7px; }.behavior-options b { font-size:10px; }.behavior-options small { font-size:9px; }.behavior-options button[aria-pressed="true"]::after { right:4px; top:2px; font-size:8px; }.behavior-note { font-size:8px; }
 #intro .intro-content { padding-top:25px; padding-bottom:80px; }#intro .intro-stage { min-height:650px; }.intro-behavior .behavior-options button { padding:8px 6px; }.intro-behavior { margin-top:16px; }
 #party-modal .party-choice-head { width:72px; height:72px; }#party-modal .party-choice p { font-size:10px; }#party-modal .party-summary strong { font-size:17px; }#party-modal .party-lede { font-size:11px; }.party-choice .selection-mark { font-size:9px; }
}
@media(max-height:540px) and (min-width:601px) {
 .hero-ui .arena-wrap>.player-card { width:276px; height:92px; top:39px; padding:14px 22px 10px 85px; }.hero-ui .player-card .fighter-heading>.portrait { left:22px; top:16px; width:53px; height:58px; }.hero-ui .fighter-heading #hero-state { display:none; }.hero-ui .fighter-heading b { font-size:16px; }.hero-ui .player-card .fighter-heading { height:18px; }
 .hero-ui #party-vitals { top:132px; left:8px; width:204px; gap:0; }.hero-ui .party-health { width:204px; height:62px; padding:12px 19px 8px 62px; }.hero-ui .party-portrait { width:34px; height:36px; left:20px; top:13px; }.hero-ui .party-health small { font-size:7px; }.hero-ui .party-health .party-meter { height:5px; margin:2px 0; }
 .hero-ui .action-deck { --slot:38px; width:294px; bottom:20px; padding:3px 7px 5px; }.hero-ui .skill-row { gap:5px 3px; }.hero-ui .bottle-counts { font-size:8px; margin-top:4px; }.hero-ui .boss-bar { width:calc(100% - 440px); top:42px; }.hero-ui .stage-hud { top:42px; }
}

/* Website / launch page only. Never style the in-game shell or menus. */
#intro { --page-title:84px; --page-copy:490px; --page-height:700px; --page-image:64%; --page-gap:44px; background:#0c1c1e; padding:0 5vw; }
#intro .intro-top { position:relative; height:94px; border:0; z-index:5; gap:25px; }
#intro .intro-top .brand strong { font-family:var(--serif); color:#e9d6ae; letter-spacing:6px; }
#intro .intro-top-caption { border:0; padding:0; color:#9aa99c; font-size:11px; }
#intro .edition { font-size:9px; color:#a4b7ac; letter-spacing:1px; }
#intro #site-layout-open { margin-left:6px; padding:8px 13px; color:#d6c5a0; background:#17312bbd; border:1px solid #9e8f6055; border-radius:15px 2px; font-size:11px; white-space:nowrap; }
#intro .intro-stage { min-height:var(--page-height); max-height:none; height:auto; border:0; margin-bottom:20px; }
#intro .intro-stage:after { border:0; inset:28px 1% 16px 35%; border-top:1px solid #b8ac6b44; border-bottom:1px solid #b8ac6b33; transform:rotate(-2deg); }
#intro .intro-art { inset:8px -2vw 20px 28%; background-position:var(--page-image) center; opacity:1; border-radius:44% 3% 17% 3%; clip-path:polygon(7% 0,95% 3%,100% 18%,97% 69%,100% 93%,88% 100%,2% 95%,0 30%); filter:saturate(.82); }
#intro .intro-shade { inset:0 -5vw; background:linear-gradient(90deg,#0c1c1e 2%,#0c1c1ef5 24%,#0c1c1eb8 39%,#0c1c1e22 65%),linear-gradient(0deg,#0c1c1e,transparent 26%,transparent 80%,#0c1c1e70); }
#intro .intro-content { width:var(--page-copy); max-width:100%; margin:0; padding:57px 0 68px 24px; }
#intro .intro-content>.eyebrow { color:#a59568; letter-spacing:4px; font-size:9px; }
#intro .intro-kicker { margin-top:30px; color:#bcc7ae; letter-spacing:3px; font-size:12px; }
#intro .intro-content h2 { font-size:28px; margin:22px 0 21px; letter-spacing:12px; }
#intro .intro-content h2>span { font-size:var(--page-title); line-height:1.25; letter-spacing:10px; color:#e5cca2; text-shadow:0 7px 24px #0006; }
#intro .intro-content>.intro-story { color:#acbbae; font-size:12px; line-height:2.2; }
#intro .intro-tags { color:#bfbf9e; margin:23px 0; font-size:10px; }
#intro .intro-behavior { margin:28px 0 15px; }
#intro .behavior-options { gap:12px; }
#intro .behavior-options button { padding:8px 5px; text-align:center; border:0; border-bottom:1px solid #74896a66; background:transparent; border-radius:0; }
#intro .behavior-options button[aria-pressed=true] { border-color:#c4a46a; background:linear-gradient(0deg,#c3a46b15,transparent); box-shadow:none; color:#e7d0a1; }
#intro .behavior-options button[aria-pressed=true]:after { content:'◆'; top:auto; right:calc(50% - 3px); bottom:-7px; font-size:8px; background:#0c1c1e; padding:0 3px; }
#intro .behavior-options b { font-size:11px; font-weight:400; }
#intro .behavior-note { margin-top:14px; color:#819d91; font-size:9px; }
#intro .arena-try { padding:5px 0; background:none; border:0; color:#c2b38c; font-size:11px; margin-bottom:10px; }
#intro #start-button { display:flex; width:260px; max-width:100%; justify-content:space-between; padding:17px 23px; border:1px solid #b69c66; border-radius:22px 2px 22px 2px; color:#e8d6ab; background:linear-gradient(100deg,#3e5344,#1d3b32); box-shadow:0 6px 20px #0003; }
#intro #start-button:hover { background:#49614a; }
#intro .intro-chapter-mark { top:35px; right:28px; letter-spacing:5px; color:#c9c8a8; }
#intro .intro-chapter-mark span { border-radius:3px; border:1px solid #b99159; color:#dec69b; background:#754b3044; transform:rotate(5deg); }
#intro .lantern-vignette { bottom:115px; right:11%; transform:rotate(4deg); }
#intro .scene-caption { right:9%; bottom:55px; }
#intro .intro-experiences { display:block; padding:var(--page-gap) 24px 45px; position:relative; }
#intro .preview-heading { display:block; max-width:400px; margin:0 0 16px; }
#intro .preview-heading h3 { color:#dbcfad; font:24px/1.8 var(--serif); letter-spacing:3px; }
#intro .preview-heading p { color:#91a799; font-size:10px; }
#intro .intro-preview { display:flex; align-items:start; justify-content:flex-end; gap:30px; width:85%; margin:0 0 0 auto; }
#intro .intro-preview button { flex:1; min-width:0; min-height:115px; border:0; border-top:1px solid #8b956455; background:linear-gradient(135deg,#31504577,transparent); padding:22px 15px; border-radius:26px 2px 20px 2px; transform:rotate(-2deg); }
#intro .intro-preview button:nth-child(2) { margin-top:28px; transform:rotate(2deg); }
#intro .intro-preview button:nth-child(3) { margin-top:58px; transform:rotate(-1deg); }
#intro .intro-preview button:before { display:none; }
#intro .intro-preview button:hover { background:#3d594c; border-color:#c6b37b; }
#intro .intro-preview b { color:#dcd0ad; font-size:18px; }.intro-preview small { color:#9cad9e; }
#intro .intro-preview .preview-number { color:#8fa58c; font:italic 28px Georgia,serif; }
#intro .intro-bottom { border:0; padding:18px 24px 30px; color:#8ca295; }
#intro[data-page-side=right] .intro-content { margin-left:auto; padding-left:0; padding-right:24px; }
#intro[data-page-side=right] .intro-art { left:-2vw; right:28%; }
#intro[data-page-side=right] .intro-shade { background:linear-gradient(270deg,#0c1c1e 2%,#0c1c1ef5 24%,#0c1c1eb8 39%,#0c1c1e22 65%),linear-gradient(0deg,#0c1c1e,transparent 26%); }
#intro[data-page-side=right] .intro-chapter-mark { left:28px; right:auto; }
#intro[data-page-side=right] .lantern-vignette { left:11%; right:auto; }
#intro[data-page-side=right] .scene-caption { left:9%; right:auto; text-align:left; }
#intro[data-page-flow=compact] .intro-preview { width:100%; gap:18px; }
#intro[data-page-flow=compact] .intro-preview button { margin-top:0; transform:none; }
#intro .site-editor { position:fixed; z-index:100; right:20px; top:90px; width:292px; max-height:calc(100dvh - 110px); overflow:auto; padding:22px; border:1px solid #a58f6266; border-radius:22px 2px; background:#112721f5; box-shadow:0 18px 70px #000a; color:#ddceb0; font:12px/1.8 "Microsoft YaHei",sans-serif; }
#intro .site-editor h2 { font:21px var(--serif); letter-spacing:3px; margin:0 0 9px; }
#intro .site-editor p { font-size:10px; color:#9ab3a2; margin:6px 0 15px; }
#intro .site-editor label { display:block; margin:12px 0; }
#intro .site-editor select { width:100%; color:#ddceb0; background:#0b1d19; border:1px solid #6e8061; padding:7px; font-size:11px; border-radius:3px; }
#intro .site-editor input[type=range] { display:block; width:100%; accent-color:#c6ac78; }
#intro .site-editor output { float:right; color:#bba16e; }
#intro .site-editor-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
#intro .site-editor button { padding:8px 12px; border:1px solid #86916b66; border-radius:10px 2px; background:#2e493a; font-size:11px; color:#e7d5ad; }
#intro .site-editor #site-save { background:#c5aa75; color:#18342a; }
#intro .site-editor-status { min-height:20px; font-size:10px; color:#d6ba86; }
#intro .site-editor.folded .site-editor-body { display:none; }
#intro .site-editor header { display:flex; align-items:center; justify-content:space-between; }
@media(max-width:1000px) {
 #intro .intro-top-caption { display:none; }#intro .intro-content { padding-left:0; }
 #intro .intro-preview { width:100%; gap:16px; }#intro .intro-preview button { padding:18px 10px; gap:9px; }#intro .intro-preview b { font-size:15px; }
}
@media(max-width:600px) {
 #intro { padding:0 22px; }#intro .intro-top { height:84px; gap:6px; }#intro .edition { display:none; }#intro #site-layout-open { margin-left:auto; font-size:10px; padding:7px 9px; }
 #intro .intro-top .brand strong { font-size:18px; letter-spacing:3px; }
 #intro .intro-stage { min-height:700px; }#intro .intro-content,#intro[data-page-side=right] .intro-content { padding:38px 0 110px; width:100%; margin:0; }
 #intro .intro-content h2>span { font-size:clamp(46px,calc(var(--page-title)*.77),78px); letter-spacing:7px; }#intro .intro-content>.eyebrow { letter-spacing:2px; font-size:8px; }
 #intro .intro-art,#intro[data-page-side=right] .intro-art { inset:0 -22px; border-radius:0; opacity:.7; }
 #intro .intro-shade,#intro[data-page-side=right] .intro-shade { background:linear-gradient(90deg,#0c1c1eea,#0c1c1e90),linear-gradient(0deg,#0c1c1e,transparent 70%); }
 #intro .intro-stage:after { display:none; }#intro .lantern-vignette,#intro[data-page-side=right] .lantern-vignette { bottom:14px; right:0; left:auto; }
 #intro .scene-caption,#intro[data-page-side=right] .scene-caption { bottom:35px; right:auto; left:0; text-align:left; }
 #intro .intro-experiences { padding:24px 0 25px; }#intro .preview-heading h3 { font-size:20px; }
 #intro .intro-preview,#intro[data-page-flow=compact] .intro-preview { display:flex; flex-direction:column; gap:16px; width:100%; padding:15px 6px; }
 #intro .intro-preview button { width:92%; min-height:90px; flex:none; padding:20px; }#intro .intro-preview button:nth-child(2) { margin:0 0 0 auto; }#intro .intro-preview button:nth-child(3) { margin:0; }
 #intro .intro-bottom { padding:15px 0 25px; }#intro .site-editor { top:auto; bottom:12px; right:12px; width:calc(100% - 24px); max-height:60dvh; padding:16px 20px; }
}
@media(prefers-reduced-motion:reduce) { #intro .lantern-vignette img { animation:none; } }

.music-settings{margin:14px 0;padding:12px;border:1px solid #846b46;border-radius:8px;background:#171f24;color:#eadfc9}.music-settings>div{display:flex;align-items:center;justify-content:space-between;gap:12px}.music-settings label,.music-settings small{display:block;margin-top:8px}.music-settings input{display:block;width:100%;margin:8px 0;accent-color:#d5ad66}.music-settings select{display:block;width:100%;min-height:44px;margin-top:8px;padding:8px;border:1px solid #846b46;border-radius:4px;background:#171f24;color:#eadfc9;font:inherit}.music-settings small{font-size:12px;color:#c5b8a0}

/* Full illustrated cards with real names and separate leader / companion actions. */
#game-root #party-modal .modal{width:min(1460px,calc((100dvh - 335px)*2 + 100px),97vw);max-width:1460px;max-height:96dvh;padding:14px 20px;background:linear-gradient(135deg,#17191b,#10191c);border:1px solid #8d7957;border-image:none!important;box-shadow:0 25px 100px #000b;image-rendering:auto}
#party-modal .modal-head{margin:0;min-height:0}#party-modal .modal-head h2{margin:2px 0 0;font-size:24px}#party-modal .modal-head .eyebrow{font-size:9px}
#party-modal .modal-head h2{color:#e3cf9f;font-family:"Songti SC",SimSun,serif;font-size:24px;line-height:1.2;letter-spacing:.14em}#party-modal .modal-head .eyebrow{display:block;line-height:12px}
#party-modal .party-lede{display:none}
#party-modal .party-summary{margin:8px 0;padding:4px 0;border-color:#635a48}#party-modal .party-summary strong{font-size:17px}
#party-modal .party-behavior{margin:10px 0 14px}
#party-modal .party-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 14px}
.hero-card{min-width:0;margin:0;border:1px solid #605847;background:#11171b;transition:border-color .18s,box-shadow .18s}
.hero-card[data-selected=leader]{border-color:#ffe1a1;box-shadow:0 0 0 2px #b69557,0 0 23px #d4b67530}
.hero-card[data-selected=companion]{border-color:var(--member-color);box-shadow:0 0 0 1px var(--member-color)}
.hero-card-art{display:block;position:relative;width:100%;aspect-ratio:1/2;padding:0;border:0;border-radius:0;cursor:pointer;background-color:#11171b;background-repeat:no-repeat;overflow:hidden;color:#f5dfaa}
.hero-card-art:hover{filter:brightness(1.08)}
.hero-card button:focus-visible{outline:3px solid #f8dfa6;outline-offset:-3px}
.hero-card-name{position:absolute;top:1.5%;left:1.5%;width:49%;height:11%;box-sizing:border-box;background:linear-gradient(90deg,#16191bf7 80%,#16191b00);padding:3% 6%;text-align:left;font:clamp(23px,2.4vw,38px)/1.2 "Songti SC",SimSun,serif;letter-spacing:.13em;text-shadow:0 2px 3px #000}
.hero-card-name i{display:block;margin-top:6px;width:50px;border-top:1px solid #c0a976}
.hero-card-state{position:absolute;right:4%;top:3%;font-size:11px;padding:4px 8px;background:#101a20dc;border:1px solid #a28b5b;letter-spacing:1px}
.hero-card[data-selected=leader] .hero-card-state{background:#ead19e;color:#19222a}
.hero-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#514a3d;border-top:1px solid #65573e}
.hero-card-actions button{font:12px/1.4 system-ui;padding:11px 4px;border:0;border-radius:0;background:#1b2528;color:#e4d5b6;cursor:pointer}
.hero-card-actions .hero-lead[aria-pressed=true]{background:#d5b77f;color:#152126}
.hero-card-actions .hero-companion[aria-pressed=true]{background:#304344;color:#e7edda}
.hero-card-actions button:disabled{color:#9ba49c;cursor:default}
.hero-card p{display:none}.hero-card[hidden]{display:none!important}
.party-pages{display:flex;gap:8px;margin:0 0 12px}.party-pages button{flex:1;padding:7px 8px;border:1px solid #655a45;background:#1b2428;color:#b6b7ae;font-size:12px;cursor:pointer}.party-pages button[aria-pressed=true]{color:#f0dba9;border-color:#c3a875;background:#30302b}
.party-behavior-details{margin-top:10px;color:#b6b7ae;font-size:12px}.party-behavior-details summary{cursor:pointer}
/* Illustrated card portraits need smooth downsampling within the existing HUD frames. */
#game-root .hero-headshot,#game-root .party-portrait,#bag-roster img,#bag-hero img{image-rendering:auto;object-fit:cover;object-position:center}
.hero-ui .player-card[data-hero="5"] .fighter-heading,.hero-ui .player-card[data-hero="5"] .fighter-heading b,.hero-ui .player-card[data-hero="5"] .fighter-heading small{color:#49341e;text-shadow:0 1px #fff9}
#party-modal .party-footer{position:static;padding:8px 0 0;margin-top:8px;background:#121b1ff5;border-top:1px solid #6c5f48;z-index:3}
@media(max-width:760px){#game-root #party-modal .modal{padding:14px;width:98vw}.hero-card-name{font-size:25px}.hero-card p{display:none}#party-modal .party-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 8px}.hero-card-state{font-size:9px;right:3%;padding:3px}.hero-card-actions button{font-size:11px}#party-modal .party-footer{bottom:-14px}.hero-card-name{height:12%}}

/* Preserve HUD anchoring during travel; cinematic layouts belong to boss entrances. */
#arena-wrap > :not(canvas){transition:opacity .22s ease}
#arena-wrap.transiting > :not(canvas){opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){#arena-wrap > :not(canvas){transition:none}}

#world-atlas-modal[hidden]{display:none!important}.world-atlas-backdrop{z-index:115;padding:18px;background:#061219e8;overflow:auto;backdrop-filter:blur(4px)}.world-atlas-dialog{width:min(1380px,100%);margin:auto;background:#14252c;border:1px solid #8d805c;box-shadow:0 20px 70px #0009;color:#dfd9c5;border-radius:8px;overflow:hidden}.world-atlas-header{padding:16px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #71674b;background:#182c32}.world-atlas-header small{font-size:10px;letter-spacing:4px;color:#af9c71}.world-atlas-header h2{font:30px Georgia,'Microsoft YaHei',serif;color:#f0d49b;margin:4px 0}.world-atlas-header h2 span{font-size:12px;font-family:inherit;font-weight:normal;color:#b7c0b4;margin-left:22px}.world-atlas-dialog button{font:inherit;cursor:pointer;color:#dfd9c5;border:1px solid #59685e;background:#243b3d;border-radius:4px;padding:8px 12px}.world-atlas-dialog button:focus-visible{outline:2px solid #f0d49b;outline-offset:2px}.world-atlas-dialog button:disabled{opacity:.5;cursor:default}#world-atlas-close{font-size:24px;width:42px;height:42px;padding:0}.world-atlas-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px}.world-atlas-left{min-width:0;background:#0d2028}.atlas-tools{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;font-size:11px;color:#acb8b5;gap:8px}.atlas-tools>span{white-space:nowrap}.atlas-tools>span i{display:inline-block;width:6px;height:6px;background:#e7c580;transform:rotate(45deg);margin:0 7px}.atlas-tools>span i.unopened{background:#71848b}.atlas-tools>div{display:flex;align-items:center;gap:5px}.atlas-tools button{padding:5px 10px;font-size:12px}#atlas-zoom{min-width:36px;text-align:center}#atlas-viewport{width:100%;max-height:64dvh;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y;border-top:1px solid #40524c;border-bottom:1px solid #40524c;scrollbar-color:#8b805c #10242b}#atlas-board{position:relative;width:100%;aspect-ratio:1.6;user-select:none}#atlas-art{width:100%;height:100%;display:block;image-rendering:pixelated;pointer-events:none}.atlas-routes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.atlas-routes path{fill:none;stroke:#ead5a2;stroke-width:.14;stroke-dasharray:.5 .6;opacity:.4}.atlas-pin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;background:none!important;border:0!important;padding:0!important;min-width:60px;text-shadow:0 2px 3px #000}.atlas-pin i{font-style:normal;font-size:22px;line-height:1.15;color:var(--region-color);filter:drop-shadow(0 0 3px #000)}.atlas-pin span{padding:3px 7px;background:#0c1e27db;border:1px solid #657373;color:#dfdfd2;font-size:12px;letter-spacing:1px;border-radius:3px;white-space:nowrap}.atlas-pin[aria-pressed=true] span{background:#e1c48b;color:#152b31;border-color:#ffe8ba;text-shadow:none}.atlas-pin[aria-pressed=true] i{color:#fff1c4}.atlas-pin.is-open i{filter:drop-shadow(0 0 6px #f4bc52)}.atlas-compass{position:absolute;top:4%;left:4%;text-align:center;color:#d4ceb7;font-size:14px;line-height:1.5;pointer-events:none;text-shadow:0 2px 4px #08212e}.atlas-ocean{position:absolute;bottom:5%;right:6%;font-size:14px;letter-spacing:5px;color:#b2c3bf;opacity:.7;pointer-events:none}.atlas-caption{padding:10px 14px;display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#b5c1b7}.atlas-caption>span:first-child{color:#e3cf9e}.atlas-info{padding:22px 20px;border-left:1px solid #596052;background:linear-gradient(145deg,#233438,#112129);overflow:auto;max-height:calc(64dvh + 82px)}.atlas-info>small:first-child{font-size:10px;letter-spacing:2px;color:#aaa887}.atlas-info h3{font:28px 'Microsoft YaHei',serif;color:#f1d69f;margin:8px 0}.atlas-info p{font-size:12px;line-height:1.85;color:#b8c4be;margin:10px 0}.atlas-info #atlas-region-subtitle{font-size:11px;margin:4px 0 12px;color:#d5c9a9}#atlas-region-state{display:inline-block;font-size:10px;padding:4px 8px;border:1px solid #6d7665;color:#c9cbb9}#atlas-region-state.open{color:#e8cf90;border-color:#a28e5a}#atlas-region-view{height:96px;margin:16px 0 12px;background-size:350%;image-rendering:pixelated;border:1px solid #5b685c;box-shadow:inset 0 0 15px #071c2470}.atlas-info h4{font-size:11px;color:#d7bd87;font-weight:normal;letter-spacing:2px;margin:16px 0 8px}#atlas-landmarks{display:flex;flex-wrap:wrap;gap:5px}#atlas-landmarks span{font-size:10px;color:#bec9bc;padding:4px 6px;background:#304541}#atlas-progress{font-size:11px;color:#e2cc99;margin:12px 0}.atlas-info>button{display:block;width:100%;font-size:12px;margin:7px 0}#atlas-chapter:not(:disabled){background:#d4bb83;color:#183137;border-color:#e4c991}#atlas-availability{display:block;color:#8faaa7;font-size:10px;line-height:1.6;margin-top:10px}#atlas-region-list{display:flex;gap:6px;padding:12px 18px;border-top:1px solid #56614f;overflow:auto}#atlas-region-list button{flex:1;white-space:nowrap;font-size:11px}#atlas-region-list button[aria-pressed=true]{border-color:#d8be80;color:#f0d49b;background:#435044}.classic-ui .topbar #map-button{display:inline-flex!important}#map-button{white-space:nowrap}
@media(max-width:900px){.world-atlas-backdrop{padding:7px}.world-atlas-layout{grid-template-columns:minmax(0,1fr) 210px}.world-atlas-header{padding:10px 14px}.world-atlas-header h2{font-size:24px}.world-atlas-header h2 span{display:none}.atlas-info{padding:14px}.atlas-info h3{font-size:24px}.atlas-tools{flex-wrap:wrap;padding:7px}.atlas-caption{flex-wrap:wrap}.atlas-pin span{font-size:10px;padding:2px 4px}.atlas-pin i{font-size:18px}}
@media(max-width:600px){.world-atlas-layout{display:block}#atlas-viewport{max-height:52dvh}.atlas-info{max-height:none;border-left:0;border-top:1px solid #596052;display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.atlas-info h3,.atlas-info>small:first-child,.atlas-info #atlas-region-subtitle{grid-column:1}.atlas-info #atlas-region-state{grid-column:2;grid-row:1/3;align-self:center;justify-self:end}.atlas-info #atlas-region-view{grid-column:2;grid-row:3/6;height:100px;margin:8px 0}.atlas-info #atlas-region-story{grid-column:1;grid-row:4/6}.atlas-info h4,.atlas-info #atlas-landmarks,.atlas-info #atlas-region-feature,.atlas-info #atlas-progress,.atlas-info #atlas-availability{grid-column:1/-1}.atlas-pin{min-width:42px}.atlas-pin span{font-size:9px;letter-spacing:0}.atlas-pin i{font-size:16px}#atlas-region-list{padding:8px;gap:4px}#atlas-region-list button{padding:7px 9px}}
@media(max-height:500px) and (min-width:601px){.world-atlas-header{padding:5px 12px}.world-atlas-header small{display:none}.world-atlas-header h2{font-size:20px}#world-atlas-close{width:30px;height:30px}.atlas-tools{padding:4px 8px}#atlas-viewport{max-height:calc(100dvh - 160px)}.atlas-info{max-height:calc(100dvh - 110px)}#atlas-region-list{padding:5px 10px}.atlas-caption{padding:5px 8px}}
.world-atlas-dialog .atlas-pin:active{transform:translate(-50%,-50%)}#atlas-board{max-width:calc(64dvh * 1.6);margin-inline:auto}
@media(max-height:500px) and (min-width:601px){#atlas-board{max-width:calc((100dvh - 160px) * 1.6)}}

#atlas-capital-art{position:absolute;left:34.5%;top:1%;width:17%;height:auto;image-rendering:pixelated;pointer-events:none}#atlas-region-list button{flex:1 0 auto}
.dungeon-modal{width:min(1100px,96vw)}.dungeon-heading,.dungeon-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:14px 0}.dungeon-heading p{margin:0}.dungeon-heading span{color:#e5c681;font-size:12px}.dungeon-modal .map-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.dungeon-card .card-copy{display:flex;flex-direction:column;gap:8px;padding:14px}.dungeon-card .card-copy strong{font-size:12px;color:#eace96;margin-top:8px}.dungeon-card img{width:100%;height:125px;object-fit:cover;image-rendering:pixelated}.dungeon-card.boss-card{border-color:#be9563}.dungeon-card:disabled{opacity:.6}.dungeon-footer button{min-height:42px;padding:10px 18px}#dungeon-return-town{background:#d7bf8a;color:#182e35}#dungeon-side{font-size:12px}.dungeon-card .map-status{font-size:11px}
@media(max-width:800px){.dungeon-modal .map-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.dungeon-heading,.dungeon-footer{flex-wrap:wrap}.dungeon-card img{height:100px}}

.dungeon-modal .route-segment{position:relative;cursor:default;border:1px solid #81704d;background:#152b2b;text-align:left}.dungeon-modal .route-segment:not(:last-child):after{content:'›';position:absolute;right:-12px;top:46%;z-index:2;color:#f4d18b;font-size:24px;text-shadow:0 2px 4px #000}.dungeon-modal .route-segment.current{border-color:#e8c985;box-shadow:0 0 0 1px #e8c98577}.dungeon-branch{font-size:12px;color:#b9cbbd;border-left:2px solid #7b967f;padding:8px 12px;margin:14px 0}.dungeon-card.route-segment .map-status{position:absolute;top:8px;right:8px}.dungeon-footer #dungeon-side{font-size:14px;min-width:200px}

#map-cards button.route-segment{text-align:left;cursor:pointer;font:inherit;color:inherit;padding:0;min-width:0}#map-cards button.route-segment.current{outline:2px solid #e7c987;outline-offset:-2px}#map-cards .card-copy small{white-space:normal;line-height:1.6}#dungeon-route-description{display:block;line-height:1.8}

/* Regional selection is a geographic layer, not a row of dungeon cards. */
#game-root #map-modal .regional-map-modal{width:min(1380px,96vw);max-width:none;padding:16px;background:#142a2d;color:#ddd4b8;max-height:94dvh;overflow:auto}
.regional-header{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid #82734f;padding:0 0 12px;gap:12px}.regional-header>div{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.regional-header h2{flex-basis:100%;margin:0;font:30px Georgia,'Microsoft YaHei',serif;letter-spacing:.1em;color:#efd29a}.regional-crumb{font-size:11px;color:#9eb6ab}.regional-header button{min-height:36px}.regional-header>.close-modal{font-size:22px;padding:2px 12px}.regional-summary{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 0;font-size:12px}.regional-summary p{margin:0;color:#b6c4b6}.regional-summary span{color:#e7c990;white-space:nowrap}.regional-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px;align-items:start}.regional-landscape{min-width:0}.regional-legend{display:flex;justify-content:space-between;gap:8px;font-size:11px;padding:8px 10px;background:#203b3a;color:#cfcca9;flex-wrap:wrap}.regional-viewport{overflow:auto;border:1px solid #8a7953;scrollbar-color:#9a845a #152e30;overscroll-behavior:contain;touch-action:pan-x pan-y}.regional-board{position:relative;aspect-ratio:680/384;min-width:560px;isolation:isolate;background:#24443d;user-select:none}.regional-board>img{position:absolute;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;pointer-events:none}.regional-board:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 35px #0d252a88;pointer-events:none;z-index:1}.regional-compass{position:absolute;top:4%;left:4%;color:#e5dcb6;text-shadow:0 1px 3px #000;text-align:center;line-height:1.3;pointer-events:none}#regional-routes{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#regional-routes path{fill:none;stroke:#e7d8ad;stroke-width:.35;stroke-dasharray:.8 .65;stroke-linecap:round;filter:drop-shadow(0 1px 1px #18302d)}#regional-routes path.locked{stroke:#c5d0c8;opacity:.45}
#map-cards.regional-nodes{position:absolute;inset:0;display:block;margin:0;padding:0}.regional-map-modal #map-cards .regional-node{position:absolute;transform:translate(-50%,-30%);min-width:88px;min-height:58px;display:flex;align-items:center;flex-direction:column;padding:0;background:none;border:0;box-shadow:none;color:#f6dfab;cursor:pointer;z-index:2;text-shadow:0 1px 3px #071e21;font:inherit;border-radius:0}.regional-map-modal #map-cards .regional-node i{display:grid;place-items:center;width:27px;height:27px;font:20px Georgia,serif;background:#172e2ce8;border:1px solid #beac73;box-shadow:0 2px 4px #0008;transform:rotate(0);margin-bottom:3px}.regional-map-modal #map-cards .regional-node b{padding:4px 8px;background:#16332bea;border:1px solid #8d865a;font-size:12px;white-space:nowrap;font-weight:normal;letter-spacing:.05em}.regional-map-modal #map-cards .regional-node small{font-size:10px;color:#ddd7bb;padding:2px 5px;background:#102d29db;white-space:nowrap}.regional-map-modal #map-cards .regional-node.locked i{border-color:#a8b7b2;color:#d1ddda;background:#243b3de8}.regional-map-modal #map-cards .regional-node.locked b{color:#cad5cf;border-color:#7c9692}.regional-map-modal #map-cards .regional-node.completed i{color:#bedc9b}.regional-map-modal #map-cards .regional-node.selected b{color:#19322c;background:#efd39a;border-color:#ffe6b3;text-shadow:none;font-weight:bold}.regional-map-modal #map-cards .regional-node.selected i{box-shadow:0 0 0 3px #e5c68555;border-color:#ffe6b3}.regional-map-modal #map-cards .regional-node[aria-current=location]:after{content:'你在这里';position:absolute;bottom:100%;padding:3px 6px;margin-bottom:5px;font-size:10px;background:#ead59c;color:#19302a;text-shadow:none}.regional-map-modal #map-cards .regional-node:focus-visible{outline:2px solid #fff0c8;outline-offset:4px}.regional-map-modal #map-cards .regional-node.boss-node i{border-color:#cb9b69;color:#f3b77e}.regional-map-modal #map-cards .regional-node:hover b{border-color:#ffe1a0}
#regional-stops{display:flex;gap:5px;margin-top:10px;flex-wrap:wrap}#regional-stops button{flex:1;min-height:36px;padding:6px 9px;white-space:nowrap;font-size:11px;background:#243c35;border:1px solid #686f51;color:#d3ceaf}#regional-stops button[aria-pressed=true]{color:#f7da9b;border-color:#c7a66b;background:#3a4938}.regional-map-note{font-size:11px;color:#9bafa5;margin:8px 0}.regional-detail{padding:12px;background:#102527;border:1px solid #67735a;box-shadow:inset 0 0 0 3px #1c3531;min-width:0}.regional-detail-image{position:relative;height:114px;margin:-2px -2px 14px;overflow:hidden;border:1px solid #7e7957}.regional-detail-image img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}.regional-detail-image span{position:absolute;bottom:0;left:0;right:0;background:#10262ce6;padding:6px 8px;font-size:11px;color:#ebd8a4}.regional-detail>small{font-size:10px;color:#bda577;letter-spacing:1px}.regional-detail h3{font-size:25px;color:#f1d4a0;font-family:Georgia,'Microsoft YaHei',serif;margin:7px 0}.regional-detail p{font-size:12px;line-height:1.7;color:#b9c4b5;margin:9px 0}.regional-detail h4{font-weight:normal;font-size:12px;color:#d8c391;margin:15px 0 8px}#regional-boss{font-size:11px;color:#e1bc87;border-bottom:1px solid #53634c;padding:8px 0}#regional-route-stops{list-style:none;display:flex;flex-direction:column;gap:6px;padding:0;margin:0 0 12px}#regional-route-stops li{font-size:11px;color:#c4d2bc;display:flex;align-items:center;gap:8px}#regional-route-stops li:before{content:attr(data-step);display:grid;place-items:center;width:18px;height:18px;border:1px solid #778164;color:#dac593;font:11px Georgia,serif}#regional-entry-hint{border-left:2px solid #b39a63;padding-left:9px;color:#dfc99b;min-height:40px}.regional-detail>button{width:100%;min-height:40px;margin-top:7px;padding:9px 8px;font-size:12px}#game-root .regional-detail #dungeon-side{background:#d9bc7d;color:#18312c;border:1px solid #f2d49b}#game-root .regional-detail #dungeon-side:disabled{background:#35423c;color:#94a298;border-color:#596352;opacity:1;cursor:not-allowed}#game-root .regional-detail #dungeon-return-town{background:#243c35;color:#dfd2a9}.regional-footer{font-size:11px;line-height:1.7;color:#9eafa0;border-top:1px solid #56644d;padding-top:12px;margin-top:12px}
@media(max-width:950px){.regional-layout{grid-template-columns:minmax(0,1fr) 230px;gap:10px}.regional-detail{padding:10px}.regional-header h2{font-size:25px}.regional-crumb{display:none}#game-root #map-modal .regional-map-modal{padding:10px}}
@media(max-width:680px){.regional-layout{display:block}.regional-detail{margin-top:12px}.regional-detail-image{height:110px;float:right;width:38%;margin:0 0 10px 10px}.regional-detail h4{clear:both}#regional-route-stops{display:grid;grid-template-columns:1fr 1fr}.regional-summary{flex-wrap:wrap}.regional-header>div{gap:8px}.regional-footer{font-size:10px}.regional-board{min-width:560px}}
@media(max-height:540px) and (min-width:681px){.regional-header h2{flex-basis:auto;font-size:22px}.regional-header>div{gap:10px}.regional-summary{padding:6px 0}.regional-header{padding-bottom:6px}.regional-detail-image{height:80px}.regional-viewport{max-height:55dvh}.regional-legend{font-size:10px}#game-root #map-modal .regional-map-modal{max-height:96dvh}.regional-detail{max-height:62dvh;overflow:auto}}
/* Keep navigation available while scrolling a small-screen regional sheet. */
@media(max-width:680px),(max-height:540px){.regional-header{position:sticky;top:-10px;background:#142a2d;z-index:5;box-shadow:0 6px 10px #102426bb}.regional-header h2{font-size:22px}.regional-header>div{gap:6px}.regional-header h2{flex-basis:auto}.regional-detail{scrollbar-width:thin}.regional-map-modal .regional-footer{margin-bottom:4px}}

/* Bottom HUD: portrait/status left, combat centre, exploration shortcuts right. */
.world-hud.hero-ui .arena-wrap>.player-card { top:auto;bottom:12px;left:12px;width:280px;height:150px;padding:10px 12px 42px 87px;border:1px solid #92774c;border-top:2px solid #c3a16a;border-radius:4px;background:linear-gradient(140deg,#172a2df5,#101b24f5);box-shadow:0 4px 20px #0009,inset 0 0 0 3px #071317;image-rendering:auto; }
.world-hud.hero-ui .player-card .fighter-heading { height:22px;margin:0 0 7px; }
.world-hud.hero-ui .player-card .fighter-heading>.portrait { top:12px;left:12px;width:64px;height:78px;border:1px solid #c6a36c;border-radius:2px;clip-path:none;box-shadow:0 0 0 3px #0b161c; }
.world-hud.hero-ui .fighter-heading b { color:#eedbbb;font-size:19px;line-height:22px; }
.world-hud.hero-ui .fighter-heading small { display:none; }
.world-hud.hero-ui .fighter-heading #hero-state { display:block;top:94px;left:12px;width:254px;font-size:9px;text-align:left;color:#a9bab5; }
.world-hud.hero-ui .player-card .fighter-info { width:100%; }
.world-hud.hero-ui #hero-orb { position:relative;width:100%;height:20px;margin:0;border:0;border-radius:0;background:none;box-shadow:none;padding:0;overflow:visible; }
.world-hud.hero-ui #hero-orb::before,.world-hud.hero-ui #hero-orb::after { display:none; }
.world-hud.hero-ui .resource-label { position:absolute;z-index:1;inset:0;display:flex;justify-content:space-between;align-items:center;padding:0 5px;font-size:9px;color:#fff;text-shadow:0 1px 2px #000; }
.world-hud.hero-ui #hp-text { font:10px/18px Consolas,monospace; }
.world-hud.hero-ui .player-card .bar.health { height:20px;margin:0;padding:0;border:1px solid #53775c;background:#091913; }
.world-hud.hero-ui .player-card .bar.health i { background:repeating-linear-gradient(90deg,transparent 0 34px,#061c174d 34px 35px),linear-gradient(#6dbc78,#337c50); }
.world-hud.hero-ui .fighting-gauges { display:grid;grid-template-columns:1fr;gap:4px;margin-top:4px;font-size:9px; }
.world-hud.hero-ui .fighting-gauges>span { position:relative;display:flex;align-items:center;justify-content:space-between;height:17px;padding:0 5px;isolation:isolate;color:#e4f5ff;text-shadow:0 1px 2px #000; }
.world-hud.hero-ui .fighting-gauges b { font:10px/16px Consolas,monospace; }
.world-hud.hero-ui .fighting-gauges i { position:absolute;z-index:-1;inset:0;height:auto;margin:0;border:1px solid #3b6681;background:#0a1525; }
.world-hud.hero-ui #energy-fill { background:linear-gradient(#499ac5,#245a99); }
.world-hud.hero-ui .fighting-gauges>span+span { height:12px;font-size:8px; }
.world-hud.hero-ui .fighting-gauges>span+span i { border-color:#57584b; }
.world-hud.hero-ui #guard-fill { background:#62654c; }
.world-hud .world-attributes { position:absolute;left:12px;right:12px;bottom:9px;display:grid;grid-template-columns:repeat(4,1fr);padding-top:7px;border-top:1px solid #46605a;gap:4px; }
.world-attributes>span { display:flex;flex-direction:column;gap:3px;min-width:0; }
.world-attributes small { font:9px/12px "Microsoft YaHei",sans-serif;color:#a8b8b7; }
.world-attributes b { font:12px/14px Consolas,monospace;color:#e9d5ae; }
.world-hud #world-shortcuts { position:absolute;z-index:20;bottom:12px;right:12px;display:flex;gap:5px;padding:7px;border:1px solid #806a47;border-top-color:#b9a074;border-radius:4px;background:linear-gradient(#1c3034f5,#0c1821f5);box-shadow:0 4px 16px #0008; }
.world-hud #world-shortcuts .world-shortcut { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:43px;height:53px;min-width:0;margin:0;padding:4px 0;border:1px solid transparent;border-radius:2px;background:none;color:#d4bc88;font:10px/13px "Microsoft YaHei",sans-serif;cursor:pointer; }
.world-shortcut svg { width:24px;height:24px;flex:none;filter:drop-shadow(0 1px 1px #000); }
.world-hud #world-shortcuts button:hover,.world-hud #world-shortcuts button:focus-visible { background:#34494b;border-color:#e2bd7e;color:#fff0c6;outline:none; }
.world-hud.hero-ui .action-deck { bottom:12px;width:355px;--slot:46px;border:1px solid #92774c;border-top:2px solid #c3a16a;border-image:none;border-radius:4px;background:linear-gradient(140deg,#172a2df5,#101b24f5);padding:8px 12px;box-shadow:0 4px 20px #0009; }
.world-hud.hero-ui .skill-icon { border:1px solid #827453;background:linear-gradient(#354047,#17242a);padding:4px;border-radius:2px; }
.world-hud.hero-ui .skill-tooltip { border:1px solid #b69a66;border-image:none;background:#101d26f5;padding:12px;color:#e7ddc4; }
.world-hud.hero-ui .battle-status { display:none; }
.world-hud.hero-ui #party-vitals { top:56px; }
.world-hud .cinematic #world-shortcuts { visibility:hidden; }
.world-hud .topbar nav { flex-wrap:wrap; }
@media (min-width:701px) and (max-width:1100px) {
 .world-hud.hero-ui .action-deck { bottom:174px; }
}
@media (max-width:700px) {
 .world-hud #world-shortcuts { bottom:8px;right:8px;gap:3px;padding:5px; }
 .world-hud #world-shortcuts .world-shortcut { width:44px;height:50px; }
 .world-hud.hero-ui .arena-wrap>.player-card { bottom:80px;left:8px;width:236px;height:142px;padding-left:75px;padding-right:9px; }
 .world-hud.hero-ui .player-card .fighter-heading>.portrait { left:10px;top:12px;width:54px;height:73px; }
 .world-hud.hero-ui .fighter-heading #hero-state { top:90px;width:212px;font-size:8px; }
 .world-hud.hero-ui .fighter-heading b { font-size:17px; }
 .world-hud.hero-ui .action-deck { left:auto;right:8px;transform:none;bottom:80px;width:270px;--slot:35px;padding:4px; }
 .world-hud.hero-ui .skill-row { grid-template-columns:repeat(6,var(--slot));gap:5px 4px; }
 .world-hud.hero-ui #party-vitals { top:78px; }
 .world-hud .world-attributes { left:10px;right:10px; }
 .world-hud .world-attributes small { font-size:8px; }
}
@media (max-width:540px) {
 .world-hud.hero-ui .action-deck { bottom:232px;width:270px; }
 .world-hud.hero-ui .arena-wrap>.player-card { width:calc(100% - 16px); }
 .world-hud #world-shortcuts { left:8px;justify-content:space-between; }
 .world-hud #world-shortcuts .world-shortcut { width:calc((100vw - 44px)/8);max-width:60px; }
}
@media (min-width:701px) and (max-height:540px) {
 .world-hud.hero-ui .action-deck { bottom:90px;left:304px;right:auto;transform:none;width:270px;--slot:35px;padding:4px; }
 .world-hud.hero-ui .skill-row { grid-template-columns:repeat(6,var(--slot));gap:5px 3px; }
 .world-hud #world-shortcuts { bottom:12px; }
 .world-hud.hero-ui .party-health { height:54px;padding-top:9px;padding-bottom:7px; }
 .world-hud.hero-ui .party-portrait { top:10px;height:32px; }
}

/* Restore the existing PixelLab skins; navigation art and consumables have separate homes. */
/* Each combat deck reuses its owner's authored PixelLab frame, without tinting skill art. */
.world-hud.hero-ui .action-deck[data-hero] { --deck-frame:var(--identity-frame);--deck-slice:12 26 12 26;--deck-trim:16px;--deck-inset:3px;--deck-floor:#181521; }
.world-hud.hero-ui .action-deck[data-hero="0"] { --deck-frame:var(--hero-fire-panel);--deck-slice:36;--deck-trim:36px;--deck-inset:22px;--deck-floor:#241614; }
.world-hud.hero-ui .action-deck[data-hero="1"] { --deck-floor:#10212c;--deck-pattern:linear-gradient(130deg,transparent 65%,#a1dce611 65% 66%,transparent 66% 80%,#a1dce611 80% 81%,transparent 81%); }
.world-hud.hero-ui .action-deck[data-hero="2"] { --deck-floor:#10231d;--deck-pattern:repeating-linear-gradient(164deg,transparent 0 28px,#98d8b60a 29px 31px,transparent 32px 60px); }
.world-hud.hero-ui .action-deck[data-hero="3"] { --deck-floor:#21142d;--deck-pattern:radial-gradient(ellipse at 85% 0,#ad80cf20,transparent 65%); }
.world-hud.hero-ui .action-deck[data-hero="4"] { --deck-floor:#161b32;--deck-pattern:radial-gradient(circle at 18% 21%,#ead79855 0 1px,transparent 2px),radial-gradient(circle at 78% 68%,#b7c6fc55 0 1px,transparent 2px); }
.world-hud.hero-ui .action-deck[data-hero="5"] { --deck-floor:#29271d;--deck-pattern:linear-gradient(90deg,transparent 49%,#e9d89c15 49% 51%,transparent 51%); }
.world-hud.hero-ui .action-deck[data-hero="6"] { --deck-floor:#282019;--deck-pattern:repeating-linear-gradient(90deg,transparent 0 20px,#bc87520e 21px 22px); }
.world-hud.hero-ui .action-deck[data-hero="7"] { --deck-floor:#17271f;--deck-pattern:radial-gradient(ellipse at 50% 0,#ddedba22,transparent 70%); }
.world-hud.hero-ui .arena-wrap>.player-card { width:306px;height:174px;left:8px;bottom:12px;padding:20px 26px 64px 92px;border:0;border-radius:0;box-shadow:none;background:var(--identity-frame) center top / 100% 116px no-repeat;image-rendering:pixelated; }
.world-hud.hero-ui .player-card .fighter-heading>.portrait { top:23px;left:25px;width:58px;height:69px;border:0;box-shadow:none;border-radius:0;clip-path:polygon(5px 0,100% 0,100% 100%,0 100%,0 5px); }
.world-hud.hero-ui .player-card .fighter-heading { margin-bottom:3px;height:20px; }
.world-hud.hero-ui .fighter-heading b { font-size:18px;line-height:20px;color:var(--identity); }
.world-hud.hero-ui .fighter-heading #hero-state { top:114px;left:26px;width:254px;text-align:left;font-size:8px; }
.world-hud.hero-ui #hero-orb,.world-hud.hero-ui .player-card .bar.health { height:17px; }
.world-hud.hero-ui .fighting-gauges { gap:3px;margin-top:3px; }
.world-hud.hero-ui .fighting-gauges>span { height:14px; }
.world-hud.hero-ui .fighting-gauges>span+span { height:10px; }
.world-hud.hero-ui .world-attributes { bottom:0;left:18px;right:18px;height:43px;padding:6px 9px;gap:4px;border:7px solid transparent;border-image:var(--skin-panel) 36 fill / 20px / 12px stretch;box-shadow:none; }
.world-hud .world-attributes small { font-size:8px;line-height:10px; }.world-hud .world-attributes b { font-size:11px;line-height:12px; }
.world-hud.hero-ui .action-deck { width:306px;--slot:46px;bottom:16px;padding:5px 9px 8px;border:14px solid transparent;border-image:var(--hero-fire-panel) 36 fill / 36px / 22px stretch;background:#15151df2;background-clip:padding-box;border-radius:0;box-shadow:none;image-rendering:pixelated; }
.world-hud.hero-ui .skill-row { grid-template-columns:repeat(5,var(--slot));gap:7px 5px; }
.world-hud.hero-ui .skill-icon { border:0;border-radius:0;padding:6px;background:var(--hero-fire-slot) center / 112% 112% no-repeat;box-shadow:none; }
.world-hud.hero-ui .skill-tooltip { border:14px solid transparent;border-image:var(--skin-panel) 36 fill / 36px / 22px stretch;background:#15151df5;background-clip:padding-box;padding:8px; }
.world-hud #world-shortcuts { bottom:16px;right:16px;padding:3px 5px;gap:2px;border:12px solid transparent;border-image:var(--skin-panel) 36 fill / 30px / 18px stretch;background:#141722f5;background-clip:padding-box;box-shadow:none;border-radius:0;image-rendering:pixelated; }
.world-hud #world-shortcuts .world-shortcut { width:51px;height:65px;padding:0;gap:0;border:0;border-radius:0;background:var(--skin-slot) center top / 51px 51px no-repeat;color:#e3ccaa;font-size:10px; }
.world-hud .navigation-art { width:48px;height:48px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 1px #000); }
.world-hud #world-shortcuts button:hover,.world-hud #world-shortcuts button:focus-visible { background:var(--skin-slot) center top / 51px 51px no-repeat;filter:brightness(1.3);outline:1px solid #e9c887;outline-offset:2px; }
.world-hud .deck-caption { font:9px/13px "Microsoft YaHei",sans-serif;letter-spacing:2px;color:#dfbd91;text-align:center;margin:0 0 5px;text-shadow:0 1px 2px #000; }
.world-hud.hero-ui .item-deck { position:absolute;z-index:10;right:24px;bottom:123px;width:150px;--slot:46px;padding:4px 6px;border:12px solid transparent;border-image:var(--skin-panel) 36 fill / 30px / 18px stretch;background:#141722f5;background-clip:padding-box;image-rendering:pixelated; }
.world-hud .item-row { display:flex;justify-content:center;gap:9px; }.world-hud .item-row .skill { width:var(--slot);height:var(--slot);position:relative; }
.world-hud .item-row .skill-icon { background-image:var(--skin-slot); }
.world-hud .item-row .skill>b { display:none; }.world-hud .item-row .skill-tooltip { left:auto;right:0;transform:none; }
.world-hud .item-quantity { position:absolute;right:4px;bottom:3px;pointer-events:none;font:bold 12px/14px Consolas,monospace;color:#fff0cf;text-shadow:1px 1px #000,-1px -1px #000; }
.world-hud.hero-ui .item-deck .bottle-counts { font-size:8px;line-height:11px;margin:5px -4px 0;text-align:center;white-space:nowrap; }
.world-hud .cinematic .item-deck { visibility:hidden;pointer-events:none; }
@media(min-width:701px) and (max-width:1100px) {
 .world-hud.hero-ui .action-deck { bottom:208px; }
}
@media(max-width:700px) {
 .world-hud #world-shortcuts { left:auto;bottom:12px;right:12px;padding:0 3px;gap:1px;border-width:10px; }
 .world-hud #world-shortcuts .world-shortcut { width:46px;height:60px;background-size:46px 46px;font-size:9px; }
 .world-hud .navigation-art { width:44px;height:44px; }
 .world-hud.hero-ui .arena-wrap>.player-card { bottom:106px;left:0;width:240px;height:168px;padding:19px 20px 60px 74px;background-size:100% 110px; }
 .world-hud.hero-ui .player-card .fighter-heading>.portrait { left:21px;top:23px;width:45px;height:65px; }
 .world-hud.hero-ui .fighter-heading #hero-state { top:110px;left:22px;width:194px; }
 .world-hud.hero-ui .world-attributes { left:16px;right:16px;padding-left:3px;padding-right:3px; }
 .world-hud.hero-ui .action-deck { left:auto;right:12px;bottom:106px;transform:none;width:264px;--slot:40px;padding:4px 6px; }
 .world-hud.hero-ui .skill-row { grid-template-columns:repeat(5,var(--slot));gap:5px 3px; }
 .world-hud.hero-ui .item-deck { right:18px;bottom:276px;width:140px;--slot:40px; }
}
@media(max-width:540px) {
 .world-hud #world-shortcuts { left:12px;right:12px;justify-content:space-between; }
 .world-hud #world-shortcuts .world-shortcut { width:calc((100vw - 62px)/8);max-width:46px;background-size:100% 44px; }
 .world-hud .navigation-art { width:100%;max-width:44px;height:44px; }
 .world-hud.hero-ui .action-deck { bottom:292px; }
 .world-hud.hero-ui .item-deck { bottom:106px;width:116px;right:12px;--slot:34px; }
 .world-hud.hero-ui .arena-wrap>.player-card { width:222px; }
 .world-hud .world-attributes small { font-size:7px; }
 .world-hud.hero-ui .item-deck .bottle-counts { display:none; }
}
@media(min-width:701px) and (max-height:540px) {
 .world-hud.hero-ui .arena-wrap>.player-card { width:286px;height:163px;background-size:100% 107px;padding-top:16px;padding-left:87px; }
 .world-hud.hero-ui .player-card .fighter-heading>.portrait { top:22px;left:24px;width:54px;height:62px; }
 .world-hud.hero-ui .fighter-heading #hero-state { top:105px; }
 .world-hud.hero-ui .action-deck { left:310px;right:auto;bottom:16px;transform:none;width:258px;--slot:38px;padding:4px 6px; }
 .world-hud.hero-ui .skill-row { grid-template-columns:repeat(5,var(--slot));gap:5px 3px; }
 .world-hud.hero-ui .item-deck { bottom:130px;width:128px;--slot:38px; }
 .world-hud #world-shortcuts { bottom:16px; }
 .world-hud.hero-ui .action-deck { bottom:130px; }
 .world-hud.hero-ui #party-vitals { top:48px; }
 .world-hud.hero-ui .party-health { height:50px; }
}
@media(min-width:701px) and (max-width:780px) and (max-height:540px) {
 .world-hud.hero-ui .action-deck { left:300px;width:236px;--slot:34px; }
}
/* Combat tools are a single visual group; consumables always follow skills. */
@media(min-width:1440px) {
 .world-hud.hero-ui .action-deck { left:calc(50% - 258px);right:auto;transform:none;bottom:16px;width:306px;--slot:46px; }
 .world-hud.hero-ui .item-deck { left:calc(50% + 70px);right:auto;bottom:16px;width:150px;--slot:46px; }
}
@media(min-width:701px) and (max-width:1439px) {
 .world-hud.hero-ui .action-deck { left:calc(50% - 240px);right:auto;transform:none;bottom:210px;width:306px;--slot:46px; }
 .world-hud.hero-ui .item-deck { left:calc(50% + 88px);right:auto;bottom:210px;width:150px;--slot:46px; }
}
@media(max-width:700px) {
 .world-hud.hero-ui .action-deck { left:12px;right:auto;transform:none;bottom:292px;width:240px;--slot:34px; }
 .world-hud.hero-ui .item-deck { left:274px;right:auto;bottom:292px;width:116px;--slot:34px; }
}
@media(max-width:410px) {
 .world-hud.hero-ui .action-deck { left:10px;width:216px;--slot:30px; }
 .world-hud.hero-ui .item-deck { left:246px;width:104px;--slot:28px;padding-left:2px;padding-right:2px; }
}
@media(min-width:701px) and (max-height:540px) and (max-width:1439px) {
 .world-hud.hero-ui .action-deck { left:calc(50% - 215px);bottom:130px;width:258px;--slot:38px; }
 .world-hud.hero-ui .item-deck { left:calc(50% + 65px);bottom:130px;width:128px;--slot:38px; }
}
@media(max-width:360px) {
 .world-hud.hero-ui .action-deck { left:8px;width:194px;--slot:26px; }
 .world-hud.hero-ui .item-deck { left:222px;width:90px;--slot:24px; }
}

/* Scoped below shared skins: supplies retain their independent neutral frame. */
.world-hud.hero-ui .action-deck[data-hero]{border-image-source:var(--deck-frame);border-image-slice:var(--deck-slice);border-image-width:var(--deck-trim);border-image-outset:var(--deck-inset);background-color:var(--deck-floor);background-image:var(--deck-pattern,none)}
.world-hud.hero-ui .action-deck[data-hero] .skill-icon{border:5px solid transparent;border-image:var(--deck-frame) var(--deck-slice) / 7px / 1px stretch;padding:1px;background:linear-gradient(135deg,#ffffff08,#0006),var(--deck-floor)}
.world-hud.hero-ui .action-deck[data-hero="0"] .skill-icon{border:0;border-image:none;padding:6px;background:var(--hero-fire-slot) center/112% 112% no-repeat}
.world-hud.hero-ui .action-deck[data-hero] .deck-caption{color:var(--identity);letter-spacing:2px;display:flex;align-items:center;justify-content:center;gap:8px}
.world-hud.hero-ui .action-deck[data-hero] .deck-caption::before,.world-hud.hero-ui .action-deck[data-hero] .deck-caption::after{content:'';height:1px;width:22px;background:var(--identity-dark);box-shadow:0 1px #0008}
.world-hud.hero-ui .action-deck[data-hero] .skill kbd{border-color:var(--identity-dark);color:var(--identity);background:var(--deck-floor)}
.world-hud.hero-ui .action-deck[data-hero] .skill:focus-visible{outline:1px solid var(--identity);outline-offset:3px}
.world-hud.hero-ui .action-deck[data-hero] .skill-tooltip{border-image-source:var(--deck-frame);border-image-slice:var(--deck-slice);border-image-width:14px;border-image-outset:3px;background:var(--deck-floor);color:var(--identity)}

/* Eight shortcuts, including the dedicated talent entry beside character equipment. */
.world-hud #world-shortcuts #talent-shortcut{position:relative}
.world-hud #world-shortcuts .talent-point-badge{position:absolute;top:-4px;right:-1px;min-width:17px;height:17px;padding:0 3px;display:grid;place-items:center;border:1px solid #f8d98e;border-radius:8px;background:#72532c;color:#fff3c9;font:bold 10px/15px Consolas,monospace;text-shadow:0 1px #342215;box-shadow:0 1px 3px #000b;pointer-events:none}
.world-hud #world-shortcuts #talent-shortcut.has-points>span{color:#ffe0a1}

/* v75: four visible pockets; two reserved slots do not consume a potion. */
.world-hud.hero-ui .item-deck .item-row{display:grid;grid-template-columns:repeat(2,var(--slot));justify-content:center;gap:6px}
.world-hud.hero-ui .item-deck .supply-empty{width:var(--slot);height:var(--slot);display:grid;place-items:center;border:1px solid #665d52;background:linear-gradient(145deg,#121a24,#202631);box-shadow:inset 0 0 0 3px #121923;color:#807766;font-size:18px}
.world-hud.hero-ui .arena-wrap>.player-card{height:128px;padding-bottom:12px}
.world-hud.hero-ui .item-deck #potions{font-size:9px;white-space:normal;line-height:1.35}

/* Two balanced rows, including the learned profession skill when available. */
.world-hud.hero-ui .action-deck{width:400px;--slot:46px;left:calc(50% - 286px);right:auto;transform:none}
.world-hud.hero-ui .action-deck .skill-row{grid-template-columns:repeat(var(--skill-columns,7),var(--slot));grid-template-rows:repeat(2,var(--slot));grid-auto-flow:row;justify-content:center;gap:7px 5px}
.world-hud.hero-ui .item-deck{left:calc(50% + 136px);right:auto}
@media(min-width:1440px){
 .world-hud.hero-ui .action-deck{left:calc(50% - 350px)}
 .world-hud.hero-ui .item-deck{left:calc(50% + 72px)}
}
@media(min-width:701px) and (max-width:1439px) and (max-height:540px){
 .world-hud.hero-ui .action-deck{width:340px;--slot:38px;left:calc(50% - 245px)}
 .world-hud.hero-ui .item-deck{left:calc(50% + 117px)}
}
@media(min-width:541px) and (max-width:700px){
 .world-hud.hero-ui .action-deck{width:340px;--slot:38px;left:12px}
 .world-hud.hero-ui .item-deck{left:374px}
}
@media(max-width:540px){
 .world-hud.hero-ui .action-deck{left:12px;right:12px;width:calc(100% - 24px);max-width:none;--slot:min(46px,calc((100vw - 94px)/7));bottom:250px}
 .world-hud.hero-ui .item-deck{left:auto;right:12px;bottom:106px}
}

.town-development{width:min(960px,94vw);max-height:90dvh;overflow:auto;padding:20px;color:#dfd3b9;background:#141d28;border:14px solid transparent;border-image:var(--skin-panel) 36 fill / 36px / 22px stretch;background-clip:padding-box}.town-development header{display:flex;align-items:center;justify-content:space-between;gap:10px}.town-development header small{font-size:10px;letter-spacing:2px;color:#b59e74}.town-development h2{font-family:serif;margin:5px 0;font-size:28px}.development-lede,.reward-guide p{font-size:12px;line-height:1.8;color:#b9b6b0}#development-wallet{display:flex;flex-wrap:wrap;gap:10px 22px;margin:15px 0;padding:12px;background:#25323a;border-bottom:1px solid #786c53;font-size:12px}#development-wallet b{color:#f0ca80}#development-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.development-card{display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid #555563;background:#1d2632}.development-card>img{width:54px;height:90px;object-fit:contain;image-rendering:pixelated}.development-card>div{flex:1;min-width:0}.development-card h3{font-size:16px;margin:0 0 8px;color:#ead4a8}.development-card h3 em{font:11px Consolas,monospace;color:#a7cfc5;white-space:nowrap}.development-card p{font-size:11px;line-height:1.7;color:#bfc4ca;margin:8px 0}.development-card p.next-building{color:#dbbb87}.building-levels{display:flex;gap:5px}.building-levels i{width:20px;height:5px;background:#464750;border:1px solid #5a5960}.building-levels i.lit{background:#dbb26e;border-color:#ead198}.building-cost{display:block;font-size:10px;line-height:1.8;color:#a9bcb9}.development-card button{margin-top:10px;min-height:34px;width:100%;color:#e5c583;border-color:#8d744c}.development-card button:disabled{opacity:.5;cursor:not-allowed}#development-status{min-height:22px;font-size:12px;color:#cbe0a8}.reward-guide{margin-top:12px;border-top:1px solid #4c5860;padding-top:14px}.reward-guide summary{cursor:pointer;color:#e2c492;font-size:13px}#development-rewards>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;padding:8px;font-size:11px;background:#25303b;margin:4px 0}#development-rewards span{color:#b1c6c3}#town-development-button{border:1px solid #91754b;color:#e2c08c;background:#30332e}#clear-loot{position:absolute;z-index:24;top:54px;left:50%;transform:translateX(-50%);width:min(430px,calc(100% - 32px));padding:15px 18px;color:#e9d3a6;background:#121e29f5;border:1px solid #b7985e;box-shadow:0 8px 30px #0009}#clear-loot[hidden]{display:none}#clear-loot>button{position:absolute;right:6px;top:6px}#clear-loot>small{font-size:9px;letter-spacing:2px;color:#98c6bf}#clear-loot h3{font-size:17px;margin:8px 0}#clear-loot-resources,#clear-loot-note{font-size:11px;line-height:1.8}#clear-loot-equipment{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}#clear-loot-equipment>span{display:flex;align-items:center;gap:5px;font-size:11px;background:#2a303c;padding:5px}#clear-loot-equipment .gear-pixel-icon{width:32px;height:32px}#clear-loot-note{color:#b5c5b6;margin-bottom:0}.building-service-link{width:100%;margin-top:12px;color:#e2c08c}
@media(max-width:700px){.town-development{padding:10px}.town-development h2{font-size:23px}#development-cards{grid-template-columns:1fr}.development-card{padding:10px}.development-card>img{height:72px;width:43px}.town-development header small{font-size:8px}.development-lede{font-size:11px}#clear-loot{top:76px}.town-development{max-height:86dvh}}

/* Resource art is shared by loot, bag and town wallets. */
.resource-icon{width:32px;height:32px;object-fit:contain;image-rendering:pixelated;flex:none;vertical-align:middle}.resource-chip{display:inline-flex;align-items:center;gap:6px;line-height:1.5;font-size:12px;color:#d6d9c9}.resource-chip b{color:#f0cd8c;font-variant-numeric:tabular-nums}.bag-item>.resource-icon{width:48px;height:48px}#clear-loot-resources{display:grid;grid-template-columns:1fr 1fr;gap:6px}#clear-loot-resources .resource-chip{background:#293534;border:1px solid #52605b;padding:5px}#service-wallet .resource-chip{margin:2px 8px 2px 0}#service-wallet p{display:flex;flex-wrap:wrap;gap:4px}.item-heading>.resource-icon{width:48px;height:48px}

/* Shared PixelLab riverside skin. Scope to out-of-combat windows, never attack HUD. */
#game-root .modal-backdrop{background:#061719b8;backdrop-filter:blur(3px)}
#game-root .modal-backdrop :is(.modal,.town-development,.town-service,.gear-panel){
 border:18px solid transparent;border-image:var(--river-frame) 24 / 24px / 0 stretch;
 background:#14272b;background-clip:padding-box;border-radius:0;box-shadow:0 18px 60px #0008;image-rendering:pixelated;color:#e0d8bd;
 scrollbar-width:thin;scrollbar-color:#9c8052 #17292b;
}
#game-root .modal-backdrop :is(h2,h3){font-family:var(--serif);color:#f0d6a3;letter-spacing:.06em;text-shadow:0 2px #0c1418}
#game-root .modal-backdrop h2{font-weight:600}
#game-root .modal-backdrop :is(.eyebrow,header small){color:#bbba93;letter-spacing:2px}
#game-root .modal-backdrop :is(.town-development>header,.town-service>header,.gear-panel>header,.modal-head){
 background:linear-gradient(90deg,#0c202de6,#10252c66),var(--river-banner) center 58% / cover;
 border-bottom:2px solid #9b7d48;min-height:96px;padding:17px 20px;margin:0 0 16px;isolation:isolate;
}
#game-root .modal-backdrop :is(.town-development,.town-service){padding:15px;width:min(1020px,95vw)}
#game-root .modal-backdrop :is(.development-lede,.town-directory>p){margin:10px 4px 14px;color:#b9c5bb}
#game-root .modal-backdrop :is(.town-development,.town-service,.game-menu,.help-modal,.result-modal,.journey-modal,.dungeon-modal) button:not(.map-card){
 border:10px solid transparent;border-image:var(--river-button) 12 28 fill / 10px 20px / 0 stretch;
 background:#352821;background-clip:padding-box;border-radius:0;box-shadow:none;color:#f2d7a4;padding:3px 8px;min-height:40px;text-shadow:0 1px #100e0d;image-rendering:pixelated;
}
#game-root .modal-backdrop button:focus-visible{outline:2px solid #f3d69a;outline-offset:2px}
#game-root .modal-backdrop :is(.town-development,.town-service,.game-menu) button:not(:disabled):hover{filter:brightness(1.18)}
#game-root .modal-backdrop :is(.town-development,.town-service,.game-menu) button:disabled{filter:grayscale(.65);opacity:.55}
#game-root .modal-backdrop :is(header,.modal-head)>button{align-self:flex-start;min-width:36px;min-height:36px;padding:0;border-width:7px;flex-shrink:0}
#game-root .town-development #development-wallet{background:#0d1e21;border:1px solid #5c6656;box-shadow:inset 0 0 0 3px #1c3030;padding:12px 16px;margin:12px 0 18px;color:#c7c9ae;gap:8px 25px}
#game-root #development-wallet b{color:#f1c780}
#game-root #development-cards{gap:16px}
#game-root .development-card{display:grid;grid-template-columns:106px minmax(0,1fr);gap:14px;padding:13px;border:1px solid #867951;background:linear-gradient(110deg,#263c3a,#172b30);box-shadow:inset 0 0 0 3px #102528}
.building-vignette{position:relative;width:106px;min-height:156px;align-self:stretch;border:1px solid #826c44;overflow:hidden;background:#182b2e}
.building-vignette .building-room{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center;filter:brightness(.62) saturate(.75);image-rendering:pixelated}
.building-vignette .building-host{position:absolute;bottom:21px;left:50%;transform:translateX(-50%);width:72px;height:108px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 3px 2px #000)}
.building-vignette figcaption{position:absolute;bottom:0;left:0;right:0;background:#102326dd;padding:3px;text-align:center;color:#dac7a3;font-size:10px;border-top:1px solid #685d45}
#game-root .development-card h3{font-size:18px;line-height:1.5;margin:0 0 8px}
#game-root .development-card h3 em{font-size:10px;color:#a3c9be;letter-spacing:0}
#game-root .development-card p{color:#bbcabd;font-size:12px;line-height:1.7;margin:8px 0}
#game-root .development-card p.next-building{color:#e0c187}
#game-root .development-card .building-cost{color:#c3c6ac;font-size:11px}
#game-root .building-levels i{height:7px;width:23px;background:#102123;border-color:#5d7268}
#game-root .building-levels i.lit{background:#d6b16b;border-color:#f5d798;box-shadow:inset 0 -2px #8e663a}
#game-root .town-development #development-status{color:#c2d6b0;margin:12px 0}
#game-root .reward-guide{border-color:#687557;background:#102427;padding:12px 15px}
#game-root #development-rewards>div{background:#203936;border-bottom:1px solid #506454;padding:10px}
#game-root .modal-backdrop .game-menu{position:relative;width:min(510px,94vw);padding:18px 22px;overflow:auto;max-height:92dvh;background:linear-gradient(#14272b88 0 100px,#14272b 150px),var(--river-banner) top center / auto 150px no-repeat,#14272b;background-clip:padding-box}
#game-root .game-menu>.eyebrow{display:block;font-size:9px;letter-spacing:1px}
#game-root .game-menu h2{font-size:32px;margin:10px 0 0}
#game-root .game-menu #menu-location{margin:4px 0 22px;color:#e2d7b7;text-shadow:0 2px 3px #000}
#game-root .game-menu>.primary{font-size:17px;min-height:46px}
#game-root .game-menu .menu-options{gap:7px;margin:12px 0}
#game-root .game-menu .menu-options button{min-height:40px;font-size:12px}
#game-root .game-menu .music-settings{background:#102124a8;border:1px solid #68715a;padding:10px 12px;color:#c7cbb2}
#game-root .game-menu .modal-foot{font-size:11px;color:#adbdad;line-height:1.8}
#game-root .gear-panel{height:calc(100dvh - 105px);max-height:900px}
#game-root .gear-panel>header{margin:0;min-height:90px;padding:12px 15px}
#game-root .gear-panel-scroll{background:linear-gradient(135deg,#21383488,#14272b);padding:14px}
#game-root .gear-workspace-tools{background:#102427ec;border-color:#82734e}
#game-root .gear-workspace button:not(.bag-item):not([data-gear-slot]){border-color:#80734f;border-radius:0;background:#233c37;color:#e5c991}
#game-root .bag-item{background:#102629;border:1px solid #5d6e61;box-shadow:inset 0 0 0 3px #1f3534;border-radius:0}
#game-root .bag-item[aria-pressed=true]{background:#3a4938;outline:1px solid #d0b474}
#game-root .gear-paperdoll{background:radial-gradient(ellipse at 50% 66%,#89794b45,transparent 65%)}
#game-root .gear-slot>button:first-child{background:#11272b;border-color:#65765d;border-radius:0}
#game-root .town-service .service-body aside{background:#11272a;border:1px solid #61705a}
#game-root .town-service .service-row,#game-root .town-service .service-story{background:#203936;border-color:#617058}
#game-root .town-directory #directory-list button{min-height:108px;border:1px solid #7d7454;border-image:none;background:linear-gradient(115deg,#203d39,#152c30);padding:12px;box-shadow:inset 0 0 0 3px #11272a}
#game-root .town-directory #directory-list img{width:50px;height:76px}
#game-root #clear-loot{border:16px solid transparent;border-image:var(--river-frame) 24 fill / 20px / 0 stretch;background:#14272b;color:#edcea0}
@media(max-width:700px){
 #game-root .modal-backdrop :is(.town-development,.town-service){padding:8px;border-width:12px}
 #game-root .modal-backdrop :is(.town-development>header,.town-service>header,.gear-panel>header,.modal-head){min-height:76px;padding:12px}
 #game-root .development-card{grid-template-columns:82px minmax(0,1fr);padding:10px;gap:10px}
 .building-vignette{width:82px;min-height:148px}.building-vignette .building-host{width:65px}
 #game-root .development-card h3{font-size:16px}#game-root .development-card p{font-size:11px}
 #game-root .game-menu{padding:14px}#game-root .gear-panel{height:calc(100dvh - 110px)}
}
@media(max-height:540px){#game-root .game-menu{max-height:94dvh}#game-root .modal-backdrop :is(.town-development>header,.town-service>header,.modal-head){min-height:68px;padding:10px 16px}}

/* Title screen: a single painted scene, brush lettering, and a quiet game menu. */
@font-face{font-family:EmberBrush;src:url('./assets/7d938fd8484004aae8b6a768.woff2') format('woff2');font-display:swap;font-weight:400}
#intro.title-screen{position:fixed;inset:0;display:block;padding:0;background:#111e2b;color:#f1dfb8;overflow:auto;font-family:'Microsoft YaHei',sans-serif;isolation:isolate}
#intro.title-screen[hidden]{display:none}
#intro .intro-art,#intro[data-page-side=right] .intro-art{position:fixed;inset:0;border-radius:0;clip-path:none;opacity:1;filter:none;background-size:cover;background-position:var(--page-image,64%) center;image-rendering:pixelated;z-index:-3}
#intro .intro-shade,#intro[data-page-side=right] .intro-shade{position:fixed;inset:0;z-index:-2;background:linear-gradient(90deg,#0c162bef 0%,#0d1b2bd9 17%,#101c2a95 35%,#121c290d 65%),linear-gradient(0deg,#0b1425cc,transparent 20%,transparent 85%,#101b2b50);pointer-events:none}
#intro .intro-top{position:relative;height:92px;margin:0 5.8vw;padding:0;border:0;display:flex;align-items:center;justify-content:space-between;z-index:3}
#intro .chapter-tab{font:15px 'SimSun',serif;letter-spacing:3px;color:#d8c7a5;display:flex;gap:14px;align-items:center}
#intro .chapter-tab b{font:25px EmberBrush,serif;color:#e1b77e;border:1px solid #b795635e;padding:5px 7px;background:#18233380;font-weight:400}
#intro #site-layout-open{background:#111c2880;border:1px solid #c3b08450;border-radius:0;padding:9px 15px;color:#e0cfb1;font:13px 'SimSun',serif;letter-spacing:2px}
#intro .intro-stage{min-height:calc(100svh - 170px);height:auto;max-height:none;border:0;margin:0;padding:0 7.5vw;position:relative;display:flex;align-items:center}
#intro .intro-stage:after{display:none}
#intro .intro-content,#intro[data-page-side=right] .intro-content{width:var(--page-copy,400px);max-width:90vw;padding:28px 0 48px;margin:0;position:relative;z-index:2}
#intro[data-page-side=right] .intro-content{margin-left:auto}
#intro .title-lockup{position:relative;width:340px;max-width:100%;padding:0 0 0 0}
#intro .title-lockup h2{font-family:EmberBrush,'KaiTi',serif;font-weight:400;font-size:clamp(90px,calc(var(--page-title,88px)*1.5),156px);line-height:.93;letter-spacing:0;margin:0;padding:0;color:#f4e5c6;transform:rotate(-4deg);text-shadow:2px 4px 0 #26313b,0 8px 22px #080c1599}
#intro .title-lockup h2>span{display:block;font:inherit;color:inherit;letter-spacing:0;line-height:.93;text-shadow:inherit}
#intro .title-lockup .title-second{margin:4px 0 0 60px}
#intro .title-lantern{position:absolute;right:-14px;top:-18px;width:72px;height:96px;object-fit:contain;filter:drop-shadow(0 0 12px #e8a34b32)}
#intro .title-seal{position:absolute;left:10px;bottom:12px;color:#efc8a3;background:#873f34;border:1px solid #ca8261;box-shadow:inset 0 0 0 3px #873f34,inset 0 0 0 4px #d89f7488;font:20px/1.05 EmberBrush,serif;padding:7px 5px;transform:rotate(-5deg)}
#intro .title-motto{font:17px/1.6 'KaiTi','SimSun',serif;letter-spacing:5px;color:#c6c1af;margin:28px 0 34px 12px}
#intro .title-menu{display:flex;flex-direction:column;align-items:stretch;gap:9px;width:320px;max-width:100%}
#intro .title-menu button{margin:0;min-height:48px;width:100%;display:flex;align-items:center;justify-content:space-between;text-align:left;padding:8px 23px;border:1px solid transparent;border-radius:0;background:transparent;color:#d5ccb8;font:27px EmberBrush,'KaiTi',serif;letter-spacing:2px;box-shadow:none;transition:color .15s,background .15s}
#intro .title-menu button:hover,#intro .title-menu button:focus-visible{color:#fff0c8;background:#d6ae6820;border-color:#b3946055;outline:1px solid #c8ab7560;outline-offset:3px}
#intro #start-button{min-height:60px;color:#ffedc3;background:linear-gradient(90deg,#b285412e,#b2854118 70%,transparent);border:0;border-top:1px solid #c9a56885;border-bottom:1px solid #c9a56860;position:relative;font-size:31px}
#intro #start-button:before{content:'◆';position:absolute;left:-10px;top:21px;font:12px serif;color:#edc57b;text-shadow:0 0 8px #dca75a}
#intro .title-menu #start-button{width:100%;max-width:none;border-radius:0;padding:12px 23px;gap:10px;white-space:nowrap}
#intro .title-menu .arena-try small{font:11px 'Microsoft YaHei',sans-serif;letter-spacing:0;color:#9ba9ab}
#intro .title-party{position:relative;width:320px;max-width:100%;margin:16px 0 10px;color:#b6c0b7;font-size:12px}
#intro .title-party summary{padding:10px 22px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;border-bottom:1px solid #b8ac8728;letter-spacing:3px}
#intro .title-party[open]{background:#101e2cef;border:1px solid #b1955a50}
#intro .intro-behavior{margin:0;padding:12px;border:0}
#intro .intro-behavior legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#intro .behavior-options{gap:8px}
#intro .behavior-options button{padding:10px 2px;background:#1a2938;border:1px solid #9d8a633c;color:#a8b6bc;min-width:0;border-radius:0}
#intro .behavior-options button[aria-pressed=true]{background:#493e2c;border-color:#c2a26c;color:#f6dc9e}
#intro .behavior-options b{font:12px 'Microsoft YaHei',sans-serif}
#intro .behavior-options small,#intro .behavior-options button:after{display:none}
#intro .behavior-note{margin:12px 0 0;font-size:11px}
#intro #load-status{display:block;margin:14px 0 0 22px;color:#a6b0b2;font-size:11px;letter-spacing:1px}
#intro .scene-caption,#intro[data-page-side=right] .scene-caption{position:absolute;right:6vw;bottom:60px;left:auto;text-align:right;border:0;display:flex;flex-direction:column;gap:8px}
#intro .scene-caption>span{font:34px EmberBrush,'KaiTi',serif;color:#f4deaf;letter-spacing:5px;text-shadow:0 2px 5px #08131e}
#intro .scene-caption>small{font:12px 'SimSun',serif;color:#cbbf9f;letter-spacing:3px}
#intro .intro-bottom{height:78px;padding:0 5.8vw;display:flex;align-items:center;gap:32px;margin:0;border-top:1px solid #b09d6e30;background:#0d17267a;color:#a1acb0;font:12px 'Microsoft YaHei',sans-serif;letter-spacing:1px;position:relative;z-index:4}
#intro .title-keys{margin-left:auto;font-size:11px}
#intro .title-previews{position:relative}
#intro .title-previews summary{cursor:pointer;padding:10px;color:#dbc8a2;list-style:none}
#intro .title-previews summary span{margin-left:22px}
#intro .intro-preview,#intro[data-page-flow=compact] .intro-preview{position:absolute;bottom:44px;left:0;width:300px;display:flex;flex-direction:column;gap:0;padding:10px;background:#111f2cf5;border:1px solid #b29868;box-shadow:0 8px 24px #0006}
#intro .intro-preview button,#intro .intro-preview button:nth-child(n){width:100%;padding:15px 12px;margin:0;min-height:0;border:0;border-bottom:1px solid #b2986833;border-radius:0;background:transparent;display:flex;align-items:center;justify-content:space-between;transform:none}
#intro .intro-preview b{font:24px EmberBrush,serif;color:#ecd7ac}
#intro .intro-preview small{font-size:11px;color:#a7b5ba}
#intro .site-editor{z-index:10}
#intro.title-screen{overflow-x:hidden}
#intro .intro-bottom{left:auto;right:auto;bottom:auto;width:100%;max-width:none;justify-content:flex-start;flex-wrap:nowrap;box-sizing:border-box}
#intro .title-previews:not([open]) .intro-preview{display:none}
#intro[data-page-side=right] .intro-shade{background:linear-gradient(270deg,#0c162bef 0%,#0d1b2bd9 17%,#101c2a95 35%,#121c290d 65%),linear-gradient(0deg,#0b1425cc,transparent 25%)}
#intro[data-page-side=right] .scene-caption{right:auto;left:6vw;text-align:left}
@media(min-height:1000px) and (min-width:800px){#intro .intro-content{padding-bottom:60px}#intro .title-motto{margin-top:40px;margin-bottom:44px}#intro .title-menu{gap:15px}}
@media(max-width:760px){#intro .intro-top{height:72px;margin:0 6vw}#intro .intro-stage{padding:0 9vw;min-height:calc(100svh - 140px)}#intro .intro-content{padding:30px 0;width:340px}#intro .title-lockup{width:270px}#intro .title-lockup h2{font-size:100px}#intro .title-lantern{width:55px;height:74px;right:-5px}#intro .title-motto{font-size:14px;letter-spacing:3px;margin:24px 0}#intro .title-menu{width:290px}#intro .scene-caption{display:none}#intro .intro-bottom{height:68px;padding:0 6vw;gap:15px;font-size:10px}#intro .title-keys{display:none}#intro .intro-art{background-position:62% center}#intro .intro-shade{background:linear-gradient(90deg,#0b172be8,#0c182bc5 40%,#0c182b55),linear-gradient(0deg,#0b172b,transparent 35%)}#intro .intro-preview{left:auto;right:-10vw;width:270px}}
@media(max-height:740px) and (min-width:761px){#intro .intro-top{height:60px}#intro .intro-stage{min-height:calc(100svh - 116px)}#intro .intro-content{padding:12px 0 20px}#intro .title-lockup{width:270px}#intro .title-lockup h2{font-size:88px}#intro .title-motto{margin:18px 0 18px;font-size:14px}#intro .title-lantern{width:54px;height:72px}#intro .title-menu button{min-height:36px;font-size:23px}#intro #start-button{min-height:48px;font-size:27px}#intro #start-button:before{top:17px}#intro .title-party{margin:6px 0}#intro #load-status{margin-top:6px}#intro .intro-bottom{height:56px}}
@media(prefers-reduced-motion:reduce){#intro *{animation:none!important;transition:none!important}}
@media(max-width:760px){#intro .title-previews{margin-left:auto}#intro .intro-preview,#intro[data-page-flow=compact] .intro-preview{left:auto;right:0}#intro .chapter-tab{font-size:12px;letter-spacing:1px;gap:8px}#intro #site-layout-open{font-size:11px;padding:8px 10px}}

/* Dedicated field satchel and inn dressing screen. Loaded after the shared menu skin. */
#game-root #equipment-modal{background:#081417b8;backdrop-filter:blur(2px)}
#game-root #equipment-modal .gear-desktop{padding-bottom:100px;gap:clamp(16px,5vw,100px)}
#game-root #equipment-modal .gear-panel{height:calc(100dvh - 180px);max-height:1060px;min-height:340px}
#game-root #equipment-modal .inventory-panel{border:0;border-image:none;background:var(--kit-satchel) center / 123% 119% no-repeat;box-shadow:0 20px 42px #0008;border-radius:18px;padding:34px 27px 30px;max-width:590px;isolation:isolate}
#game-root #inventory-panel>header{background:none;border:0;margin:0;padding:9px 15px 12px;min-height:74px;flex-shrink:0}
#game-root #inventory-panel h2{font-size:28px;color:#f3d9aa;text-shadow:2px 2px #171117}
#game-root #inventory-panel header small{font-size:10px;color:#a9b9b9;letter-spacing:3px}
#game-root #inventory-panel .gear-panel-scroll{background:none;padding:0 15px;display:flex;flex-direction:column;overflow:hidden;gap:0}
#game-root #inventory-panel footer{border:0;padding:10px 15px 0;color:#c0af8f;font-size:10px;flex-shrink:0}
#game-root #inventory-panel .bag-wallet{display:flex;background:#100f1699;padding:7px 10px;border-top:1px solid #8a7056;border-bottom:1px solid #564d50;flex-shrink:0;gap:6px}
#game-root #inventory-panel .bag-wallet #bag-count{font-size:10px;color:#b2a397;white-space:nowrap}
#game-root #inventory-panel .resource-chip{display:inline-flex;align-items:center;color:#c5b89c;white-space:nowrap;font-size:11px}
#game-root #inventory-panel .resource-chip>span{display:inline}#game-root #inventory-panel .resource-chip b{font-size:17px}
#game-root #inventory-panel .bag-wallet .resource-icon{width:28px;height:28px}
#game-root #inventory-panel #bag-filters{gap:0;margin:13px 0 0;padding:0 3px;border-bottom:2px solid #a4865b;flex-shrink:0;display:grid;grid-template-columns:repeat(6,1fr)}
#game-root #inventory-panel #bag-filters button{padding:8px 2px;border:1px solid #76604b;border-bottom:0;background:#29252b;color:#a89b89;font-size:11px;position:relative}
#game-root #inventory-panel #bag-filters button[aria-pressed=true]{background:#b69a66;color:#201c1c;box-shadow:inset 0 2px #e5cf9d;font-weight:bold}
#game-root #inventory-panel .bag-storage{background:#0c1220b0;padding:9px 8px 10px;border:1px solid #5b5360;border-top:0;min-height:140px;flex:1;overflow:auto;scrollbar-width:thin;scrollbar-color:#a28b65 #171b2b}
.bag-storage-label{display:flex;align-items:center;justify-content:space-between;color:#ad9c82;font-size:10px;letter-spacing:2px;margin:0 3px 9px}.bag-storage-label small{font-size:9px;letter-spacing:0;color:#87939d}
#game-root #inventory-panel #bag-items{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
#game-root #inventory-panel :is(.bag-item,.bag-empty-pocket){border:0!important;border-radius:0;box-shadow:none;background:var(--kit-pocket) center / 100% 100% no-repeat;min-height:84px;padding:8px 4px 6px!important;position:relative;aspect-ratio:1/1.08}
#game-root #inventory-panel .bag-item{justify-content:center;gap:2px;color:#dfd4bc;transition:filter .12s}
#game-root #inventory-panel .bag-item:hover{filter:brightness(1.22)}
#game-root #inventory-panel .bag-item[aria-pressed=true]{outline:2px solid #e8c27d;outline-offset:-5px;filter:brightness(1.2)}
#game-root #inventory-panel .bag-item::after{content:'';position:absolute;left:28%;right:28%;bottom:4px;height:2px;background:#8c8a83}
#game-root #inventory-panel .bag-item.fine::after{background:#77b48c}#game-root #inventory-panel .bag-item.rare::after{background:#78b7da}#game-root #inventory-panel .bag-item.epic::after{background:#c393d9}
#game-root #inventory-panel .bag-empty-pocket{opacity:.48}
#game-root #inventory-panel .bag-item :is(.gear-pixel-icon,.resource-icon){width:42px;height:42px;filter:drop-shadow(0 2px #090d16)}
#game-root #inventory-panel .bag-item b{font-size:9px;line-height:1.35;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px #000}
#game-root #inventory-panel .bag-item small{font-size:8px;margin:0;color:#baa98e;line-height:1.4}
#game-root #inventory-panel .gear-item-detail{margin:12px 0 0;padding:12px 14px;flex:0 0 auto;max-height:32%;min-height:110px;overflow:auto;color:#d3c2a6;background:linear-gradient(110deg,#332b29f5,#23202af2);border:1px solid #8c7454;box-shadow:inset 0 0 0 3px #211d22,0 3px 7px #0005}
#game-root #inventory-panel .gear-item-detail h3{font-size:19px;color:#efcf95}#game-root #inventory-panel .gear-item-detail p{font-size:11px;color:#c0b5a3;line-height:1.8;margin:6px 0}
#game-root #inventory-panel .gear-compare{font-size:11px;background:#151c20;border-color:#5f6254}#game-root #inventory-panel :is(#bag-equip,#bag-use){background:#91784e;border:1px solid #d0ae71;color:#fff0cb;font-size:12px}
#game-root #equipment-modal .character-panel{background:#1c2426;border:12px solid #433a2c;border-image:var(--river-frame) 24 / 18px / 0 stretch;box-shadow:0 20px 42px #0008;max-width:620px}
#game-root #character-panel>header{background:linear-gradient(90deg,#121b20ed,#2b3228ed),var(--kit-alcove) center 30%/cover;border-bottom:2px solid #94764b;min-height:78px;margin:0;padding:12px 18px}
#game-root #character-panel>header h2{font-size:27px}#game-root #character-panel>header small{font-size:9px;letter-spacing:3px}
#game-root #character-panel .gear-panel-scroll{background:linear-gradient(90deg,#302a25aa,#121e24 18%,#121e24 82%,#302a25aa);padding:12px 14px}
#game-root #character-panel #bag-roster{padding:6px;background:#0b151b;border:1px solid #65583f;gap:4px}
#game-root #character-panel #bag-roster button{background:#26302d;border:1px solid #5e6353;padding:3px 0;color:#a7b2aa;font-size:9px}
#game-root #character-panel #bag-roster button[aria-pressed=true]{border-color:#d8b26d;background:#5a4b35;color:#ffe2a7;box-shadow:inset 0 -2px #cfac6b}
#game-root #character-panel #gear-name{padding:0 4px;margin:12px 0}#game-root #character-panel #gear-name h3{font-size:26px}
#game-root #character-panel .gear-paperdoll{background:#0d181f;border:1px solid #625b47;padding:7px;grid-template-columns:94px minmax(90px,1fr) 94px;gap:8px;align-items:stretch}
#game-root #character-panel .gear-model-wrap{background:var(--kit-alcove) center / 100% 100% no-repeat;position:relative;min-height:320px;border:1px solid #384746;overflow:hidden;justify-content:flex-end;padding-bottom:0}
#game-root #character-panel .gear-model-wrap canvas{position:relative;z-index:1;width:100%;max-height:310px;filter:drop-shadow(0 2px 1px #07121a88)}
#game-root #character-panel .gear-model-wrap>span{position:absolute;bottom:5px;left:0;right:0;color:#c5b58e;font-size:9px;text-shadow:0 2px #000}
#game-root #character-panel .gear-slots{align-content:space-between;gap:5px}
#game-root #character-panel .gear-slot>button:first-child{background:var(--kit-pocket) center/100% 100% no-repeat;border:0;min-height:59px;display:flex;padding:8px;color:#decea9}
#game-root #character-panel .gear-slot small{font-size:9px;color:#adad99}#game-root #character-panel .gear-slot b{font-size:9px}
#game-root #character-panel .slot-ghost{width:30px;display:inline-block;opacity:.35;filter:grayscale(1) sepia(.4)}
#game-root #character-panel .slot-ghost .gear-pixel-icon{width:28px;height:34px}
#game-root #character-panel .gear-slot .gear-unequip{z-index:2;background:#604a35;border-color:#b29662;color:#efd7a3}
#game-root #character-panel #bag-stats{background:#0d171e;border:1px solid #5c5846;margin-top:12px;padding:10px 4px;gap:4px}
#game-root #character-panel #bag-stats b{color:#ebcc93;font-family:var(--serif);font-size:23px}#game-root #character-panel #gear-rule{font-size:10px;margin:10px 0 2px}
#game-root #character-panel footer{background:#1c2627;color:#a5b1a7;border-color:#62553e;font-size:10px;padding:8px 12px}
#game-root #equipment-modal .gear-access-dock{position:fixed;right:24px;bottom:18px;display:flex;gap:6px;z-index:3;padding:7px;background:#142026ed;border:1px solid #9b7e4f;box-shadow:0 4px 14px #0009}
#game-root #equipment-modal .gear-access-dock button{display:flex;align-items:center;gap:8px;background:#253332;border:1px solid #77674b;padding:5px 12px;color:#d8c29b;min-width:104px}
#game-root #equipment-modal .gear-access-dock button[aria-pressed=true]{border-color:#dfbd7c;background:#51452f;color:#ffe6b1}
.gear-access-dock img{width:36px;height:36px;image-rendering:pixelated}.gear-access-dock span{font-size:12px}.gear-access-dock kbd{font-size:10px;opacity:.7;margin-left:3px}
#game-root #character-panel #bag-stats{grid-template-columns:1fr 1fr;padding:10px 12px;gap:0 16px;text-align:left}
#game-root #character-panel #bag-stats h4{grid-column:1/-1;font:16px var(--serif);letter-spacing:3px;margin:0 0 7px;color:#dabd88}
#game-root #character-panel #bag-stats>div{display:flex;justify-content:space-between;align-items:center;gap:4px;padding:6px 0;border-bottom:1px solid #38413d}
#game-root #character-panel #bag-stats span{font-size:11px}#game-root #character-panel #bag-stats b{font-size:15px;margin:0;white-space:nowrap}#game-root #character-panel #bag-stats b small{font-size:9px;margin-left:3px;color:#9ec09c}
@media(max-width:1100px){#game-root #equipment-modal .gear-desktop{gap:12px;padding:12px 10px 90px}#game-root #equipment-modal .inventory-panel{padding:27px 17px 23px}#game-root #inventory-panel .gear-panel-scroll{padding:0 8px}#game-root #inventory-panel #bag-items{grid-template-columns:repeat(4,minmax(0,1fr))}#game-root #inventory-panel :is(.bag-item,.bag-empty-pocket){min-height:74px}#game-root #character-panel .gear-paperdoll{grid-template-columns:65px minmax(70px,1fr) 65px;gap:3px;padding:4px}#game-root #character-panel .gear-slot>button:first-child{display:block;text-align:center;padding:5px;min-height:62px}#game-root #character-panel .slot-ghost{margin:auto}#game-root #character-panel .gear-slot b{display:none}#game-root #character-panel .gear-model-wrap{min-height:340px}#game-root #character-panel #bag-roster img{display:block;width:24px;height:26px}#game-root #character-panel .gear-panel-scroll{padding:8px}}
@media(max-width:700px){#game-root #equipment-modal .gear-desktop{grid-template-columns:1fr;padding:8px 8px 90px;gap:16px}#game-root #equipment-modal .gear-panel{grid-column:1;width:100%;justify-self:stretch;max-width:none;height:calc(100dvh - 150px);min-height:440px}#game-root #equipment-modal.both-open .gear-panel{height:680px}#game-root #inventory-panel #bag-items{grid-template-columns:repeat(5,minmax(0,1fr))}#game-root #inventory-panel>header{min-height:58px;padding:4px 8px 10px}#game-root #inventory-panel h2{font-size:23px}#game-root #inventory-panel header small{font-size:8px;letter-spacing:1px}#game-root #inventory-panel .bag-item :is(.gear-pixel-icon,.resource-icon){width:32px;height:32px}#game-root #inventory-panel .bag-item b{font-size:8px}#game-root #inventory-panel :is(.bag-item,.bag-empty-pocket){min-height:65px}#game-root #inventory-panel .gear-item-detail{padding:9px;min-height:96px}#game-root #inventory-panel .gear-item-detail h3{font-size:17px}#game-root #character-panel #bag-roster{grid-template-columns:repeat(8,1fr)}#game-root #character-panel #bag-roster span{font-size:8px}#game-root #character-panel #bag-stats{grid-template-columns:repeat(2,1fr);text-align:left}#game-root #character-panel #bag-stats>div{display:flex}#game-root #character-panel #bag-stats span{font-size:9px}#game-root #character-panel #bag-stats b{font-size:14px}#game-root #equipment-modal .gear-access-dock{right:10px;bottom:10px;padding:4px}#game-root #equipment-modal .gear-access-dock button{min-width:90px;padding:4px 9px}.gear-access-dock img{width:30px;height:30px}}

#game-root #equipment-modal .gear-workspace-tools{position:sticky;top:0;z-index:5;flex-shrink:0}

/* Character progression: a quiet brass experience gauge below combat status. */
.character-level-hud{display:flex;align-items:center;gap:6px;padding:3px 8px;color:#e8ce91;background:#142527;border:1px solid #70624b;font-size:10px}.character-level-hud b{white-space:nowrap;color:#f5d28a}.character-level-hud progress{flex:1;min-width:20px;height:5px;accent-color:#d9b66e;border:0;background:#172023}.character-level-hud progress::-webkit-progress-bar{background:#172023}.character-level-hud progress::-webkit-progress-value{background:linear-gradient(90deg,#8f764d,#ebcb89)}.character-level-hud small{white-space:nowrap;font-size:9px}.character-growth{margin-top:5px;color:#c3c6b4;font-size:11px}.character-growth summary{color:#dec48c;cursor:pointer}.character-growth p{margin:7px 0;line-height:1.6}

/* v60: three readable inventory lines, including quality and wearer. */
#game-root #inventory-panel .bag-item{min-height:104px;aspect-ratio:auto}
#game-root #inventory-panel .bag-item small{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}
#game-root #inventory-panel .bag-item .gear-pixel-icon{flex-shrink:0}
#game-root #inventory-panel .bag-item.legendary::after{background:#edbe62}
#game-root #inventory-panel .bag-item.limited::after{background:#f3a99d;height:3px}
@media(max-width:700px){#game-root #inventory-panel .bag-item{min-height:90px}#game-root #inventory-panel .bag-item b{flex-shrink:0}}

/* v75: use the available desktop width and give the traveller a full alcove. */
@media(min-width:1101px){
 #game-root #equipment-modal .gear-desktop{gap:24px;padding:18px 24px 88px}
 #game-root #equipment-modal .gear-panel{height:calc(100dvh - 138px);max-height:1200px}
 #game-root #equipment-modal .inventory-panel{width:100%;max-width:820px}
 #game-root #equipment-modal .character-panel{max-width:820px}
 #game-root #character-panel .gear-paperdoll{grid-template-columns:114px minmax(120px,1fr) 114px;gap:10px;padding:10px}
 #game-root #character-panel .gear-model-wrap{min-height:420px}
 #game-root #character-panel .gear-model-wrap canvas{max-height:410px}
 #game-root #character-panel .gear-slot>button:first-child{min-height:76px}
 #game-root #inventory-panel .bag-item .gear-pixel-icon{width:48px;height:48px}
 #game-root #inventory-panel #bag-items{gap:8px}
}
/* Full quality rims, with a small wearability marker beside the item art. */
#game-root #equipment-modal .common{--quality:#e1e4df;--quality-floor:#363d42}
#game-root #equipment-modal .fine{--quality:#80c99a;--quality-floor:#203e33}
#game-root #equipment-modal .rare{--quality:#77baff;--quality-floor:#243851}
#game-root #equipment-modal .epic{--quality:#c89aef;--quality-floor:#3c2d50}
#game-root #equipment-modal .legendary{--quality:#f2b257;--quality-floor:#493721}
#game-root #equipment-modal .limited{--quality:#f1a2a7;--quality-floor:#4b2936}
#game-root #inventory-panel .bag-item[data-bag-item].common,
#game-root #inventory-panel .bag-item[data-bag-item]:is(.fine,.rare,.epic,.legendary,.limited),
#game-root #character-panel .gear-slot>button:first-child:not(.empty){
 border:2px solid var(--quality)!important;
 background:linear-gradient(145deg,var(--quality-floor),#111b25 80%);
 box-shadow:inset 0 0 0 2px #141c23,inset 0 0 0 3px color-mix(in srgb,var(--quality) 36%,transparent),0 2px 0 #060d14;
 border-radius:2px;
}
#game-root #inventory-panel .bag-item::after{display:none}
#game-root #inventory-panel .bag-item[aria-pressed=true]{outline:2px solid #ffe1a4;outline-offset:2px;filter:none}
#game-root #inventory-panel .bag-item small:first-of-type{color:var(--quality,#c9b996)}
#game-root #inventory-panel .bag-item .equip-blocked{position:absolute;right:7px;top:8px;width:16px;height:16px;border:2px solid #f1a19a;border-radius:50%;background:#401c24;box-shadow:0 1px 3px #000;pointer-events:none}
#game-root #inventory-panel .equip-blocked::before{content:'';position:absolute;left:1px;right:1px;top:5px;height:2px;background:#f1a19a;transform:rotate(-45deg)}

#ai-rules-modal .modal{width:min(900px,94vw);max-height:90dvh;overflow:auto;background:#11262c;color:#e9dcc2;border:2px solid #987c50;padding:28px;box-shadow:0 0 0 5px #172e30,0 16px 70px #000b}
#ai-rule-roster{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin:18px 0}
#ai-rule-roster button{display:grid;justify-items:center;gap:4px;padding:8px;background:#1b3035;border:1px solid #5d6757;color:#d9c9a5}
#ai-rule-roster img{width:44px;height:44px;object-fit:cover;image-rendering:pixelated}
#ai-rule-roster [aria-pressed=true]{border-color:#e1bc70;background:#34413a;box-shadow:inset 0 -3px #d7ad62}
.ai-rule-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin:18px 0}
.ai-rule-fields label{display:block;font-size:14px;color:#e2d2ae}.ai-rule-fields select{display:block;width:100%;margin-top:8px;padding:9px;background:#20383d;color:#f2e2bc;border:1px solid #69715b}
.ai-rule-fields input[type=range]{width:100%;display:block;accent-color:#cfaa61;margin:12px 0}.ai-rule-fields output{float:right;color:#f2d796}
#ai-rule-skills{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;border:1px solid #64705a;padding:16px;margin:16px 0}#ai-rule-skills input{accent-color:#d2b376;margin-right:8px}
.ai-rule-note{font-size:13px;line-height:1.7;color:#b4bfae}.ai-rule-footer{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.ai-rule-footer p{flex:1;font-size:13px}
@media(max-width:650px){#ai-rules-modal .modal{padding:18px}#ai-rule-roster{grid-template-columns:repeat(4,1fr)}.ai-rule-fields{grid-template-columns:1fr}#ai-rule-skills{grid-template-columns:1fr 1fr}}

/* Academy journal: warm paper, jade bookmarks and a PixelLab lantern companion. */
#bag-stats>.balance-note{grid-column:1/-1;font-size:11px;line-height:1.7;color:#b6c3b6;margin:0 0 8px;text-align:left}
#career-modal [hidden],.action-deck [data-action="dash"][hidden]{display:none!important}
#game-root #career-modal{color-scheme:light;background:#071c25c9;backdrop-filter:blur(4px)}
#game-root #career-modal .career-dialog{width:min(1120px,96vw);max-height:94dvh;overflow:auto;padding:22px 28px;border:5px solid #6c8578;border-image:none;border-radius:22px 8px 8px 22px;background:linear-gradient(90deg,#d4c7a9 0,transparent 15px),repeating-linear-gradient(0deg,transparent 0 27px,#a89d7310 27px 28px),#f3ecd9;color:#3d5047;box-shadow:0 0 0 3px #d1b47d,inset 0 0 0 5px #fffcf1,0 20px 70px #0008;scrollbar-gutter:stable;scrollbar-color:#9eac98 #e9dfc8}
#game-root #career-modal :is(h2,h3,h4){color:#345448;text-shadow:none;letter-spacing:.025em}
#career-modal button{font:inherit;cursor:pointer;border:1px solid #a8b59c;border-bottom-width:3px;background:#e2ead8;color:#355644;border-radius:10px;padding:8px 13px;min-height:40px;box-shadow:none}
#career-modal button:not(:disabled):hover{background:#d1e2c7;border-color:#698a70}
#career-modal button:disabled{opacity:.65;cursor:default;color:#5e645a;background:#e7e3d5;border-color:#bdbba7}
#game-root #career-modal button:focus-visible{outline:3px solid #4e8078;outline-offset:3px}
#game-root #career-modal .career-heading{display:flex;align-items:center;gap:18px;padding:8px 4px 17px;border-bottom:2px dashed #b9bba0;background:none}
.career-heading>div:first-child{flex:1}
#game-root #career-modal .career-heading small{font-size:11px;color:#6c7d64;letter-spacing:1px}
#career-modal .career-heading h2{font-size:31px;margin:6px 0;font-family:KaiTi,STKaiti,'Microsoft YaHei',serif}
.career-heading-note{font-size:12px;color:#7b8067}
.career-mascot{width:100px;height:100px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 3px 0 #a7a98418)}
.career-mascot-card{position:relative;flex:0 0 auto;align-self:center;z-index:3}
#game-root #career-modal .career-mascot-button{display:flex;flex-direction:column;align-items:center;gap:1px;min-height:0;padding:2px 5px;border:0;border-radius:12px;background:transparent;color:#79582e;box-shadow:none}
#game-root #career-modal .career-mascot-button:hover{background:#e9d9ac48}
.career-mascot-button>span{font-size:12px;line-height:1.4;letter-spacing:3px;padding-left:3px}
#career-modal .career-mascot-story{position:absolute;top:calc(100% + 8px);right:0;width:230px;max-width:calc(90vw - 26px);padding:15px 17px;background:#fcf6e5;border:1px solid #c2ad7b;border-radius:12px 3px 12px 12px;box-shadow:0 8px 24px #293e3833;text-align:left;box-sizing:border-box}
#game-root #career-modal .career-mascot-story>small{font-size:10px;letter-spacing:1px;color:#8d7149}
#game-root #career-modal .career-mascot-story h3{margin:7px 0;font-size:22px}.career-mascot-story h3 span{font-size:11px;margin-left:7px;color:#688170}.career-mascot-story p{font-size:12px;line-height:1.8;margin:9px 0;color:#4f6356}.career-mascot-story blockquote{font-size:12px;margin:10px 0 0;padding-top:9px;border-top:1px dashed #cdbf98;color:#956431}
.career-points{display:grid;justify-items:center;min-width:100px;padding:12px;border:1px solid #cfb782;border-radius:18px 18px 6px 18px;background:#f6dfad;transform:rotate(2deg);box-shadow:2px 3px #d5c49e55}
.career-points b{font-size:33px;line-height:1;color:#79552e;font-family:Georgia,serif}.career-points span{font-size:11px;margin-top:6px;color:#715d3d}
#game-root #career-modal #career-close{align-self:flex-start;min-width:34px;min-height:34px;border:1px solid #adbaa1;padding:3px;background:#e1e8d7;border-radius:50%}
#career-roster{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin:17px 0}
#career-roster button{display:grid;grid-template-columns:34px 1fr;align-items:center;column-gap:6px;padding:7px 6px;background:#e7e4d5;border-color:#c3c4ae;position:relative}
#career-roster img{width:34px;height:40px;object-fit:cover;image-rendering:pixelated;grid-row:span 2;border-radius:6px;border:1px solid #acb99e}
#career-roster span{font-size:14px;font-weight:bold}#career-roster small{font-size:10px;color:#6a765f}
#career-roster [aria-pressed=true]{border-color:#628c75;background:#d4e5cd;box-shadow:0 2px 0 #bcc8a7;transform:translateY(-2px)}
#career-roster [aria-pressed=true]:after{content:'✦';position:absolute;right:4px;top:-9px;color:#9b682c;background:#f8e3b4;border-radius:50%;width:18px;height:18px;font-size:12px}
#career-summary{display:flex;align-items:center;gap:16px;padding:14px 18px;background:#e2e7d6;border:1px solid #bcc8a9;border-radius:14px;box-shadow:inset 0 0 0 3px #f8f6e850}
.career-portrait{width:64px;height:76px;object-fit:cover;image-rendering:pixelated;border:3px solid #fff8e6;border-radius:10px;box-shadow:0 2px 0 #b8bca4;transform:rotate(-3deg)}
.career-identity{flex:1;min-width:0}.career-identity>small{font-size:10px;color:#66765f}.career-identity h3{font-size:24px;margin:3px 0 7px}.career-identity h3 span{font-size:13px;margin-left:13px;font-weight:normal}.career-identity p{font-size:11px;color:#66775f;margin:5px 0 0}
.career-xp{display:flex;align-items:center;gap:9px;font-size:11px}.career-xp b{color:#426f55}.career-xp progress{width:140px;height:8px;border:0;border-radius:6px;overflow:hidden;accent-color:#709c77}.career-xp progress::-webkit-progress-bar{background:#c3ccb3}.career-xp progress::-webkit-progress-value{background:#709c77}.career-xp span{color:#596e55}
.career-milestones{display:flex;gap:16px;list-style:none;padding:0;margin:0;font-size:11px;color:#777a6b}.career-milestones li{border-top:3px dotted #b8b89f;padding-top:8px}.career-milestones b{display:block;margin-bottom:4px}.career-milestones .reached{color:#477356;border-color:#7f9f6e}
.career-tabs{display:flex;align-items:center;gap:8px;border-bottom:1px solid #c7c8ae;padding:16px 0 10px}.career-tabs span{margin-left:auto;font-size:11px;color:#6d7862}
#career-modal .career-tabs [aria-pressed=true]{background:#567e68;color:#fff5d9;border-color:#426451;border-radius:10px 10px 3px 3px}
.career-lede{font-size:13px;color:#647458;line-height:1.7}
#career-guidance{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:15px 0;padding:12px 16px;border-radius:5px 14px 14px 14px;background:#efe0bd;border:1px solid #d7c497}
#career-guidance b{font-size:13px;color:#735c35}#career-guidance p{font-size:12px;color:#705e3c;margin-top:4px}#career-guidance p span{display:block;font-size:11px;color:#827357;margin-top:3px}#career-guidance>small{text-align:right;line-height:1.8;color:#786943}
#career-filters{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}
#career-filters button{font-size:12px;min-height:34px;padding:5px 10px;border-bottom-width:1px;background:#f9f4e7;border-color:#c6c9af;border-radius:16px}
#career-filters button[aria-pressed=true]{background:#d1e2c7;color:#355b40;border-color:#7c9d76}
#career-filters small{display:inline-block;min-width:17px;margin-left:7px;background:#d9dfca;border-radius:50%;font-size:10px;color:#526a48}
.career-group{margin:20px 0}.career-group>h3{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-size:18px}.career-group>h3:before{content:'✦';color:#b98e4c;font-size:16px}.career-group>h3 small{font-size:11px;color:#7b8068;font-weight:normal;letter-spacing:0}
.career-node-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.career-node{display:flex;flex-direction:column;min-width:0;padding:14px;background:#fbf6e9;border:1px solid #ccc8b0;border-radius:14px;box-shadow:0 3px 0 #c9c3a847}
.career-node.available{border-color:#94ac80}.career-node.learned{background:#f2f5e6;border-color:#85a57d;box-shadow:0 3px 0 #a3bc9755}
.career-node-heading{display:flex;align-items:center;gap:10px}.career-node-heading img{width:56px;height:56px;flex:0 0 56px;padding:3px;object-fit:contain;image-rendering:pixelated;border:1px solid #cbb78d;border-radius:12px;background:radial-gradient(ellipse at 50% 38%,#344846,#172c33 76%);box-shadow:inset 0 0 0 2px #e7d7b323,0 2px 4px #27312922}.career-node-heading>div{flex:1;min-width:0}.career-node-heading small{font-size:10px;color:#71805f}.career-node-heading h4{margin:4px 0;font-size:14px;line-height:1.4}.career-rank{font-size:19px;color:#487053;white-space:nowrap}.career-rank small{font-size:10px}
.career-node>p{font-size:12px;line-height:1.75;color:#67745d;min-height:40px;margin:10px 0;flex:1}
.career-preview{display:flex;flex-wrap:wrap;gap:4px 9px;border-top:1px dashed #d0cbb4;padding-top:8px;font-size:11px;line-height:1.8}.career-preview span{display:block}.career-preview b{color:#66725d;font-weight:normal;margin-left:4px}.career-preview i{font-style:normal;color:#97a084;margin:0 5px}.career-preview strong{color:#37694d}
#career-modal kbd{padding:2px 6px;border:1px solid #b6c2a6;border-bottom-width:2px;background:#e0e8d4;font-family:inherit;font-size:11px;color:#40634a;border-radius:5px}
.career-pips{display:flex;gap:4px;margin:13px 0}.career-pips i{height:6px;border-radius:3px;background:#e3dfcb;flex:1;border:1px solid #d6d0b6}.career-pips .filled{background:#8eae75;border-color:#789966}
.career-node-bottom{display:flex;align-items:center;justify-content:space-between;gap:5px}.career-node-bottom>span{font-size:10px;color:#778268}.career-node-actions{display:flex;gap:5px}.career-node-bottom button{font-size:11px!important;min-height:34px!important;padding:5px 8px!important}.career-node-bottom .career-refund{min-width:30px;font-size:17px!important;padding:0 6px!important;background:#f0e9da}
#career-modal .career-node.available [data-career-learn]{background:#d7e5c8;border-color:#90aa77;color:#365633}
.career-unassigned{display:flex;align-items:center;gap:18px;margin:16px 0;padding:14px 18px;border:1px dashed #b0b894;border-radius:14px;background:#e6ead6}.career-unassigned img{height:78px;width:50px;object-fit:contain;image-rendering:pixelated}.career-unassigned div{flex:1}.career-unassigned h3{font-size:18px;margin:0 0 6px}.career-unassigned p{font-size:12px;line-height:1.7;color:#65775d}
#career-branches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}.career-branch{position:relative;display:flex;flex-direction:column;gap:9px;padding:22px 18px 18px;background:#faf5e7;border:1px solid #c8c7a9;border-radius:16px 16px 6px 6px;box-shadow:0 4px #cdc5a84a}.career-branch.chosen{border-color:#789d74;background:#e6edda}.career-branch>img{width:72px;height:72px;padding:4px;object-fit:contain;image-rendering:pixelated;background:#20343c;border:2px solid #dac69d;border-radius:14px}.career-branch h3{font-size:21px;margin:0}.career-branch small{font-size:12px;color:#65805b}.career-branch p{font-size:13px;line-height:1.8;flex:1;min-height:48px}.career-branch>div{line-height:2.2;font-size:12px;border-top:1px dashed #c7c8ac;padding-top:8px}.career-number{position:absolute;right:18px;top:13px;font-family:KaiTi,serif;font-size:40px;color:#abb595}.career-branch button{margin-top:10px}
.career-footer{display:flex;gap:10px;align-items:center;border-top:2px dashed #c4c4a6;padding-top:12px;margin-top:20px}.career-footer p{flex:1;font-size:12px;line-height:1.7;color:#61765b}.career-footer button{font-size:12px!important}#career-modal #career-reset{background:#eee5d2;color:#7a6746;border-color:#c4b697}#career-confirm{padding:16px;border:1px solid #c6b882;border-radius:12px;background:#eee1b9;font-size:13px;line-height:1.8}#career-confirm button{margin-right:12px}
.character-level-hud .talent-shortcut{margin-left:5px;border:1px solid #b19a61;background:#293b36;color:#f2dba6;font-size:10px;white-space:nowrap;padding:2px 5px;cursor:pointer}.character-level-hud .talent-shortcut.has-points{background:#4e4d2e;border-color:#dbc17e}
@media(max-width:960px){#career-roster{grid-template-columns:repeat(4,minmax(0,1fr))}.career-node-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.career-milestones{gap:9px}.career-mascot{width:80px;height:80px}.career-tabs span{font-size:10px}}
@media(max-width:600px){#game-root #career-modal .career-dialog{padding:12px;width:96vw;border-width:3px;border-radius:15px;max-height:95dvh}#game-root #career-modal .career-heading{gap:8px;flex-wrap:wrap;padding:4px 0 12px}.career-heading>div:first-child{flex-basis:60%}#career-modal .career-heading h2{font-size:25px}#game-root #career-modal .career-heading small{font-size:10px;letter-spacing:0}.career-heading-note{font-size:10px}.career-mascot{width:80px;height:80px}.career-points{min-width:0;display:flex;gap:9px;padding:6px 10px;border-radius:10px;transform:none}.career-points b{font-size:23px}.career-points span{font-size:10px;margin:0}#game-root #career-modal #career-close{margin-left:auto;align-self:center}#career-roster{gap:6px}#career-roster button{grid-template-columns:30px 1fr;padding:6px 4px;gap:2px}#career-roster img{width:30px;height:34px}#career-roster span{font-size:12px}#career-roster small{font-size:9px}#career-summary{flex-wrap:wrap;gap:10px;padding:10px}.career-portrait{width:48px;height:58px}.career-identity h3{font-size:21px}.career-identity h3 span{font-size:11px;margin-left:6px}.career-milestones{width:100%;justify-content:space-around}.career-xp{gap:6px;font-size:10px}.career-xp progress{width:70px}.career-tabs span{display:none}#career-guidance{flex-wrap:wrap;gap:8px;padding:10px}#career-guidance>small{text-align:left}#career-filters{gap:5px}#career-filters button{font-size:11px;padding:5px 8px}.career-node-grid,#career-branches{grid-template-columns:1fr}.career-group>h3{display:block}.career-group>h3:before{margin-right:6px}.career-group>h3 small{display:block;margin-top:5px}.career-node>p{min-height:0}.career-unassigned{flex-wrap:wrap;gap:10px}.career-unassigned button{width:100%}.career-footer{flex-wrap:wrap}.career-footer p{min-width:100%}.career-footer button{flex:1}}

#skillbook-modal .skillbook-dialog{width:min(1180px,96vw);max-height:94vh;overflow:auto;padding:24px;background:#11252d;border:2px solid #b69b69;color:#dce4d8;box-shadow:0 0 0 5px #071920,0 22px 90px #000a;border-radius:14px;font-family:EmberLanternText,"Microsoft YaHei",sans-serif}
/* Warm paper study pages, with a separate ledger for skill investment. */
#game-root #skillbook-modal .skillbook-dialog{background:#eee9d7;color:#354f49;border-color:#8eaa92;box-shadow:0 0 0 3px #c6b582,0 20px 70px #10282688}
#game-root #skillbook-modal header{border-color:#b7bea4}
#game-root #skillbook-modal h2,#game-root #skillbook-modal h3,#game-root #skillbook-modal h4,#game-root #skillbook-modal strong{color:#30594f}
#game-root #skillbook-modal button{background:#e5ead8;color:#36594e;border-color:#a5b79c;box-shadow:none}
#game-root #skillbook-modal button:disabled{opacity:.65}
#game-root #skillbook-modal button:focus-visible{outline:3px solid #977430}
#game-root #skillbook-modal [aria-pressed=true]{background:#cddfc6;border-color:#6b9478;color:#284b40}
#game-root #skillbook-summary{background:linear-gradient(110deg,#e2e9d1,#f4edda);border:0;border-bottom:2px solid #b5c3a8;flex-wrap:wrap}
#game-root #skillbook-summary>div{flex:1;min-width:190px}
#game-root #skillbook-summary h3 span,#game-root #book-growth,#game-root #skillbook-modal footer{color:#657561}
#game-root #skillbook-modal .book-study-points{display:flex;flex-direction:column;gap:5px;min-width:135px;padding-left:18px;border-left:1px solid #b4c0a6}
#game-root #skillbook-modal .book-study-points strong{font-size:36px;line-height:1}
#game-root #skillbook-modal .book-study-points span{font-size:12px}
#game-root #skillbook-modal .book-loadout-slot{background:#e2e6d7;color:#40584c;border-color:#adbba3}
#game-root #skillbook-modal .book-loadout-slot>small{color:#655735}
#game-root #skillbook-modal .book-section-title,#game-root #book-notice{color:#71603b}
#game-root #book-role-description>div{background:#e1e6d3;border-color:#8faa8d}
#game-root #book-role-description p{color:#586f60}
#game-root #skillbook-modal .book-skill-card{background:#f6f3e8;color:#40574e;border:0;border-bottom:2px solid #c5cbb4;border-radius:3px 12px 5px 3px;gap:10px}
#game-root #skillbook-modal .book-skill-card.equipped{background:#e7efde;box-shadow:inset 3px 0 #72947b}
#game-root #skillbook-modal .book-skill-card.ultimate{background:linear-gradient(145deg,#f8eed8,#edf0df);border-bottom-color:#baa569}
#game-root #skillbook-modal .book-skill-heading small,#game-root #skillbook-modal .book-stats{color:#637461}
#game-root #skillbook-modal .book-tier{color:#8c6629}
#game-root #skillbook-modal .book-rank{display:flex;justify-content:space-between;gap:8px;font-size:11px;border-bottom:1px dashed #bbc4ad;padding-bottom:8px;color:#557a5e}
#game-root #skillbook-modal .book-next{font-size:11px;color:#5e715c;line-height:1.7}
#game-root #skillbook-modal .book-next summary{cursor:pointer;color:#4c7560}
#game-root #skillbook-modal .book-study-actions{display:flex;gap:8px;margin-top:auto}
#game-root #skillbook-modal .book-study-actions button:first-child{flex:1;background:#d3e3c8}
.skillbook-dialog>header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #476068;padding-bottom:16px}.skillbook-dialog h2{font-size:28px;color:#f0d5a2;margin:6px 0}.skillbook-dialog button{font:inherit;cursor:pointer;border:1px solid #6c8279;background:#243d43;color:#e2dec5;padding:8px 12px;border-radius:6px}.skillbook-dialog button:disabled{opacity:.5;cursor:default}.skillbook-dialog button:focus-visible,.book-slot:focus-visible{outline:2px solid #ffdc8f;outline-offset:3px}
#skillbook-roster{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin:18px 0}#skillbook-roster button{display:flex;gap:8px;align-items:center;justify-content:center;padding:6px}#skillbook-roster img{width:34px;height:40px;object-fit:cover;image-rendering:pixelated}#skillbook-roster [aria-pressed=true],#book-tabs [aria-pressed=true]{border-color:var(--book-accent);background:#344f50;color:#ffdf9b}
#skillbook-summary{display:flex;align-items:center;gap:20px;padding:18px;border:1px solid #466367;border-radius:8px;background:linear-gradient(115deg,#263e46,#182b35)}#skillbook-summary>img{width:72px;height:88px;object-fit:cover;border:1px solid #9a8967}#skillbook-summary h3{font-size:25px;margin:4px 0;color:var(--book-accent)}#skillbook-summary h3 span{font-size:13px;color:#b8c6bc;margin-left:16px}#skillbook-summary p{margin:8px 0;line-height:1.8}.book-section-title{display:flex;justify-content:space-between;align-items:center;color:#dec698}.book-section-title h3{font-size:18px}
#book-loadout-slots{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px}.book-loadout-slot{position:relative;border:1px solid #60746b;background:#20353d;border-radius:8px;padding:8px 4px;text-align:center;min-height:105px}.book-loadout-slot>small{position:absolute;top:2px;left:5px;font:11px monospace;color:#f7db93}.book-loadout-slot img{width:48px;height:48px;image-rendering:pixelated;object-fit:contain}.book-loadout-slot>span{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.book-loadout-slot>div{height:24px}.book-loadout-slot button{padding:0 8px;font-size:13px;margin:2px}.book-loadout-slot b{font-size:10px;color:#879e95}.book-loadout-slot .book-empty{display:block;height:48px;font:30px/48px sans-serif;color:#67877e}#book-growth{font-size:12px;color:#a3bbb0}
#book-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 16px}#book-role-description{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}#book-role-description>div{border-left:3px solid var(--book-accent);padding:10px 14px;background:#20373e}#book-role-description strong{color:#e3d1a9}#book-role-description p{font-size:12px;color:#b5c9c0;line-height:1.8;margin:8px 0}#book-notice{color:#ecce8e;min-height:20px;font-size:13px}
#book-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.book-skill-card{display:flex;flex-direction:column;padding:16px;border:1px solid #4c6467;background:#1c323b;border-radius:9px;gap:12px}.book-skill-card.equipped{border-color:var(--book-accent);box-shadow:inset 0 0 0 1px #a2c0a13b}.book-skill-heading{display:flex;align-items:center;gap:12px}.book-skill-heading img{width:64px;height:64px;image-rendering:pixelated;object-fit:contain;border-radius:9px;background:radial-gradient(#3d5151,#13282f);border:1px solid #988460;padding:3px}.book-skill-heading h4{font-size:18px;color:#efdab3;margin:5px 0}.book-skill-heading small{font-size:10px;color:#b0c1b6}.book-tier{font-size:11px;color:#ffcf81;margin-left:auto}.book-skill-card p{font-size:13px;line-height:1.8;flex:1;margin:0}.book-stats{font-size:11px;line-height:1.8;color:#b7cfae}.book-skill-card.locked .book-skill-heading{opacity:.7}.skillbook-dialog footer{font-size:12px;color:#9cb1a7;margin-top:20px}.book-career-link{margin-left:auto!important}
.world-hud.hero-ui .action-deck.loadout-deck{width:min(580px,calc(100vw - 600px));max-width:none;left:50%;right:auto;transform:translateX(-50%);height:auto;padding:10px 14px 8px;bottom:12px}.loadout-deck>.hotbar{display:none!important}.book-hotbar{display:grid;grid-template-columns:repeat(var(--book-columns),minmax(0,1fr));grid-template-rows:repeat(2,1fr);gap:5px;max-width:100%;margin-top:4px}.book-slot{position:relative;aspect-ratio:1;min-width:0;max-height:60px;border:1px solid #ad9164;padding:3px;background:radial-gradient(#34474c,#10222b);box-shadow:inset 0 0 0 1px #07161d;cursor:pointer;overflow:hidden}.book-slot img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.book-slot kbd{position:absolute;bottom:0;left:2px;color:#fff2cc;font:10px/12px monospace;text-shadow:1px 1px #000;background:#10202aab;padding:1px 2px}.book-slot>i{position:absolute;left:0;right:0;bottom:0;background:#0a111fc9;pointer-events:none}.book-slot .book-cooldown{position:absolute;inset:0;display:grid;place-content:center;font:12px monospace;color:#fff8e6;text-shadow:1px 1px 3px #000}.book-slot.empty{color:#7c928e;font-size:22px;border-color:#53656b}.book-slot.unready img{opacity:.55}.book-manage{display:block;margin:5px auto 0;padding:2px 12px;border:0;background:transparent;color:#e3c68f;font-size:11px;cursor:pointer}.world-hud.hero-ui .item-deck{left:auto!important;right:12px;bottom:112px!important}
@media(max-width:1050px){#book-cards{grid-template-columns:repeat(2,minmax(0,1fr))}#book-role-description{grid-template-columns:1fr}.world-hud.hero-ui .action-deck.loadout-deck{width:min(560px,calc(100vw - 28px));left:50%;bottom:170px}}
@media(max-width:700px){#skillbook-modal .skillbook-dialog{padding:16px}#skillbook-roster{grid-template-columns:repeat(4,1fr)}#book-loadout-slots{grid-template-columns:repeat(5,minmax(0,1fr))}.book-skill-heading img{width:48px;height:48px}.book-skill-heading h4{font-size:15px}.book-skill-card{padding:12px}.world-hud.hero-ui .action-deck.loadout-deck{bottom:230px;width:calc(100vw - 24px)}.book-slot kbd{font-size:8px}.book-hotbar{gap:3px}}
@media(max-width:480px){#book-cards{grid-template-columns:1fr}#skillbook-summary{gap:12px;padding:12px}#skillbook-summary>img{width:48px;height:60px}.book-loadout-slot img{width:40px;height:40px}}

.book-controls{display:flex;align-items:center;gap:10px}.book-controls .book-hotbar{flex:1;min-width:0}.book-controls .book-innate{flex:0 0 46px;width:46px;height:60px;aspect-ratio:auto;border-color:#b1bfa1}.book-innate>span{position:absolute;top:1px;right:2px;font-size:9px;color:#e6d8b7;background:#172c32c9}.book-innate:disabled{opacity:.55}.book-innate-note{display:flex;align-items:center;gap:16px;margin:12px 0;padding:10px 14px;background:#dce6d0;border-left:3px solid #789b7d;border-radius:4px;color:#456353}.book-innate-note span{font-size:12px}@media(max-width:700px){.book-controls{gap:5px}.book-controls .book-innate{flex-basis:34px;width:34px;height:48px}.book-innate-note{flex-wrap:wrap;gap:4px}}

.book-innate-controls{display:grid;grid-template-rows:repeat(2,1fr);gap:4px;padding-right:10px;border-right:1px solid #b1bfa155}.book-controls .book-innate-controls .book-innate{height:42px;width:46px}.book-innate[aria-pressed="true"]{border-color:#ffe9a7;background:#496653;box-shadow:inset 0 0 0 2px #d5b976}@media(max-width:700px){.book-innate-controls{padding-right:5px}.book-controls .book-innate-controls .book-innate{width:34px;height:36px}}

.book-hotbar .book-passive-slot{border-style:dashed;border-color:#a8cca7;background:#1b3936}.book-passive-slot kbd{font-size:9px;color:#d1e9bf}.book-passive-card{border-left:3px solid var(--folio-accent,#9bbd8a)}.passive-equip{margin:10px 0 2px;padding:9px;font-size:11px}

#hero-guide-modal .hero-guide-dialog{width:min(1200px,96vw);max-width:96vw;max-height:94vh;overflow:auto;padding:26px;color:#e1dfcc;background:#11242c;border:2px solid #b39c73;font-family:EmberLanternText,"Microsoft YaHei",sans-serif}
.hero-guide-head{display:flex;align-items:center;gap:18px;border-bottom:1px solid #52605c;padding-bottom:16px}.hero-guide-head>div{flex:1}.hero-guide-head h2{font:30px EmberLanternDisplay,serif;margin:4px 0;color:#f2d6a0}.hero-guide-head small{letter-spacing:2px;color:#a5b8b0}.hero-guide-head>span{font-size:12px;color:#b4bba9}
.hero-guide-dialog button,.hero-guide-entry{font:inherit;color:#e3d5b0;border:1px solid #61756c;background:#21383f;border-radius:5px;padding:8px 12px;cursor:pointer}.hero-guide-dialog button:hover,.hero-guide-entry:hover{border-color:var(--guide-color,#e2c994);background:#304a4d}.hero-guide-dialog button:focus-visible,.hero-guide-dialog input:focus-visible{outline:2px solid #eacb8e;outline-offset:3px}.hero-guide-dialog [aria-pressed=true]{border-color:var(--guide-color);color:#fff1cc;background:#314b4e}.hero-guide-entry{font-size:12px;margin:5px}
#hero-guide-roster{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin:18px 0}#hero-guide-roster button{display:flex;align-items:center;gap:9px;padding:8px}#hero-guide-roster img{width:34px;height:42px;object-fit:cover;image-rendering:pixelated}#hero-guide-roster span{text-align:left;font-size:16px}#hero-guide-roster small{display:block;font-size:10px;color:#a0b7b1;margin-top:3px}
.hero-guide-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:26px}.guide-illustration{height:360px;position:relative;border:1px solid #a88b5a;image-rendering:pixelated;box-shadow:inset 0 -95px 45px -30px #07141c}.guide-illustration>span{position:absolute;bottom:74px;left:18px;writing-mode:vertical-rl;letter-spacing:4px;color:#f6dfab;text-shadow:1px 2px #081821}.guide-illustration>strong{position:absolute;bottom:14px;left:18px;font:48px EmberLanternDisplay,serif;color:#fff0cc;text-shadow:1px 3px #101c27}.guide-identity{border:1px solid #4f6663;border-top:0;padding:16px;background:#192f36}.guide-identity>span{font-size:11px;color:var(--guide-color)}.guide-identity>b{float:right;font-size:12px}.guide-identity>p{font-size:17px;color:#e4cea5;margin:12px 0}.guide-identity>div{display:flex;flex-wrap:wrap;gap:6px}.guide-identity small{font-size:10px;color:#bccfc2;border:1px solid #425e5b;border-radius:12px;padding:3px 7px}
#hero-guide-tabs{display:flex;gap:8px;border-bottom:1px solid #4c6762;padding-bottom:12px;margin-bottom:18px;flex-wrap:wrap}#hero-guide-tabs button{flex:1;white-space:nowrap}.hero-guide-reading{min-width:0}.guide-intro small{color:#a8b9a8;font-size:10px;letter-spacing:2px}.guide-intro h3{font-size:26px;color:var(--guide-color);margin:10px 0}.guide-intro h3 span{font-size:12px;color:#c5cdb9;display:inline-block;margin-left:14px}.hero-guide-dialog p{font-size:14px;line-height:1.85}.guide-intro p{margin:8px 0;color:#c5d0c7}.guide-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:22px 0}.guide-metrics>div{background:#233b42;border-bottom:2px solid var(--guide-color);padding:12px}.guide-metrics small{display:block;font-size:10px;color:#b3c4b9}.guide-metrics b{font:24px/1.8 EmberLanternText,serif;color:#eedbb4}.guide-metrics em{font:11px EmberLanternText;margin-left:6px}.guide-note{padding:14px 18px;background:#20363e;border-left:3px solid var(--guide-color);margin:12px 0}.guide-note h4,.guide-partners h4{font-size:16px;color:#ead5a8;margin:0 0 6px}.guide-note p{margin:0;color:#c6d4c9}.guide-note small{font-size:11px;color:#9fb8ae}.guide-note.caution{border-color:#b59b6b;background:#2c3437}.guide-partners>p{font-size:11px;color:#9db3aa;margin:2px 0 10px}.guide-partners{margin:20px 0}.guide-partners>div{display:flex;gap:8px}.guide-partners button{display:flex;flex:1;gap:10px;text-align:left;align-items:center}.guide-partners img{width:30px;height:38px;object-fit:cover;image-rendering:pixelated}.guide-partners small{display:block;font-size:9px;color:#b2c0b3;margin-top:4px}
.guide-section-heading h3{font-size:23px;color:#ead6ac;margin:8px 0}.guide-section-heading p{font-size:12px;color:#aebeb1;margin:8px 0 18px}.guide-careers{display:grid;gap:14px}.guide-careers article{background:#1d343d;border:1px solid #506761;padding:16px}.guide-careers article.chosen{border-color:var(--guide-color)}.guide-careers header{display:flex;gap:12px;align-items:center}.guide-careers header img{width:54px;height:54px;image-rendering:pixelated}.guide-careers h4{font-size:21px;color:#e9d3a5;margin:5px 0}.guide-careers header small{font-size:10px;color:#b4c7b9}.guide-careers p{margin:8px 0}.guide-bonus{font-size:11px;color:#a9c9b0}.guide-route-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}.guide-route-preview>span{display:grid;grid-template-columns:36px 1fr;column-gap:8px;align-items:center}.guide-route-preview img{width:36px;height:36px;image-rendering:pixelated;grid-row:span 2}.guide-route-preview b{font-size:12px;font-weight:normal}.guide-route-preview small{font-size:10px;color:#a4bbaa}.guide-careers article>button{font-size:12px;width:100%}
.guide-search{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.guide-search>input{flex:1;min-width:180px;padding:10px;color:#e8e6ce;border:1px solid #688378;background:#0f222c;font:13px EmberLanternText}.guide-search label{font-size:12px;display:flex;gap:7px;align-items:center}.guide-search input[type=checkbox]{accent-color:#bcbb80}#guide-skill-filters{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0}#guide-skill-filters button{font-size:11px;padding:6px 9px}#guide-skill-count{font-size:11px;color:#aec3b7}#guide-skill-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.guide-skill{padding:14px;background:#1c343c;border:1px solid #4b6963}.guide-skill>div{display:flex;gap:10px;align-items:center}.guide-skill img{width:48px;height:48px;image-rendering:pixelated;flex-shrink:0}.guide-skill h4{font-size:17px;margin:4px 0;color:#e9d5ac}.guide-skill small{font-size:10px;color:#a9bdb1;line-height:1.7}.guide-skill>div>span{margin-left:auto;font-size:9px;color:#b5cbb1;white-space:nowrap}.guide-skill.locked>div>span{color:#ae9d83}.guide-skill p{font-size:12px;margin:10px 0}.guide-empty{grid-column:1/-1;text-align:center;padding:30px;color:#b2c0b1}
.guide-growth-current{display:flex;flex-wrap:wrap;gap:12px;padding:18px;background:#253e42;border:1px solid #6a8070}.guide-growth-current>b{margin-left:auto;font-size:12px;color:#e5d2aa}.guide-growth-current>progress{width:100%;height:8px;accent-color:#b7c98c}.guide-growth-current>small{font-size:11px;color:#c0ceb5}.guide-milestones{padding:0;list-style:none;margin:22px 0}.guide-milestones li{display:flex;gap:20px;padding:13px 0;border-bottom:1px solid #3c5558}.guide-milestones li>b{width:100px;flex-shrink:0;font-size:15px;color:var(--guide-color)}.guide-milestones small{display:block;font-size:11px;color:#b3c6bb;margin-top:5px}.guide-capacity summary{cursor:pointer;font-size:13px;color:#d8c89f;padding:14px 0}.guide-capacity>div{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.guide-capacity span{padding:8px;background:#22383d;color:#aabfb4;font-size:11px}.guide-capacity b{float:right;color:#e8d5a8}
.hero-guide-footer{display:flex;align-items:center;gap:12px;justify-content:space-between;border-top:1px solid #52695e;padding-top:16px;margin-top:22px}.hero-guide-footer>span{font-size:11px;color:#aec0b2}.hero-guide-footer>div{display:flex;gap:8px;flex-wrap:wrap}.hero-guide-footer button{font-size:12px}
@media(max-width:480px){#hero-guide-roster button{flex-direction:column;justify-content:center}#hero-guide-roster span{text-align:center;white-space:nowrap}#hero-guide-roster small{font-size:9px}}
@media(max-width:1000px){.hero-guide-layout{grid-template-columns:190px minmax(0,1fr);gap:18px}.guide-illustration{height:290px}#hero-guide-roster span{font-size:13px}#hero-guide-roster img{width:26px;height:34px}#hero-guide-roster button{gap:5px;padding:6px}.guide-metrics{grid-template-columns:repeat(2,1fr)}#guide-skill-list{grid-template-columns:1fr}.hero-guide-footer{align-items:flex-start;flex-direction:column}.guide-identity>b{float:none;display:block;margin-top:8px}}
@media(max-width:700px){#hero-guide-modal .hero-guide-dialog{padding:16px}.hero-guide-head>span{display:none}#hero-guide-roster{grid-template-columns:repeat(4,1fr)}.hero-guide-layout{display:block}#hero-guide-portrait{display:flex;margin-bottom:18px}.guide-illustration{width:130px;flex-shrink:0;height:185px}.guide-illustration>strong{font-size:32px;bottom:6px;left:12px}.guide-illustration>span{display:none}.guide-identity{flex:1;border:1px solid #4f6663;border-left:0}.guide-identity>b{display:block;float:none;margin-top:10px}.guide-metrics{grid-template-columns:repeat(4,1fr)}.guide-metrics>div{padding:9px}.guide-metrics small{font-size:9px}.guide-metrics b{font-size:21px}.guide-partners>div{flex-wrap:wrap}.guide-partners button{min-width:125px}.hero-guide-footer button{font-size:11px;padding:8px}.guide-route-preview{gap:5px}.guide-route-preview b{font-size:10px}.guide-route-preview img{width:28px;height:28px}.guide-route-preview>span{grid-template-columns:28px 1fr;column-gap:4px}#hero-guide-tabs{gap:5px}#hero-guide-tabs button{font-size:12px;padding:8px}.guide-capacity>div{grid-template-columns:repeat(2,1fr)}}

/* Ember Lantern: original PixelLab Latin/runes + licensed Chinese companions.
   See dist/font-licenses for upstream attribution and modification details. */
@font-face{font-family:EmberLanternText;src:url('./assets/78348f30134cfa16a8fb5403.woff2') format('woff2');font-display:swap;font-weight:100 900}
@font-face{font-family:EmberLanternDisplay;src:url('./assets/bb38a8c48a8c2787683e3fca.woff2') format('woff2');font-display:swap;font-weight:100 900}
@font-face{font-family:EmberLanternRunes;src:url('./assets/daff9f68e28f6b47e82e97c8.woff2') format('woff2');font-display:swap;font-weight:100 900;unicode-range:U+0020-007E}
:root{--lantern-reading:EmberLanternText,EmberLanternRunes,'Microsoft YaHei',sans-serif;--lantern-art:EmberLanternDisplay,EmberLanternText,EmberLanternRunes,serif;--lantern-runes:EmberLanternRunes,EmberLanternText,sans-serif;--serif:var(--lantern-art)}
#game-root,#game-root :is(div,section,article,header,footer,nav,p,span,small,label,summary,li,button,input,select,option,textarea,b,strong,em,a){font-family:var(--lantern-reading)!important}
#game-root :is(h1,h2,h3,h4),#game-root :is(h1,h2,h3,h4)>span,#game-root #intro.title-screen :is(h1,h2,h3),#game-root .deck-caption,#game-root #gear-name h3{font-family:var(--lantern-art)!important;font-weight:400;letter-spacing:.06em}
#game-root :is(kbd,.item-quantity,.talent-point-badge),#game-root #bag-stats b,#game-root #hud-level,#game-root #hud-xp-text{font-family:var(--lantern-runes)!important;font-variant-numeric:tabular-nums}
#game-root #inventory-panel .bag-item b{font-size:12px;line-height:1.4}
#game-root #inventory-panel .bag-item small{font-size:11px;line-height:1.4}
#game-root #character-panel .gear-slot :is(b,small){font-size:11px;line-height:1.45}
#game-root :is(.gear-item-detail p,.gear-compare){font-size:13px!important}
#game-root #character-panel #bag-stats span{font-size:13px}
#game-root .deck-caption{font-size:13px}
@media(max-width:1100px){#game-root #inventory-panel .bag-item b{font-size:10px}#game-root #inventory-panel .bag-item small{font-size:9px}}
@media(max-width:700px){#game-root #character-panel #bag-stats span{font-size:11px}#game-root .deck-caption{font-size:10px}}

/* Shared visible edges for the four bottom panels, including pixel-frame outsets. */
.world-hud.hero-ui{--dock-edge:16px;--dock-gap:12px;--dock-height:180px;--dock-player:280px;--dock-items:132px;--dock-menu:292px}
.world-hud.hero-ui .arena-wrap>.player-card,
.world-hud.hero-ui .action-deck.loadout-deck,
.world-hud.hero-ui .item-deck,
.world-hud.hero-ui #world-shortcuts{box-sizing:border-box;top:auto;bottom:var(--dock-edge)!important;height:var(--dock-height);margin:0;transform:none;border-width:10px;border-image-outset:0;border-image-width:18px;max-width:none}
.world-hud.hero-ui .arena-wrap>.player-card{left:var(--dock-edge);width:var(--dock-player);padding:28px 15px 12px 83px;border:10px solid transparent;border-image:var(--identity-frame) 12 26 12 26 fill / 18px / 0 stretch;background:#14232c;background-clip:padding-box}
.world-hud.hero-ui .player-card .fighter-heading>.portrait{left:13px;top:30px;width:58px;height:73px}
.world-hud.hero-ui .fighter-heading #hero-state{top:auto;bottom:43px;left:14px;width:auto;right:14px;font-size:9px}
.world-hud.hero-ui .character-level-hud{position:absolute;left:13px;right:13px;bottom:14px;margin:0}
.world-hud.hero-ui .action-deck.loadout-deck{left:calc(var(--dock-edge) + var(--dock-player) + var(--dock-gap));right:calc(var(--dock-edge) + var(--dock-menu) + var(--dock-items) + var(--dock-gap)*2);width:auto;padding:7px 10px 5px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:13px minmax(0,1fr) 18px;gap:3px;--deck-inset:0px;--deck-trim:18px}
.world-hud.hero-ui .loadout-deck>.deck-caption{grid-column:1;grid-row:1;margin:0;line-height:13px}
.world-hud.hero-ui .book-hotbar{grid-column:1;grid-row:2;justify-self:center;width:min(100%,calc(var(--book-columns)*60px));height:100%;margin:0;gap:5px;align-items:center;justify-items:center}
.world-hud.hero-ui .book-slot{width:min(100%,54px);max-height:54px;padding:3px}
.world-hud.hero-ui .book-manage{grid-column:1;grid-row:3;margin:0;padding:0 8px;line-height:18px}
.world-hud.hero-ui .item-deck{left:auto!important;right:calc(var(--dock-edge) + var(--dock-menu) + var(--dock-gap));width:var(--dock-items);--slot:42px;padding:7px 4px;display:flex;flex-direction:column;justify-content:space-between;gap:4px}
.world-hud.hero-ui .item-deck .deck-caption{margin:0;line-height:13px;white-space:nowrap}
.world-hud.hero-ui .item-deck .bottle-counts{margin:0;display:block;font-size:8px;line-height:12px}
.world-hud.hero-ui .item-deck #potions{font-size:8px}
.world-hud.hero-ui #world-shortcuts{left:auto;right:var(--dock-edge);width:var(--dock-menu);padding:8px 7px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4px;align-items:center;justify-items:center}
.world-hud.hero-ui #world-shortcuts .world-shortcut{width:100%;height:60px;background-size:46px 46px;font-size:10px;line-height:13px}
.world-hud.hero-ui #world-shortcuts .navigation-art{width:44px;height:44px}
.world-hud.hero-ui #world-shortcuts button:hover,.world-hud.hero-ui #world-shortcuts button:focus-visible{background-size:46px 46px}
@media(min-width:760px) and (max-width:1100px){
 .world-hud.hero-ui{--dock-edge:10px;--dock-gap:8px;--dock-height:160px;--dock-player:220px;--dock-items:114px;--dock-menu:244px}
 .world-hud.hero-ui .arena-wrap>.player-card{padding:22px 8px 8px 65px}
 .world-hud.hero-ui .player-card .fighter-heading>.portrait{left:9px;top:25px;width:47px;height:64px}
 .world-hud.hero-ui .fighter-heading b{font-size:15px}
 .world-hud.hero-ui .fighter-heading #hero-state{bottom:37px;font-size:8px}
 .world-hud.hero-ui .character-level-hud{left:8px;right:8px;bottom:9px;padding:3px;gap:3px}
 .world-hud.hero-ui .item-deck{--slot:35px;padding:5px 2px}
 .world-hud.hero-ui #world-shortcuts{padding:4px}
 .world-hud.hero-ui #world-shortcuts .world-shortcut{height:53px;background-size:39px 39px;font-size:9px}
 .world-hud.hero-ui #world-shortcuts .navigation-art{width:38px;height:38px}
 .world-hud.hero-ui .action-deck.loadout-deck{padding:5px;gap:2px}
 .world-hud.hero-ui .book-slot{max-height:46px}
}
@media(max-width:759px){
 .world-hud.hero-ui{--dock-edge:8px;--dock-gap:8px;--dock-height:120px;--dock-player:calc(100% - 140px);--dock-items:116px}
 .world-hud.hero-ui .arena-wrap>.player-card,.world-hud.hero-ui .item-deck{bottom:80px!important}
 .world-hud.hero-ui .arena-wrap>.player-card{padding:7px 8px 4px 65px}
 .world-hud.hero-ui .player-card .fighter-heading>.portrait{left:8px;top:9px;width:46px;height:62px}
 .world-hud.hero-ui .fighter-heading b{font-size:15px;line-height:18px}
 .world-hud.hero-ui .fighter-heading #hero-state{display:none}
 .world-hud.hero-ui .character-level-hud{left:8px;right:8px;bottom:4px;padding:2px 3px;gap:3px;font-size:9px}
 .world-hud.hero-ui .character-level-hud small{font-size:8px}
 .world-hud.hero-ui .item-deck{right:var(--dock-edge);--slot:28px;padding:2px;gap:2px}
 .world-hud.hero-ui .item-deck .item-row{gap:3px}
 .world-hud.hero-ui .item-deck .skill-icon{width:28px;height:28px;padding:3px}
 .world-hud.hero-ui .item-deck .skill-icon img{width:22px;height:22px}
 .world-hud.hero-ui .item-deck .deck-caption{font-size:8px;letter-spacing:1px}
 .world-hud.hero-ui .item-deck .bottle-counts{line-height:10px}
 .world-hud.hero-ui .action-deck.loadout-deck{left:var(--dock-edge);right:var(--dock-edge);bottom:208px!important;width:auto;height:146px;padding:5px 8px;gap:2px}
 .world-hud.hero-ui .book-slot{max-height:40px}
 .world-hud.hero-ui #world-shortcuts{left:var(--dock-edge);right:var(--dock-edge);width:auto;height:64px;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:1fr;padding:0 3px;gap:1px}
 .world-hud.hero-ui #world-shortcuts .world-shortcut{height:42px;background-size:30px 30px;font-size:8px;line-height:10px;gap:0}
 .world-hud.hero-ui #world-shortcuts .navigation-art{width:min(30px,100%);height:30px}
}
.guild-dialog{width:min(720px,94vw);max-height:88dvh;overflow:auto;padding:26px;background:#142830;border:12px solid transparent;border-image:var(--skin-panel) 36 fill / 24px / 0 stretch;color:#deceb0}
.guild-dialog header{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #92795480;padding-bottom:16px}.guild-dialog header h2{font:28px/1.5 EmberLanternDisplay,serif;color:#f4d699}.guild-dialog header small,.guild-keeper small{color:#b8ab86;letter-spacing:2px}.guild-dialog header p{color:#9bb8b5;font-size:12px}.guild-dialog header button{width:34px;height:34px;flex:none}
.guild-keeper{display:flex;align-items:center;gap:20px;margin:20px 0;padding:16px;background:#0a1923a8;border:1px solid #68786a}.guild-keeper>img{width:62px;height:96px;object-fit:contain;image-rendering:pixelated}.guild-keeper h3{font:20px/1.8 EmberLanternDisplay,serif}.guild-keeper p{color:#a8c0bd;font-size:12px;line-height:1.8}
.guild-section-title{font:15px/1.6 EmberLanternDisplay,serif;margin:20px 0 10px;color:#e3c78d}#guild-records{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}#guild-records article{border:1px solid #647168;padding:12px;background:#1e3536;display:flex;flex-direction:column}#guild-records b{color:#f4d699;font-size:24px}#guild-records small{color:#9cb7ae;font-size:11px}
#guild-companions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#guild-companions>div{display:flex;align-items:center;gap:10px;background:#0c1e28;padding:8px}#guild-companions img{width:38px;height:46px;object-fit:cover;image-rendering:pixelated}#guild-companions small{display:block;color:#a4b5af;font-size:11px}.guild-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.guild-actions button{padding:8px 12px;border-color:#8b7953;color:#ecd09c}#guild-location-note{font-size:11px;color:#97aaa5;line-height:1.8;margin-top:12px}
@media(max-width:480px){.guild-dialog{padding:14px}.guild-keeper{gap:12px;padding:10px}.guild-keeper h3{font-size:17px}#guild-records{gap:6px}#guild-records article{padding:8px}#guild-companions{grid-template-columns:1fr}.guild-actions button{flex:1 1 auto}}

/* Regional rules remain folded during combat. */
.map-terrain-hint{margin:5px 0;border-left:2px solid var(--terrain-color,#c1d3d8);padding:3px 6px;background:#101e269c;font-size:10px;color:var(--terrain-color,#c1d3d8)}
.map-terrain-hint summary{cursor:pointer;font:inherit;letter-spacing:.04em}
.map-terrain-hint p{margin:6px 0 2px!important;color:#cfdbd9!important;font-size:10px!important;line-height:1.65!important}

#arena-wrap .mission-panel .map-terrain-hint[open]>p{display:block!important}

#codex-modal{z-index:135;padding:16px;background:#030d15d9;backdrop-filter:blur(7px)}
#game-root #codex-modal{color-scheme:light}
#game-root #codex-modal #codex-tabs button[aria-pressed=true],#game-root #codex-modal #collection-roster button[aria-pressed=true],#game-root #codex-modal #collection-new[aria-pressed=true]{background:#b5ceb4;color:#294f3c;border-color:#7d9b75;box-shadow:inset 0 -3px #7d9b75}
#game-root #codex-modal #collection-count{color:#526c55}
#codex-modal .quality-legend .quality-common{color:#657466}#codex-modal .quality-legend .quality-fine{color:#426a4d}#codex-modal .quality-legend .quality-rare{color:#3b6684}#codex-modal .quality-legend .quality-epic{color:#805598}#codex-modal .quality-legend .quality-legendary{color:#92652f}#codex-modal .quality-legend .limited{color:#9d5f44!important}
.codex-dialog{display:flex;flex-direction:column;width:min(1200px,96vw);height:min(900px,94dvh);padding:20px;background:linear-gradient(135deg,#20363b,#0c1c27 70%);border:1px solid #b29b6d;border-radius:9px;box-shadow:0 24px 90px #000b;color:#e5deca;overflow:hidden;font-family:EmberLanternText,"Microsoft YaHei",sans-serif}
.codex-header{display:flex;align-items:center;gap:16px;flex:none}.codex-header>img{image-rendering:pixelated;object-fit:contain}.codex-header>div{flex:1}.codex-header small{letter-spacing:2px;color:#acbcb4}.codex-header h2{font:32px EmberLanternDisplay,serif;color:#f1d99e;margin:4px 0}.codex-header button,.codex-tabs button,.collection-tools button,#collection-pages button{font:inherit;padding:8px 14px;color:#e4d5af;background:#203841;border:1px solid #66756b;border-radius:4px;cursor:pointer;min-height:40px}.codex-dialog button:focus-visible,.codex-dialog input:focus-visible,.codex-dialog select:focus-visible{outline:2px solid #e9c886;outline-offset:2px}
.codex-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0 12px;padding-bottom:12px;border-bottom:1px solid #58655b;flex:none}.codex-tabs button{display:flex;align-items:center;justify-content:center;gap:12px;font-size:17px}.codex-tabs small{font-size:11px;color:#a8beb9}.codex-tabs [aria-pressed=true]{background:#414b3d;border-color:#d5bc7f;color:#fff0c3;box-shadow:inset 0 -3px #d5bc7f}
#codex-pages{min-height:0;overflow:hidden;flex:1;position:relative}.codex-page{height:100%;min-height:0;overflow:auto;position:static!important;inset:auto!important;padding:0!important;background:none!important;backdrop-filter:none!important}.codex-page[hidden]{display:none!important}
#codex-modal .codex-page>section{width:100%!important;max-width:none!important;max-height:none!important;min-height:0;height:auto;border:0!important;border-image:none!important;box-shadow:none!important;border-radius:0;background:none!important;padding:12px 4px!important;margin:0;overflow:visible!important}
#codex-modal .collection-dialog{height:100%;display:flex;flex-direction:column}#codex-modal .collection-scroll{padding:8px 0;overflow:visible}#codex-modal .collection-dialog>header{background:none;border:0;padding:0 0 10px;display:flex;align-items:center;justify-content:space-between;color:#e3d5b8}#codex-modal .collection-dialog>header h2{font:26px EmberLanternDisplay,serif;margin:4px 0}#codex-modal .collection-dialog>header small{color:#a3bbb4}
.collection-tools{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:16px 0}.collection-tools label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#c5d1c4}.collection-tools label:first-child{flex:1;min-width:170px}.collection-tools input[type=search],.collection-tools select{font:inherit;min-height:40px;padding:9px;border:1px solid #60766c;border-radius:4px;background:#0e252f;color:#e9e6d3;width:100%}.collection-tools .collection-owned-filter{flex-direction:row;align-items:center;min-height:40px}.collection-tools input[type=checkbox]{accent-color:#d5b978}.collection-new-filter{display:flex;gap:14px;align-items:center;color:#c4c9b5}.collection-new-filter button,#collection-roster button{font:inherit;padding:7px 10px;border:1px solid #5b7167;background:#203841;color:#ddcfaa;border-radius:4px;cursor:pointer}.collection-new-filter [aria-pressed=true]{border-color:#dab873;background:#414b3d}.collection-explainer{line-height:1.8;color:#adc0ba}.collection-possession{margin-left:auto;white-space:nowrap;font-size:11px;padding:3px 6px;border:1px solid #52645d;color:#8a9c98}.collection-possession.owned{border-color:#8fba87;color:#c3dfae}.collection-base{padding:9px 12px;background:#091a2355}.collection-base small{display:block;margin-bottom:5px}.collection-set{border:1px solid #66684f;padding:10px;color:#d3c196}.collection-set summary{cursor:pointer}.collection-empty{grid-column:1/-1;text-align:center;padding:40px}.collection-empty p{color:#acc0b8}#collection-pages{display:flex;justify-content:center;align-items:center;gap:20px;margin:22px 0}#collection-pages button:disabled{opacity:.35;cursor:default}#menu-codex img{width:28px;height:28px;vertical-align:middle;margin-right:8px;image-rendering:pixelated}
.world-hud.hero-ui #world-shortcuts{grid-template-columns:repeat(6,minmax(0,1fr))}.world-hud.hero-ui #world-shortcuts .navigation-art{width:min(38px,100%);object-fit:contain}
#codex-modal .codex-dialog{background:linear-gradient(135deg,#f7f0dd,#e8e6ce);color:#426252;border-color:#9eac84;box-shadow:0 24px 90px #102f384f}
#codex-modal .codex-header h2{color:#385c47}#codex-modal .codex-header small,#codex-modal .codex-tabs small{color:#6b7d60}
#codex-modal .codex-header button,#codex-modal .codex-tabs button{background:#e0e8cf;color:#49664f;border-color:#a9b795}#codex-modal .codex-tabs{border-color:#aeb99b}#codex-modal .codex-tabs [aria-pressed=true]{background:#b5ceb4;color:#294f3c;border-color:#7d9b75;box-shadow:inset 0 -3px #7d9b75}
#codex-modal .collection-dialog>header{color:#426252}#codex-modal .collection-dialog>header h2{color:#426252}#codex-modal .collection-dialog>header small,.collection-tools label,.collection-new-filter{color:#63795d}.collection-base{background:#f6f0dc}.collection-possession{color:#6c7e63;border-color:#aeb99c}.collection-possession.owned{color:#3f7148;border-color:#88a478}.collection-set{background:#f3e9ce;color:#7b6845;border-color:#b5b395}
@media(max-width:759px){#codex-modal{padding:5px}.codex-dialog{width:100%;height:96dvh;padding:12px}.codex-header{gap:8px}.codex-header>img{width:40px;height:40px}.codex-header h2{font-size:25px}.codex-header small{font-size:10px;letter-spacing:1px}.codex-header button{padding:6px 10px}.codex-tabs{gap:5px;margin:12px 0 6px}.codex-tabs button{font-size:13px;flex-direction:column;gap:5px;padding:8px 3px}.codex-tabs small{font-size:10px}#codex-modal .hero-guide-head>span{display:none}.collection-tools{gap:8px}.collection-new-filter{flex-wrap:wrap;font-size:12px}.collection-card .item-heading{gap:8px}.collection-card h3{font-size:17px}.collection-possession{padding:2px 4px;font-size:10px}.world-hud.hero-ui #world-shortcuts{height:106px;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.world-hud.hero-ui .arena-wrap>.player-card,.world-hud.hero-ui .item-deck{bottom:122px!important}.world-hud.hero-ui .action-deck.loadout-deck{bottom:250px!important}.world-hud.hero-ui #world-shortcuts .navigation-art{width:min(30px,100%)}}

/* Inn daylight: linen, celadon and rubbed copper. Keep the world visible. */
#game-root #equipment-modal{background:#203a413b;backdrop-filter:blur(1px);color:#394c49;color-scheme:light}
#game-root #equipment-modal .gear-workspace-tools{background:#e9e0cceF;border:0;border-bottom:1px solid #b8b49a;justify-content:flex-start;padding-left:4vw;gap:14px}
#game-root #equipment-modal .gear-workspace-tools button{background:transparent;color:#46625c;border:0;border-bottom:1px solid #a29c80;padding:6px 2px}
#game-root #equipment-modal .gear-panel{border:0;border-image:none;box-shadow:0 12px 40px #18363738;background:#f3ecd9;border-radius:3px 16px 4px 4px;padding:0;color:#354c49}
#game-root #equipment-modal .gear-panel>header{background:linear-gradient(110deg,#d6e4d7 0%,#e8e7cd 72%,#e6c99e);border:0;border-bottom:1px solid #9eaa90;padding:18px 25px;min-height:90px;margin:0;position:relative}
#game-root #equipment-modal .gear-panel>header::after{content:'';position:absolute;left:24px;bottom:-3px;width:76px;height:5px;background:#aa654b;clip-path:polygon(0 0,100% 20%,94% 100%,3% 75%)}
#game-root #equipment-modal .gear-panel h2{color:#345951;text-shadow:none;font-size:29px;letter-spacing:4px}
#game-root #equipment-modal .gear-panel header small{color:#6b7966;letter-spacing:2px}
#game-root #equipment-modal .gear-panel header button{background:transparent;color:#53695c;border:0;box-shadow:none}
#game-root #equipment-modal .gear-panel-scroll{background:repeating-linear-gradient(0deg,transparent 0 31px,#a39a7510 31px 32px),#f3ecd9;padding:18px 20px;scrollbar-color:#91a893 #e9e2cb}
#game-root #equipment-modal .gear-panel footer{background:#e2e0c8;color:#657367;border:0;padding:9px 24px}
#game-root #character-panel #bag-roster{background:transparent;border:0;padding:0 0 10px;gap:5px;border-bottom:1px solid #b7bda3}
#game-root #character-panel #bag-roster button{background:transparent;border:0;color:#5a6b60;box-shadow:none;padding:3px 0;border-radius:0 0 7px 0}
#game-root #character-panel #bag-roster button[aria-pressed=true]{background:#b8cfbd;color:#284e47;border:0;box-shadow:0 3px #8b9f80}
#game-root #character-panel #bag-roster img{width:34px;height:37px}
#game-root #character-panel #gear-name{margin:18px 0 10px;padding:0 8px}
#game-root #character-panel #gear-name h3{color:#9d5942;font-size:32px}
#game-root #character-panel #gear-name :is(span,small){color:#6a7667}
#game-root #character-panel #gear-progression{background:none;border:0;padding:0 8px 12px;margin-bottom:10px;font-size:11px}
#game-root #character-panel #gear-progression>button{float:right;background:#dde6cf;color:#456658;border:0;border-bottom:2px solid #a3b49a;font-size:10px;margin-left:8px}
#game-root #character-panel #gear-progression>div{display:block;color:#68735d;line-height:1.9}
#game-root #character-panel #gear-progression>div span{display:block;font-size:10px}
#game-root #character-panel #gear-progression small{color:#7c7c66}
#game-root #character-panel #gear-progression progress{height:4px;accent-color:#829f83;margin:7px 0}
#game-root #character-panel .gear-paperdoll{background:none;border:0;padding:0;grid-template-columns:92px minmax(95px,1fr) 106px;gap:9px;align-items:center}
#game-root #character-panel .gear-model-wrap{isolation:isolate;border:0;border-radius:46% 46% 2px 2px;min-height:330px;background:#c6d8cb;box-shadow:0 5px 0 #ccd0b5}
#game-root #character-panel .gear-model-wrap::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#d3e2d044,#efd7a038),var(--kit-alcove) center/cover;filter:brightness(1.65) saturate(.7)}
#game-root #character-panel .gear-model-wrap>span{color:#fff2cb;text-shadow:0 1px 3px #163b3a;z-index:2;bottom:9px}
#game-root #character-panel .gear-slots{gap:12px;align-content:center}
#game-root #character-panel #gear-left{padding-top:0;padding-bottom:22px}
#game-root #character-panel #gear-right{padding-top:28px}
#game-root #character-panel .gear-slot>button:first-child{background:linear-gradient(100deg,#dce4cd99,#f8f0db);border:0!important;border-image:none;box-shadow:0 1px 0 #b6bfa4;min-height:52px;height:auto;padding:7px 3px;color:#425e54;border-radius:1px 8px 1px 1px;gap:3px}
#game-root #character-panel .gear-slot>button.empty{background:transparent;box-shadow:none;border-bottom:1px dashed #aab69b!important}
#game-root #character-panel .gear-slot>button:first-child:hover{background:#d7e4cc;box-shadow:0 2px #94ab8b}
#game-root #character-panel .gear-slot small{color:#79846c;font-size:10px}
#game-root #character-panel .gear-slot b{color:#36584e;font-size:10px;overflow-wrap:anywhere;line-height:1.5}
#game-root #character-panel .gear-slot .gear-pixel-icon{width:29px;height:32px;object-fit:contain}
#game-root #character-panel .slot-ghost{width:25px;opacity:.5;filter:grayscale(1) sepia(.5)}
#game-root #character-panel .slot-ghost .gear-pixel-icon{width:23px;height:28px}
#game-root #character-panel .gear-slot .gear-unequip{background:#e8dcc0;border:0;color:#926048;font-size:8px;bottom:-8px}
#game-root #character-panel #bag-stats{display:block;background:none;border:0;border-top:2px solid #b4bca0;padding:18px 4px 0;margin-top:26px}
#game-root #character-panel #bag-stats h4{color:#496456;font-size:18px;letter-spacing:3px;margin:0 0 16px}
#game-root #character-panel #bag-stats .stat-group{margin:0 0 17px;padding:0 0 8px;display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
#game-root #character-panel #bag-stats .stat-group h5{grid-column:1/-1;color:#9d654c;font-size:11px;font-weight:normal;margin:0 0 7px;letter-spacing:2px}
#game-root #character-panel #bag-stats .stat-group>div{display:flex;justify-content:space-between;gap:8px;align-items:center;border-bottom:1px dotted #bec2aa;padding:7px 0}
#game-root #character-panel #bag-stats :is(span,small){color:#67796a;font-size:11px}
#game-root #character-panel #bag-stats b{color:#345b51;font-size:16px;font-family:var(--serif);margin:0}
#game-root #character-panel #bag-stats .stat-group:first-of-type{background:#dce6ce85;padding:13px 12px;border-radius:0 14px 0 0}
#game-root #character-panel #gear-rule{color:#75806b;text-align:right}
#game-root #equipment-modal .help-link{background:none;border:1px solid #a7b496;color:#536d5c}
/* The bag reads as a collector's tray, with an open space for the selected item. */
#game-root #equipment-modal #inventory-panel{margin-top:23px;border-radius:14px 3px 3px 3px;background:#e8e1ca;max-width:590px}
#game-root #inventory-panel .gear-panel-scroll{display:flex;padding:14px 20px;background:#ede6d2}
#game-root #inventory-panel .bag-wallet{background:transparent;border:0;padding:5px 0 10px;color:#586d5e}
#game-root #inventory-panel .bag-wallet :is(b,span){color:#765e3f}
#game-root #inventory-panel #bag-filters{display:flex;gap:12px;flex-wrap:wrap;background:none;border-bottom:1px solid #b4b69c;padding:0 0 5px;margin-top:8px}
#game-root #inventory-panel #bag-filters button{background:none;color:#75816e;border:0;padding:4px 0}
#game-root #inventory-panel #bag-filters button[aria-pressed=true]{background:none;color:#955b42;border-bottom:2px solid #a06b4d;box-shadow:none}
#game-root #inventory-panel .bag-storage{background:transparent;border:0;padding:12px 0;scrollbar-color:#a2b49b #e6dfc8}
#game-root #inventory-panel .bag-storage-label{color:#78866f;letter-spacing:1px}
#game-root #inventory-panel .bag-storage-label small{color:#78866f}
#game-root #inventory-panel #bag-items{gap:8px;grid-template-columns:repeat(4,minmax(0,1fr))}
#game-root #inventory-panel .bag-empty-pocket{display:none}
#game-root #inventory-panel .bag-item{background:#e0e4cf;border:0!important;border-radius:3px 8px 2px 2px;box-shadow:0 2px #c4c9af;aspect-ratio:auto;min-height:91px;padding:7px!important}
#game-root #inventory-panel .bag-item:nth-child(3n+2){background:#e8dfc4}
#game-root #inventory-panel .bag-item[aria-pressed=true]{outline:2px solid #769980;outline-offset:0;background:#cbdcc6;filter:none}
#game-root #inventory-panel .bag-item b{color:#405d52;text-shadow:none;font-size:10px}
#game-root #inventory-panel .bag-item small{color:#687965;font-size:9px}
#game-root #inventory-panel .bag-item :is(.gear-pixel-icon,.resource-icon){filter:drop-shadow(0 2px 1px #5c6e4a38)}
#game-root #inventory-panel #bag-detail{background:#faf4e1;border:0;border-top:2px solid #bbb593;border-radius:0 12px 0 0;box-shadow:none;color:#516c5f;padding:14px;scrollbar-color:#a4b69a #f0e7ce}
#game-root #inventory-panel #bag-detail :is(p,small,li){color:#687760}
#game-root #inventory-panel #bag-detail :is(h3,b){color:#3b6155;text-shadow:none}
#game-root #inventory-panel #bag-detail :is(.item-stat-block,.gear-compare){background:#e5ebd4;border:0;border-left:2px solid #acbb96;color:#526d58}
#game-root #inventory-panel #bag-detail .gain{color:#37754c}#game-root #inventory-panel #bag-detail .loss{color:#a65040}
#game-root #inventory-panel :is(#bag-equip,#bag-use){background:#6e947d;border:0;color:#fff8df}
#game-root #equipment-modal :is(.bag-secondary-filters,.bag-secondary-filters select){color:#63735d;background:transparent}
#game-root #equipment-modal .gear-access-dock{background:#e7e3cced;border:0;box-shadow:0 4px 15px #324c402c;border-radius:10px 2px 2px 2px}
#game-root #equipment-modal .gear-access-dock button{background:transparent;color:#516b5c;border:0}
#game-root #equipment-modal .gear-access-dock button[aria-pressed=true]{background:#c5d7bd;color:#355b4e}
/* Shared reading pages: pale paper with open rows instead of nested dark boxes. */
#game-root :is(#help-modal,#collection-modal,#hero-guide-modal,#bestiary-modal) :is(.modal,.collection-dialog,.hero-guide-dialog,.bestiary-dialog){background:#f2ecd9;color:#486458;border:0;border-image:none;box-shadow:0 15px 55px #173b3844;border-radius:3px 18px 3px 3px}
#game-root :is(#help-modal,#collection-modal,#hero-guide-modal,#bestiary-modal) :is(header,.modal-head){background:#d9e3ce;border:0;color:#496554}
#game-root :is(#help-modal,#collection-modal,#hero-guide-modal,#bestiary-modal) :is(h2,h3,h4){color:#426252;text-shadow:none}
#game-root :is(#help-modal,#collection-modal) :is(p,small,dd,li){color:#63745d}
#game-root :is(#help-modal,#collection-modal) button{background:#e0e8cf;color:#536b58;border:1px solid #b8c4a6;box-shadow:none}
#game-root :is(#help-modal,#collection-modal) button[aria-pressed=true]{background:#a9c4ac;color:#294f42}
#game-root :is(#help-modal,#collection-modal) :is(select,input){color:#42614f;background:#fbf6e7;border:1px solid #b4bda2}
#game-root #collection-modal .collection-scroll{background:#f3edda;color:#566b59}
#game-root #collection-modal .collection-card{background:#e7e9d4;border:0;border-bottom:1px solid #b6c1a0;box-shadow:none;padding:18px;border-radius:2px 12px 2px 2px}
#game-root #collection-modal .collection-card:nth-child(3n+2){background:#eee3c8}
#game-root #collection-modal .collection-card b{color:#916b42}
#game-root #collection-modal .collection-source{border-color:#b5b99c;color:#6c7b60}
#game-root #help-modal :is(.help-definitions,.help-affixes>div,details){background:#e8ecd8;border-color:#b9c2a2;box-shadow:none;color:#50684f}
#game-root #help-modal :is(dt,summary,.help-affixes b){color:#4c755c}
#game-root #help-modal .help-affixes span{color:#6a7d63}
#game-root #hero-guide-modal :is(p,small,em,label,.hero-guide-footer>span,.hero-guide-head>span){color:#64785f}
#game-root #hero-guide-modal :is(button,input){background:#e2e8d0;border:1px solid #b3c0a0;color:#44644f;box-shadow:none}
#game-root #hero-guide-modal button[aria-pressed=true]{background:#b5ceb4;color:#315741;border-color:#829e79}
#game-root #hero-guide-modal :is(.guide-identity,.guide-metrics>div,.guide-note,.guide-careers article,.guide-skill,.guide-growth-current,.guide-capacity span){background:#e1e8cf;border:0;border-bottom:1px solid #b8c4a2;box-shadow:none;color:#45654e}
#game-root #hero-guide-modal .guide-note.caution{background:#ecdfc1;border-left:3px solid #bd9970}
#game-root #hero-guide-modal :is(.guide-metrics b,.guide-growth-current>b,.guide-capacity b,.guide-identity>b){color:#735d3d}
#game-root #hero-guide-modal .guide-identity small{color:#617552;border-color:#abbc97}
#game-root #hero-guide-modal :is(.guide-intro h3 span,.guide-skill>div>span,.guide-identity>span,.guide-milestones li>b){color:#8d6447}
body #bestiary-modal{background:#203a4166;backdrop-filter:blur(2px)}
body #bestiary-modal .bestiary{background:#f0e9d5;border:0;border-image:none;color:#48644f;box-shadow:0 15px 55px #173b3844;border-radius:3px 18px 3px 3px}
body #bestiary-modal :is(p,small,dt,label,li,#bestiary-count,.bestiary-card-type){color:#62795e}
body #bestiary-modal :is(h2,h3,h4,strong,dd){color:#3d654e}
body #bestiary-modal :is(button,input,select){background:#e4ead4;border:1px solid #b4c3a0;color:#4e6b52;box-shadow:none}
body #bestiary-modal .bestiary-card{background:#e0e7ce;border:0;border-bottom:2px solid #b2c09e;border-radius:3px 10px 3px 3px}
body #bestiary-modal button[aria-pressed=true]{background:#bdd2b7;border-color:#749a78;color:#355c42}
body #bestiary-modal .bestiary-detail{background:#faf3de;border:0;border-left:2px solid #b5c09b;border-radius:0 16px 0 0}
body #bestiary-modal .bestiary-guard{background:#dce8d0;border-color:#92b193;color:#4e7258}
body #bestiary-modal .bestiary-foot{color:#728368!important}
#game-root #codex-modal{background:#203a4166;backdrop-filter:blur(2px)}
#game-root #codex-modal .codex-dialog{background:#f2ecd9;border:0;border-radius:3px 18px 3px 3px;color:#48654f;box-shadow:0 15px 55px #173b3844}
#game-root #codex-modal .codex-header{padding:4px 8px 13px;border-bottom:1px solid #b0bda0}
#game-root #codex-modal .codex-header h2{color:#3e6251}
#game-root #codex-modal :is(.codex-header small,.codex-tabs small,.collection-tools label,.collection-new-filter,.collection-possession){color:#6b7d62}
#game-root #codex-modal :is(.codex-header button,.codex-tabs button,.collection-new-filter button,#collection-roster button,#collection-pages button){background:#e0e8cf;border:1px solid #b2c0a0;color:#526d56;box-shadow:none}
#game-root #codex-modal .codex-tabs [aria-pressed=true]{background:#b5cdb3;color:#365a43;border-color:#8aa982;box-shadow:inset 0 -2px #7d9c73}
#game-root #codex-modal .collection-dialog>header :is(h2,small){color:#5c765c}
#game-root #codex-modal :is(.collection-base,.collection-set){background:#e4e9d2;border-color:#b4c1a0;color:#5e7357}
#game-root #codex-modal .collection-possession.owned{color:#3b7647;border-color:#8cb084}
#game-root #codex-modal :is(.collection-tools input,.collection-tools select){background:#faf5e2;color:#486850;border-color:#afbd9d}
#game-root :is(.quality-legend,.help-quality) .quality-common{color:#667061}
#game-root :is(.quality-legend,.help-quality) .quality-fine{color:#39714e}
#game-root :is(.quality-legend,.help-quality) .quality-rare{color:#356b91}
#game-root :is(.quality-legend,.help-quality) .quality-epic{color:#84549e}
#game-root :is(.quality-legend,.help-quality) .quality-legendary{color:#956621}
#game-root :is(.quality-legend,.help-quality) .quality-limited{color:#ab5a43}
#game-root #codex-modal #collection-count{color:#5a7256}
@media(max-width:1050px){#game-root #equipment-modal .gear-desktop{gap:12px}#game-root #equipment-modal .gear-panel-scroll{padding:12px}#game-root #character-panel .gear-paperdoll{grid-template-columns:70px minmax(75px,1fr) 78px;gap:5px}#game-root #character-panel .gear-slot>button:first-child{display:block;text-align:center;padding:4px 2px}#game-root #character-panel .slot-ghost{display:block;margin:auto}#game-root #character-panel .gear-model-wrap{min-height:300px}#game-root #inventory-panel #bag-items{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){#game-root #equipment-modal .gear-desktop{display:flex;flex-direction:column;padding:10px 8px 90px}#game-root #equipment-modal .gear-panel{width:100%;max-width:none;height:calc(100dvh - 150px);margin:0}#game-root #equipment-modal .gear-workspace-tools{height:auto;min-height:44px;gap:10px;padding:5px 12px;flex-wrap:wrap}#game-root #character-panel .gear-paperdoll{grid-template-columns:72px minmax(95px,1fr) 80px}#game-root #character-panel .gear-model-wrap{min-height:310px}#game-root #character-panel .gear-slot>button:first-child{min-height:55px}#game-root #character-panel .gear-slot b{display:block;font-size:9px}#game-root #character-panel #bag-stats .stat-group{gap:0 12px}#game-root #equipment-modal .gear-panel>header{padding:12px 20px;min-height:70px}}

/* Ink blue equipment desk, warm grey details, copper highlights. */
/* Grip state remains visible even on the compact equipment desk. */
#game-root .weapon-grip{border-left:2px solid #bfa578;background:#182831;padding:9px 12px;margin:12px 0;color:#dbc69d;font-size:12px}
#game-root .weapon-grip p{margin:5px 0 0;color:#adbec8;font-size:11px;line-height:1.65}
#game-root #inventory-panel #bag-detail .weapon-grip{background:#d5d9d0;border-left-color:#8f7953;color:#28444b}
#game-root #inventory-panel #bag-detail .weapon-grip b{color:#28444b}
#game-root #inventory-panel #bag-detail .weapon-grip p{color:#3d555d}
#game-root .weapon-target-label{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#b8cbd4;font-size:12px;padding:5px 0}
#game-root .weapon-target-label select{max-width:70%;padding:6px;background:#172934;color:#e6d3af;border:1px solid #6b7e84}
#game-root #character-panel .hand-slot-tag{display:block;font-style:normal;font-size:9px;color:#d8bc83;margin-top:3px}
#game-root #character-panel .hand-occupied>button:first-child{border-style:dashed;background:#16252e;color:#b3a68d}
#game-root #character-panel .hand-occupied b{display:block;color:#b3a68d;font-size:10px}
#game-root #character-panel .hand-link{display:inline-block;color:#bda77e;font:28px Georgia;min-width:24px}
#game-root #equipment-modal{background:#09131b80;color:#e4e8e8;color-scheme:dark;backdrop-filter:blur(2px)}
#game-root #equipment-modal .gear-workspace-tools{background:#182732ee;border-color:#46545c}
#game-root #equipment-modal .gear-workspace-tools button{color:#c8d3d8;border-color:#66747b}
#game-root #equipment-modal .gear-panel{background:#1c2b35;border:1px solid #56616a;border-radius:8px;box-shadow:0 20px 65px #0007;color:#dce4e7}
#game-root #equipment-modal #inventory-panel{background:#1c2b35;border-radius:8px;margin-top:0}
#game-root #equipment-modal .gear-panel>header{background:linear-gradient(115deg,#2c404c,#1d2c37);border-bottom:1px solid #657076;min-height:78px;padding:16px 22px}
#game-root #equipment-modal .gear-panel>header::after{height:2px;background:#c0a078;bottom:0}
#game-root #equipment-modal .gear-panel h2{color:#f1e5d0;font-size:27px;letter-spacing:3px}
#game-root #equipment-modal .gear-panel>header h2{margin:5px 0 0}
#game-root #equipment-modal .gear-panel header small{color:#a5b7c1}
#game-root #equipment-modal .gear-panel header button{color:#d1dce2}
#game-root #equipment-modal .gear-panel-scroll{background:#21313c;padding:16px 20px;scrollbar-color:#647b87 #1b2933}
#game-root #equipment-modal .gear-panel footer{background:#192933;color:#9faeb7;border-top:1px solid #41515c}
#game-root #inventory-panel .bag-wallet{border:0;color:#b9c8d0;padding:0 0 10px}
#game-root #inventory-panel .bag-wallet :is(b,span){color:#dfc39b}
#game-root #inventory-panel .bag-wallet #bag-count{color:#a8bac5}
#game-root #inventory-panel .bag-search{display:flex;align-items:center;gap:8px;flex-shrink:0}
#game-root #inventory-panel .bag-search label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#game-root #inventory-panel .bag-search input{flex:1;min-width:0;width:100%;font:inherit;font-size:12px;padding:10px 12px;background:#14242e;border:1px solid #5e7481;border-radius:4px;color:#edf0ed}
#game-root #inventory-panel .bag-search input::placeholder{color:#9fb0ba}
#game-root #inventory-panel .bag-search button,#game-root #inventory-panel #bag-mode{background:#2b404c;border:1px solid #647580;color:#e0d2b8;border-radius:4px;padding:7px 10px;font-size:11px;white-space:nowrap}
#game-root #inventory-panel .bag-mode-bar{display:flex;align-items:center;gap:10px;justify-content:space-between;margin:9px 0 0;flex-shrink:0}
#game-root #inventory-panel #bag-mode-note{font-size:10px;line-height:1.5;color:#a9bbc4}
#game-root #inventory-panel #bag-filters{border-color:#4d616b;gap:16px;margin-top:10px}
#game-root #inventory-panel #bag-filters button{color:#aebfc9;font-size:12px;padding:5px 0}
#game-root #inventory-panel #bag-filters button[aria-pressed=true]{color:#f0d5a8;border-color:#d6b079;background:none}
#game-root #equipment-modal .bag-secondary-filters{color:#b4c2c9;font-size:11px;margin:8px 0}
#game-root #equipment-modal .bag-secondary-filters label{color:#b4c2c9}
#game-root #equipment-modal .bag-secondary-filters select{color:#e1e7e7;background:#1b2b36;border-color:#526976;border-radius:3px}
#game-root #equipment-modal #inventory-panel .bag-storage{background:none;border:0;padding:7px 0;flex:1.4 1 230px;min-height:100px;scrollbar-color:#627d89 #192a35}
#game-root #inventory-panel .bag-storage-label,#game-root #inventory-panel .bag-storage-label small{color:#a5b9c4}
#game-root #inventory-panel #bag-items{display:flex;flex-direction:column;gap:5px}
#game-root #equipment-modal #inventory-panel .bag-item{--item-tone:#aab8c3;display:grid;grid-template-columns:46px minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;justify-content:initial;column-gap:12px;row-gap:2px;width:100%;min-height:66px;aspect-ratio:auto;padding:9px 12px!important;text-align:left;background:#283c49;border:1px solid #3b515e!important;border-left:3px solid var(--item-tone)!important;border-radius:4px;box-shadow:none!important;filter:none;position:relative}
#game-root #equipment-modal #inventory-panel .bag-item.fine{--item-tone:#86c6a2}
#game-root #equipment-modal #inventory-panel .bag-item.rare{--item-tone:#83bee9}
#game-root #equipment-modal #inventory-panel .bag-item.epic{--item-tone:#c3a1e9}
#game-root #equipment-modal #inventory-panel .bag-item.legendary{--item-tone:#edc37c}
#game-root #equipment-modal #inventory-panel .bag-item.limited{--item-tone:#f1aa9d}
#game-root #equipment-modal #inventory-panel .bag-item::after{display:none}
#game-root #equipment-modal #inventory-panel .bag-item:hover{background:#324b59}
#game-root #equipment-modal #inventory-panel .bag-item[aria-pressed=true]{background:#3c535f;border-color:#c6ac7f!important;outline:0;box-shadow:inset 0 0 0 1px #c6ac7f55!important}
#game-root #equipment-modal #inventory-panel .bag-item :is(.gear-pixel-icon,.resource-icon,.gear-empty-icon){grid-column:1;grid-row:1/3;width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 2px 2px #08151b88);margin:0}
#game-root #equipment-modal #inventory-panel .bag-item b{grid-column:2;grid-row:1;color:#e9ece8;font-size:13px;font-weight:normal;text-shadow:none;line-height:1.45;white-space:normal}
#game-root #equipment-modal #inventory-panel .bag-item small{grid-column:2;grid-row:2;color:#aebfc9;font-size:10px;white-space:normal;line-height:1.5}
#game-root #equipment-modal #inventory-panel .bag-item small:last-child:not(:first-of-type){grid-column:3;grid-row:1/3;max-width:110px;text-align:right;color:var(--item-tone)}
#game-root #inventory-panel .bag-empty-result{text-align:center;padding:22px 12px;color:#d5dedd;line-height:1.8;font-size:13px}
#game-root #inventory-panel .bag-empty-result small{color:#adbec6;font-size:11px}
#game-root #equipment-modal #inventory-panel #bag-detail{background:#e8e4d9;color:#344650;border:0;border-top:2px solid #b89a72;border-radius:4px;flex:1 1 155px;max-height:39%;padding:14px;scrollbar-color:#8d9c9f #d8d6cc}
#game-root #equipment-modal #inventory-panel #bag-detail :is(p,small,li){color:#50606a}
#game-root #equipment-modal #inventory-panel #bag-detail :is(h3,b){color:#273f4b}
#game-root #equipment-modal #inventory-panel #bag-detail h3{font-size:21px}
#game-root #equipment-modal #inventory-panel #bag-detail :is(.item-stat-block,.gear-compare,.gear-set){background:#d9dfdc;border:0;border-left:2px solid #91a7ab;color:#354d53}
#game-root #equipment-modal #inventory-panel #bag-detail .gear-affinity{color:#7d5a30!important}
#game-root #equipment-modal #inventory-panel #bag-detail .requirement-locked,#game-root #equipment-modal #inventory-panel #bag-detail .loss{color:#9c4037}
#game-root #equipment-modal #inventory-panel #bag-detail .gain{color:#326747}
#game-root #equipment-modal #inventory-panel #bag-action button{background:#b89c70;color:#172a34;border:1px solid #d1b789;min-height:37px;border-radius:4px;font-weight:bold;font-size:12px}
#game-root #equipment-modal button:disabled{opacity:.45;cursor:not-allowed}
#game-root #equipment-modal :is(button,input,select):focus-visible{outline:2px solid #e1bf82;outline-offset:2px}
#game-root #equipment-modal .gear-access-dock{background:#21343eee;border:1px solid #58717b;border-radius:5px}
#game-root #equipment-modal .gear-access-dock button{color:#d6e0e2}
#game-root #equipment-modal .gear-access-dock button[aria-pressed=true]{background:#3d5560;color:#f1dab4;border-color:#bfa275}
#game-root #equipment-modal #bag-status{background:#172c37;color:#efdab2;border-color:#a48d67}
#game-root #character-panel #bag-roster{border-color:#4b606b}
#game-root #character-panel #bag-roster button{color:#afc2cc}
#game-root #character-panel #bag-roster button[aria-pressed=true]{background:#3b535f;color:#f1d7a8;box-shadow:0 2px #c2a373;border-radius:4px}
#game-root #character-panel #gear-name h3{color:#e3c596}
#game-root #character-panel #gear-name :is(span,small){color:#b2c1c8}
#game-root #character-panel #gear-progression>button{background:#354d59;color:#e3d3b5;border-color:#84968d}
#game-root #character-panel #gear-progression>div{color:#cedade}
#game-root #character-panel #gear-progression small{color:#9eafb9}
#game-root #character-panel #gear-progression progress{accent-color:#bd9e6a}
#game-root #character-panel .gear-model-wrap{border-radius:5px;min-height:330px;background:#1b303b;box-shadow:inset 0 0 0 1px #607681,0 3px #152530}
#game-root #character-panel .gear-model-wrap::before{background:linear-gradient(#132b3c22,#182a3488),var(--kit-alcove) center/cover;filter:brightness(.9) saturate(.75)}
#game-root #character-panel .gear-slot>button:first-child{background:#2d414d;box-shadow:none;border:1px solid #4b6471!important;border-radius:4px;color:#d6e1e5}
#game-root #character-panel .gear-slot>button.empty{background:#1c2e39;border:1px dashed #536c78!important}
#game-root #character-panel .gear-slot>button:first-child:hover{background:#3a5360;box-shadow:none}
#game-root #character-panel .gear-slot small{color:#aabcc6}
#game-root #character-panel .gear-slot b{color:#dbe4e6}
#game-root #character-panel .gear-slot .gear-unequip{background:#455b66;color:#e7dbc3}
#game-root #character-panel .slot-ghost{filter:grayscale(.6);opacity:.7}
#game-root #character-panel #bag-stats{border-color:#506671}
#game-root #character-panel #bag-stats h4{color:#e3d1b1}
#game-root #character-panel #bag-stats .stat-group{gap:0 20px}
#game-root #character-panel #bag-stats .stat-group h5{color:#c6ac85}
#game-root #character-panel #bag-stats .stat-group>div{border-color:#465d68}
#game-root #character-panel #bag-stats :is(span,small){color:#aebfc8}
#game-root #character-panel #bag-stats b{color:#e0e9e8}
#game-root #character-panel #bag-stats .stat-group:first-of-type{background:#2a404c;border-radius:5px}
#game-root #character-panel #gear-rule{color:#adbec7}
#game-root #equipment-modal .help-link{color:#d1c4a7;border-color:#70828a}
/* Each sheet is four 443.5 × 887 cards; the standalone card is 887 × 1774. */
#game-root #hero-guide-portrait .guide-illustration{height:auto;aspect-ratio:1/2;align-self:flex-start;box-sizing:content-box;background-repeat:no-repeat;image-rendering:auto;box-shadow:none}
#game-root #hero-guide-portrait .guide-illustration>span,#game-root #hero-guide-portrait .guide-illustration>strong{display:none}
@media(max-width:700px){#game-root #hero-guide-portrait .guide-illustration{width:130px;height:260px;flex:0 0 130px}}
@media(max-width:650px){#game-root #equipment-modal .gear-panel-scroll{padding:12px}#game-root #equipment-modal .gear-panel>header{min-height:64px;padding:12px 16px}#game-root #equipment-modal #inventory-panel .bag-item{grid-template-columns:38px minmax(0,1fr) 75px;column-gap:8px;min-height:64px;padding:8px!important}#game-root #equipment-modal #inventory-panel .bag-item :is(.gear-pixel-icon,.resource-icon){width:34px;height:38px}#game-root #equipment-modal #inventory-panel .bag-item b{font-size:12px}#game-root #inventory-panel #bag-filters{gap:13px}#game-root #equipment-modal #inventory-panel .bag-storage{flex-basis:170px}#game-root #equipment-modal #inventory-panel #bag-detail{flex-basis:110px;max-height:31%}}
@media(max-width:650px){
 #game-root #character-panel .gear-model-wrap{height:284px;min-height:284px;justify-content:center}
 #game-root #character-panel .gear-model-wrap canvas{width:100%;height:auto;max-height:280px;object-fit:contain}
 #game-root #character-panel .gear-slots{gap:6px;padding:0}
 #game-root #character-panel .gear-slot>button:first-child{display:flex;min-height:49px;padding:5px 3px;text-align:left;gap:4px}
 #game-root #character-panel .gear-slot .gear-pixel-icon{width:21px;height:28px}
 #game-root #character-panel .slot-ghost{width:21px;height:28px;margin:0;flex-shrink:0}
 #game-root #character-panel #gear-name{margin:12px 0 8px}
}

/* A hero's annotated practice folio, with separate currencies and readable icon art. */
#career-modal .career-points{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:0 10px;min-width:132px;transform:none}
#career-modal .career-points b{font-size:27px;line-height:1.3}
#career-modal .career-points span{margin:0;font-size:11px;text-align:left}
#career-modal #career-exclusive-count{color:#9a6543}
#career-pools{display:flex;gap:18px;margin-top:20px;border-bottom:1px solid #bcc9ac}
#career-modal #career-pools button{display:flex;flex-direction:column;gap:5px;text-align:left;background:transparent;border:0;border-bottom:3px solid transparent;border-radius:0;box-shadow:none;padding:12px 18px;color:#718165}
#career-modal #career-pools button b{font-size:18px;font-family:var(--font-display,serif);font-weight:normal}
#career-modal #career-pools button span{font-size:11px}
#career-modal #career-pools [aria-pressed=true]{border-bottom-color:#b07a4c;color:#3f6854;background:linear-gradient(0deg,#dedfc250,transparent)}
#career-modal .hero-talent-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px}
#career-modal .hero-talent-node{background:transparent;border:0;border-bottom:1px solid #c4c6ad;box-shadow:none;border-radius:0;padding:10px 2px 16px}
#career-modal .hero-talent-node.learned{background:linear-gradient(110deg,#e0ebd37a,transparent);border-bottom-color:#91ac83}
#career-modal .hero-talent-node .career-node-heading img{width:64px;height:64px;flex-basis:64px;background:radial-gradient(ellipse,#dce7cf,#f3ebd600 72%);border:0;box-shadow:none;filter:drop-shadow(0 2px 1px #465e4530);padding:0;border-radius:0}
#career-modal .hero-talent-node .career-node-heading h4{font-size:18px;letter-spacing:1px}
#career-modal .hero-talent-node .career-node-heading small{color:#8b7357}
#career-modal .hero-talent-node>p{font-size:13px;line-height:1.85;margin:12px 0 8px;color:#536950;min-height:48px}
#career-modal .hero-talent-node .career-preview{border:0;padding:3px 0;color:#748168;min-height:38px}
#career-modal .hero-talent-node .career-pips{max-width:82px;gap:7px;margin:8px 0 12px}
#career-modal .hero-talent-node .career-pips i{height:5px;border-radius:0;border:0;background:#d3d4bd;transform:skew(-20deg)}
#career-modal .hero-talent-node .career-pips i.filled{background:#9a784a}
#career-modal .hero-talent-node .career-rank{color:#997044;font-size:22px}
#career-modal .hero-talent-node:nth-child(even){padding-top:22px}
#career-modal .hero-talent-grid .hero-talent-node:last-child:nth-child(odd){grid-column:1/-1;max-width:75%;padding-right:20px}
@media(max-width:650px){#career-modal .hero-talent-grid{grid-template-columns:1fr;gap:12px}#career-modal .hero-talent-node:nth-child(even){padding-top:10px}#career-modal .hero-talent-grid .hero-talent-node:last-child:nth-child(odd){max-width:none;padding-right:2px}#career-pools{gap:4px}#career-modal #career-pools button{padding:10px 8px;flex:1}#career-modal #career-pools button b{font-size:16px}#career-modal .career-points{display:grid;min-width:125px}}

/* Painted atlas with brush-lettered place names, readable travel notes. */
#game-root #world-atlas-modal .world-atlas-dialog{background:#142932;border:1px solid #aa9270;border-radius:5px;box-shadow:0 24px 85px #0009}
#game-root #world-atlas-modal .world-atlas-header{background:linear-gradient(100deg,#263d45,#132a34);border-bottom:1px solid #927c57;padding:17px 24px}
#game-root #world-atlas-modal .world-atlas-header small{color:#bba481;letter-spacing:3px;font-size:11px}
#game-root #world-atlas-modal #world-atlas-title{font-size:34px;letter-spacing:5px;color:#f2d5a4;margin:5px 0 0}
#game-root #world-atlas-modal #world-atlas-title span{font-family:var(--lantern-reading)!important;font-size:12px;letter-spacing:2px;color:#bac8c8}
#game-root #world-atlas-modal .world-atlas-layout{grid-template-columns:minmax(0,1fr) 280px}
#game-root #world-atlas-modal .atlas-tools{background:#142c36;color:#b8c7ca;padding:10px 15px}
#game-root #world-atlas-modal #atlas-viewport{background:#163947;border-color:#6d786f}
#game-root #world-atlas-modal #atlas-board{aspect-ratio:8/5}
#game-root #world-atlas-modal #atlas-art{image-rendering:auto;object-fit:contain}
#game-root #world-atlas-modal .atlas-routes{display:none}
#game-root #world-atlas-modal .atlas-pin{gap:2px;min-width:64px;isolation:isolate}
#game-root #world-atlas-modal .atlas-pin i{font-size:12px;line-height:1;color:var(--region-color);filter:drop-shadow(0 1px 2px #071b26)}
#game-root #world-atlas-modal .atlas-pin span{font-family:var(--lantern-art)!important;font-size:19px;font-weight:400;letter-spacing:2px;line-height:1.25;padding:5px 10px 6px;color:#f3e6cd;border:1px solid #ac9577;background:linear-gradient(110deg,#122c37ed,#253c43f2);border-radius:2px;box-shadow:0 3px 7px #06171a55;text-shadow:0 1px 2px #06171b}
#game-root #world-atlas-modal .atlas-pin:hover span{border-color:var(--region-color);background:#304953;transform:translateY(-2px)}
#game-root #world-atlas-modal .atlas-pin[aria-pressed=true] span{background:linear-gradient(120deg,#f0dab0,#caaa72);color:#163440;border-color:#ffe2a5;text-shadow:none;box-shadow:0 0 0 2px #1d353c,0 4px 10px #071d29aa}
#game-root #world-atlas-modal .atlas-compass{font-family:var(--lantern-art)!important;top:3%;left:2.3%;font-size:18px;color:#f1dfb9;text-shadow:0 1px 4px #0b2634}
#game-root #world-atlas-modal .atlas-ocean{font-family:var(--lantern-art)!important;bottom:4%;right:14%;font-size:24px;letter-spacing:8px;color:#e0d7b9;opacity:.8;text-shadow:0 1px 3px #0c324a}
#game-root #world-atlas-modal .atlas-caption{background:#142c36;padding:11px 15px;font-size:11px;color:#aabfc4}
#game-root #world-atlas-modal .atlas-info{background:linear-gradient(135deg,#233c44,#142c37);border-left:1px solid #607571;padding:22px 20px}
#game-root #world-atlas-modal .atlas-info h3{font-family:var(--lantern-art)!important;font-size:36px;letter-spacing:4px;margin:9px 0 11px;color:#f0d5a8}
#game-root #world-atlas-modal .atlas-info p{font-size:13px;line-height:1.9;color:#c0cfcc}
#game-root #world-atlas-modal #atlas-region-subtitle{font-size:13px;color:#dac6a1}
#game-root #world-atlas-modal #atlas-region-view{position:relative;overflow:hidden;image-rendering:auto;height:114px;border-color:#8b927b;border-radius:2px}
#game-root #world-atlas-modal #atlas-region-view>img{position:absolute;top:50%;width:450%;max-width:none;height:auto;image-rendering:auto;pointer-events:none}
#game-root #world-atlas-modal .atlas-info h4{font-family:var(--lantern-art)!important;font-size:18px;letter-spacing:2px;color:#dfc298}
#game-root #world-atlas-modal #atlas-region-list{background:linear-gradient(180deg,#233d46,#152d36);border-top:1px solid #8d7d61;padding:13px 16px;gap:6px;scrollbar-width:thin;scrollbar-color:#a18b66 #20353d}
#game-root #world-atlas-modal #atlas-region-list button{position:relative;font-family:var(--lantern-art)!important;font-size:19px;line-height:1.5;letter-spacing:1px;font-weight:400;flex:1 0 auto;color:#bdc9c6;background:#20353e;border:1px solid #4b6369;border-radius:3px;padding:8px 12px 10px;transition:background .15s,color .15s}
#game-root #world-atlas-modal #atlas-region-list button::after{content:'';position:absolute;left:30%;right:30%;bottom:4px;height:1px;background:var(--region-color);opacity:.45}
#game-root #world-atlas-modal #atlas-region-list button.is-open{color:#ecd7b3}
#game-root #world-atlas-modal #atlas-region-list button:hover{color:#fff0cf;background:#344c51;border-color:#b6a07c}
#game-root #world-atlas-modal #atlas-region-list button[aria-pressed=true]{color:#192f36;background:#dfc28e;border-color:#f4d69e;box-shadow:inset 0 0 0 2px #b89963}
#game-root #world-atlas-modal #atlas-region-list button[aria-pressed=true]::after{background:#405250;opacity:.7}
@media(max-width:1100px){#game-root #world-atlas-modal #atlas-region-list button{font-size:17px;padding:8px 10px}#game-root #world-atlas-modal .atlas-pin span{font-size:16px;padding:4px 7px}#game-root #world-atlas-modal .world-atlas-layout{grid-template-columns:minmax(0,1fr) 235px}#game-root #world-atlas-modal .atlas-info{padding:15px}}
@media(max-width:600px){#game-root #world-atlas-modal{padding:5px}#game-root #world-atlas-modal .world-atlas-header{padding:12px 14px}#game-root #world-atlas-modal #world-atlas-title{font-size:28px}#game-root #world-atlas-modal .world-atlas-layout{display:block}#game-root #world-atlas-modal #atlas-board{min-width:650px}#game-root #world-atlas-modal .atlas-pin span{font-size:16px}#game-root #world-atlas-modal .atlas-info{border-left:0}#game-root #world-atlas-modal .atlas-tools{padding:8px;font-size:10px}#game-root #world-atlas-modal #atlas-region-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:10px}#game-root #world-atlas-modal #atlas-region-list button{font-size:18px;padding:7px 4px}#game-root #world-atlas-modal .atlas-caption{font-size:10px;gap:5px}}

.tactical-dialog{width:min(800px,94vw);max-height:90vh;overflow:auto;background:#122832;color:#e5d6b2;border:2px solid #a98b58;padding:25px;box-shadow:0 16px 70px #0009}
.tactical-dialog>header,.tactical-catalog article>header,.tactical-shop-bar{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tactical-dialog h2{margin:4px 0 20px;color:#efd293}.tactical-dialog>header small{color:#a6c5be;letter-spacing:2px}
.tactical-dialog button,.tactical-equip-actions button{background:#233c41;border:1px solid #8b825e;color:#ead7ab;padding:8px 12px;cursor:pointer}.tactical-dialog button:hover:not(:disabled){background:#355158;border-color:#efd293}.tactical-dialog button:disabled,.tactical-equip-actions button:disabled{opacity:.45;cursor:default}.tactical-dialog button:focus-visible,.tactical-gear:focus-visible{outline:2px solid #e5d6b2;outline-offset:2px}
.tactical-loadout{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-bottom:18px;border-bottom:1px solid #546661}.tactical-loadout>div{display:flex;align-items:center;gap:12px;padding:10px;background:#203a40;border:1px solid #637c72;box-shadow:inset 0 0 0 3px #172b32}.tactical-loadout span{display:grid;gap:5px}.tactical-loadout strong{margin-left:auto;color:#c3dcc4}.tactical-icon{width:60px;height:60px;object-fit:contain;image-rendering:pixelated}.tactical-loadout .tactical-icon{width:46px;height:46px}
.tactical-shop-bar{margin:16px 0}.tactical-shop-bar small,.tactical-note{color:#9fbbb4}.tactical-catalog{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tactical-catalog article{background:linear-gradient(135deg,#1b353e,#13262e);border:1px solid #556e69;border-top:2px solid var(--tactical-color);padding:14px}.tactical-catalog article>header{justify-content:flex-start}.tactical-catalog h3{margin:3px 0;color:var(--tactical-color)}.tactical-catalog header strong{margin-left:auto;font-size:12px}.tactical-catalog header small{color:#a8c1b9}.tactical-catalog p{font-size:13px;line-height:1.75;min-height:90px;color:#c4d1c5;margin:12px 0}.tactical-catalog footer{display:grid;gap:10px}.tactical-catalog footer>div,.tactical-equip-actions{display:flex;gap:8px}.tactical-catalog footer>div button{flex:1}.tactical-dialog details{border-top:1px solid #435d5d;padding-top:12px;font-size:12px;color:#a6beb9;line-height:1.8}.tactical-dialog summary{cursor:pointer}.tactical-note{text-align:center;font-size:12px;margin:16px 0}#tactical-status{min-height:18px;font-size:13px;color:#e2c88d}
.world-hud.hero-ui .item-deck .tactical-gear{font-family:inherit;font-size:8px;letter-spacing:0;padding:1px 3px;margin-left:4px;line-height:12px;background:#243e41;color:#e6c98d;border:1px solid #7d805e;cursor:pointer}
.world-hud.hero-ui .item-deck .tactical-quick{position:relative;background:#172d35!important;border:1px solid #a18c61!important;box-shadow:inset 0 0 0 2px #2e4448;width:var(--slot);height:var(--slot);padding:2px;overflow:hidden}.world-hud.hero-ui .item-deck .tactical-quick img{display:block;max-width:100%;width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.tactical-quick-art{display:block;width:100%;height:100%}.tactical-quick kbd{position:absolute;left:2px;bottom:1px;font-size:9px;color:#f4dfb5}.tactical-quick .item-quantity{position:absolute;right:2px;bottom:1px;z-index:2}.tactical-cooldown{position:absolute;inset:0;display:grid;place-items:center;background:#0b182cb8;color:#f0d6ac;font:700 16px serif}.tactical-cooldown[hidden]{display:none}.tactical-quick.empty img{opacity:.3}.bag-item.tactical-item img{width:48px;height:48px}.tactical-equip-actions{margin-top:12px}
@media(max-width:620px){.tactical-dialog{padding:14px}.tactical-catalog{grid-template-columns:1fr}.tactical-catalog p{min-height:0}.tactical-loadout{gap:6px}.tactical-loadout>div{padding:6px;gap:5px}.tactical-loadout .tactical-icon{width:30px;height:30px}.tactical-loadout strong{font-size:12px}.tactical-shop-bar{flex-wrap:wrap}}
/* Paper labels and celadon trays keep the expanded kit readable in daylight. */
#tactical-modal .tactical-dialog{background:#f3efdf;color:#3f5b50;border-color:#b5a17b;box-shadow:0 16px 60px #102b354d}
#tactical-modal h2{color:#4a6658}#tactical-modal .tactical-dialog>header small{color:#8b7b57}
#tactical-modal .tactical-loadout>div{background:#dfe7d5;border:1px solid #b4c1a6;box-shadow:none;border-radius:4px 11px 4px 4px}
#tactical-modal .tactical-loadout strong{color:#4c7558}#tactical-modal button{background:#e3e8d7;border-color:#b0bba1;color:#486449;border-radius:3px}
#tactical-modal button:hover:not(:disabled){background:#cfddc5;border-color:#8eaa84}#tactical-modal button:focus-visible{outline:2px solid #63866b;outline-offset:2px}
#tactical-filters{display:flex;flex-wrap:wrap;gap:7px;padding:3px 0 17px}#tactical-filters button{font-size:12px;padding:7px 11px;border-radius:16px}#tactical-filters button[aria-pressed="true"]{background:#5f7c65;color:#fff9e6}#tactical-filters small{margin-left:4px;opacity:.7}
#tactical-modal .tactical-catalog article{background:#fbf7ea;border:1px solid #d6cfb8;border-top:0;border-left:3px solid var(--tactical-color);border-radius:3px 8px 3px 3px;padding:14px 16px}
#tactical-modal .tactical-catalog h3{color:#496653}#tactical-modal .tactical-catalog header small{color:#99825d}#tactical-modal .tactical-catalog p{color:#6a7564;line-height:1.8;min-height:96px}#tactical-modal .tactical-icon{filter:drop-shadow(0 3px 2px #6d67462a)}
#tactical-modal .tactical-shop-bar small,#tactical-modal .tactical-note,#tactical-modal details{color:#7b846c}#tactical-modal details{border-color:#c6c8af}#tactical-status{color:#997c3e}
@media(max-width:620px){#tactical-modal .tactical-catalog p{min-height:0}#tactical-filters{gap:5px}#tactical-filters button{padding:6px 9px}}
#game-root #tactical-modal .tactical-dialog{background:#f3efdf;color:#3f5b50;border:1px solid #b5a17b;border-image:none;border-radius:4px 16px 4px 4px;box-shadow:0 16px 60px #102b354d}
#game-root #tactical-modal :is(h2,h3){color:#496653;text-shadow:none}
#game-root #tactical-modal :is(header small,.tactical-loadout small){color:#897753;letter-spacing:.05em}
#game-root #tactical-modal :is(.tactical-loadout b,.tactical-loadout strong,.tactical-catalog header strong){color:#496653;text-shadow:none}
#game-root #tactical-modal .tactical-shop-bar .resource-chip{color:#74603a}

#codex-modal .codex-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}
#map-codex{color:#37574c}.map-book-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:4px 0 20px}.map-book-head h2{font:32px EmberLanternDisplay,serif;margin:4px 0}.map-book-head p{margin:0;color:#7a8164;font-size:13px}.map-book-head small{letter-spacing:3px;color:#967745}#map-book-count{font-size:12px;color:#7a8164;white-space:nowrap}
#map-book-chapters{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid #b7bea2}#map-codex button{font:inherit;cursor:pointer;color:#496655;background:#f8f5e9;border:1px solid #b5bea6;padding:8px 12px;border-radius:3px}#map-codex button[aria-pressed=true]{background:#d9e4cb;border-color:#64876c;box-shadow:inset 3px 0 #64876c}#map-book-chapters small{margin-left:7px;color:#8f916f}.map-book-tools{display:flex;gap:16px;margin:18px 0}.map-book-tools label{display:flex;flex-direction:column;gap:5px;font-size:12px}.map-book-tools label:first-child{flex:1}.map-book-tools input,.map-book-tools select{font:inherit;padding:9px 12px;border:1px solid #afbda1;background:#fffcf0;color:#395e4a;min-height:40px;border-radius:3px}.map-book-layout{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.55fr);gap:28px;align-items:start}#map-book-list{display:flex;flex-direction:column;gap:10px;max-height:600px;overflow:auto;padding-right:7px}#map-codex #map-book-list>button{display:flex;text-align:left;gap:12px;padding:6px;border-width:0 0 1px;background:#f5f0df;border-radius:0}#map-codex #map-book-list>button[aria-pressed=true]{background:#dce5cf}#map-book-list img{width:110px;height:70px;object-fit:cover;image-rendering:pixelated}#map-book-list span{min-width:0;align-self:center}#map-book-list strong{display:block;font:19px EmberLanternDisplay,serif;line-height:1.5}#map-book-list small{font-size:10px;color:#8b825f}#map-book-list em{font-size:10px;line-height:1.5;color:#677c61;font-style:normal;display:block}.map-book-empty{padding:24px;line-height:2}
#map-book-detail figure{margin:0;position:relative}#map-book-detail figure>img{width:100%;aspect-ratio:688/384;object-fit:contain;display:block;image-rendering:pixelated;box-shadow:5px 5px 0 #d8d8bc}#map-book-detail figcaption{font-size:11px;color:#7e8263;line-height:1.7;margin:14px 0 0}.map-book-caption{margin:23px 0 16px}.map-book-caption small{color:#9b7e4b;letter-spacing:3px}.map-book-caption h3{font:32px EmberLanternDisplay,serif;color:#385f4d;margin:7px 0}.map-book-caption p,.map-book-note p{font-size:13px;line-height:1.9;color:#62765c;margin:7px 0}.map-book-note{margin:20px 0;padding:14px 18px;background:#eee4c5;border-left:3px solid #ba9d5d;transform:rotate(-.35deg)}#map-book-detail h4{font:18px EmberLanternDisplay,serif;color:#76623f;margin:10px 0}.map-book-note small{font-size:11px;color:#8a805e}.map-book-inhabitants,.map-book-route{margin:20px 0}.map-book-inhabitants button,.map-book-route button{margin:0 5px 7px 0!important;font-size:12px!important}.map-book-visit{display:inline-block;color:#366752;background:#d5e4ce;padding:12px 17px;font-size:13px;text-decoration:none;border-bottom:2px solid #88a27e}.map-book-preview-note{display:block;margin:12px 0;font-size:11px;color:#7d866c;line-height:1.8}
@media(max-width:760px){.map-book-layout{grid-template-columns:1fr;gap:20px}#map-book-list{max-height:230px}.map-book-tools{gap:8px}.map-book-tools input{min-width:0;width:100%}.map-book-head h2{font-size:26px}.map-book-head{gap:10px}#map-book-count{font-size:10px}.map-book-head p{font-size:11px}.map-book-caption h3{font-size:27px}#map-codex button{padding:8px}#codex-modal .codex-tabs small{font-size:9px}#map-book-detail figure>img{box-shadow:3px 3px 0 #d8d8bc}}

#field-note-modal{z-index:136;background:#142a335e;backdrop-filter:blur(3px)}.field-note-dialog{width:min(700px,94vw);max-height:90dvh;overflow:auto;background:#f3eddb;color:#3d6156;padding:24px 28px;border:1px solid #a7b29a;border-radius:4px 22px 4px 5px;box-shadow:0 18px 60px #102d3940}.field-note-dialog header{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:14px;border-bottom:1px solid #c4c5aa}.field-note-dialog header>span{font-size:12px;letter-spacing:2px;color:#8c7f56}.field-note-dialog button{padding:8px 12px;background:#e1e8d4;color:#456552;border:1px solid #acbba0;font:inherit}.field-note-body{display:grid;grid-template-columns:150px 1fr;gap:25px;margin:24px 0;align-items:center}.field-note-body img{width:150px;height:180px;object-fit:contain;image-rendering:pixelated}.field-note-body small{color:#8c805b;font-size:11px}.field-note-body h2{font:30px EmberLanternDisplay,serif;color:#386053;margin:8px 0 14px}.field-note-body p{line-height:1.95;font-size:14px;color:#59715e}#field-note-detail{font-size:12px;color:#8b876b;border-top:1px dashed #c7c4a7;margin-top:16px;padding-top:12px}.field-note-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #c7c4ad;padding-top:16px}.field-note-dialog footer span{font-size:11px;color:#8c8568}.interact-hint .field-note-hint{padding:0;border:0;background:none;color:inherit;font:inherit;min-height:24px}#map-book-detail .field-note-quote{font-size:12px;line-height:1.9;color:#7b704f;padding-top:10px;border-top:1px dashed #c3b68b}.field-map-preview{display:inline-block;margin:4px 0 14px;font-size:12px;color:#426e59}
@media(max-width:600px){.field-note-dialog{padding:16px 18px}.field-note-body{grid-template-columns:90px 1fr;gap:12px;margin:18px 0}.field-note-body img{width:90px;height:130px}.field-note-body h2{font-size:24px}.field-note-body p{font-size:12px}.field-note-dialog footer{flex-wrap:wrap}.field-note-dialog header>span{font-size:10px;letter-spacing:1px}}

/* Character identity is local to each inspection panel; no animated overlays cross a model. */
#game-root #character-panel.hero-folio,
#game-root :is(#career-modal,#skillbook-modal).hero-folio>.modal{color:var(--folio-ink);background:var(--folio-paper);border:1px solid var(--folio-line);border-image:none;border-radius:var(--folio-radius);box-shadow:0 3px 0 var(--folio-line),0 20px 70px #14293166;color-scheme:light}
#game-root #character-panel.hero-folio>header,
#game-root :is(#career-modal,#skillbook-modal).hero-folio>.modal>header{position:relative;isolation:isolate;min-width:0;background:linear-gradient(110deg,var(--folio-wash),var(--folio-paper) 75%);border-bottom:2px solid var(--folio-line);color:var(--folio-ink);padding:18px 22px;border-radius:var(--folio-radius)}
#game-root .hero-folio header::before{content:'';position:absolute;inset:0 16px 0 auto;width:180px;background:var(--folio-pattern) right center/64px 64px repeat-x;opacity:.6;z-index:-1;pointer-events:none}
#game-root #character-panel.hero-folio>header::after{background:var(--folio-accent);height:3px;width:64px;left:22px;right:auto}
#game-root :is(#career-modal,#skillbook-modal).hero-folio h2,#game-root #character-panel.hero-folio h2{color:var(--folio-ink);text-shadow:none;font-size:26px;letter-spacing:3px}
#game-root .hero-folio header small{color:var(--folio-muted);letter-spacing:2px}
#game-root #skillbook-modal.hero-folio #skillbook-close{order:10;margin-left:auto}
#game-root #skillbook-modal.hero-folio .hero-guide-entry{margin-left:auto}
#game-root #character-panel.hero-folio .gear-panel-scroll{background:var(--folio-paper);color:var(--folio-ink);scrollbar-color:var(--folio-line) var(--folio-paper)}
#game-root #character-panel.hero-folio>footer{background:var(--folio-wash);color:var(--folio-muted);border-color:var(--folio-line)}
#game-root .hero-folio .hero-folio-banner{position:relative;isolation:isolate;display:flex;align-items:center;gap:16px;min-height:88px;margin:12px 0 18px;padding:12px 20px;background:var(--folio-wash);border-left:3px solid var(--folio-accent);border-radius:var(--folio-radius);overflow:hidden}
#game-root .hero-folio .hero-folio-banner::after{content:'';position:absolute;right:10%;top:-12px;width:160px;height:120px;background:var(--folio-pattern) center/100px no-repeat;z-index:-1;pointer-events:none}
#game-root .hero-folio .folio-sigil{width:72px;height:72px;object-fit:contain;image-rendering:pixelated;flex-shrink:0;filter:drop-shadow(0 3px 0 #635a3926)}
#game-root .hero-folio .folio-inscription{min-width:0;flex:1}
#game-root .hero-folio .folio-inscription>b{font-family:var(--font-display,serif);font-size:24px;letter-spacing:3px;color:var(--folio-accent)}
#game-root .hero-folio .folio-inscription>p{font-size:12px;line-height:1.8;color:var(--folio-ink);margin:6px 0 0}
#game-root .hero-folio .folio-traits{display:flex;gap:12px;padding:0;margin:0;list-style:none;flex-shrink:0}
#game-root .hero-folio .folio-traits li{color:var(--folio-accent);font-size:12px;writing-mode:vertical-rl;letter-spacing:4px;border-top:2px solid var(--folio-gold);padding-top:9px}
#game-root .hero-folio :is(#bag-roster,#career-roster,#skillbook-roster){border-color:var(--folio-line);background:transparent}
#game-root .hero-folio :is(#bag-roster,#career-roster,#skillbook-roster) button{color:var(--folio-ink);background:var(--folio-card);border:1px solid transparent;box-shadow:none;border-radius:var(--folio-radius)}
#game-root .hero-folio :is(#bag-roster,#career-roster,#skillbook-roster) button[aria-pressed=true]{color:var(--folio-ink);background:var(--folio-selected);border-color:var(--folio-accent);box-shadow:0 2px var(--folio-accent)}
#game-root .hero-folio :is(#bag-roster,#career-roster,#skillbook-roster) small{color:var(--folio-muted)}
#game-root :is(#career-modal,#skillbook-modal).hero-folio button,#game-root #character-panel.hero-folio :is(header button,.help-link,#gear-progression>button){background:var(--folio-wash);color:var(--folio-ink);border-color:var(--folio-line);box-shadow:none}
#game-root .hero-folio button:focus-visible{outline:2px solid var(--folio-accent);outline-offset:3px}
#game-root .hero-folio button:not(:disabled):hover{filter:brightness(.97)}
#game-root :is(#career-modal,#skillbook-modal).hero-folio :is(h3,h4,strong),#game-root #character-panel.hero-folio :is(#gear-name h3,#bag-stats h4,#bag-stats b){color:var(--folio-ink);text-shadow:none}
#game-root #character-panel.hero-folio :is(#gear-name span,#gear-name small,#gear-progression>div,#gear-progression small,#bag-stats span,#bag-stats small,#gear-rule){color:var(--folio-muted)}
#game-root #character-panel.hero-folio #gear-name h3{color:var(--folio-accent)}
#game-root #character-panel.hero-folio #gear-progression progress{accent-color:var(--folio-accent)}
#game-root #character-panel.hero-folio .gear-model-wrap{background:var(--folio-wash);border-radius:var(--folio-stage);box-shadow:0 4px var(--folio-line),inset 0 0 0 1px var(--folio-line)}
#game-root #character-panel.hero-folio .gear-model-wrap::before{background:linear-gradient(0deg,var(--folio-accent),transparent 65%),var(--kit-alcove) center/cover;filter:brightness(1.4) saturate(.55);opacity:.8}
#game-root #character-panel.hero-folio .gear-model-wrap::after{content:'';position:absolute;inset:15px 12px auto auto;width:56px;height:56px;background:var(--folio-emblem) center/contain no-repeat;image-rendering:pixelated;opacity:.35;pointer-events:none;z-index:-1}
#game-root #character-panel.hero-folio .gear-model-wrap>span{background:#18322d99;padding:4px 8px;border-radius:3px;color:#fff9e7;font-size:10px;text-shadow:none}
#game-root #character-panel.hero-folio .gear-slot>button:first-child{background:var(--folio-card);border:0!important;border-bottom:1px solid var(--folio-line)!important;box-shadow:none;border-radius:var(--folio-radius);color:var(--folio-ink)}
#game-root #character-panel.hero-folio .gear-slot>button.empty{background:transparent;border-bottom:1px dashed var(--folio-line)!important}
#game-root #character-panel.hero-folio .gear-slot>button:first-child:hover{background:var(--folio-selected)}
#game-root #character-panel.hero-folio .gear-slot :is(small,.hand-slot-tag){color:var(--folio-muted)}
#game-root #character-panel.hero-folio .gear-slot b{color:var(--folio-ink)}
#game-root #character-panel.hero-folio .gear-slot .gear-unequip{background:var(--folio-wash);color:var(--folio-accent)}
#game-root #character-panel.hero-folio :is(#bag-stats,#bag-stats .stat-group>div){border-color:var(--folio-line)}
#game-root #character-panel.hero-folio #bag-stats .stat-group h5{color:var(--folio-accent)}
#game-root #character-panel.hero-folio #bag-stats .stat-group:first-of-type{background:var(--folio-wash);border-radius:var(--folio-radius)}
#game-root #character-panel.hero-folio #gear-sets .gear-set{background:var(--folio-card);color:var(--folio-ink);border-color:var(--folio-line)}
#game-root #character-panel.hero-folio #gear-sets :is(p,b){color:var(--folio-ink)}
#game-root #career-modal.hero-folio :is(#career-summary,#career-guidance,.career-branch,.career-unassigned){background:var(--folio-wash);border-color:var(--folio-line);border-radius:var(--folio-radius);color:var(--folio-ink)}
#game-root #career-modal.hero-folio :is(.career-identity p,.career-identity small,.career-milestones,#career-guidance p,#career-guidance small,.career-group h3 small,.career-node p,.career-preview,.career-node-heading small,.career-branch p,.career-bonus,.career-lede){color:var(--folio-muted)}
#game-root #career-modal.hero-folio :is(.career-points b,#career-exclusive-count,.career-rank,.career-group h3,.career-milestones .reached,.career-node-heading h4){color:var(--folio-accent)}
#game-root #career-modal.hero-folio :is(#career-pools,.career-tabs,.career-footer,.career-group,.career-node){border-color:var(--folio-line)}
#game-root #career-modal.hero-folio :is(#career-pools,.career-tabs,#career-filters) [aria-pressed=true]{background:var(--folio-selected);color:var(--folio-ink);border-color:var(--folio-accent)}
#game-root #career-modal.hero-folio .career-node{background:var(--folio-card);border-radius:var(--folio-radius);color:var(--folio-ink)}
#game-root #career-modal.hero-folio .hero-talent-node{background:transparent;border-radius:0;border-left:2px solid var(--folio-line);padding-left:15px}
#game-root #career-modal.hero-folio .hero-talent-node.learned{border-left-color:var(--folio-accent);background:linear-gradient(90deg,var(--folio-wash),transparent)}
#game-root #career-modal.hero-folio .hero-talent-node .career-node-heading img{background:radial-gradient(var(--folio-selected),transparent 72%)}
#game-root #career-modal.hero-folio .career-pips i{background:var(--folio-wash)}
#game-root #career-modal.hero-folio .career-pips i.filled{background:var(--folio-accent)}
#game-root #career-modal.hero-folio .career-xp progress{accent-color:var(--folio-accent)}
#game-root #career-modal.hero-folio .career-footer{background:var(--folio-paper);color:var(--folio-muted)}
#game-root #career-modal.hero-folio #career-message{color:var(--folio-ink)}
#game-root #skillbook-modal.hero-folio #skillbook-summary{background:var(--folio-wash);border-color:var(--folio-line);border-radius:var(--folio-radius)}
#game-root #skillbook-modal.hero-folio :is(#skillbook-summary h3 span,#book-growth,footer,.book-stats,.book-skill-heading small,.book-next){color:var(--folio-muted)}
#game-root #skillbook-modal.hero-folio :is(.book-section-title,#book-notice,.book-tier,.book-rank,.book-next summary){color:var(--folio-accent)}
#game-root #skillbook-modal.hero-folio :is(.book-study-points,.book-rank){border-color:var(--folio-line)}
#game-root #skillbook-modal.hero-folio .book-loadout-slot{background:var(--folio-wash);border-color:var(--folio-line);color:var(--folio-ink);border-radius:var(--folio-radius)}
#game-root #skillbook-modal.hero-folio .book-loadout-slot>small{color:var(--folio-accent)}
#game-root #skillbook-modal.hero-folio #book-role-description>div{background:var(--folio-wash);border-color:var(--folio-accent)}
#game-root #skillbook-modal.hero-folio #book-role-description p{color:var(--folio-muted)}
#game-root #skillbook-modal.hero-folio #book-tabs [aria-pressed=true]{background:var(--folio-selected);border-color:var(--folio-accent);color:var(--folio-ink)}
#game-root #skillbook-modal.hero-folio .book-skill-card{background:var(--folio-card);border-color:var(--folio-line);color:var(--folio-ink);border-radius:var(--folio-radius)}
#game-root #skillbook-modal.hero-folio .book-skill-card.equipped{background:var(--folio-wash);box-shadow:inset 3px 0 var(--folio-accent)}
#game-root #skillbook-modal.hero-folio .book-skill-card.ultimate{background:var(--folio-pattern) right 12px top 12px/64px no-repeat,linear-gradient(135deg,var(--folio-card),var(--folio-wash));border-bottom:2px solid var(--folio-gold)}
#game-root #skillbook-modal.hero-folio .book-study-actions button:first-child{background:var(--folio-selected)}
/* The material language is different as well as the palette. */
#game-root .hero-folio[data-folio=ember] .hero-folio-banner{border-left-width:6px;border-bottom:2px solid var(--folio-gold)}
#game-root #skillbook-modal[data-folio=ember] .book-skill-card{border-top:2px solid var(--folio-line)}
#game-root .hero-folio[data-folio=frost] .hero-folio-banner{border:1px solid var(--folio-line);box-shadow:inset 5px 0 var(--folio-paper),inset -5px 0 var(--folio-paper)}
#game-root #career-modal[data-folio=frost] .career-pips i{transform:rotate(-45deg);width:8px;height:8px}
#game-root .hero-folio[data-folio=gale] .hero-folio-banner{border-left:0;border-bottom:2px solid var(--folio-accent)}
#game-root .hero-folio[data-folio=gale] .folio-traits{transform:rotate(-7deg)}
#game-root .hero-folio[data-folio=moon] .hero-folio-banner{border-left:0;border-right:4px solid var(--folio-accent);border-radius:50px 6px 6px 50px}
#game-root #career-modal[data-folio=moon] .career-pips i{border-radius:50%;height:7px;transform:none}
#game-root .hero-folio[data-folio=astral] .hero-folio-banner{border:1px solid var(--folio-line);border-top:3px double var(--folio-gold)}
#game-root #career-modal[data-folio=astral] .hero-talent-node{border-left-style:dotted}
#game-root .hero-folio[data-folio=oath] .hero-folio-banner{border-left:0;border-top:3px double var(--folio-gold);border-bottom:3px double var(--folio-gold)}
#game-root #career-modal[data-folio=oath] .hero-talent-node{border-left:0;border-bottom:2px solid var(--folio-line);border-radius:0 0 18px 18px}
#game-root .hero-folio[data-folio=copper] .hero-folio-banner{border:1px dashed var(--folio-accent);background:var(--folio-pattern) right center/80px no-repeat,var(--folio-wash)}
#game-root .hero-folio[data-folio=copper] .folio-traits li{border-top-style:dashed}
#game-root #career-modal[data-folio=copper] .career-pips i{height:7px;transform:none;border-right:2px solid var(--folio-paper)}
#game-root #skillbook-modal[data-folio=copper] .book-skill-card{border:1px dashed var(--folio-line);box-shadow:3px 3px var(--folio-wash)}
#game-root .hero-folio[data-folio=grove] .hero-folio-banner{border-left-width:2px;border-radius:32px 4px 32px 4px}
#game-root #career-modal[data-folio=grove] .career-pips i{height:8px;border-radius:8px 0 8px 0;transform:none}
#game-root #character-panel.hero-folio .hero-folio-banner{gap:10px;padding:10px 12px;min-height:72px;margin-bottom:10px}
#game-root #character-panel.hero-folio .folio-sigil{width:54px;height:54px}
#game-root #character-panel.hero-folio .folio-inscription>b{font-size:21px}
#game-root #character-panel.hero-folio .folio-traits{gap:8px}
/* Override the old equipment desk's more specific ink-blue roster rules. */
#game-root #character-panel.hero-folio #bag-roster{border-color:var(--folio-line)}
#game-root #character-panel.hero-folio #bag-roster button{background:transparent;color:var(--folio-ink);border:1px solid transparent;box-shadow:none;border-radius:var(--folio-radius)}
#game-root #character-panel.hero-folio #bag-roster button[aria-pressed=true]{background:var(--folio-selected);color:var(--folio-ink);border-color:var(--folio-accent);box-shadow:0 2px var(--folio-accent)}
#game-root #character-panel.hero-folio>header small,#game-root #career-modal.hero-folio>.modal>header small,#game-root #skillbook-modal.hero-folio>.modal>header small{color:var(--folio-muted)}
#game-root #career-modal.hero-folio .career-points{background:var(--folio-card);border-color:var(--folio-line);box-shadow:2px 3px var(--folio-wash);border-radius:var(--folio-radius)}
#game-root #career-modal.hero-folio :is(.career-points span,.career-identity h3 span,.career-identity .career-xp,.career-tabs>span){color:var(--folio-muted)}
#game-root #career-modal.hero-folio .career-portrait{border-color:var(--folio-card);box-shadow:0 2px var(--folio-line)}
#game-root #career-modal.hero-folio .career-xp progress::-webkit-progress-value,#game-root #character-panel.hero-folio #gear-progression progress::-webkit-progress-value{background:var(--folio-accent)}
#game-root #career-modal.hero-folio .career-xp progress::-moz-progress-bar,#game-root #character-panel.hero-folio #gear-progression progress::-moz-progress-bar{background:var(--folio-accent)}
@media(max-width:700px){
 #game-root .hero-folio .hero-folio-banner{padding:12px;gap:10px}
 #game-root .hero-folio .folio-sigil{width:52px;height:52px}
 #game-root .hero-folio .folio-inscription>b{font-size:20px;letter-spacing:2px}
 #game-root .hero-folio .folio-traits{gap:6px}
 #game-root .hero-folio .folio-traits li{font-size:10px;letter-spacing:2px}
 #game-root :is(#career-modal,#skillbook-modal).hero-folio h2,#game-root #character-panel.hero-folio h2{font-size:22px;letter-spacing:1px}
 #game-root #skillbook-modal.hero-folio>.modal>header{gap:8px;flex-wrap:wrap;padding:12px 0}
 #game-root #character-panel.hero-folio .gear-paperdoll{grid-template-columns:72px minmax(95px,1fr) 80px}
 #game-root #character-panel.hero-folio>header{padding:10px 18px;min-height:66px}
 #game-root #character-panel.hero-folio>header h2{margin:5px 0 0}
 #game-root #character-panel.hero-folio #bag-roster{padding-bottom:7px}
 #game-root #character-panel.hero-folio .hero-folio-banner{min-height:62px;margin:7px 0 10px;padding:8px 10px}
 #game-root #character-panel.hero-folio .folio-sigil{width:42px;height:42px}
 #game-root #character-panel.hero-folio .folio-inscription>p{font-size:10px;margin-top:3px}
 #game-root #character-panel.hero-folio #gear-name{margin:10px 0 6px}
 #game-root #character-panel.hero-folio #gear-name h3{font-size:25px}
 #game-root #character-panel.hero-folio #gear-progression{padding:0 4px 6px;margin-bottom:6px}
 #game-root #character-panel.hero-folio .gear-model-wrap{height:280px;min-height:280px;align-self:center;justify-content:center}
 #game-root #character-panel.hero-folio .gear-model-wrap canvas{height:270px;max-height:270px;width:100%;object-fit:contain}
 #game-root #character-panel.hero-folio .gear-slots{gap:5px}
 #game-root #character-panel.hero-folio #gear-left,#game-root #character-panel.hero-folio #gear-right{padding:0}
 #game-root #character-panel.hero-folio .gear-slot>button:first-child{min-height:47px;padding:3px 2px}
 #game-root #character-panel.hero-folio .gear-slot .gear-pixel-icon{height:25px;width:24px}
}
@media(prefers-reduced-motion:reduce){#game-root .hero-folio *{scroll-behavior:auto;transition:none}}

/* Readable field notes, colored by the traveler currently being inspected. */
.hero-folio .hero-passives{margin:12px 0 18px;color:var(--folio-ink);border-block:1px solid var(--folio-line);background:var(--folio-card)}
.hero-folio .hero-passives>summary{cursor:pointer;padding:13px 16px;display:flex;align-items:center;gap:12px;list-style:none;min-height:46px}
.hero-folio .hero-passives>summary::-webkit-details-marker{display:none}
.hero-folio .hero-passives>summary:before{content:'＋';color:var(--folio-accent);font-size:18px}
.hero-folio .hero-passives[open]>summary:before{content:'−'}
.hero-folio .hero-passives>summary>span{font-weight:bold;letter-spacing:.12em}
.hero-folio .hero-passives>summary>b{font-size:12px;color:var(--folio-accent)}
.hero-folio .hero-passives>summary>small{margin-left:auto;font-size:11px;color:var(--folio-muted)}
.hero-folio .passive-mini-icons{display:flex;gap:4px}
.hero-folio .passive-mini-icons img{width:28px;height:28px;image-rendering:pixelated;object-fit:contain}
.hero-folio .hero-passives[open] .passive-mini-icons{display:none}
.hero-folio .hero-passives>summary:focus-visible{outline:2px solid var(--folio-accent);outline-offset:2px}
.hero-folio .passive-note{padding:0 16px;margin:0 0 14px;color:var(--folio-muted);font-size:12px;line-height:1.8}
.hero-folio .passive-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:0 16px 16px}
.hero-folio .passive-entry{min-width:0;padding:12px 10px 8px;border-left:2px solid var(--folio-accent);background:var(--folio-paper);border-radius:var(--folio-radius);display:flex;flex-direction:column}
.hero-folio .passive-heading{display:flex;align-items:center;gap:9px}
.hero-folio .passive-heading img{width:44px;height:44px;object-fit:contain;image-rendering:pixelated;flex:none}
.hero-folio .passive-heading small{color:var(--folio-muted);font-size:10px}
.hero-folio .passive-heading h3{margin:4px 0;font-size:15px;color:var(--folio-ink);letter-spacing:.06em}
.hero-folio .passive-entry>p{font-size:12px;line-height:1.85;margin:12px 0;flex:1;color:var(--folio-ink)}
.hero-folio .passive-state{font-size:11px;color:var(--folio-accent);padding-top:8px;border-top:1px dashed var(--folio-line)}
.hero-folio .passive-entry.dormant{border-left-color:var(--folio-line)}
.hero-folio .passive-entry.dormant img{filter:saturate(.45)}
.hero-folio .passive-entry.dormant .passive-state{color:var(--folio-muted)}
.hero-folio .passive-heading img{width:56px;height:56px}
.hero-folio .passive-preview{font-size:12px;line-height:1.8;color:var(--folio-accent)}
.hero-folio .passive-pips{display:flex;gap:5px;margin:10px 0}
.hero-folio .passive-pips i{height:5px;flex:1;background:var(--folio-line)}
.hero-folio .passive-pips i.lit{background:var(--folio-accent)}
.hero-folio .passive-actions{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.hero-folio .passive-actions button{padding:8px;font-size:11px;border:1px solid var(--folio-line);background:var(--folio-card);color:var(--folio-ink);border-radius:4px;cursor:pointer}
.hero-folio .passive-actions button:last-child{flex:1;background:var(--folio-selected)}
.hero-folio .passive-actions button:disabled,.study-shortcut button:disabled{opacity:.55;cursor:default}
.study-shortcuts{padding:0 16px 10px;display:grid;gap:10px}
.study-shortcut{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px;background:var(--folio-wash,#e6ead8);color:var(--folio-ink,#3c584b)}
.study-shortcut img{width:48px;height:48px;image-rendering:pixelated;object-fit:contain}
.study-shortcut>span{flex:1;min-width:100px;display:grid;gap:6px;font-size:13px}
.study-shortcut small{font-size:11px}
.study-shortcut button{padding:10px;border:1px solid var(--folio-line,#b9c6ab);border-radius:5px;background:var(--folio-card,#faf7e9);color:inherit;cursor:pointer;font-size:12px}
.study-item img,#bag-detail .item-heading img{image-rendering:pixelated;object-fit:contain}
#study-recipient{padding:10px;margin:10px 0;background:#faf7e9;color:#3c584b;max-width:100%}
#character-panel .passive-list{grid-template-columns:1fr}
@media(max-width:700px){.hero-folio .passive-list{grid-template-columns:1fr}.hero-folio .hero-passives>summary{gap:8px;padding-inline:10px}.hero-folio .hero-passives>summary{flex-wrap:wrap}.hero-folio .hero-passives>summary>small{display:inline}}

/* Character dossier: ink, cut metal and a different elemental accent per traveler. */
#game-root #equipment-modal:not(.both-open) .gear-desktop{grid-template-columns:1fr}
#game-root #equipment-modal:not(.both-open) #character-panel.hero-avant{grid-column:1;justify-self:center;max-width:1220px}
#game-root #equipment-modal #character-panel.hero-avant{container-type:inline-size;border:1px solid #526066;border-top:3px solid var(--folio-accent);border-radius:0 24px 0 0;border-image:none;background:#121820;box-shadow:12px 14px 0 #070d1366,0 25px 80px #0009;overflow:hidden;color-scheme:dark}
#game-root #character-panel.hero-avant>header{min-height:62px;padding:12px 24px;background:#121820;border:0;border-bottom:1px solid #46545a;border-radius:0}
#game-root #character-panel.hero-avant>header h2{font-size:20px;letter-spacing:6px;margin:4px 0 0;color:#f3efdf}
#game-root #character-panel.hero-avant>header small{font-size:9px;color:var(--folio-accent);letter-spacing:3px}
#game-root #character-panel.hero-avant>header::before{background:var(--folio-pattern) right center/70px repeat-x;opacity:.5;width:260px}
#game-root #character-panel.hero-avant>header::after{display:none}
#game-root #character-panel.hero-avant button:focus-visible{outline:2px solid var(--folio-accent);outline-offset:3px}
#game-root #character-panel.hero-avant .gear-panel-scroll{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-content:start;padding:18px 22px 24px;background:#121820;scrollbar-gutter:stable}
#game-root #character-panel.hero-avant .hero-folio-banner{display:none}
#game-root #character-panel.hero-avant #bag-roster{grid-column:1/-1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px;padding:0 0 12px;border:0;border-bottom:1px solid #35424a;background:transparent}
#game-root #character-panel.hero-avant #bag-roster button{display:flex;align-items:center;justify-content:center;gap:6px;padding:5px 4px;background:#1d2730;border:0;border-bottom:2px solid transparent;border-radius:0;min-width:0;color:#c1c6c4}
#game-root #character-panel.hero-avant #bag-roster button[aria-pressed=true]{background:var(--folio-accent);color:#142029;border-color:var(--folio-accent);box-shadow:none;transform:translateY(-3px)}
#game-root #character-panel.hero-avant #bag-roster img{display:block;width:27px;height:31px;margin:0;object-fit:cover}
#game-root #character-panel.hero-avant #bag-roster span{font-size:11px;white-space:nowrap;margin:0}
#game-root #character-panel.hero-avant #gear-name{display:flex;justify-content:space-between;align-items:center;margin:0;padding:4px 0 10px;min-width:0;border:0}
#game-root #character-panel.hero-avant .avant-identity>small{display:block;margin:0;color:var(--folio-accent);font-size:10px;letter-spacing:4px}
#game-root #character-panel.hero-avant #gear-name h3{display:flex;align-items:baseline;gap:15px;font-size:66px;line-height:1.15;letter-spacing:4px;color:#f3efdf;margin:4px 0}
#game-root #character-panel.hero-avant #gear-name h3 em{font-size:14px;font-weight:normal;font-style:normal;letter-spacing:3px;color:var(--folio-accent)}
#game-root #character-panel.hero-avant .avant-identity>span{font-size:12px;color:#c5c9c6;letter-spacing:2px}
#game-root #character-panel.hero-avant .avant-level{text-align:right;padding-left:12px;border-left:1px solid #46545a}
#game-root #character-panel.hero-avant .avant-level>b{font:italic 54px/1 Georgia,serif;color:var(--folio-accent)}
#game-root #character-panel.hero-avant .avant-level>small{display:block;margin:8px 0 0;font-size:10px;letter-spacing:1px}
#game-root #character-panel.hero-avant #gear-progression{margin:0;padding:12px 16px;background:#202b35;border:0;border-left:3px solid var(--folio-accent);align-self:center}
#game-root #character-panel.hero-avant #gear-progression button{background:var(--folio-accent);border:0;color:#142029;font-size:11px;padding:9px 12px;margin-bottom:10px}
#game-root #character-panel.hero-avant #gear-progression>div{font-size:11px;gap:10px}
#game-root #character-panel.hero-avant #gear-progression progress{height:3px;margin:9px 0 5px;width:100%;border-radius:0}
#game-root #character-panel.hero-avant .gear-paperdoll{display:grid;grid-template-columns:100px minmax(90px,1fr) 108px;gap:10px;padding:12px 0;background:none;border:0;align-items:center;min-width:0}
#game-root #character-panel.hero-avant .gear-model-wrap{isolation:isolate;position:relative;align-self:stretch;justify-content:center;min-height:400px;height:440px;padding:0;border:0;border-radius:0;overflow:hidden;background:linear-gradient(112deg,#202c36 0 27%,var(--folio-accent) 27% 71%,#283540 71%);box-shadow:none}
#game-root #character-panel.hero-avant .gear-model-wrap::before{content:attr(data-hero-name);position:absolute;inset:0;display:flex;align-items:flex-start;justify-content:center;padding-top:20px;font:150px/1.1 var(--serif);color:#111b2233;background:var(--folio-pattern) center 90%/150px no-repeat;filter:none;opacity:1;z-index:0;pointer-events:none}
#game-root #character-panel.hero-avant .gear-model-wrap::after{content:'';position:absolute;inset:auto 12% 12% 12%;width:auto;height:50px;border:1px solid #10242d55;border-radius:50%;background:#15283122;opacity:1;z-index:0;pointer-events:none}
#game-root #character-panel.hero-avant .gear-model-wrap canvas{position:relative;z-index:1;width:100%;height:410px;max-height:410px;object-fit:contain;image-rendering:pixelated;filter:none}
#game-root #character-panel.hero-avant .gear-model-wrap>span{bottom:12px;left:10px;right:10px;color:#d3d9d7;background:#13212de8;border-radius:0;padding:7px 2px;letter-spacing:2px;font-size:9px;z-index:2}
#game-root #character-panel.hero-avant .gear-slots{gap:9px;padding:0;align-content:center}
#game-root #character-panel.hero-avant .gear-slot>button:first-child{display:flex;align-items:center;text-align:left;gap:5px;min-height:58px;padding:7px 5px;border:1px solid #4a5760!important;border-left:3px solid var(--quality,var(--folio-accent))!important;border-radius:0;background:#202b35;box-shadow:none;color:#f3efdf}
#game-root #character-panel.hero-avant .gear-slot>button.empty{background:#18212a;border-color:#34424b!important;border-left:2px solid #586670!important}
#game-root #character-panel.hero-avant .gear-slot>button:first-child:hover{background:#35434c;border-color:var(--folio-accent)!important;transform:translateX(2px)}
#game-root #character-panel.hero-avant .gear-slot .gear-pixel-icon{width:28px;height:34px;flex-shrink:0}
#game-root #character-panel.hero-avant .slot-ghost{width:28px;height:34px;opacity:.55;flex-shrink:0}
#game-root #character-panel.hero-avant .gear-slot b{display:block;font-size:10px;line-height:1.5;color:#ece8d9}
#game-root #character-panel.hero-avant .gear-slot small{font-size:9px;letter-spacing:1px;color:#aebbc0}
#game-root #character-panel.hero-avant .gear-slot .gear-unequip{background:#15212b;border:1px solid #70818c;border-radius:0;color:var(--folio-accent);font-size:9px;bottom:-5px;right:0}
#game-root #character-panel.hero-avant .gear-insights{min-width:0}
#game-root #character-panel.hero-avant .hero-passives{margin:0 0 14px;background:#202b35;border:1px solid #46545a;border-top:2px solid var(--folio-accent)}
#game-root #character-panel.hero-avant .hero-passives>summary{padding:12px 10px;gap:7px;flex-wrap:wrap;font-size:12px}
#game-root #character-panel.hero-avant .passive-mini-icons img{width:24px;height:24px}
#game-root #character-panel.hero-avant .passive-list{grid-template-columns:1fr;padding:0 12px 12px}
#game-root #character-panel.hero-avant .passive-note{font-size:11px}
#game-root #character-panel.hero-avant #bag-stats{display:block;margin:0;padding:0;border:0;background:none}
#game-root #character-panel.hero-avant #bag-stats h4{font-size:16px;letter-spacing:4px;padding:5px 0 12px;margin:0;color:#efe9da}
#game-root #character-panel.hero-avant #bag-stats .stat-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 15px;margin:0 0 10px;padding:12px;background:#1b252e;border:0;border-radius:0}
#game-root #character-panel.hero-avant #bag-stats .stat-group h5{grid-column:1/-1;margin:0 0 5px;font-size:11px;letter-spacing:2px;color:var(--folio-accent)}
#game-root #character-panel.hero-avant #bag-stats .stat-group>div{display:flex;justify-content:space-between;align-items:center;gap:4px;padding:7px 0;border-bottom:1px solid #37434b}
#game-root #character-panel.hero-avant #bag-stats span{font-size:10px;color:#b4c0c3}
#game-root #character-panel.hero-avant #bag-stats b{font:17px Georgia,serif;color:#f3efdf;white-space:nowrap}
#game-root #character-panel.hero-avant #bag-stats b small{font-size:9px;color:var(--folio-accent)}
#game-root #character-panel.hero-avant #gear-rule{grid-column:1/-1;font-size:10px;color:#acb9bc;margin:0}
#game-root #character-panel.hero-avant>footer{font-size:9px;letter-spacing:3px;padding:8px 22px;background:#1b252e;color:var(--folio-accent);border-top:1px solid #46545a}
@container(min-width:820px){
 #game-root #character-panel.hero-avant .gear-panel-scroll{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px 28px}
 #game-root #character-panel.hero-avant #gear-name{grid-column:1;grid-row:2}
 #game-root #character-panel.hero-avant #gear-progression{grid-column:2;grid-row:2}
 #game-root #character-panel.hero-avant .gear-paperdoll{grid-column:1;grid-row:3;align-self:start}
 #game-root #character-panel.hero-avant .gear-insights{grid-column:2;grid-row:3;max-height:480px;overflow:auto;scrollbar-width:thin;scrollbar-color:#617179 #1b252e;padding-right:6px}
 #game-root #character-panel.hero-avant #bag-roster button{padding:6px;justify-content:flex-start;gap:12px}
 #game-root #character-panel.hero-avant #bag-roster img{width:35px;height:38px}
}
@media(max-width:700px){
 #game-root #equipment-modal:not(.both-open) #character-panel.hero-avant{height:calc(100dvh - 135px);min-height:350px}
 #game-root #character-panel.hero-avant .gear-panel-scroll{padding:12px;gap:12px}
 #game-root #character-panel.hero-avant #bag-roster{gap:4px}
 #game-root #character-panel.hero-avant #bag-roster button{display:grid;gap:3px;padding:4px 2px}
 #game-root #character-panel.hero-avant #bag-roster img{width:26px;height:28px}
 #game-root #character-panel.hero-avant #bag-roster span{font-size:9px}
 #game-root #character-panel.hero-avant #gear-name h3{font-size:48px;gap:10px}
 #game-root #character-panel.hero-avant #gear-name h3 em{font-size:11px;letter-spacing:1px}
 #game-root #character-panel.hero-avant .avant-level>b{font-size:40px}
 #game-root #character-panel.hero-avant .gear-paperdoll{grid-template-columns:78px minmax(60px,1fr) 80px;gap:5px}
 #game-root #character-panel.hero-avant .gear-model-wrap{min-height:340px;height:370px}
 #game-root #character-panel.hero-avant .gear-model-wrap canvas{height:340px;max-height:340px}
 #game-root #character-panel.hero-avant .gear-model-wrap::before{font-size:100px}
 #game-root #character-panel.hero-avant .gear-slot>button:first-child{padding:5px 3px;min-height:50px;gap:3px}
 #game-root #character-panel.hero-avant .gear-slot b{font-size:8px}
 #game-root #character-panel.hero-avant .gear-slot :is(.gear-pixel-icon,.slot-ghost){width:22px;height:28px}
}
/* Keep the character visible before secondary growth details on a small screen. */
@container(max-width:819px){
 #game-root #character-panel.hero-avant .gear-panel-scroll{gap:10px}
 #game-root #character-panel.hero-avant #gear-name h3{font-size:50px}
 #game-root #character-panel.hero-avant .gear-model-wrap{height:370px;min-height:370px}
 #game-root #character-panel.hero-avant .gear-model-wrap canvas{height:350px;max-height:350px}
}
@media(max-width:700px){
 #game-root #character-panel.hero-avant>header{box-sizing:border-box;min-height:62px;height:62px;padding:8px 14px}
 #game-root #character-panel.hero-avant>header h2{font-size:18px;line-height:1.2;margin:5px 0 0}
 #game-root #character-panel.hero-avant .gear-panel-scroll{gap:8px;padding:10px 12px}
 #game-root #character-panel.hero-avant #bag-roster{order:0;padding-bottom:8px}
 #game-root #character-panel.hero-avant #gear-name{order:1;padding:0 0 4px}
 #game-root #character-panel.hero-avant #gear-name h3{font-size:38px;line-height:1.1;margin:3px 0}
 #game-root #character-panel.hero-avant .avant-identity>small{font-size:9px;letter-spacing:2px}
 #game-root #character-panel.hero-avant .avant-identity>span{font-size:10px}
 #game-root #character-panel.hero-avant .avant-level>b{font-size:34px}
 #game-root #character-panel.hero-avant .gear-paperdoll{order:2;padding:4px 0}
 #game-root #character-panel.hero-avant #gear-progression{order:3}
 #game-root #character-panel.hero-avant .gear-insights{order:4}
 #game-root #character-panel.hero-avant #gear-rule{order:5}
 #game-root #character-panel.hero-avant .gear-model-wrap{height:315px;min-height:315px}
 #game-root #character-panel.hero-avant .gear-model-wrap canvas{height:300px;max-height:300px}
 #game-root #character-panel.hero-avant .gear-slot>button:first-child{min-height:42px;padding:4px 3px}
 #game-root #character-panel.hero-avant .gear-slots{gap:7px}
}

/* Traveling kit: open paper, offset tabs, elemental ink; item data stays native. */
#town-time-status{display:inline-flex;align-items:center;padding:8px 12px;color:#f4dfa9;background:#27423de8;border-left:2px solid #cab574;font-size:11px;white-space:nowrap}#town-time-status[hidden]{display:none}
#game-root #equipment-modal #inventory-panel.bag-avant{width:100%;max-width:1160px;justify-self:center;container-type:inline-size;background:#eee9d9;color:#263e3d;border:0;border-top:4px solid var(--bag-accent,#b54f38);border-radius:4px 34px 4px 4px;box-shadow:12px 14px 0 #081c2366,0 24px 70px #0007;overflow:hidden;color-scheme:light;height:calc(100dvh - 125px);max-height:950px}
#game-root #equipment-modal #inventory-panel.bag-avant>header{background:#eee9d9;border:0;min-height:100px;padding:18px 28px;position:relative;gap:16px}
#game-root #equipment-modal #inventory-panel.bag-avant>header::before{content:'行';position:absolute;right:180px;top:-20px;font:150px EmberLanternDisplay,serif;color:#63746712;background:none;width:auto;pointer-events:none}
#game-root #equipment-modal #inventory-panel.bag-avant>header::after{display:none}
#game-root #equipment-modal #inventory-panel.bag-avant h2{font:36px/1.1 EmberLanternDisplay,serif;color:#263e3d;letter-spacing:7px;margin:8px 0 0!important}
#game-root #equipment-modal #inventory-panel.bag-avant header small{color:var(--bag-accent);font-size:10px;letter-spacing:3px}
#game-root #equipment-modal #inventory-panel.bag-avant header>button{border:0;background:#d9dfc9;color:#284d44;width:32px;height:32px;padding:0;border-radius:50%;flex-shrink:0;box-shadow:none}
.bag-curator{display:flex;align-items:center;gap:12px;margin-left:auto;transform:rotate(-2deg);border-bottom:2px solid var(--bag-accent);padding:6px 12px;background:#f9f5e6;color:#3c5750;font-size:12px}.bag-curator img{width:42px;height:48px;object-fit:cover;image-rendering:pixelated}.bag-curator small{display:block;margin-bottom:4px}
#game-root #equipment-modal #inventory-panel.bag-avant .gear-panel-scroll{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr);grid-template-rows:auto auto auto auto auto minmax(0,1fr) auto;gap:12px 24px;padding:0 28px 18px;background:#eee9d9;overflow:hidden;align-content:stretch;scrollbar-color:#8eab98 #e1e5d7}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-wallet{grid-column:1/-1;grid-row:2;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #c5cbb8;padding:0 0 10px;margin:0;color:#536c5f}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-wallet :is(b,span){color:#4a6055}#game-root #equipment-modal #inventory-panel.bag-avant .bag-wallet #bag-count{color:#6b7a68}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-search{grid-column:1;grid-row:3}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-search input{background:#fbf8ed;color:#2b4840;border:0;border-bottom:2px solid #9ea993;border-radius:0;padding:11px 8px;font-size:13px}#game-root #equipment-modal #inventory-panel.bag-avant .bag-search input::placeholder{color:#85917c}
#game-root #equipment-modal #inventory-panel.bag-avant :is(.bag-search button,#bag-mode){background:transparent;border:1px solid #a6b29c;color:#536954;border-radius:2px;padding:8px}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-mode-bar{grid-column:2;grid-row:3;margin:0;gap:10px}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-mode-note{color:#6f7a67;font-size:11px}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-filters{grid-column:1/-1;grid-row:4;display:flex;flex-wrap:wrap;gap:5px 16px;border:0;margin:0;padding:0 0 3px}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-filters button{color:#6c7867;font-size:12px;border:0;border-bottom:2px solid transparent;padding:7px 3px;background:transparent;border-radius:0}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-filters button[aria-pressed=true]{color:var(--bag-accent);border-color:var(--bag-accent);font-weight:bold;transform:translateY(-2px)}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-secondary-filters{grid-column:1/-1;grid-row:5;margin:0;color:#6b7866;display:flex;gap:12px}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-secondary-filters label{color:#5e725e}#game-root #equipment-modal #inventory-panel.bag-avant .bag-secondary-filters select{background:#fbf8ed;color:#425c50;border:1px solid #b6bfaa}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-storage{grid-column:1;grid-row:6/8;min-height:0;overflow:auto;max-height:none;flex:none;margin:0;padding:0 8px 8px 0;scrollbar-color:#8eab98 #e1e5d7}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-storage-label{color:#647960;letter-spacing:2px;padding:4px 0 12px}#game-root #equipment-modal #inventory-panel.bag-avant .bag-storage-label small{color:#7d8c73}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:9px}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item{--item-tone:#6d8178;min-height:100px;display:grid;grid-template-columns:45px minmax(0,1fr);grid-template-rows:auto auto auto;align-content:center;gap:4px 9px;width:100%;background:#f8f6eb;border:0!important;border-bottom:2px solid #ced3bf!important;border-left:3px solid var(--item-tone)!important;border-radius:2px 13px 2px 2px;padding:10px!important;color:#364d43;box-shadow:none!important}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item.fine{--item-tone:#52916c}#game-root #equipment-modal #inventory-panel.bag-avant .bag-item.rare{--item-tone:#3b829e}#game-root #equipment-modal #inventory-panel.bag-avant .bag-item.epic{--item-tone:#9965a6}#game-root #equipment-modal #inventory-panel.bag-avant .bag-item.legendary{--item-tone:#b78325}#game-root #equipment-modal #inventory-panel.bag-avant .bag-item.limited{--item-tone:#b9584c}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item:hover{background:#fffdf2;transform:translateY(-2px)}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item[aria-pressed=true]{background:#dfe9ca;border-color:var(--bag-accent)!important;box-shadow:inset 0 0 0 1px #75917266!important}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item>img,#game-root #equipment-modal #inventory-panel.bag-avant .bag-item>.tactical-icon{grid-column:1;grid-row:1/4;width:44px;height:52px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(1px 3px 0 #496b3b22)}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item b{grid-column:2;grid-row:1;font-size:13px;color:#304b43;overflow-wrap:anywhere;white-space:normal}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item>small{grid-column:2;grid-row:auto;justify-self:start;text-align:left;font-size:10px;color:#71816a;white-space:normal;line-height:1.45}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail{grid-column:2;grid-row:6;align-self:stretch;min-height:0;max-height:none;overflow:auto;flex:none;margin:0;padding:20px;background:#faf7e8;border:0;border-top:3px solid var(--bag-accent);border-radius:0 20px 0 0;color:#4c6558;scrollbar-color:#8eab98 #e1e5d7}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail .item-heading{display:flex;align-items:center;gap:14px;border:0;padding:0 0 16px;margin:0 0 12px;border-bottom:1px solid #cfd4bc}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail .item-heading img{width:74px;height:82px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(2px 4px 0 #51794822)}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail h3{color:#2b4b3f;font:25px/1.35 EmberLanternDisplay,serif;letter-spacing:1px}#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail p{color:#5e7462;line-height:1.85;font-size:12px}#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail :is(small,.gear-affinity){color:#79836b!important}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail .item-stat-block{background:#e8edda;color:#3c5b4d;border-left:2px solid #90a47b;padding:12px}#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail .gear-affixes{color:#397b85}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail .gear-set{background:#e4ead5;border:0;color:#4c6850}#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail .gear-set :is(b,p){color:#507052}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-detail .gear-compare{background:none;color:#526e59;border-top:1px dashed #b3bea3;padding-top:12px}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-action{grid-column:2;grid-row:7;display:flex;flex-wrap:wrap;min-height:0;padding:0;gap:8px;color:#44604f}
#game-root #equipment-modal #inventory-panel.bag-avant :is(#bag-action,#bag-detail) button{background:#355d4e;color:#f7efd8;border:0;border-radius:2px 12px 2px 2px;padding:10px 16px;box-shadow:none}
#game-root #equipment-modal #inventory-panel.bag-avant :is(#bag-action,#bag-detail) button:disabled{background:#d0d7c4;color:#74816b;opacity:1}
#game-root #equipment-modal #inventory-panel.bag-avant #bag-action label{color:#526950}#game-root #equipment-modal #inventory-panel.bag-avant #bag-action select{color:#3e5d4b;background:#f9f6e7;border:1px solid #b7c0a8}
#game-root #equipment-modal #inventory-panel.bag-avant>footer{color:#7d856c;background:#e0e5d2;border:0;padding:8px 28px;letter-spacing:2px}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-empty-result{grid-column:1/-1;color:#69775e;padding:25px}
#game-root #equipment-modal #inventory-panel.bag-avant :focus-visible{outline:2px solid var(--bag-accent);outline-offset:3px}
#game-root #equipment-modal #inventory-panel.bag-avant .gear-panel-scroll>.dengtuan-guide{grid-column:1/-1;grid-row:1;margin:0;padding:10px;min-height:0}
#game-root #equipment-modal #inventory-panel.bag-avant .bag-item>small:last-child:not(:first-of-type){grid-column:2;grid-row:3;max-width:none;text-align:left;color:var(--item-tone)}
@container(max-width:760px){
 #game-root #equipment-modal #inventory-panel.bag-avant .gear-panel-scroll{display:flex;flex-direction:column;gap:10px;padding:0 16px 16px;overflow:auto;scrollbar-gutter:stable}
 #game-root #equipment-modal #inventory-panel.bag-avant .gear-panel-scroll>.dengtuan-guide{order:-1;flex-shrink:0}
 #game-root #equipment-modal #inventory-panel.bag-avant .bag-wallet{flex-shrink:0}
 #game-root #equipment-modal #inventory-panel.bag-avant .bag-mode-bar{margin:0}
 #game-root #equipment-modal #inventory-panel.bag-avant .bag-storage{height:310px;min-height:240px;max-height:310px;flex:0 0 310px}
 #game-root #equipment-modal #inventory-panel.bag-avant #bag-detail{min-height:220px;max-height:360px;flex:0 0 300px;padding:15px}
 #game-root #equipment-modal #inventory-panel.bag-avant #bag-action{flex-shrink:0;min-height:42px}
 #game-root #equipment-modal #inventory-panel.bag-avant>header{padding:12px 16px;min-height:80px}#game-root #equipment-modal #inventory-panel.bag-avant h2{font-size:27px}.bag-curator{padding:4px 7px;font-size:10px;gap:5px}.bag-curator img{width:30px;height:34px}
}
@container(max-width:480px){
 #game-root #equipment-modal #inventory-panel.bag-avant #bag-items{grid-template-columns:minmax(0,1fr)}
 #game-root #equipment-modal #inventory-panel.bag-avant .bag-item{min-height:82px;grid-template-columns:48px minmax(0,1fr)}
}
@media(max-width:700px){#game-root #equipment-modal.both-open .gear-desktop{grid-template-columns:1fr}#game-root #equipment-modal.both-open #character-panel{grid-column:1}#game-root #equipment-modal #inventory-panel.bag-avant{height:calc(100dvh - 140px);min-height:610px;border-radius:3px 22px 3px 3px}.bag-curator{display:none}#town-time-status{font-size:9px;padding:6px}}
/* Conversation opens as an offset portrait and a folded note, not a boxed menu. */
#game-root #npc-dialogue-modal{padding:24px 5% 40px;background:linear-gradient(transparent 55%,#10292799);backdrop-filter:none}
#game-root #npc-dialogue-modal .npc-conversation{--speaker-ink:#3c7568;--speaker-paper:#f4efd9;display:grid;grid-template-columns:170px minmax(0,1fr);gap:0;align-items:end;width:min(1040px,100%);padding:14px 10px;background:none;border:0;box-shadow:none;border-radius:0;max-height:85dvh;overflow:auto;animation:npc-dialogue-arrive .2s ease-out;color:#345247}
#game-root #npc-dialogue-modal .npc-dialogue-portrait{position:relative;z-index:1;min-height:220px;height:240px;padding:14px 4px 0;border:0;background:linear-gradient(165deg,transparent 30%,#d8e4c9 30%,#f8f1d4 92%,transparent 92%);transform:rotate(-3deg) translate(10px,-18px);align-self:end;filter:drop-shadow(5px 7px 0 #102a342e)}
#game-root #npc-dialogue-modal .npc-dialogue-portrait img{max-width:180px;width:100%;height:215px;object-fit:contain;image-rendering:pixelated;transform:rotate(3deg);filter:drop-shadow(3px 5px 0 #31584322)}
#game-root #npc-dialogue-modal .npc-dialogue-content{position:relative;padding:22px 30px 16px 34px;border:0;border-top:4px solid var(--speaker-ink);border-radius:3px 34px 3px 3px;background:var(--speaker-paper);box-shadow:10px 10px 0 #102c3544;min-width:0}
#game-root #npc-dialogue-modal header{align-items:start;margin-top:-8px}#game-root #npc-dialogue-role{color:var(--speaker-ink);font-size:11px;letter-spacing:3px}
#game-root #npc-dialogue-name{color:var(--speaker-ink);font-size:32px;letter-spacing:3px;margin:4px 0 13px}
#game-root #npc-dialogue-text{color:#3d554b;font-size:18px;line-height:1.85;min-height:65px;margin-bottom:16px}
#game-root #npc-dialogue-modal footer{border-color:#bfc7ae;padding-top:12px;gap:10px}#game-root #npc-dialogue-progress{font:italic 16px Georgia,serif;color:#8a956f}#game-root #npc-dialogue-hint{color:#8b977e;font-size:10px;margin-top:10px}
#game-root #npc-dialogue-modal button{background:var(--speaker-ink);color:#fff8e4;border:0;border-radius:2px 13px 2px 2px;box-shadow:none;padding:9px 18px;font-size:14px;min-height:38px}
#game-root #npc-dialogue-modal #npc-dialogue-close{background:#e1e6d1;color:#5d7662;border:0;border-radius:50%;width:30px;min-height:30px;padding:0;flex-shrink:0}#game-root #npc-dialogue-modal button:hover{filter:brightness(1.12)}
#game-root #npc-dialogue-modal #npc-dialogue-action{background:#cfaa61;color:#314f43}#game-root #npc-dialogue-emblem{color:var(--speaker-ink)}
@media(max-width:650px){#game-root #npc-dialogue-modal{padding:8px 10px 20px}#game-root #npc-dialogue-modal .npc-conversation{grid-template-columns:64px minmax(0,1fr);padding:8px 0;max-height:88dvh}#game-root #npc-dialogue-modal .npc-dialogue-portrait{min-height:125px;height:130px;transform:rotate(-3deg) translate(3px,-30px);padding:0}#game-root #npc-dialogue-modal .npc-dialogue-portrait img{height:120px}#game-root #npc-dialogue-modal .npc-dialogue-content{padding:16px 15px 12px 18px;border-radius:2px 23px 2px 2px}#game-root #npc-dialogue-name{font-size:26px}#game-root #npc-dialogue-text{font-size:16px;min-height:0}#game-root #npc-dialogue-modal footer{flex-direction:column;align-items:flex-start}#game-root #npc-dialogue-hint{text-align:left}}
@media(prefers-reduced-motion:reduce){#game-root #npc-dialogue-modal .npc-conversation{animation:none}#game-root #equipment-modal #inventory-panel.bag-avant .bag-item{transition:none}}

/* A small paper note in the page flow, never over combat or controls. */
#game-root .dengtuan-guide{grid-column:1/-1;display:flex;align-items:center;gap:12px;flex-shrink:0;min-width:0;margin:12px 0;padding:10px 14px;background:#f4ecd7;color:#3b554e;border:1px solid #bfbd96;border-left:3px solid #79a58b;border-radius:5px 19px 19px 19px;box-shadow:0 3px 0 #253d3520;font-family:inherit;text-align:left}
#game-root .dengtuan-guide[hidden],#game-root .dengtuan-guide [hidden]{display:none!important}
#game-root .dengtuan-guide button{font:inherit;cursor:pointer;box-shadow:none;text-shadow:none;background:none;border:0;border-image:none;border-radius:5px;color:#476359;min-width:0;min-height:32px;padding:4px 7px;clip-path:none;transform:none;line-height:1.4}
#game-root .dengtuan-guide button:hover{background:#d9e2ca;color:#203e34}
#game-root .dengtuan-guide button:focus-visible{outline:2px solid #528b75;outline-offset:2px}
#game-root .dengtuan-guide .dengtuan-toggle{display:flex;flex-direction:column;align-items:center;flex:0 0 66px;padding:0;background:transparent}
#game-root .dengtuan-toggle img{display:block;width:64px;height:64px;object-fit:contain;image-rendering:pixelated;filter:none}
#game-root .dengtuan-toggle span{font-size:12px;letter-spacing:2px;white-space:nowrap}
#game-root .dengtuan-toggle i{font-style:normal;color:#b78a45}
#game-root .dengtuan-message{flex:1;min-width:0}
#game-root .dengtuan-caption{display:flex;align-items:baseline;gap:12px;justify-content:space-between}
#game-root .dengtuan-caption strong{font-size:14px;color:#35574b;font-weight:600;letter-spacing:1px}
#game-root .dengtuan-count{font-size:10px;color:#7b8067;white-space:nowrap}
#game-root .dengtuan-copy{font-size:13px;line-height:1.65;letter-spacing:0;margin:4px 0;color:#47594e}
#game-root .dengtuan-actions{display:flex;gap:6px;flex-wrap:wrap}
#game-root .dengtuan-actions button{font-size:11px;text-decoration:underline;text-underline-offset:3px}
#game-root .dengtuan-actions .dengtuan-fold{margin-left:auto;color:#777d66}
#game-root .dengtuan-guide.is-folded{justify-self:start;align-self:flex-start;width:max-content;max-width:100%;padding:3px 10px;margin:6px 0;border-radius:20px}
#game-root .is-folded .dengtuan-toggle{flex-direction:row;gap:6px;flex-basis:auto}
#game-root .is-folded .dengtuan-toggle img{width:32px;height:32px}
#game-root #career-modal.has-dengtuan-guide .career-mascot-card{display:none}
#game-root #world-atlas-modal .dengtuan-guide,#game-root #codex-modal .dengtuan-guide{margin:10px 20px}
@media(max-width:700px){#game-root .dengtuan-guide{gap:8px;padding:8px 10px;margin:8px 0}#game-root .dengtuan-guide .dengtuan-toggle{flex-basis:48px}#game-root .dengtuan-toggle img{width:48px;height:48px}#game-root .dengtuan-copy{font-size:12px}#game-root .dengtuan-caption strong{font-size:13px}#game-root .dengtuan-guide.is-folded .dengtuan-toggle{flex-basis:auto}#game-root #world-atlas-modal .dengtuan-guide,#game-root #codex-modal .dengtuan-guide{margin:8px 12px}}

.town-new-streets{padding:14px 18px;margin:0 0 18px;background:#e4ead8;color:#31584e;border-radius:6px 22px 6px 6px;border-bottom:2px solid #a8b797}
.town-new-streets{grid-column:1/-1}.town-new-streets h3{color:#31584e!important;text-shadow:none!important}
#game-root .town-directory #directory-list .town-new-streets nav button{min-height:38px;box-shadow:none;font-size:13px}
#game-root .town-directory #directory-list .town-new-friends button{min-height:76px;box-shadow:none;border:0}
#game-root .town-directory #directory-list .town-new-friends small{color:#6a8068}
.town-new-streets h3{margin:0 0 6px;font-size:20px}.town-new-streets p{margin:0 0 12px;color:#647c65}.town-new-streets nav{display:flex;flex-wrap:wrap;gap:6px}
.town-new-streets nav button{width:auto!important;display:inline-block!important;padding:8px 12px!important;background:#f7f2de!important;color:#3e6255!important;border:1px solid #a8b797!important;border-radius:4px!important}
.town-new-streets nav button[aria-current]{background:#497b68!important;color:#fff2d2!important}.town-new-friends{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.town-new-friends button{min-width:0;display:flex!important;align-items:center;gap:8px;padding:8px!important;background:#f6f1df!important;color:#31584e!important;border-radius:4px!important}.town-new-friends img{width:48px!important;height:58px!important;object-fit:contain;image-rendering:pixelated}.town-new-friends small{display:block;color:#70836a}.town-new-friends span{min-width:0}
#town-time-button{background:#ebd8a1;color:#314f4c;border:1px solid #aa9a6c;white-space:nowrap}#town-time-button[hidden]{display:none!important}
@media(max-width:600px){.town-new-friends{grid-template-columns:1fr}.town-new-streets{padding:10px}.town-new-streets nav button{padding:7px!important}}