/* Broadcast composition: an invariant 540 x 1080 logical frame (9:18). */
:root{--gold:#f4cf83;--gold-dim:#b68b48;--text:#fff0ce;--muted:#c1ae8c;--jade:#a9e4d0;--line:#d4a45355;--serif:'STKaiti','KaiTi','SimSun',serif}
html,body{width:100%;height:100%;overflow:hidden;background:#070709}body{background:radial-gradient(ellipse at center,#282016,#070709 65%)}
.app-shell{position:absolute;width:540px;height:1080px;min-height:0;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--game-scale,1));transform-origin:center;display:block;overflow:hidden;background:#111018;box-shadow:0 0 100px #000}
.app-shell:after{content:'';position:absolute;inset:8px;border:1px solid #dcaf6360;outline:1px solid #201606;outline-offset:3px;pointer-events:none;z-index:12;clip-path:polygon(0 0,24% 0,24% 1%,76% 1%,76% 0,100% 0,100% 100%,0 100%)}
main{position:static;margin:0;padding:0;width:100%;height:100%;max-width:none}
header{position:absolute;top:20px;left:26px;right:26px;height:52px;margin:0;z-index:8;align-items:flex-start;text-shadow:0 2px 5px #000}
header:before{content:'';background:url('art/v8/logo.png') center/contain no-repeat;position:absolute;left:-10px;top:-5px;width:205px;height:68px;filter:drop-shadow(0 2px 2px #160c0490)}
header h1{display:none}header .eyebrow{position:absolute;top:40px;font-size:8px;color:#ead5ac;letter-spacing:1px;max-width:310px;white-space:nowrap;overflow:hidden}.header-right{margin-left:auto;gap:6px;max-width:150px;padding-top:5px}.header-right strong{font-size:10px;max-width:125px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.header-right small{font-size:8px;color:#d6c9b4}.anchor-avatar{display:none}.connection-dot{width:5px;height:5px}.connection-dot.on{background:#a2f1ca;box-shadow:0 0 10px #84ffb5}
.panel{position:absolute;inset:0;display:none}.panel.active{display:block}#battlePanel{background:none}.battle-layout,.main-column,.battle-sidebar{display:contents}
.scene-wrap{position:absolute;inset:0;height:1080px;width:540px;border:0;border-radius:0;background:#231a1a;overflow:hidden}.scene-grain{background:linear-gradient(180deg,#080509bd 0%,#100a0e55 17%,transparent 31%,transparent 68%,#0b090b88 79%,#0b080bee 95%);box-shadow:inset 0 0 80px #07040688}
.scene-top{top:99px;left:30px;right:30px;display:flex}.chapter-pill{font-size:9px;letter-spacing:3px;background:#1d100c88;border:0;border-left:2px solid #efd08c;padding:2px 9px}.scene-top h2{font:37px var(--serif);font-weight:bold;letter-spacing:8px;margin:10px 0 5px;color:#fff0c6;text-shadow:0 2px 0 #714725,0 4px 12px #000}.scene-top p{font-size:10px;color:#e3c99f;letter-spacing:3px}.timer{padding-top:9px}.timer small{font-size:8px;color:#ddc6a0}.timer b{font:26px Georgia;letter-spacing:2px;color:#fff3cd;text-shadow:0 2px 5px #000}.timer span{font-size:8px;max-width:125px;line-height:1.5;color:#efcd88}
.boss-hud{top:207px;left:50px;right:50px;text-align:center}.boss-hud>div:first-child{justify-content:center;gap:14px;font:14px var(--serif);letter-spacing:3px;text-shadow:0 2px 6px #000}.boss-hud small{font:9px Georgia;letter-spacing:0;align-self:center}.boss-bar{height:10px;margin-top:7px;background:#19060e;border:1px solid #e0b76c;box-shadow:0 2px 5px #000,0 0 0 2px #462723,0 0 0 3px #d0a05155;border-radius:50% 8px 8px 50%}.boss-bar i{background:linear-gradient(#ffad78,#d74935 45%,#9a1531 75%,#e4654e);box-shadow:0 0 12px #f94639}.boss-hud:before,.boss-hud:after{content:'◆';position:absolute;bottom:-5px;color:#f6da9c;font-size:22px;text-shadow:0 2px 1px #3a1a0c}.boss-hud:before{left:-13px}.boss-hud:after{right:-13px}
.scene-bottom{bottom:auto;top:274px;left:54px;right:54px;justify-content:center;text-align:center;font-size:9px;line-height:1.7;color:#ede2ca;text-shadow:0 2px 4px #000}.npc-label{display:none}.impact-banner{top:43%;width:95%;white-space:normal;text-align:center;font:bold 31px var(--serif);letter-spacing:3px;text-shadow:0 0 18px #ff9b27,0 3px 2px #361507;z-index:5}
.status-strip{position:absolute;top:794px;left:26px;right:26px;height:48px;background:linear-gradient(90deg,transparent,#171313c9,transparent);border:0;padding:6px 5px;gap:15px}.status-strip>div{gap:7px}.status-icon{border:1px solid #c69a52;border-radius:50%;width:28px;height:28px;box-shadow:inset 0 0 8px #dcae4944;background:#211714;font-size:17px}.status-strip small{font-size:8px;color:#d1c5ad}.status-strip strong{font:11px Georgia;margin-top:3px;color:#fff1d1}.status-strip .bar{height:5px;width:55px;border:1px solid #8d784e}.status-strip .shield-metric{padding-left:10px}.guard-bar i{background:linear-gradient(#d0ffd3,#42b896)}.mechanic-bar i{background:linear-gradient(#fff0a1,#e29d32)}
.command-panel{position:absolute;top:389px;right:18px;display:flex;flex-direction:column;gap:13px;margin:0;padding:0;border:0;z-index:5}.command-panel>div{display:none}.command{flex:none;width:59px;height:66px;border:0;background:none;padding:0;display:flex;flex-direction:column;gap:0;text-align:center;position:relative}.command b{width:45px;height:45px;display:grid;place-items:center;border:2px solid #cda85f;border-radius:50%;background:radial-gradient(circle at 35% 25%,#775b38,#2c201e 65%,#080709);box-shadow:0 2px 4px #000,0 0 0 3px #51382c,0 0 0 4px #c0944b66,inset 0 0 8px #f1c25b44;font-size:24px;color:#ffe7aa}.command span{font:11px var(--serif);color:#f8e8c4;margin-top:7px;text-shadow:0 2px 4px #000}.command small,.command kbd{display:none}.command:disabled{opacity:.55;filter:saturate(.35)}
.team-heading{position:absolute;left:30px;right:30px;top:850px;margin:0;height:14px}.team-heading h3{font:11px var(--serif);letter-spacing:2px;color:#f1d39d}.team-heading h3 span{font:10px Georgia;margin-left:4px}.team-heading>span{font-size:8px;color:#ddd0b5}.team-cards{position:absolute;left:28px;right:28px;top:872px;display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.team-card{background:linear-gradient(180deg,#3c2b2399,#16111499);border:1px solid #b78f4b55;padding:6px 3px;min-height:41px;border-radius:0;display:block;text-align:center}.team-card .role-token{display:none}.team-card strong{font-size:9px;max-width:85px}.team-card small{font-size:7px;margin-top:3px;color:#d2b77e}.team-card.empty{opacity:.6}
.journey-card{position:absolute;left:24px;top:319px;background:none;padding:0;border:0;width:61px;text-align:center}.journey-card .section-top,.journey-card .progress-bar,.journey-card p,.journey-total>span{display:none}.journey-total{margin:0;display:block}.journey-total b{display:none}.journey-card #chooseStage{font:12px var(--serif);letter-spacing:3px;writing-mode:vertical-rl;width:40px;height:88px;text-align:center;background:linear-gradient(90deg,#322319e8,#5c412bde,#2b1c19df);border:1px solid #c39a55;box-shadow:0 3px 10px #0008;padding:8px 11px;color:#ffe6af;clip-path:polygon(10% 0,90% 0,100% 8%,100% 92%,90% 100%,10% 100%,0 92%,0 8%)}.journey-card #chooseStage span{display:none}
.challenge-card{display:contents}.challenge-card>.section-top{display:none}.challenge-card #mechanicDesc{position:absolute;top:745px;left:57px;right:57px;text-align:center;font:12px/1.8 var(--serif);color:#ffe7ad;margin:0;padding:6px 12px;background:linear-gradient(90deg,transparent,#21121bda 15%,#21121bda 85%,transparent);border-top:1px solid #cd9c4d77;border-bottom:1px solid #cd9c4d55;display:block;text-shadow:0 2px 3px #000}.reward-box{position:absolute;left:33px;top:951px;width:252px;border:0;background:none;padding:0;gap:8px}.reward-box>span{font-size:27px;color:#ffda83;text-shadow:0 0 8px #e4b95b}.reward-box small{font-size:8px;color:#cdbb99}.reward-box strong{font-size:10px;color:#ffe2a0;margin-top:3px;max-width:207px}.difficulty-label{position:absolute;left:35px;top:992px;margin:0;font-size:8px;gap:8px;color:#bca382}.difficulty-label select{font-size:8px;background:#201613;border-color:#b68b4855;padding:3px 5px;max-width:140px}.challenge-card #startBtn{position:absolute;right:29px;top:950px;width:188px;height:55px;font:bold 20px var(--serif);letter-spacing:4px;background:linear-gradient(#bc5634,#802515 55%,#551914);border:1px solid #f3d78b;box-shadow:inset 0 0 0 3px #7e4024,inset 0 0 0 4px #d19f51,0 3px 14px #0009;color:#ffebae;clip-path:polygon(6% 0,94% 0,100% 20%,100% 80%,94% 100%,6% 100%,0 80%,0 20%);padding:12px 10px}.challenge-card #startBtn span{display:none}#stopBtn{position:absolute;top:1006px;right:60px;font-size:8px;padding:0;color:#d3ac89}
.feed-card{position:absolute;top:419px;left:24px;width:179px;height:87px;min-height:0;padding:0;background:none;border:0;pointer-events:none}.feed-card .section-top{display:none}.feed{margin:0;max-height:84px;overflow:hidden;mask-image:linear-gradient(#000 45%,transparent)}.feed-item{font:9px/1.6 var(--sans);margin:0 0 5px;text-shadow:0 2px 3px #000;color:#ebdbba}.feed-item strong{color:#ffe7a5}.feed-item:before{content:'✦';font-size:8px}.feed .empty-small{font:9px var(--serif);color:#cbb697}
.gift-dock{position:absolute;top:923px;left:26px;right:26px;height:18px;margin:0;background:none;padding:0;border:0;gap:6px}.gift-dock .gift-intro{display:none}.gift-dock>div{min-width:0;justify-content:center;gap:4px;flex:1}.gift-dock b{font-size:15px;color:#f7cb78;text-shadow:0 0 6px #cc8337}.gift-dock span{font-size:8px;color:#eed7a9}.gift-dock small{display:none}
.rail{position:absolute;top:auto;bottom:14px;left:25px;right:25px;width:auto;height:44px;padding:0;border:0;background:none;z-index:10;display:block}.rail>.seal,.rail-title,.rail-sub,.rail-bottom{display:none}.rail nav{display:flex;justify-content:space-around;gap:10px;height:44px;border-top:1px solid #ba8c4566;padding-top:8px}.rail .nav{flex:1;width:auto;margin:0;padding:0;display:flex;justify-content:center;gap:5px;font:11px var(--serif);color:#c8ae83;background:none;border-radius:0;white-space:nowrap;letter-spacing:1px}.rail .nav span{display:inline;font-size:15px;color:#d6ac62}.rail .nav.active{color:#ffe8b2;box-shadow:none;text-shadow:0 0 10px #e9b058}.rail .nav.active:after{content:'';position:absolute;bottom:0;width:30px;height:1px;background:#ebc779;box-shadow:0 0 8px #ffc96c}
.portrait-settings{position:absolute;right:25px;top:65px;width:24px;height:24px;z-index:10;border:1px solid #c49a4f88;border-radius:50%;background:#1a1212bb;color:#edce95;font:14px var(--serif);padding:0}
.panel:not(#battlePanel){top:88px;bottom:78px;left:18px;right:18px;padding:22px 17px;overflow:auto;background:linear-gradient(145deg,#281c19ed,#120d16f5),url('art/lingshan.png') center/cover;border:1px solid #c99d55;box-shadow:inset 0 0 0 4px #67482f44,0 8px 40px #000b;z-index:7;scrollbar-width:thin}
.page-intro{margin:0 0 20px;gap:10px;align-items:flex-start}.page-intro .eyebrow{font-size:8px;letter-spacing:2px}.page-intro h2{font:22px/1.4 var(--serif);margin-top:9px;letter-spacing:2px;max-width:315px}.page-intro select{max-width:120px;font-size:9px}.chapter-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:15px 0}.chapter-tabs button{padding:10px 3px;background:#432d2088;border-color:#b78e4844;font:10px var(--serif);color:#dfc397;min-width:0}.chapter-tabs button.active{background:#91563266;border-color:#e2bb72;color:#ffebbd}.stage-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stage-card{min-height:167px;padding:14px;background:linear-gradient(140deg,#80573144,#281a2199);border:1px solid #ba8f4f55;clip-path:polygon(0 0,92% 0,100% 8%,100% 100%,0 100%)}.stage-card h3{font-size:23px;margin:10px 0}.stage-card p{font-size:9px;color:#d1bfa3}.stage-card .stage-num,.stage-card small{font-size:8px}.stage-card:before{font-size:85px;color:#dabc8010}.role-grid{grid-template-columns:repeat(2,1fr);gap:12px}.role-card{padding:14px 12px;background:linear-gradient(150deg,#64452a55,#21131d);border-color:#cda55b55}.role-portrait{height:160px;font-size:0;background-image:url('art/pilgrims.png');background-size:500% auto;background-repeat:no-repeat;background-position:0% center;mask-image:linear-gradient(transparent,#000 15%,#000 90%,transparent)}.role-card:nth-child(2) .role-portrait{background-position:25% center}.role-card:nth-child(3) .role-portrait{background-position:50% center}.role-card:nth-child(4) .role-portrait{background-position:75% center}.role-card:nth-child(5) .role-portrait{background-position:100% center}.role-portrait:before{display:none}.role-card h3{font-size:24px}.role-card>p{margin:8px 0;font-size:8px;height:auto}.role-spec{font-size:8px;margin-top:9px;padding-top:9px;gap:5px}.role-card .secondary{font-size:9px;padding:8px}.inventory-header{gap:10px;padding:12px;background:#5a352333;border-color:#b58b4544}.inventory-header>div{font-size:8px}.inventory-header b{font:15px Georgia;margin-top:8px}.upgrade-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}.upgrade-actions button{width:100%;min-width:0}.primary{background:linear-gradient(#b56e39,#703b26);color:#ffe8b5;border:1px solid #ddb26a;border-radius:0;font-family:var(--serif)}.secondary{background:#6a3c2722;border-color:#b5894f66;color:#eed3a2;border-radius:0}.podium{gap:8px;margin:20px 0}.podium-card{padding:15px 5px;min-height:135px;background:radial-gradient(ellipse at top,#b97d3d55,transparent),#24151b;border-color:#c4994e77}.podium-card b{font-size:25px}.podium-card h3{font-size:14px;margin:12px 0;word-break:break-all}.podium-card span{font-size:8px}.card{background:#24191bb0;border-color:#b38d4f44}.ranking-table th,.ranking-table td{font-size:10px;padding:12px 6px}.segmented button{padding:8px 13px;font-size:10px;background:#30201d}.info-note{font-size:9px;color:#bda788;line-height:1.9}.empty-state{padding:65px 20px;background:radial-gradient(ellipse,#9b62242a,transparent)}
.gate{background:linear-gradient(#110b13b8,#130c14ec),url('art/lingshan.png') center/cover;backdrop-filter:blur(3px)}.gate-card{background:linear-gradient(145deg,#4a2f24e8,#140d18f5);border-color:#cba55e;max-width:410px;padding:35px 28px;box-shadow:0 0 0 5px #28150f88,0 20px 80px #000b}.gate-card h2{font-size:27px;color:#ffe1a1}.gate-card .eyebrow{font-size:8px}.gate-card .seal{color:#f6d08b}.gate-card p{font-size:11px;color:#e6d5b8}.connection-steps{font-size:9px;gap:12px}.gate-card .primary{font-size:16px;padding:14px}
dialog{background:linear-gradient(145deg,#503627,#1b111b);border:1px solid #f0c981;max-width:min(440px,90vw);padding:28px;box-shadow:0 0 0 4px #472b20,0 20px 90px #000c;border-radius:0}dialog h2{font-size:25px;color:#ffe3aa}dialog p{color:#dcc7a5;font-size:11px}dialog::backdrop{background:#120b16bb}#toast{background:#412a20;border-color:#ddb36a;color:#ffeac0;max-width:85%;font-size:11px}
.feed-card{display:block}.team-heading>span{font-size:9px}.team-card strong{font-size:10px}
.role-portrait{width:85.333px;height:160px;margin:0 auto;background-size:500% 100%;mask-image:none}
