/* style.css */ :root{color-scheme:dark;font-family:system-ui,-apple-system,"Segoe UI","Noto Sans KR",sans-serif;color:#f3efd8;--gold:#e9c877;--ink:#102329;--blue:#7cced8;--red:#ec8974;--safe:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}body{margin:0;background:#182d31;overflow:hidden;touch-action:manipulation;-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit;border:0;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #fcdf85;outline-offset:3px}button:active{transform:translateY(2px)}button:disabled{cursor:default;opacity:.5;transform:none}.hidden{display:none!important}#battle{position:fixed;inset:0;width:100%;height:100%;image-rendering:pixelated}#hud{position:fixed;top:max(12px,env(safe-area-inset-top));left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));display:grid;grid-template-columns:1fr 150px 1fr;align-items:start;gap:26px;pointer-events:none}.team{display:flex;gap:12px;align-items:center;max-width:380px;padding:9px 13px;background:linear-gradient(90deg,#112a30f2,#172e329c);border:1px solid #afd4c236;border-radius:4px;box-shadow:0 4px 0 #0f202433}.team>div{flex:1}.team small{font-size:11px;letter-spacing:.04em}.team strong{font:700 18px ui-monospace,monospace}.team-mark{display:grid;place-items:center;width:29px;height:33px;background:#214959;border:1px solid #86ccd377;color:#a5dce1;font-family:Georgia,serif;font-size:20px;clip-path:polygon(0 0,100% 0,100% 80%,50% 100%,0 80%)}.enemy{justify-self:end;width:100%;text-align:right;background:linear-gradient(90deg,#32282a9c,#332123f2)}.enemy .team-mark{background:#633c3c;color:#f5b6a0;border-color:#e2936977}.health{height:5px;margin-top:6px;background:#071d27;border-radius:2px;overflow:hidden}.health i{display:block;height:100%;background:#72c3d7;transition:width .25s}.enemy .health i{background:#e38470}.clock{text-align:center;background:#112930f0;border:1px solid #c7d2ad40;border-radius:0 0 14px 14px;padding:6px 12px 9px;box-shadow:0 4px 0 #071f2633}.clock small{display:block;font-size:9px;letter-spacing:.11em;color:#adc6bd}.clock b{display:block;font-size:26px;line-height:1.12;font-variant-numeric:tabular-nums;letter-spacing:.03em}.clock span{font-size:10px;color:var(--gold)}#cornerControls{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(15px,var(--safe));display:flex;gap:7px;z-index:9}.small-icon{position:relative;display:grid;place-items:center;width:39px;height:39px;background:#132c32de;border:1px solid #a9c7b947;border-radius:9px;font-size:22px;box-shadow:0 3px 0 #10202655}.small-icon svg{width:21px;height:21px}.small-icon span{font-size:10px;display:block}.small-icon #soundDot{position:absolute;right:5px;top:2px;font-size:12px;color:#fda48c}#controls{position:fixed;inset:0;pointer-events:none}#controls button{pointer-events:auto}.skill-controls{position:absolute;left:max(20px,env(safe-area-inset-left));bottom:max(30px,var(--safe));display:flex;gap:14px}.round{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;box-shadow:0 5px 0 #102128a6,0 0 0 4px #152a32a3,0 12px 24px #09232d65}.skill{height:68px;width:68px;background:radial-gradient(circle at 38% 30%,#426572,#142d3c 75%);border:2px solid #9cbcaf}.skill svg{width:40px;height:40px}.button-name{position:absolute;bottom:-18px;font-size:11px;font-weight:700;text-shadow:0 2px 2px #000}.cooldown{position:absolute;inset:0;display:grid;place-items:center;background:#10232fbd;border-radius:50%;font-size:23px;backdrop-filter:grayscale(.7)}.summon{position:absolute;right:max(29px,env(safe-area-inset-right));bottom:max(72px,var(--safe));width:99px;height:99px;border:3px solid #f5d995;background:radial-gradient(circle at 34% 25%,#e3b765,#926230 73%);box-shadow:0 5px 0 #694a2e,0 0 0 5px #1327319c,0 0 26px #e9b75a4d}.summon canvas{width:76px;height:67px;position:absolute;top:-4px;image-rendering:pixelated;pointer-events:none}.summon .plus{position:absolute;top:19px;right:13px;font-size:23px;color:#fff9d7;text-shadow:0 2px 2px #775531}.summon strong{position:absolute;bottom:19px;font-size:17px;text-shadow:0 2px 2px #47361f}.tickets{position:absolute;bottom:-17px;background:#142c33;border:1px solid #edce87;border-radius:10px;padding:2px 12px;font-size:13px;min-width:58px}.tickets small{font-size:9px;color:#c8cdb2}.recharge{position:absolute;bottom:-24px;width:62px;height:3px;background:#091e27}.recharge i{display:block;height:100%;background:#edc86c}.roster-button{position:absolute;right:max(24px,env(safe-area-inset-right));top:92px;height:48px;width:46px;gap:0;padding:5px}.menu-button{position:absolute;left:max(20px,env(safe-area-inset-left));top:92px;font-size:17px}.combo-badge{position:absolute;right:30px;bottom:196px;background:#183f45;border:1px solid #ecc36e;color:#fae7b2;border-radius:20px;padding:7px 12px;font-size:11px;box-shadow:0 2px 5px #10242e55}.combo-badge b{color:white}.combo{position:fixed;top:100px;left:50%;transform:translateX(-50%);width:365px;background:#142b31f5;border:1px solid #d8bd7c99;border-radius:9px;box-shadow:0 5px 0 #091e2740,0 10px 35px #061e274d;z-index:5;padding:8px 10px 5px}.combo header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px;font-size:11px;color:#e8d4a0}.combo-tools{display:flex;align-items:center}.combo-tools button{background:transparent;min-height:32px;min-width:32px;font-size:11px;color:#aec5ba}.choices{display:flex;gap:8px}.choice{flex:1;min-width:0;position:relative;border-radius:5px;padding:5px 7px 7px;background:linear-gradient(140deg,#27464d,#142e37);border:1px solid #83b9b582;display:grid;grid-template-columns:70px 1fr;align-items:center;text-align:left;min-height:84px}.choice:hover{border-color:var(--gold);background:linear-gradient(140deg,#36595b,#1e3940)}.choice img{width:70px;height:70px;image-rendering:pixelated;object-fit:contain;grid-row:1/4}.choice strong{font-size:12px;line-height:1.35}.choice small{font-size:9px;color:#b9c8b3}.choice .tier{font-size:8px;letter-spacing:.06em;color:var(--gold)}.combo-foot{display:block;text-align:center;color:#95b0a4;font-size:9px;margin-top:6px}.drawer{position:fixed;top:78px;bottom:18px;right:max(15px,env(safe-area-inset-right));width:min(390px,calc(100vw - 32px));background:#10292ff5;z-index:15;border:1px solid #829e8766;border-radius:12px;box-shadow:0 12px 50px #06151e85;display:flex;flex-direction:column}.drawer header,.net-card header{display:flex;align-items:center;justify-content:space-between;padding:17px 20px}.drawer header small,.net-card header small{font-size:9px;letter-spacing:.15em;color:#bac79e}.drawer h2,.net-card h2{margin:5px 0 0;font-size:21px}.close{width:40px;height:40px;background:#294148;border-radius:8px;font-size:25px}.drawer nav{display:flex;padding:0 12px;border-bottom:1px solid #7d9e8533}.drawer nav button{flex:1;padding:11px 3px;background:transparent;font-size:12px;color:#9aafa7}.drawer nav .active{color:var(--gold);border-bottom:2px solid var(--gold)}.drawer-content{overflow-y:auto;overscroll-behavior:contain;padding:12px;touch-action:pan-y}.role-title{font-size:11px;color:#abbba4;margin:13px 0 6px;display:flex;justify-content:space-between}.unit-row{display:flex;align-items:center;gap:9px;background:#203a3f80;border:1px solid #9ab8941f;border-radius:7px;padding:3px 9px;margin-bottom:5px}.unit-row img{width:50px;height:48px;object-fit:contain;image-rendering:pixelated}.unit-row>div{flex:1}.unit-row strong{font-size:12px}.unit-row small{display:block;font-size:10px;color:#a9bdae;margin-top:4px}.unit-row b{font-size:16px;color:#efce86}.recipe-row{padding:10px 8px;margin:5px 0;background:#26404580;border-radius:6px;font-size:11px;line-height:1.8}.recipe-row small{display:block;color:#b5c3ac}.recipe-row.ready{border-left:2px solid #e5c470}.toast{position:fixed;left:50%;bottom:max(25px,var(--safe));transform:translateX(-50%);background:#102831e8;border:1px solid #c2c39866;border-radius:20px;padding:9px 18px;font-size:12px;max-width:65vw;text-align:center;pointer-events:none;z-index:25}.wave-banner{position:fixed;left:50%;top:44%;transform:translate(-50%,-50%);font-size:19px;letter-spacing:.1em;color:#ffe3a7;background:linear-gradient(90deg,transparent,#102e3ad9 15%,#102e3ad9 85%,transparent);padding:13px 55px;text-shadow:0 2px 0 #163c40;pointer-events:none;white-space:nowrap;z-index:2}.veil{position:fixed;inset:0;background:#061c2770;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:20;padding:14px;overflow:auto}.home-card{width:410px;max-width:90vw;padding:26px 32px 17px;background:linear-gradient(155deg,#17343af5,#0d222beF);border:1px solid #d4bd8170;border-radius:12px;box-shadow:0 24px 100px #061c2999;text-align:center}.eyebrow{font-size:9px;letter-spacing:.18em;color:#adbea7}.eyebrow span{padding:0 8px;color:#d9b966}.mini-crest{color:#efd390;font-size:26px;margin:18px 0 5px}.home-card h1{font-size:53px;letter-spacing:-.06em;margin:0;font-weight:850;color:#f2e6bd;text-shadow:0 4px 0 #091f28}.subtitle{color:#e4c98c;font-size:15px;margin:8px 0 18px}.intro{font-size:12px;line-height:1.9;color:#a9c0b3;margin:0 0 22px}.home-actions{display:grid;gap:9px}.primary,.secondary{min-height:45px;padding:11px 17px;border-radius:6px;font-weight:700;font-size:14px;width:100%}.primary{background:linear-gradient(135deg,#edcc87,#cda569);color:#182e31;border:1px solid #ffe6a7;box-shadow:0 3px 0 #877049}.primary span{float:right}.secondary{background:#213e46;border:1px solid #adc0a953;color:#d5dfc9}.secondary small{font-size:9px;color:#adbfa7;margin-left:9px}.home-footer{border-top:1px solid #a4b99326;margin-top:21px;padding-top:13px;font-size:9px;color:#8ba697;text-align:left}.home-footer span{float:right}.text-button{background:transparent;color:#dfcd9d;font-size:11px;padding:12px 8px 0}.net-card{width:480px;max-width:94vw;background:#132d35;border:1px solid #adbd9066;border-radius:12px;padding:0 20px 17px;max-height:94vh;overflow:auto;touch-action:pan-y}.net-card header{padding:17px 0 8px}.net-card p{font-size:12px;line-height:1.7;color:#bbcebc}.net-actions{display:flex;gap:10px;margin-bottom:15px}.net-actions button{font-size:12px}.net-card label{display:block;font-size:11px;color:#d3c795;margin:10px 0 5px}.net-card textarea{font:11px monospace;width:100%;min-height:61px;height:61px;resize:vertical;border:1px solid #6c91817a;border-radius:5px;background:#09202b;color:#dfdec0;padding:8px;user-select:text;touch-action:pan-y}.net-card .secondary{min-height:36px;font-size:12px;margin-top:5px}.net-card .net-status{color:#f1d69a;background:#243e40;border-radius:5px;padding:8px}.net-note{font-size:10px;color:#a0b4a5;line-height:1.7;display:block}.result-card,.pause-card{width:360px;max-width:90vw;background:#122d35f5;border:1px solid #c8b97b99;border-radius:12px;padding:27px;text-align:center;box-shadow:0 20px 60px #081b2588}.result-card>small{font-size:10px;letter-spacing:.15em;color:#b6c3a6}.result-card h1{font-size:54px;margin:13px 0 4px;color:#edd598}.result-card p,.pause-card p{font-size:12px;color:#aebfaf;line-height:1.7}.result-stats{display:flex;gap:8px;margin:21px 0}.result-stats div{flex:1;background:#264247;border-radius:6px;padding:10px 5px}.result-stats b{display:block;font-size:22px}.result-stats small{font-size:10px;color:#b2c6b6}.result-card .secondary,.pause-card .secondary{margin-top:10px}#rotate{display:none;position:fixed;inset:0;z-index:100;background:#112b32;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:30px}#rotate h2{font-size:24px;margin-top:27px}#rotate p{font-size:13px;color:#adbea9;line-height:1.8}#rotate button{max-width:250px;margin-top:15px}.rotate-phone{width:100px;height:58px;border:3px solid #e2c77f;border-radius:10px;transform:rotate(-12deg);box-shadow:inset 0 0 0 6px #203f47;position:relative}.rotate-phone:after{content:'↻';position:absolute;right:-36px;top:-17px;color:#9bd4d3;font-size:35px} @media(max-height:500px) and (orientation:landscape){#hud{top:8px;left:12px;right:12px;grid-template-columns:1fr 108px 1fr;gap:18px}.team{padding:6px 10px;gap:7px;max-width:280px}.team strong{font-size:14px}.team small{font-size:9px}.team-mark{height:27px;width:22px;font-size:16px}.clock{padding:4px 6px 6px}.clock b{font-size:21px}.clock span{font-size:9px}.clock small{font-size:8px}.combo{top:65px;width:330px;padding:4px 8px}.combo header{margin:0;font-size:10px}.choice{min-height:71px;grid-template-columns:56px 1fr;padding:3px 5px}.choice img{width:56px;height:58px}.choice strong{font-size:11px}.choice small{font-size:8px}.combo-foot{font-size:8px;margin-top:4px}.summon{width:76px;height:76px;right:23px;bottom:53px}.summon canvas{width:64px;height:57px;top:-6px}.summon strong{font-size:14px;bottom:14px}.summon .plus{right:8px;top:13px}.skill{width:57px;height:57px}.skill svg{width:35px;height:35px}.skill-controls{left:20px;bottom:29px;gap:13px}.roster-button{top:64px;width:39px;height:44px;right:15px}.menu-button{top:65px;left:14px;width:34px;height:34px}#cornerControls{right:20px;bottom:8px;gap:5px}#cornerControls button{width:29px;height:29px;font-size:18px}.combo-badge{bottom:153px;right:18px;padding:5px 9px;font-size:10px;min-height:33px}.home-card{padding:15px 29px 12px;width:360px}.mini-crest{margin:7px 0 0;font-size:20px}.home-card h1{font-size:40px}.subtitle{font-size:12px;margin:3px 0 9px}.intro{font-size:10px;margin:0 0 12px}.primary,.secondary{min-height:38px;padding:9px 14px;font-size:12px}.home-actions{gap:7px}.home-footer{margin-top:11px;padding-top:9px;font-size:8px}.drawer{top:61px;bottom:8px;width:350px}.drawer header{padding:8px 12px}.drawer h2{font-size:16px}.drawer nav button{padding:8px}.drawer-content{padding:8px 11px}.result-card{padding:18px 27px}.result-card h1{font-size:42px}.result-stats{margin:15px 0}.wave-banner{font-size:15px;padding:9px 35px}.toast{font-size:10px;padding:7px 14px;bottom:11px}.net-card{max-height:96vh}.net-card header{padding:11px 0 3px}.net-card h2{font-size:17px}.net-card p{margin:7px 0;font-size:10px}.net-card textarea{height:43px;min-height:43px}.net-actions{margin-bottom:5px}} @media(orientation:portrait){#rotate{display:flex}} @media(prefers-reduced-motion:reduce){.health i{transition:none}.veil{backdrop-filter:none}} /* v020.css */ /* v0.2: full-field controls remain unchanged; management is opt-in. */ #bomb .charges{position:absolute;top:-6px;right:-10px;padding:3px 7px;border-radius:9px;background:#162b34;border:1px solid #dfb779;font-size:12px;color:#ffe6b0}#bomb.aiming{border-color:#ffe3a1;box-shadow:0 0 0 4px #e5ba6480,0 0 25px #e2a449}#aimHint{position:fixed;top:23%;left:50%;transform:translateX(-50%);padding:10px 18px;border:1px solid #dfb879;background:#122934ef;border-radius:8px;text-align:center;pointer-events:none;font-size:12px;z-index:12;white-space:nowrap}#aimHint small{display:block;font-size:10px;color:#d6b478;margin-top:3px}.faction-home{width:min(690px,94vw);display:grid;grid-template-columns:1fr 1.1fr;column-gap:26px;text-align:left;padding:23px 28px}.faction-home .eyebrow{grid-column:1/-1}.faction-home .mini-crest{display:none}.faction-home h1{grid-column:1;font-size:48px;margin-top:13px}.faction-home .subtitle{grid-column:1;margin:0}.faction-home .intro{grid-column:1;font-size:12px;line-height:1.8;margin:12px 0}.faction-home .home-actions{grid-column:1}.faction-home .home-footer{grid-column:1/-1}.faction-home #resume{grid-column:1}.faction-lobby{grid-column:2;grid-row:2/7;display:flex;flex-direction:column;justify-content:center;gap:8px}.race-tabs{display:flex;gap:5px}.race-tab{flex:1;padding:10px 8px;background:#213d45;border:1px solid #6b8a7a77;border-radius:6px;font-size:12px}.race-tab.active{border-color:#e7cb8d;background:#455245;color:#ffedbc}.race-figures{display:flex;justify-content:center;height:89px;background:radial-gradient(ellipse at 50% 90%,#a8c49522,transparent 70%)}.race-figures img{width:83px;height:82px;object-fit:contain;image-rendering:pixelated}.race-description{margin:0;font-size:11px;line-height:1.75;min-height:38px;color:#c1d2b4}.wallet{font-size:15px;font-weight:700;color:#f0d38e}.lobby-tools{display:grid;grid-template-columns:1fr 1fr;gap:6px}.lobby-tools button{font-size:11px;padding:10px 7px}.codex-overlay{position:fixed;inset:0;z-index:45;padding:max(12px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));background:#071c25cc;backdrop-filter:blur(5px);display:flex}.codex-shell{width:100%;max-width:1400px;margin:auto;height:100%;display:flex;flex-direction:column;overflow:hidden;background:#112932;border:1px solid #bda57288;border-radius:12px;box-shadow:0 20px 60px #03121b88}.codex-header{display:flex;align-items:center;gap:14px;padding:13px 18px;border-bottom:1px solid #8da89233}.codex-header>div:first-child{flex:1}.codex-header small{font-size:9px;letter-spacing:.14em;color:#a6b995}.codex-header h2{font-size:20px;margin:3px 0 0}.codex-header .close{width:40px;height:40px;flex-shrink:0}.tech-actions{display:flex;align-items:center;gap:6px}.tech-actions>button:not(.close){min-width:38px;min-height:36px;background:#29424a;border-radius:6px;font-size:12px;padding:6px 10px}.codex-filters{display:flex;gap:7px;align-items:center;padding:10px 16px;border-bottom:1px solid #8da89222;flex-wrap:wrap}.codex-filters>button{min-height:34px;padding:6px 18px;background:#1f3942;border:1px solid #6c898177;border-radius:5px;font-size:12px}.codex-filters>button.active{background:#435346;border-color:#dfc287;color:#ffe3a1}.codex-filters small{font-size:11px;color:#a0b4ad}.codex-filters select{margin-left:auto;background:#1a3540;color:#deead9;border:1px solid #8a9b8266;border-radius:5px;padding:8px}.tech-main{min-height:0;flex:1;display:grid;grid-template-columns:minmax(0,1fr) 300px}.tech-viewport{overflow:auto;touch-action:pan-x pan-y;background:radial-gradient(#98cbb115 1px,transparent 1px) 0 0/18px 18px;overscroll-behavior:contain;padding:8px}.tech-space{position:relative}.tech-board{position:relative;width:800px;height:930px;transform-origin:0 0}.tech-column{position:absolute;top:0;width:170px;height:930px;pointer-events:none}.tech-column h3{margin:8px 0;color:#d5c496;text-align:center;font-size:13px}.tech-unit{position:absolute;left:0;width:168px;height:78px;display:grid;grid-template-columns:62px 1fr;grid-template-rows:1fr 1fr;align-items:center;padding:6px;background:#203a42;border:1px solid #5d7b7377;border-radius:7px;text-align:left;pointer-events:auto;box-shadow:0 3px 0 #081f26}.tech-unit img{grid-row:1/3;width:59px;height:60px;object-fit:contain;image-rendering:pixelated}.tech-unit strong{font-size:11px;align-self:end;line-height:1.4}.tech-unit small{font-size:9px;color:#a7bbb0;line-height:1.35;align-self:start;margin-top:3px}.tech-unit em{position:absolute;top:3px;left:3px;background:#16322c;padding:2px 4px;font-size:9px;font-style:normal;color:#b3e7b7;border-radius:3px}.tech-unit.selected{background:#394e43;border:2px solid #ecd59b;box-shadow:0 0 18px #e7be4122}.tech-lines{position:absolute;width:800px;height:930px;pointer-events:none}.tech-lines path{fill:none;stroke:#799f9270;stroke-width:.8;opacity:.32}.tech-lines path.related{stroke:#e4c882;stroke-width:2.5;opacity:1}.tech-detail{overflow:auto;padding:14px;border-left:1px solid #718b7b44;background:#102630;touch-action:pan-y}.tech-hero{text-align:center}.tech-hero img{height:88px;width:94px;object-fit:contain;image-rendering:pixelated}.tech-hero h3{margin:0 0 6px;font-size:18px}.tech-hero p{font-size:11px;color:#c7d4bc;line-height:1.5;margin:3px 0 10px}.tech-detail h4{margin:17px 0 9px;font-size:13px;color:#dcc799}.tree-recipe{padding:8px;margin:0 0 9px;background:#203943;border:1px solid #52716266;border-radius:7px}.ingredient-row{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}.ingredient{display:flex;flex-direction:column;align-items:center;flex:1;min-width:55px;max-width:100px;background:#132c36;border-radius:5px;padding:4px;font-size:10px}.ingredient img{width:43px;height:40px;object-fit:contain;image-rendering:pixelated}.ingredient span{line-height:1.3}.branch-label{display:block;text-align:center;color:#f3d492;font-size:9px;margin:8px 0}.tree-recipe .primary{width:100%;margin-top:8px;font-size:11px;padding:8px}.missing{display:block;color:#c8a888;font-size:9px;line-height:1.5;margin-top:8px}.codex-note,.tech-help{font-size:11px;color:#a6bdb0;line-height:1.7}.codex-note{margin:9px 16px}.work-gold{color:#f3d394;font-size:18px;white-space:nowrap}.upgrade-grid{overflow:auto;min-height:0;flex:1;padding:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:9px;align-content:start;touch-action:pan-y}.upgrade-card{display:grid;grid-template-columns:65px 1fr;align-items:center;background:#203a42;border:1px solid #68857855;border-radius:8px;padding:9px}.upgrade-card>img{width:63px;height:65px;image-rendering:pixelated;object-fit:contain}.upgrade-card strong{font-size:12px;display:block}.upgrade-card small{display:block;font-size:10px;color:#b9c8b3;line-height:1.7}.upgrade-button{grid-column:1/-1;margin-top:7px;padding:8px;border-radius:5px;background:#62624a;color:#f9e5b5;font-size:12px}.upgrade-button:disabled{background:#243e45}.result-reward{color:#f5d394;font-size:23px;font-weight:800;margin:12px 0 4px}.result-reward-note{font-size:10px;color:#b7c6b7;margin-bottom:14px}.result-card .result-upgrade{margin:7px 0}.roster-graph-link{width:100%;padding:12px;background:#2a4548;border:1px solid #9bac7766;border-radius:6px;margin-bottom:12px;font-size:12px} @media(max-height:500px) and (orientation:landscape){.faction-home{width:min(660px,95vw);padding:14px 23px;column-gap:23px}.faction-home h1{font-size:37px;margin-top:8px}.faction-home .intro{font-size:10px;margin:8px 0}.faction-home .subtitle{font-size:12px}.faction-home .home-actions{gap:6px}.faction-home .home-actions button{padding:10px 12px;font-size:12px}.faction-home .home-footer{margin-top:9px;font-size:9px}.race-figures{height:67px}.race-figures img{width:68px;height:66px}.faction-lobby{gap:5px}.race-tab{padding:8px 5px;font-size:11px}.race-description{font-size:10px;min-height:33px}.lobby-tools button{padding:8px 4px;font-size:10px}.codex-overlay{padding:6px 10px}.codex-header{padding:7px 12px}.codex-header h2{font-size:16px}.codex-header small{font-size:8px}.codex-filters{padding:6px 10px}.codex-filters small{display:none}.codex-filters>button{min-height:30px;padding:4px 14px;font-size:11px}.tech-main{grid-template-columns:minmax(0,1fr) 245px}.tech-detail{padding:9px}.tech-hero img{width:65px;height:62px}.tech-hero h3{font-size:14px}.codex-note{font-size:9px;margin:5px 12px}.upgrade-grid{padding:8px;gap:7px;grid-template-columns:repeat(auto-fill,minmax(205px,1fr))}.upgrade-card{padding:6px}.tech-actions>button:not(.close){min-height:32px;min-width:32px;padding:4px 8px}.tech-actions{gap:4px}#aimHint{font-size:11px;padding:7px 13px;top:24%}} /* v030.css */ /* Full battlefield remains unobscured except when an explicit codex/deck icon is opened. */ .v3-lobby-tools{display:grid!important;grid-template-columns:1fr 1fr;gap:6px!important}.v3-lobby-tools button{font-size:12px!important;padding:8px!important}.v3-loadout-note{color:#b9c9b2;font-size:10px;text-align:center;margin:5px 0}.v3-shell{height:94dvh;max-height:900px;display:flex;flex-direction:column;overflow:hidden}.v3-shell .codex-header{flex-shrink:0}.v3-note{font-size:12px;line-height:1.65;color:#abc0b7;margin:8px 12px}.v3-warning{font-size:12px;color:#efb68a}.v3-presets{display:flex;gap:6px;padding:0 12px 8px;flex-wrap:wrap}.v3-presets button,.v3-tabs button,.v3-tier-filters button,.v3-zoom button{border:1px solid #48636a;background:#25414b;color:#dbe5d4;border-radius:5px;padding:7px 10px;min-height:34px;font:inherit;font-size:12px;cursor:pointer}.v3-deck-main{display:grid;grid-template-columns:minmax(0,1fr) 215px;gap:10px;flex:1;min-height:0;padding:0 12px;overflow:auto}.v3-card-pool{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;align-content:start}.v3-deck-card{position:relative;border:1px solid #355660;background:#193640;color:#dce8da;border-radius:7px;min-width:0;padding:5px;display:flex;align-items:center;flex-direction:column;cursor:pointer;font:inherit}.v3-deck-card img{width:64px;height:59px;object-fit:contain;image-rendering:pixelated}.v3-deck-card strong{font-size:12px;line-height:1.4}.v3-deck-card small{font-size:10px;color:#abc4b8;margin:3px 0}.v3-deck-card span{font-size:10px;color:#e1cca0;line-height:1.3}.v3-deck-card.selected{border:2px solid #e1c889;background:#304845;padding:4px}.v3-deck-card:disabled{opacity:1;cursor:default}.v3-card-check{position:absolute;right:5px;top:4px;color:#f1d898;font-size:13px}.v3-deck-summary h3{margin:0 0 8px;color:#e9d49e;font-size:15px}.v3-synergy{border:1px solid #35525a;border-radius:5px;padding:7px;margin-bottom:6px;opacity:.55;background:#16313a}.v3-synergy.active{opacity:1;border-color:#9f946c;background:#344842}.v3-synergy strong{display:block;color:#e7d39f;font-size:12px}.v3-synergy small{display:block;color:#c6d6c7;font-size:11px;line-height:1.5;margin-top:3px}#deckBuilder .primary{align-self:center;margin:8px;min-height:36px;padding:8px 24px}.v3-deck-affinity{align-self:center;margin-bottom:8px;padding:5px 16px!important;font-size:11px!important}.v3-racebar{gap:6px;align-items:center;flex-shrink:0}.v3-tabs{display:flex;margin-left:auto;gap:5px}.v3-tabs button.active,.v3-tier-filters button.active{border-color:#e2c681;color:#f7e4b5;background:#48544a}.v3-atlas-main{display:grid;grid-template-columns:minmax(0,1fr) 275px;min-height:0;flex:1}.v3-atlas-view{min-width:0;overflow:auto;background:#102e37}.v3-atlas-detail{min-width:0;overflow:auto;padding:12px;background:#17313a;border-left:1px solid #3b545b}.v3-atlas-detail h4{color:#e4c989;font-size:13px;margin:16px 0 8px}.v3-detail-hero{display:grid;grid-template-columns:78px 1fr;gap:3px;align-items:center}.v3-detail-hero img{grid-row:span 4;width:76px;height:72px;object-fit:contain;image-rendering:pixelated}.v3-detail-hero h3{font-size:16px;margin:0;color:#f1e4c4}.v3-detail-hero small{font-size:11px;color:#aac5bd}.v3-detail-hero p{font-size:12px;color:#e4c58b;margin:0}.v3-ability{font-size:12px;line-height:1.65;padding:6px 0;margin:0;border-bottom:1px solid #284953;color:#d0dfd0}.v3-recipe{display:grid;grid-template-columns:1fr 20px 1fr;align-items:center;gap:5px;padding:9px;margin:8px;border:1px solid #36565d;border-radius:8px;background:#193640}.v3-recipe.ready{border-color:#d1b976}.v3-materials,.v3-results{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap;min-width:0}.v3-results{padding-top:16px;position:relative}.v3-choose-label{position:absolute;left:0;top:0;right:0;text-align:center;color:#d6bf8d;font-size:10px}.v3-mini-unit{position:relative;color:#dfe7d6;background:#24414a;border:1px solid #426069;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:64px;max-width:94px;flex:1;padding:3px;cursor:pointer;font:inherit;overflow:hidden}.v3-mini-unit img{width:45px;height:43px;object-fit:contain;image-rendering:pixelated}.v3-mini-unit strong{font-size:11px;line-height:1.4;text-align:center}.v3-mini-unit small{font-size:10px;line-height:1.4;color:#b4c7b7}.v3-mini-unit em{position:absolute;left:3px;top:2px;font-size:10px;font-style:normal;background:#16343b;padding:1px 3px;border-radius:3px}.ok{color:#cfe6a8}.missing{color:#efab8e}.v3-plus,.v3-arrow{font-size:18px;color:#dfc694;text-align:center}.v3-result-choice{display:flex;flex:1;flex-direction:column;max-width:100px;min-width:62px}.v3-craft{background:#485e45;border:1px solid #b9bb7d;color:#f1ebc3;border-radius:3px;padding:4px;margin-top:4px;min-height:30px;cursor:pointer;font-size:11px}.v3-atlas-detail .v3-recipe{display:flex;flex-direction:column;margin:8px 0;padding:7px}.v3-atlas-detail .v3-arrow{transform:rotate(90deg);height:16px;line-height:16px}.v3-atlas-detail .v3-mini-unit{min-width:52px}.v3-tier-filters{display:flex;gap:6px;padding:8px;position:sticky;top:0;z-index:2;background:#14313af5}.v3-zoom{display:flex;gap:4px;margin-left:auto;margin-right:8px}.v3-graph-viewport{position:relative;touch-action:none;overflow:hidden;cursor:grab;background-image:radial-gradient(#456264 1px,transparent 1px);background-size:16px 16px}.v3-graph{position:absolute;left:0;top:0;transform-origin:0 0}.v3-graph-unit{position:absolute!important;width:170px;max-width:none;height:66px;display:grid;grid-template-columns:52px 1fr;opacity:.56;padding:4px}.v3-graph-unit img{grid-row:span 2;width:52px;height:55px}.v3-graph-unit strong{font-size:12px}.v3-graph-unit.related{opacity:1;border-color:#8ca995}.v3-graph-unit.selected{opacity:1;border:2px solid #f1d487;background:#4a5b4b}.v3-col-label{position:absolute;top:0;width:170px;text-align:center;color:#e5cf95;font-size:13px}.v3-graph-lines{position:absolute;inset:0;pointer-events:none}.v3-graph-lines path{fill:none;stroke:#83a397;opacity:.09;stroke-width:1.5}.v3-graph-lines path.related{stroke:#e1c87f;opacity:.9;stroke-width:2.5}.v3-counter{padding:12px}.v3-counter h3{color:#ecd293;font-size:15px;margin:12px 0}.v3-counter-row{display:flex;justify-content:space-between;gap:12px;padding:10px;border-bottom:1px solid #35565d;font-size:12px;line-height:1.6;color:#c5d9cb}.v3-counter-row strong{color:#ecd9ac;min-width:90px}.v3-element-ring{text-align:center;padding:16px;background:#26454d;color:#e1d49c;font-weight:700;font-size:15px;border-radius:6px}.v3-zoom.hidden{display:none} @media(max-height:480px){.faction-home .mini-crest{display:none}.faction-home h1{font-size:30px!important}.faction-home .intro{display:none}.faction-home .race-figures{display:none}.faction-home .subtitle{margin:2px 0!important}.faction-home .race-description{margin:3px 0;font-size:10px}.v3-shell .codex-header{padding:8px 12px}.v3-shell .codex-header h2{font-size:17px}.v3-shell .codex-header small{font-size:9px}.v3-card-pool{grid-template-columns:repeat(4,minmax(0,1fr))}.v3-deck-card img{height:42px;width:48px}.v3-deck-main{grid-template-columns:minmax(0,1fr) 200px}.v3-note{font-size:11px;margin:5px 10px}.v3-shell .codex-filters{padding:6px 10px}.v3-atlas-main{grid-template-columns:minmax(0,1fr) 235px}.v3-ability{font-size:11px}.v3-recipe{margin:6px;padding:7px}.v3-deck-card span{font-size:9px}.v3-tabs button,.v3-zoom button{padding:5px 8px;font-size:11px;min-height:30px}} @media(max-width:760px){.v3-atlas-main{grid-template-columns:minmax(0,1fr) 200px}.v3-mini-unit{min-width:48px}.v3-mini-unit img{width:38px;height:36px}.v3-mini-unit strong{font-size:10px}.v3-materials,.v3-results{gap:2px}.v3-plus{font-size:13px}.v3-recipe{grid-template-columns:1fr 12px 1fr}.v3-deck-main{grid-template-columns:minmax(0,1fr) 170px}.v3-deck-card strong{font-size:10px}.v3-deck-card small{font-size:9px}.v3-counter-row{flex-direction:column;gap:2px}.v3-zoom button{padding:4px 6px}.v3-tabs button{padding:5px}} @media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}} /* Keep the action row compact in landscape; the card pool scrolls independently. */ .v3-deck-actions{display:flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;padding:6px 12px}.v3-deck-actions .primary,.v3-deck-actions .secondary{margin:0!important;min-height:36px!important;width:auto!important;max-width:none!important;padding:7px 15px!important;font-size:12px!important}.v3-deck-actions .v3-deck-affinity{margin:0!important} /* v031.css */ /* v0.3.1: opt-in roster synergies; the battlefield remains full screen. */ .synergy-hud{position:absolute;right:max(82px,calc(env(safe-area-inset-right) + 62px));top:92px;width:46px;height:48px;padding:3px;gap:0}.synergy-hud b{font-size:21px;line-height:21px;color:#e9d291}.synergy-count{position:absolute;top:-4px;right:-5px;background:#284a44;border:1px solid #c0b67d;border-radius:10px;padding:1px 5px;font-size:10px;font-style:normal;color:#f5e4bc}.v31-side-tabs{display:flex;gap:5px;margin:0 12px 8px}.v31-side-tabs button{padding:6px 14px;border:1px solid #557576;border-radius:5px;background:#183640;font-size:12px;min-height:34px}.v31-side-tabs button.active{border-color:#e0c68b;background:#405347}.v31-synergy-main{display:grid;grid-template-columns:185px minmax(0,1fr);min-height:0;flex:1;overflow:hidden;border-top:1px solid #3d5a5b}.v31-trait-list{padding:10px;overflow:auto;background:#102a32;display:flex;flex-direction:column;gap:7px}.v31-trait{display:flex;flex-direction:column;align-items:flex-start;gap:3px;flex-shrink:0;text-align:left;padding:10px;border:1px solid #365860;background:#18353f;border-radius:7px;min-height:67px;color:#c5d1c6}.v31-trait strong{font-size:13px}.v31-trait span{font-size:11px}.v31-trait small{font-size:10px;color:#9cbaaf}.v31-trait.active{background:#2b473d;border-color:#83966a;color:#f3deb0}.v31-trait.selected{outline:2px solid #e0c887;outline-offset:-2px}.v31-trait-detail{padding:15px 18px;overflow:auto;background:#18333a}.v31-trait-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.v31-trait-heading h3{font-size:22px;margin:0;color:#f0dfb6}.v31-trait-heading>strong{color:#e1d3a5;font-size:13px}.v31-next{color:#b8d5bd;font-size:12px;margin:7px 0 12px}.v31-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.v31-stage{padding:9px;border:1px solid #41615f;border-radius:6px;display:flex;flex-direction:column;gap:5px;background:#18323a;font-size:11px;line-height:1.6}.v31-stage strong{font-size:15px;color:#b6c9b9}.v31-stage.current{border-color:#e9cc8b;background:#354e41;box-shadow:inset 0 0 0 1px #e9cc8b55}.v31-stage.current strong{color:#f6e5b6}.v31-stage.achieved{border-color:#799269}.v31-trait-detail .v3-note{margin:10px 0;line-height:1.65;font-size:11px}.v31-trait-detail h4{font-size:13px;color:#decea7;margin:13px 0 9px}.v31-member-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:7px}.v31-member{border:1px solid #3d5b5d;background:#15323a;border-radius:7px;padding:6px;display:flex;flex-direction:column;align-items:center;min-width:0}.v31-member img{image-rendering:pixelated;width:62px;height:58px;object-fit:contain;opacity:.4;filter:grayscale(1)}.v31-member strong{font-size:11px;color:#b3c3b4;text-align:center;line-height:1.5}.v31-member small{font-size:10px;color:#9aafa4;margin-top:3px}.v31-member.owned{border-color:#cbb880;background:#35483e}.v31-member.owned img{opacity:1;filter:none}.v31-member.owned strong{color:#f0dfb1}.v31-member.owned small{color:#cfe5ab}.v31-trait-tags{font-size:11px;line-height:1.6;color:#ead29b;padding:7px;border:1px solid #5c6950;background:#2c4239;border-radius:5px}.choice .combo-synergy{grid-column:1/-1;white-space:normal;font-size:9px;color:#f1c996;margin-top:4px;line-height:1.35}.v3-loadout-note{line-height:1.5} @media(max-height:480px){.synergy-hud{top:64px;right:max(65px,calc(env(safe-area-inset-right) + 55px));height:40px;width:40px}.synergy-hud b{font-size:17px;line-height:18px}.synergy-hud span{font-size:8px}.v31-synergy-main{grid-template-columns:145px minmax(0,1fr)}.v31-trait-list{padding:7px}.v31-trait{padding:7px;min-height:58px;gap:2px}.v31-trait strong{font-size:11px}.v31-trait-detail{padding:10px 12px}.v31-trait-heading h3{font-size:17px}.v31-trait-heading>strong{font-size:11px}.v31-stage{padding:6px;font-size:10px}.v31-next{font-size:10px;margin:5px 0 8px}.v31-member-grid{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}.v31-member img{width:51px;height:47px}.v31-member strong{font-size:10px}.v31-side-tabs{margin-bottom:6px}.v31-side-tabs button{min-height:29px;font-size:11px}} /* v032.css */ /* v0.3.2 — noninteractive edge notices keep the battlefield and skill targets usable. */ .merge-feed{position:fixed;top:max(145px,env(safe-area-inset-top));width:clamp(148px,20vw,222px);z-index:4;display:flex;flex-direction:column;gap:6px;pointer-events:none;isolation:isolate} .merge-feed.mine{left:max(14px,env(safe-area-inset-left));--feed-accent:#80d6dd;--feed-bg:#14343dee} .merge-feed.enemy{right:max(14px,env(safe-area-inset-right));--feed-accent:#e89d8d;--feed-bg:#3e272fee} .merge-notice{display:flex;align-items:center;gap:6px;min-height:57px;padding:5px 9px 5px 4px;border:1px solid color-mix(in srgb,var(--feed-accent),transparent 40%);border-left:3px solid var(--feed-accent);border-radius:7px;background:var(--feed-bg);box-shadow:0 3px 0 #071b2533;animation:merge-enter-left .18s ease-out;pointer-events:none} .draw-notice{border-color:color-mix(in srgb,#ffd478,transparent 30%);border-left:3px solid #ffd478;background:linear-gradient(135deg,var(--feed-bg),#1a3d3aee);box-shadow:0 4px 14px rgba(255,212,120,0.22),0 3px 0 #071b2533} .draw-notice small{color:#ffe59c;font-weight:600} .draw-notice strong{color:#fffdf4;text-shadow:0 0 6px rgba(255,225,140,0.45)} .merge-feed.enemy .draw-notice{border-left-width:1px;border-right:3px solid #f29a88;background:linear-gradient(135deg,var(--feed-bg),#3d252cee)} .merge-feed.enemy .merge-notice{border-left-width:1px;border-right:3px solid var(--feed-accent);flex-direction:row-reverse;text-align:right;padding:5px 4px 5px 9px;animation-name:merge-enter-right} .merge-notice img{width:46px;height:45px;flex:none;object-fit:contain;image-rendering:pixelated;pointer-events:none} .merge-notice>div{min-width:0;flex:1}.notice-meta{display:flex;align-items:center;gap:4px;white-space:nowrap}.merge-feed.enemy .notice-meta{flex-direction:row-reverse;justify-content:flex-start} .merge-notice small{display:block;font-size:9px;line-height:1.4;color:var(--feed-accent);white-space:nowrap}.merge-notice strong{display:block;font-size:12px;line-height:1.65;color:#f4e7c7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.merge-notice span:not(.tier-badge){display:block;font-size:9px;line-height:1.3;color:var(--unit-tier)} .tier-badge{display:inline-block;padding:1px 4px;font-size:8px;font-weight:700;line-height:1.1;border-radius:3px;letter-spacing:-0.2px;text-transform:uppercase;flex-shrink:0} .tier-badge.tier-1{color:#d8e5dd;background:rgba(181,200,188,0.22);border:1px solid rgba(181,200,188,0.45)} .tier-badge.tier-2{color:#9fe9ee;background:rgba(142,213,219,0.22);border:1px solid rgba(142,213,219,0.5)} .tier-badge.tier-3{color:#eeddff;background:rgba(203,183,240,0.28);border:1px solid rgba(203,183,240,0.65);box-shadow:0 0 6px rgba(203,183,240,0.45)} .tier-badge.tier-4{color:#fff4d0;background:rgba(241,206,131,0.32);border:1px solid rgba(241,206,131,0.8);box-shadow:0 0 8px rgba(241,206,131,0.6)} .merge-notice.tier-1{border-color:rgba(181,200,188,0.35);border-left-color:#b5c8bc} .merge-feed.enemy .merge-notice.tier-1{border-right-color:#b5c8bc} .merge-notice.tier-2{border-color:rgba(142,213,219,0.5);border-left-color:#8ed5db;box-shadow:0 0 10px rgba(142,213,219,0.2),0 3px 0 #071b2533} .merge-feed.enemy .merge-notice.tier-2{border-right-color:#8ed5db} .merge-notice.tier-3{border:2px solid #cbb7f0;border-left:4px solid #cbb7f0;background:linear-gradient(135deg,rgba(28,19,53,0.96),rgba(47,26,86,0.93));box-shadow:0 0 18px rgba(203,183,240,0.55),0 0 6px rgba(162,128,230,0.35),0 3px 0 #071b2544} .merge-notice.tier-3 strong{color:#fcf9ff;text-shadow:0 0 8px rgba(203,183,240,0.7)} .merge-notice.tier-3 small{color:#d6c6f6} .merge-feed.enemy .merge-notice.tier-3{border-left-width:2px;border-right:4px solid #cbb7f0;background:linear-gradient(135deg,rgba(46,20,54,0.96),rgba(64,24,72,0.93))} .merge-notice.tier-4{border:2px solid #f1ce83;border-left:4px solid #ffd770;background:linear-gradient(135deg,rgba(56,38,15,0.96),rgba(88,54,17,0.93));box-shadow:0 0 22px rgba(241,206,131,0.72),inset 0 0 10px rgba(255,235,170,0.25),0 3px 0 #071b2544;animation:merge-enter-left .18s ease-out,tier4-legendary-pulse 1.8s infinite ease-in-out} .merge-notice.tier-4 strong{color:#fffdf2;text-shadow:0 0 10px rgba(241,206,131,0.85);font-weight:700} .merge-notice.tier-4 small{color:#fbeec6;font-weight:600} .merge-feed.enemy .merge-notice.tier-4{border-left-width:2px;border-right:4px solid #ffd770;background:linear-gradient(135deg,rgba(62,31,21,0.96),rgba(92,42,23,0.93));animation:merge-enter-right .18s ease-out,tier4-legendary-pulse 1.8s infinite ease-in-out} @keyframes tier4-legendary-pulse{0%,100%{box-shadow:0 0 18px rgba(241,206,131,0.6),inset 0 0 8px rgba(255,235,170,0.2),0 3px 0 #071b2544}50%{box-shadow:0 0 26px rgba(255,220,140,0.88),inset 0 0 14px rgba(255,245,200,0.36),0 3px 0 #071b2544}} @keyframes merge-enter-left{from{opacity:0;transform:translateX(-14px) scale(0.96)}to{opacity:1;transform:none}}@keyframes merge-enter-right{from{opacity:0;transform:translateX(14px) scale(0.96)}to{opacity:1;transform:none}} @media(max-height:500px) and (orientation:landscape){.merge-feed{top:114px;width:clamp(146px,20vw,186px);gap:4px}.merge-notice{min-height:49px;padding-top:3px;padding-bottom:3px;gap:3px}.merge-notice img{width:37px;height:39px}.merge-notice strong{font-size:11px}.merge-notice small{font-size:8px}.merge-notice span{font-size:8px}.tier-badge{font-size:7px;padding:0 3px}} @media(prefers-reduced-motion:reduce){.merge-notice,.tier-4{animation:none!important}} /* mobile-v036.css */ /* Responsive overlay layout. The battlefield remains the whole screen. */ :root{--view-w:100vw;--view-h:100dvh;--safe-l:max(8px,env(safe-area-inset-left));--safe-r:max(8px,env(safe-area-inset-right));--safe-t:max(6px,env(safe-area-inset-top));--safe-b:max(6px,env(safe-area-inset-bottom))} html,body{width:100%;height:100%;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%} *,*:before,*:after{box-sizing:border-box}button,input,select{font-family:inherit}button{white-space:nowrap;touch-action:manipulation} .veil,.codex-overlay{position:fixed;inset:0;padding:var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l);height:var(--view-h);width:var(--view-w);overflow:auto;overscroll-behavior:contain;align-items:safe center} .home-card,.online-card,.result-card,.pause-card,.codex-shell{max-width:100%;max-height:calc(var(--view-h) - var(--safe-t) - var(--safe-b));margin:auto;min-height:0;overflow:auto;overscroll-behavior:contain} .home-card{width:min(510px,100%)}.home-card h1,.home-card .subtitle,.race-tab,.wallet,.home-footer,.button-name{white-space:nowrap}.race-description,.v3-loadout-note{white-space:nowrap;overflow-x:auto;scrollbar-width:thin;margin:5px 0;max-width:100%} .home-footer{font-size:10px}.home-actions{display:flex;gap:8px}.home-actions>button{flex:1;min-width:0;margin:0}.home-actions small{display:block;white-space:nowrap;font-size:10px}.v3-lobby-tools{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px!important}.v3-lobby-tools button{white-space:nowrap;min-width:0;min-height:34px;font-size:12px!important;padding:6px 8px!important} #hud{left:var(--safe-l);right:var(--safe-r);top:var(--safe-t);width:auto;gap:8px;display:grid;grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr)}#hud.hidden{display:none}.team{min-width:0;width:100%;gap:5px;padding:5px 7px}.team>div{min-width:0;flex:1}.team small{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.team>strong{white-space:nowrap;font-size:13px}.team-mark{display:none}.clock{min-width:0;width:auto;padding:4px 7px}.clock>small,.clock>span{white-space:nowrap;font-size:10px}.clock>b{font-size:23px} #cornerControls{top:auto;bottom:var(--safe-b);left:calc(50% - 45px);right:auto;display:flex;gap:6px;z-index:5}#cornerControls .small-icon{width:37px;height:34px}.menu-button{left:var(--safe-l);top:65px;bottom:auto}.roster-button{right:var(--safe-r);top:65px;width:44px;height:44px}.synergy-hud{right:calc(var(--safe-r) + 50px);top:65px;width:44px;height:44px}.synergy-hud b{font-size:18px}.skill-controls{left:var(--safe-l);bottom:var(--safe-b);gap:8px}.round.skill{width:64px;height:64px}.skill svg{width:34px;height:34px}.button-name{font-size:10px}.charges{font-size:10px}.summon{right:var(--safe-r);bottom:var(--safe-b);width:84px;height:84px}.summon canvas{width:47px;height:44px}.summon>strong{font-size:14px}.summon .tickets{font-size:12px}.summon .plus{font-size:20px}.combo-badge{right:calc(var(--safe-r) + 91px);bottom:calc(var(--safe-b) + 15px);font-size:12px;padding:8px 12px;min-height:36px} .combo{width:clamp(310px,54vw,580px);max-width:calc(var(--view-w) - 148px);left:50%;right:auto;top:65px;bottom:auto;max-height:calc(var(--view-h) - 158px);overflow:auto;transform:translateX(-50%);z-index:8;padding:7px}.combo header{display:flex;gap:6px;align-items:center;min-width:0}.combo header>span{min-width:0;flex:1;white-space:nowrap;overflow:auto;font-size:11px}.combo-tools{display:flex;flex:none;gap:4px}.combo-tools button{min-width:32px;min-height:30px;padding:4px 7px;font-size:11px}.choices{gap:6px}.choice{min-width:0;padding:5px;grid-template-columns:48px minmax(0,1fr)}.choice img{width:48px;height:47px}.choice strong,.choice .tier,.choice small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.choice strong{font-size:12px}.choice small{font-size:10px}.choice .combo-synergy{white-space:nowrap;overflow-x:auto;text-overflow:clip;font-size:9px}.combo-foot{white-space:nowrap;font-size:9px} .merge-feed{top:119px;width:clamp(115px,17vw,185px)}.merge-feed.mine{left:var(--safe-l)}.merge-feed.enemy{right:var(--safe-r)}.merge-notice{min-height:46px;padding:3px;gap:3px}.merge-notice img{width:32px;height:35px}.merge-notice strong{font-size:10px}.merge-notice small,.merge-notice span{font-size:8px} .drawer{top:var(--safe-t);right:var(--safe-r);bottom:var(--safe-b);height:auto;max-width:calc(var(--view-w) - var(--safe-l) - var(--safe-r));width:min(365px,78vw);display:flex;flex-direction:column}.drawer.hidden{display:none}.drawer header,.drawer nav{flex:none}.drawer-content{min-height:0;overflow:auto}.unit-row>div{min-width:0;flex:1}.unit-row strong,.unit-row small{white-space:nowrap;overflow:auto}.unit-row strong{font-size:12px}.unit-row small{font-size:10px}.drawer nav{overflow:auto;white-space:nowrap}.drawer nav button{min-width:56px;padding:8px 6px;font-size:11px} .codex-shell,.v3-shell{width:min(1150px,100%);height:calc(var(--view-h) - var(--safe-t) - var(--safe-b));display:flex;flex-direction:column;overflow:hidden}.codex-header{flex:none;min-width:0;gap:7px;padding:8px 10px}.codex-header h2{font-size:18px;white-space:nowrap}.codex-header small{font-size:9px;white-space:nowrap}.codex-header .close{flex:none;min-width:34px;min-height:34px}.codex-filters{flex:none;padding:6px 8px;gap:5px;min-width:0;overflow-x:auto;white-space:nowrap;flex-wrap:nowrap}.codex-filters button,.v3-tabs button{flex:none;padding:6px 9px;min-height:32px;font-size:11px}.v3-tabs{display:flex;flex:none;margin-left:auto}.v3-atlas-main{grid-template-columns:minmax(0,1fr) minmax(175px,25%);min-height:0;overflow:hidden}.v3-atlas-view,.v3-atlas-detail{min-height:0;min-width:0;overscroll-behavior:contain}.v3-atlas-detail{padding:8px}.v3-detail-hero{grid-template-columns:53px minmax(0,1fr)}.v3-detail-hero img{width:52px;height:52px}.v3-detail-hero h3{font-size:13px;white-space:nowrap;overflow-x:auto}.v3-detail-hero small,.v3-detail-hero p{font-size:10px;white-space:nowrap;overflow:auto}.v3-recipe{display:flex;flex-direction:row;flex-wrap:nowrap;gap:7px;padding:6px;margin:6px;overflow-x:auto}.v3-materials,.v3-results{flex:0 0 auto;flex-wrap:nowrap;gap:4px}.v3-mini-unit{width:70px;min-width:70px;max-width:70px;flex:none;padding:3px;min-height:69px}.v3-mini-unit img{width:40px;height:40px}.v3-mini-unit strong{font-size:10px;line-height:1.5;white-space:nowrap;max-width:100%;overflow:auto;text-align:left}.v3-mini-unit small{font-size:9px;white-space:nowrap}.v3-arrow{flex:none}.v3-result-choice{flex:none;min-width:70px;width:70px}.v3-atlas-detail .v3-recipe{flex-direction:column;overflow:visible}.v3-atlas-detail .v3-materials,.v3-atlas-detail .v3-results{max-width:100%;overflow-x:auto}.v3-atlas-detail .v3-mini-unit{min-width:65px;width:65px}.v3-ability{font-size:11px;line-height:1.65;word-break:keep-all;overflow-wrap:anywhere}.v3-note{font-size:11px;word-break:keep-all;overflow-wrap:anywhere}.v3-tier-filters{white-space:nowrap;overflow:auto;flex-wrap:nowrap}.v3-zoom{gap:3px}.v3-zoom button{min-height:30px;font-size:10px;padding:4px 6px}.v3-graph-unit{width:170px;max-width:none}.v31-synergy-main{grid-template-columns:130px minmax(0,1fr);min-height:0}.v31-trait-list{padding:6px}.v31-trait{min-height:53px;padding:6px}.v31-trait strong{font-size:11px;white-space:nowrap}.v31-trait-detail{padding:8px;min-width:0}.v31-stages{gap:4px}.v31-stage{padding:5px;font-size:10px}.v31-member-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}.v31-member strong{white-space:nowrap;max-width:100%;overflow:auto;font-size:10px} .upgrade-grid{grid-template-columns:repeat(auto-fit,minmax(225px,1fr));min-height:0;overflow:auto;padding:8px}.upgrade-card{min-width:0;padding:7px;gap:5px;grid-template-columns:44px minmax(0,1fr)}.upgrade-card img{width:44px;height:46px}.upgrade-card strong,.upgrade-card small{white-space:nowrap;overflow:auto;max-width:100%;font-size:11px}.upgrade-button{white-space:nowrap;min-height:32px;font-size:11px}.codex-note{font-size:10px;flex:none;padding:5px 8px;word-break:keep-all}.result-card h1{font-size:38px;margin:5px}.result-card button{min-height:36px;padding:7px}.result-stats{margin:9px 0}.online-card{width:min(730px,100%);padding:12px}.online-card header h2{font-size:20px}.online-card button{white-space:nowrap;min-height:36px;padding:7px 10px}.online-bar{display:flex;flex-wrap:nowrap;gap:7px;min-width:0}.online-bar input{min-width:0;flex:1}.online-title-row{flex-wrap:nowrap;gap:6px}.online-title-row h3{font-size:14px;white-space:nowrap;overflow:auto}.online-title-row>div{min-width:0}.online-title-row button{font-size:11px}.online-member strong,.online-member small,.online-member span{white-space:nowrap;overflow:auto}.online-members{gap:7px}.online-member{min-width:0;min-height:65px;padding:8px}.online-actions{flex-wrap:nowrap;gap:6px}.online-actions button{min-width:0;flex:1}.online-note,.online-warning{word-break:keep-all;overflow-wrap:anywhere;font-size:11px}.online-rooms{max-height:34dvh}.online-status{font-size:11px;line-height:1.5;min-height:29px;padding:6px 8px}.online-room-row>div{min-width:0}.online-room-row strong{white-space:nowrap;display:block;overflow:auto}.online-room-row button{flex:none} #netStatus{position:fixed;left:50%;bottom:calc(var(--safe-b) + 39px);transform:translateX(-50%);max-width:calc(var(--view-w) - 230px);padding:4px 8px;border-radius:5px;background:#17333cdb;color:#edd39b;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;z-index:6}#netStatus.hidden{display:none} @media(orientation:landscape) and (max-height:430px){.home-card{padding:10px 14px;width:min(590px,100%)}.mini-crest,.home-card .intro,.race-figures{display:none!important}.home-card h1{font-size:27px;margin:4px!important;line-height:1.1}.eyebrow{font-size:9px}.home-card .subtitle{font-size:12px;margin:3px 0!important}.race-tabs{gap:6px;margin:5px 0}.race-tab{padding:6px 9px;min-height:32px}.race-description{font-size:10px}.wallet{margin:4px 0;font-size:11px}.faction-lobby{margin:5px 0}.v3-loadout-note{font-size:9px;margin:3px 0}.home-actions button{min-height:37px;padding:7px 10px}.home-footer{margin-top:7px;padding-top:5px}.home-actions .primary,.home-actions .secondary{font-size:13px}.home-card #resume{font-size:11px;margin:3px;padding:2px}.team small{font-size:10px}.clock>b{font-size:21px}.round.skill{width:56px;height:56px}.skill-controls{gap:6px}.summon{width:70px;height:70px}.summon canvas{width:36px;height:32px}.summon .tickets{font-size:11px}.summon>strong{font-size:12px}.combo-badge{right:calc(var(--safe-r) + 76px)}.combo{top:58px;max-height:calc(var(--view-h) - 140px);width:58vw;padding:5px}.choice{grid-template-columns:38px minmax(0,1fr);gap:3px}.choice img{width:38px;height:39px}.choice strong{font-size:11px}.choice small{font-size:9px}.combo-foot{font-size:8px}.merge-feed{top:108px}.roster-button,.synergy-hud,.menu-button{top:58px}.roster-button,.synergy-hud{width:38px;height:38px}.synergy-hud{right:calc(var(--safe-r) + 43px)}.menu-button{width:35px;height:35px}.v31-side-tabs{margin:0 8px 5px}.v3-shell .codex-header h2{font-size:16px}.codex-header small{display:none}.v3-atlas-main{grid-template-columns:minmax(0,1fr) 170px}.v3-zoom button[data-zoom="focus"]{display:none}.result-reward{font-size:22px;margin:5px}.result-card{padding:12px}.result-card h1{font-size:29px}.result-stats{padding:7px}.result-stats b{font-size:19px}.online-card header{margin-bottom:5px}.online-note{margin:4px 0 7px}.online-faction{margin:4px 0;font-size:10px}.online-warning{font-size:9px}} @media(max-width:650px){#hud{grid-template-columns:minmax(0,1fr) 80px minmax(0,1fr);gap:5px}.team{padding:4px}.team>strong{font-size:11px}.clock>small{font-size:9px}.v3-atlas-main{grid-template-columns:minmax(0,1fr)}.v3-atlas-detail{display:none}.v3-atlas-main.detail-open .v3-atlas-view{display:none}.v3-atlas-main.detail-open .v3-atlas-detail{display:block;width:100%;height:100%;border:0}.v3-atlas-main.detail-open .v3-atlas-detail .v3-materials,.v3-atlas-main.detail-open .v3-atlas-detail .v3-results{max-width:100%}.mobile-detail-back{display:block!important;position:sticky;top:0;z-index:2;min-height:34px;padding:6px 12px;margin:0 0 8px;background:#294952;color:#f0ddac;border:1px solid #759087;border-radius:5px;font-size:12px}.v3-mini-unit{width:82px;min-width:82px;max-width:82px}.v3-mini-unit strong{font-size:11px}.v3-tabs{gap:3px}.v3-tabs button{padding:5px 7px;font-size:10px}.codex-filters button{padding:5px 7px;min-height:31px;font-size:10px}.v31-synergy-main{grid-template-columns:110px minmax(0,1fr)}.v31-trait-heading h3{font-size:15px}.v31-trait-heading>strong{font-size:10px}.v31-stage strong{font-size:12px}.merge-feed{width:108px}.merge-notice img{width:27px}.merge-notice strong{font-size:9px}.merge-notice small{font-size:7px}.combo{max-width:calc(var(--view-w) - 114px);width:64vw}.online-actions button{font-size:11px;padding:6px}.online-title-row small{font-size:10px}} .mobile-detail-back{display:none}.hidden{display:none!important} @media(prefers-reduced-motion:reduce){.merge-notice{animation:none!important}} .online-card{background:#142f39;border:1px solid #637f7c;border-radius:10px;color:#efe1be}.online-card header{display:flex;align-items:center;justify-content:space-between;gap:8px}.online-card header h2{margin:3px 0}.online-card header small{font-size:10px;color:#b4d1c1}.online-card input{background:#0e2730;color:#eddfbf;border:1px solid #617e7d;border-radius:5px;padding:8px;max-width:100%}.online-title-row{display:flex;align-items:center;justify-content:space-between;margin:9px 0}.online-members{display:grid;grid-template-columns:1fr 1fr}.online-member{display:flex;flex-direction:column;gap:5px;border:1px solid #527573;border-radius:6px;background:#1c3c44}.online-member.is-ready{border-color:#c8c285}.online-actions{display:flex}.online-rooms{min-height:45px;overflow:auto}.online-room-row{display:flex;justify-content:space-between;align-items:center;padding:7px;gap:7px}.online-status{background:#102932;border-radius:5px}.online-warning{opacity:.78;margin:6px 0}.online-note{margin:5px 0 8px}.online-card .primary,.online-card .secondary{margin:0;width:auto} /* Reserve space for labels and ticket counters below the circular icons. */ .skill-controls{bottom:calc(var(--safe-b) + 21px)}.summon{bottom:calc(var(--safe-b) + 26px)}.v3-graph-unit{width:170px!important;min-width:170px!important;max-width:170px!important} /* fit-v037.css */ /* UI-only 037: fit actual visible landscape space, not a fixed phone resolution. */ :root { --view-x:0px; --view-y:0px; --hud-edge:62px; } #battle, #controls { inset:auto; left:var(--view-x); top:var(--view-y); width:var(--view-w); height:var(--view-h); } .veil, .codex-overlay { inset:auto; left:var(--view-x); top:var(--view-y); width:var(--view-w); height:var(--view-h); } #hud { left:calc(var(--view-x) + var(--safe-l)); right:auto; width:calc(var(--view-w) - var(--safe-l) - var(--safe-r)); top:calc(var(--view-y) + var(--safe-t)); } #cornerControls { left:calc(var(--view-x) + var(--view-w)/2 - 45px); top:calc(var(--view-y) + var(--view-h) - var(--safe-b) - 34px); bottom:auto; } .menu-button, .roster-button, .synergy-hud { top:calc(var(--hud-edge) + 6px); } .combo { top:calc(var(--view-y) + var(--hud-edge) + 6px); left:calc(var(--view-x) + var(--view-w)/2); width:min(640px,calc(var(--view-w) - 204px)); max-width:calc(var(--view-w) - var(--safe-l) - var(--safe-r) - 96px); max-height:calc(var(--view-h) - var(--hud-edge) - 92px); overflow-x:hidden; overflow-y:auto; } .combo .choice { grid-template-columns:minmax(28px,40px) minmax(0,1fr); gap:3px 6px; } .combo .choice img { width:40px; height:44px; } .choice strong { font-size:12px; } .choice strong, .choice .tier, .choice > small, .v3-mini-unit strong, .v31-member strong, .upgrade-card strong, .unit-row strong, .v3-detail-hero h3 { display:block; min-width:0; max-width:100%; white-space:nowrap; text-overflow:clip; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; } .choice .combo-synergy { white-space:nowrap; overflow-x:auto; grid-column:1/-1; } .choices[data-fit-layout="stacked"] .choice { grid-template-columns:minmax(0,1fr); text-align:center; gap:2px; padding:5px; } .choices[data-fit-layout="stacked"] .choice img { grid-row:auto; justify-self:center; width:34px; height:34px; } .choices[data-fit-layout="stacked"] .choice strong { font-size:11px; } .choices[data-fit-layout="stacked"] .choice .tier { font-size:9px; letter-spacing:0; } .choices[data-fit-layout="stacked"] .choice > small { font-size:10px; } .merge-feed { top:calc(var(--view-y) + var(--hud-edge) + 58px); } .merge-feed.mine { left:calc(var(--view-x) + var(--safe-l)); } .merge-feed.enemy { left:auto; right:calc(100vw - var(--view-x) - var(--view-w) + var(--safe-r)); } .drawer { left:auto; right:calc(100vw - var(--view-x) - var(--view-w) + var(--safe-r)); top:calc(var(--view-y) + var(--safe-t)); bottom:auto; height:calc(var(--view-h) - var(--safe-t) - var(--safe-b)); } .toast { top:auto; bottom:calc(100vh - var(--view-y) - var(--view-h) + var(--safe-b) + 42px); left:calc(var(--view-x) + var(--view-w)/2); white-space:nowrap; max-width:calc(var(--view-w) - 160px); overflow-x:auto; text-overflow:clip; font-size:11px; padding:7px 12px; } #netStatus { left:calc(var(--view-x) + var(--view-w)/2); bottom:calc(100vh - var(--view-y) - var(--view-h) + var(--safe-b) + 42px); } #aimHint { left:calc(var(--view-x) + var(--view-w)/2); max-width:calc(var(--view-w) - 160px); white-space:nowrap; } #aimHint small { white-space:nowrap; overflow-x:auto; } /* Short battle actions do not wrap. Full descriptions remain readable in their panels. */ .home-actions button { display:flex; align-items:center; justify-content:center; gap:8px; } .home-actions small { display:inline; margin:0; } .home-actions .primary span { float:none; } .home-footer { display:flex; justify-content:space-between; align-items:center; gap:12px; } .home-footer span { float:none; flex:none; } .v3-recipe { min-width:0; } .v3-mini-unit strong { width:100%; text-align:center; } .v3-detail-hero { min-width:0; } .v3-list .v3-recipe { gap:5px; } @media (orientation:landscape) and (max-height:500px) { .home-card.faction-home { width:min(740px,100%); display:grid; grid-template-columns:minmax(170px,.85fr) minmax(260px,1.4fr); grid-template-rows:auto auto auto auto 1fr auto auto; column-gap:22px; padding:14px 18px; text-align:left; } .home-card .eyebrow { grid-column:1; grid-row:1; font-size:8px; letter-spacing:.06em; white-space:nowrap; } .home-card .eyebrow span { padding:0 4px; } .home-card .mini-crest, .home-card .intro, .home-card .race-figures { display:none!important; } .home-card h1 { grid-column:1; grid-row:2; font-size:36px!important; margin:10px 0 4px!important; white-space:nowrap; } .home-card .subtitle { grid-column:1; grid-row:3; font-size:12px; margin:0 0 8px!important; } .home-card .faction-lobby { grid-column:2; grid-row:1/7; min-width:0; margin:0; } .home-card .home-actions { grid-column:1; grid-row:4; flex-direction:column; gap:8px; } .home-actions button { min-height:40px; padding:8px 9px; font-size:12px; } .home-card #resume { grid-column:1; grid-row:5; padding:7px 0; margin:0; text-align:left; } .home-footer { grid-column:1/-1; grid-row:7; padding-top:7px; margin-top:8px; font-size:9px; } .faction-lobby .race-tabs { display:flex; gap:5px; margin:0 0 6px; } .race-tab { flex:1; min-width:0; min-height:36px; padding:6px 7px; font-size:12px; } .faction-lobby .race-description { font-size:10px; margin:5px 0; } .faction-lobby .wallet { margin:6px 0; } .v3-lobby-tools { gap:6px!important; } .v3-lobby-tools button { min-height:35px; font-size:11px!important; } .v3-loadout-note { font-size:9px; text-align:left; } .combo { width:min(550px,calc(var(--view-w) - 184px)); } } @media (max-width:700px) and (orientation:landscape) { .home-card.faction-home { grid-template-columns:minmax(157px,.8fr) minmax(0,1.3fr); column-gap:12px; padding:12px; } .home-card h1 { font-size:30px!important; } .home-card .eyebrow { font-size:7px; letter-spacing:0; } .combo { width:calc(var(--view-w) - 204px); top:calc(var(--view-y) + var(--hud-edge) + 6px); } .combo { max-height:calc(var(--view-h) - var(--hud-edge) - 92px); } .combo .choice { min-height:68px; } .combo .choice img { width:32px; height:37px; } .choices:not([data-fit-layout="stacked"]) .choice { grid-template-columns:32px minmax(0,1fr); } .combo .combo-foot { display:none; } .v3-atlas-main { grid-template-columns:minmax(0,1fr); } .v3-atlas-main:not(.detail-open) .v3-atlas-detail { display:none; } .v3-atlas-main.detail-open .v3-atlas-view { display:none; } .v3-atlas-main.detail-open .v3-atlas-detail { display:block; width:100%; height:100%; border:0; } .mobile-detail-back { display:block!important; } .v3-list .v3-recipe { display:grid; grid-template-columns:minmax(0,1fr) 14px minmax(0,1fr); overflow:visible; } .v3-list .v3-materials, .v3-list .v3-results { min-width:0; width:100%; overflow:visible; } .v3-list .v3-mini-unit, .v3-list .v3-result-choice { flex:1 1 0; width:auto; min-width:0; max-width:none; } .v3-list .v3-result-choice .v3-mini-unit { width:100%; } .v3-list .v3-mini-unit strong { font-size:11px; } .v3-list .v3-plus { flex:none; font-size:11px; } } @media (orientation:landscape) and (max-height:430px) { .combo .combo-foot { display:none; } .combo header { margin-bottom:3px; } } /* Cover browser viewport during iOS toolbar/rotation transitions. */ html{background:#182d31} /* ../game-ui/pixel038.css */ /* Same pixel typeface used by the defense interface. Font binaries stay with the publisher. */ @import url('https://cdn.jsdelivr.net/npm/galmuri@2.40.3/dist/galmuri.css'); :root{--px-w:100vw;--px-h:100dvh;--px-x:0px;--px-y:0px;--px-l:max(8px,env(safe-area-inset-left));--px-r:max(8px,env(safe-area-inset-right));--px-t:max(6px,env(safe-area-inset-top));--px-b:max(6px,env(safe-area-inset-bottom));--px-font:Galmuri11,'Malgun Gothic',monospace;--px-ink:#eee3c3;--px-muted:#abb9a3;--px-gold:#d7b779;--px-frame:#8d815b;--px-panel:#152a27;--px-shadow:#081713} html.pixel-ui038 body,html.pixel-ui038 body *:not(svg):not(path):not(rect){font-family:var(--px-font)!important;font-synthesis:none} html.pixel-ui038 body{color:var(--px-ink);-webkit-text-size-adjust:100%;text-size-adjust:100%} html.pixel-ui038 :is(button,input,select,textarea){font-family:var(--px-font)!important;font-size:12px;border-radius:0!important} html.pixel-ui038 button{white-space:nowrap;touch-action:manipulation} html.pixel-ui038 :is(img,canvas){image-rendering:pixelated} html.pixel-ui038 button:focus-visible{outline:2px solid #f4db95;outline-offset:-4px} html.pixel-ui038 [hidden]{display:none!important} .px-line{white-space:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;max-width:100%;scrollbar-width:thin;text-overflow:clip!important} .px-button,.px-primary,.px-close{border:2px solid var(--px-frame);background:#243b30;color:var(--px-ink);padding:7px 12px;min-height:38px;box-shadow:inset 2px 2px 0 #5c684c,inset -2px -2px 0 #101f1c;cursor:pointer} .px-primary{background:#665633;border-color:#d7b779;box-shadow:inset 2px 2px 0 #ae9660,inset -2px -2px 0 #3b361f} .px-button:disabled,.px-primary:disabled{opacity:.5;cursor:default}.px-close{padding:4px 8px;min-width:38px;font-size:19px} .px-chip{display:inline-block;border:1px solid #596c53;color:#dfd3af;padding:3px 7px;font-size:11px;white-space:nowrap;background:#11231f;flex:none} .px-room-info{display:flex;gap:6px;align-items:center;min-width:0;overflow:auto;scrollbar-width:thin} .px-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:9px;min-height:0;align-content:stretch} .px-slot{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:4px 10px;align-items:center;min-width:0;min-height:68px;padding:9px 10px;border:2px solid #657252;background:#1a3029;box-shadow:inset 2px 2px #31483b,inset -2px -2px #091c18;overflow:hidden} .px-slot.vacant{border-style:dashed;background:#14231f;box-shadow:none}.px-slot.ready{border-color:#d0c17c;background:#294232} .px-avatar{width:40px;height:48px;grid-row:1/3;object-fit:contain;align-self:center} .px-slot-copy{min-width:0;display:grid;gap:4px;align-content:center}.px-slot-copy>*{display:block;white-space:nowrap;max-width:100%;overflow:auto;scrollbar-width:thin;margin:0}.px-slot-label{font-size:10px;color:#bbbc9c}.px-slot-name{font-size:14px;color:#f5e5bc;font-weight:normal}.px-slot-race{font-size:11px;color:#9eb6a6}.px-ready{justify-self:start;min-height:20px;padding:2px 7px;line-height:1.5;color:#b7bfa8;font-size:10px;white-space:nowrap;font-weight:normal;background:#0d211b;border:1px solid #617451}.px-slot.ready .px-ready{color:#e1ed9f;border-color:#adc071;background:#314625}.px-slot.vacant .px-ready{border-color:#354b3f;color:#7e9b8a} .px-dialog{position:fixed;inset:0;width:min(480px,calc(var(--px-w) - var(--px-l) - var(--px-r)));max-width:100%;max-height:calc(var(--px-h) - var(--px-t) - var(--px-b));margin:auto;padding:0;overflow:hidden;color:var(--px-ink);background:#152a27;border:3px solid #ab9461;box-shadow:inset 0 0 0 2px #081713,5px 5px 0 #061310} .px-dialog[open]{display:flex;flex-direction:column}.px-dialog::backdrop{background:#031311bf}.px-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 12px;border-bottom:1px solid #7c7b56;flex:none}.px-dialog-head h2{font-size:17px;margin:0;white-space:nowrap}.px-dialog-body{padding:12px;min-height:0;overflow:auto;display:grid;gap:10px}.px-dialog-actions{display:flex;justify-content:flex-end;gap:8px;padding:8px 12px;border-top:1px solid #677558;flex:none}.px-field{display:grid;grid-template-columns:75px minmax(0,1fr);align-items:center;gap:8px;font-size:12px}.px-field>span{white-space:nowrap}.px-field input,.px-field select{width:100%;min-width:0;min-height:36px;padding:6px;background:#0f231f;border:1px solid #8e9164;color:#e7dfbe}.px-field output{font-size:12px;color:#d8d7b7}.px-dialog .px-help{font-size:11px;color:#c3c8aa;line-height:1.7;margin:0;word-break:keep-all} @media(orientation:landscape) and (max-height:440px){.px-slots{gap:6px}.px-slot{padding:6px;gap:3px 7px;grid-template-columns:34px minmax(0,1fr);min-height:56px}.px-avatar{width:30px;height:36px}.px-slot-name{font-size:12px}.px-slot-copy{gap:2px}.px-slot-race{font-size:10px}.px-slot-label{font-size:9px}.px-ready{font-size:10px;min-height:18px;padding:1px 5px}.px-dialog-head{padding:4px 9px}.px-dialog-head h2{font-size:15px}.px-dialog-body{gap:7px;padding:9px}.px-dialog-actions{padding:6px 9px}.px-button,.px-primary{min-height:34px;padding:6px 9px}.px-field input,.px-field select{min-height:32px}.px-slot[data-slot="3"]{min-height:56px}} @media(max-width:390px) and (orientation:portrait){.px-slot{grid-template-columns:28px minmax(0,1fr);gap:4px 6px;padding:7px}.px-avatar{width:27px;height:33px}.px-slot-name{font-size:12px}.px-slot-label,.px-slot-race{font-size:10px}} @media(orientation:landscape) and (max-height:440px){ .px-slot{grid-template-columns:30px minmax(0,1fr) auto;grid-template-rows:minmax(0,1fr);min-height:50px;gap:5px} .px-avatar{grid-row:1;grid-column:1} .px-slot-copy{grid-column:2;grid-row:1;gap:3px}.px-slot-label{font-size:9px;line-height:12px}.px-slot-name{font-size:12px;line-height:16px}.px-slot-race{display:none} .px-ready{grid-column:3;grid-row:1;align-self:center;line-height:16px;padding:2px 4px} .px-slot[data-slot="3"]{min-height:50px} } /* Center dialogs inside the visible viewport, including an open mobile keyboard. */ .px-dialog{inset:auto;left:calc(var(--px-x) + var(--px-w)/2);top:calc(var(--px-y) + var(--px-h)/2);transform:translate(-50%,-50%);margin:0} /* ui038.css */ /* Pixel title scene uses the existing defense title artwork, not a new image. */ .pixel-frontline038 #home{background:#0d211cf0 url('../game-ui/art/title-beacons.png') center/cover!important} .pixel-frontline038 #home .home-card{background:#10231deE;border:3px solid #b29a60;border-radius:0!important;box-shadow:inset 3px 3px #4c5c3b,inset -3px -3px #071a14,6px 6px #061710b0;backdrop-filter:none} .pixel-frontline038 .home-card h1{color:#f2dca2;text-shadow:3px 3px #060f0c!important;letter-spacing:1px;font-weight:normal}.pixel-frontline038 .home-card .eyebrow{color:#baac80}.pixel-frontline038 .home-card .subtitle{color:#d0cfab}.pixel-frontline038 .home-card .intro{color:#bac5a5} .pixel-frontline038 .home-card :is(button,.race-tab){border:2px solid #93875a!important;border-radius:0!important;background:#273c2c!important;color:#ead9ab!important;box-shadow:inset 2px 2px #5d7049,inset -2px -2px #101c12!important;font-weight:normal;white-space:nowrap} .pixel-frontline038 .home-card :is(.primary,.race-tab.active){background:#695731!important;border-color:#dabd76!important;color:#fff1c2!important;box-shadow:inset 2px 2px #a48c51,inset -2px -2px #392f16!important} .pixel-frontline038 .home-card .wallet{color:#e8c982}.pixel-frontline038 .home-footer{border-color:#75805a;color:#a8b396}.pixel-frontline038 .v3-loadout-note{color:#b3c2a3}.pixel-frontline038 .home-card .faction-lobby{border-left:1px solid #5a6d4a;padding-left:12px} .pixel-frontline038 :is(.combo,.drawer,.codex-shell,.result-card,.pause-card){border-radius:0!important;border-color:#a28b58!important;box-shadow:inset 2px 2px #4b6141,3px 3px #081912!important}.pixel-frontline038 :is(.choice,.v3-mini-unit,.v31-member,.v31-stage,.v3-recipe){border-radius:0!important} /* Native hidden state controls visibility; page scrolling is confined to room lists. */ .pixel-frontline038 #network{padding:var(--px-t) var(--px-r) var(--px-b) var(--px-l);overflow:hidden;align-items:center;justify-content:center} .pixel-frontline038 #network .online-card{width:min(850px,100%);height:min(530px,calc(var(--px-h) - var(--px-t) - var(--px-b)));max-height:100%;margin:0;padding:12px;display:grid;grid-template-rows:40px minmax(0,1fr) 28px;gap:8px;overflow:hidden;border:3px solid #a18e5b;border-radius:0;box-shadow:inset 2px 2px #415438,4px 4px #071911;background:#152c23;color:#eee2bd} .pixel-frontline038 #network .online-card>header{display:flex;align-items:center;gap:7px;margin:0;border-bottom:1px solid #566b47;padding-bottom:5px;min-width:0}.pixel-frontline038 #network .online-card>header>div{flex:1;min-width:0}.pixel-frontline038 #network .online-card>header h2{font-size:19px;white-space:nowrap;margin:0}.pixel-frontline038 #network .online-card>header small{font-size:9px;white-space:nowrap;display:block;color:#a7bb9b}.pixel-frontline038 #network :is(.online-note,.online-warning){display:none}.pixel-frontline038 #onlineStatus{margin:0;min-width:0;min-height:0;height:28px;font-size:11px;line-height:18px;padding:4px 6px;white-space:nowrap;overflow-x:auto;overflow-y:hidden;background:#0c231b;border-top:1px solid #47613f} .pixel-frontline038 #network button{margin:0;width:auto;min-height:34px;padding:5px 10px;background:#2d402d;border:2px solid #8b8758;box-shadow:inset 1px 1px #617346,inset -1px -1px #0a1e13;color:#e7dbb4;white-space:nowrap}.pixel-frontline038 #network button.primary,.pixel-frontline038 #network button.px-primary{background:#6a592f;border-color:#d1b675;color:#ffeabc}.pixel-frontline038 #network input{background:#0c2119;border:1px solid #79865c;color:#ede1c4;padding:8px;min-width:0;font-size:12px;max-width:100%} .pixel-frontline038 #network[data-px-stage=login] .online-card{height:auto;max-width:620px;grid-template-rows:40px auto 28px}.pixel-frontline038 #onlineLogin .online-bar{display:flex;align-items:center;gap:8px;margin:15px 0}.pixel-frontline038 #onlineName{flex:1;min-width:0}.pixel-frontline038 #onlineLogin label{font-size:12px;white-space:nowrap} .pixel-frontline038 #onlineDirectory{display:grid;grid-template-rows:35px 34px minmax(0,1fr);gap:5px;min-height:0;overflow:hidden}.pixel-frontline038 #onlineDirectory>.online-bar{justify-content:flex-end}.pixel-frontline038 #onlineTitle{display:none}.pixel-frontline038 #onlineDirectory .online-title-row{margin:0}.pixel-frontline038 #onlineDirectory h3{font-size:14px;margin:0;white-space:nowrap}.pixel-frontline038 #onlineRooms{min-height:0;max-height:none;overflow:auto;border:1px solid #445f42;background:#0f231c;padding:3px}.pixel-frontline038 #onlineRooms .online-room-row{margin:0;padding:6px;display:flex;gap:7px;align-items:center;min-width:0}.pixel-frontline038 #onlineRooms .online-room-row strong{font-size:12px;min-width:0;flex:1;white-space:nowrap;overflow-x:auto}.pixel-frontline038 #onlineRooms button{flex:none} .pixel-frontline038 #onlineRoom{display:grid;grid-template-rows:36px 24px minmax(0,1fr) 38px;gap:7px;min-height:0;overflow:hidden}.pixel-frontline038 #onlineRoom>.online-title-row{display:flex;align-items:center;gap:7px;justify-content:space-between;margin:0;min-width:0}.pixel-frontline038 #onlineRoomTitle{font-size:15px;margin:0;white-space:nowrap;overflow-x:auto;min-width:0}.pixel-frontline038 .px-room-tools{display:flex;gap:5px;flex:none}.pixel-frontline038 #onlineMembers{display:none!important}.pixel-frontline038 #px-frontline-slots{align-self:center;height:min(100%,160px)}.pixel-frontline038 #onlineRoom .online-actions{display:flex;align-items:stretch;gap:7px;justify-content:flex-end;flex-wrap:nowrap;margin:0}.pixel-frontline038 #onlineRoom .online-actions button{flex:initial}.pixel-frontline038 #onlineStart{min-width:120px} .pixel-frontline038.px-front-network #rotate,.pixel-frontline038.px-front-home #rotate{display:none!important} @media(orientation:landscape) and (max-height:440px){.pixel-frontline038 #network .online-card{height:calc(var(--px-h) - var(--px-t) - var(--px-b));padding:7px;grid-template-rows:33px minmax(0,1fr) 24px;gap:5px}.pixel-frontline038 #network .online-card>header small{display:none}.pixel-frontline038 #network .online-card>header h2{font-size:16px}.pixel-frontline038 #onlineStatus{height:24px;padding:3px 5px;font-size:10px}.pixel-frontline038 #onlineRoom{grid-template-rows:33px 22px minmax(0,1fr) 34px;gap:5px}.pixel-frontline038 #network button{min-height:32px;padding:4px 8px;font-size:11px}.pixel-frontline038 #onlineRoomTitle{font-size:13px}.pixel-frontline038 #network[data-px-stage=login] .online-card{height:auto;grid-template-rows:33px auto 24px}.pixel-frontline038 #px-frontline-slots{height:min(100%,130px)}.pixel-frontline038 .home-card h1{font-size:30px!important;line-height:1.4!important}.pixel-frontline038 #home .home-card{padding:12px}.pixel-frontline038 .home-card .faction-lobby{padding-left:9px}.pixel-frontline038 .home-card .home-actions button{font-size:12px}} @media(orientation:portrait){.pixel-frontline038 #home .home-card{padding:18px 14px;max-height:calc(var(--px-h) - 24px);width:min(460px,100%)}.pixel-frontline038 .home-card .faction-lobby{border:0;padding-left:0}.pixel-frontline038 .home-card h1{font-size:34px!important}.pixel-frontline038 #network .online-card{height:min(660px,calc(var(--px-h) - 16px))}.pixel-frontline038 #onlineRoom{grid-template-rows:auto auto minmax(0,1fr) 38px}.pixel-frontline038 #onlineRoom>.online-title-row{flex-wrap:wrap}.pixel-frontline038 #onlineStart{min-width:90px}.pixel-frontline038 #onlineRoom .online-actions button{flex:1;min-width:0}.pixel-frontline038 #onlineRoomTitle{font-size:14px}.pixel-frontline038 #px-frontline-slots{height:160px}} @media(orientation:portrait){ .pixel-frontline038 #home .home-card.faction-home{display:flex;flex-direction:column;gap:9px;text-align:center;min-width:0;overflow-x:hidden} .pixel-frontline038 .home-card>*{min-width:0;max-width:100%} .pixel-frontline038 .home-card :is(.faction-lobby,.home-actions,.home-footer){width:100%;grid-column:auto;grid-row:auto} .pixel-frontline038 .home-card .intro{display:none}.pixel-frontline038 .home-card .race-figures{height:62px}.pixel-frontline038 .home-card .race-figures img{height:61px;width:64px} .pixel-frontline038 .home-card .home-footer{font-size:8px;gap:5px}.pixel-frontline038 .home-card h1{margin:3px 0!important} } /* ui039.css */ /* Keep the pixel/mobile shell; wide result branches are a swipe strip, never squeezed text. */ #choices[data-wide039="true"]{display:flex!important;flex-flow:row nowrap!important;gap:6px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;touch-action:pan-x;overscroll-behavior-x:contain;padding-bottom:5px;scrollbar-width:thin} #choices[data-wide039="true"] .choice{display:grid!important;flex:0 0 clamp(126px,20vw,168px)!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:32px 13px 17px 15px auto;gap:1px 4px!important;min-width:126px!important;height:auto!important;min-height:96px!important;scroll-snap-align:start;text-align:center!important;padding:5px!important} #choices[data-wide039="true"] .choice img{grid-row:1!important;width:32px!important;height:32px!important;justify-self:center} #choices[data-wide039="true"] .choice strong{font-size:12px!important;line-height:17px;white-space:nowrap;grid-row:3} #choices[data-wide039="true"] .choice .tier{font-size:10px!important;grid-row:2;line-height:13px} #choices[data-wide039="true"] .choice>small{font-size:10px!important;white-space:nowrap;overflow-x:auto;text-overflow:clip} #choices[data-wide039="true"] .combo-synergy{grid-row:5!important;min-height:12px} #combo{overscroll-behavior:contain} .branch-guide039{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:22px;font-size:10px;white-space:nowrap;color:#dbc79b} .branch-guide039 button{min-height:25px;min-width:29px;padding:2px 6px;border:1px solid #99815d;border-radius:0;background:#223c40;color:#f3e2af;font:inherit} .branch-guide039 .branch-caption{min-width:0;overflow-x:auto} #atlasV3 .v3-results{justify-content:flex-start!important;overflow-x:auto!important;max-width:100%;flex-wrap:nowrap!important;scrollbar-width:thin} #atlasV3 .v3-results .v3-result-choice,#atlasV3 .v3-results>.v3-mini-unit{flex:0 0 86px!important;min-width:86px!important;max-width:86px!important} #atlasV3 .v3-results .v3-result-choice .v3-mini-unit{width:100%;min-width:0;max-width:100%} #ai039{width:min(550px,calc(var(--view-w,100vw) - 24px));max-height:calc(var(--view-h,100dvh) - 20px);margin:auto;padding:12px;background:#172e30;color:#f1dfb5;border:2px solid #b69d68;box-shadow:4px 4px 0 #09191d;font-family:Galmuri11,monospace;overflow:auto} #ai039::backdrop{background:#07191cb5} #ai039 header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:10px;font-size:17px} #ai039 header button{min-width:36px;min-height:34px;background:#213e43;border:1px solid #a9956c;color:inherit;font:inherit} .ai039-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} .ai039-levels button{min-width:0;min-height:86px;border:1px solid #9e895f;background:#24433e;color:inherit;padding:8px;font:inherit;font-size:14px} .ai039-levels small{display:block;font-size:10px;margin-top:6px;white-space:nowrap} #ai039 p{font-size:11px;line-height:1.6;margin:8px 0 0;word-break:keep-all} .racial039{margin:8px 0;padding:10px;background:#223d41;border:1px solid #647d71;font-size:12px;line-height:1.6} .racial039 p{margin:5px 0;word-break:keep-all} @media (max-height:400px){#choices[data-wide039="true"] .choice{min-height:83px!important;grid-template-rows:26px 12px 15px 13px auto;padding:3px!important}#choices[data-wide039="true"] .choice img{height:26px!important;width:28px!important}#choices[data-wide039="true"] .choice strong{font-size:11px!important;line-height:15px}.branch-guide039{min-height:20px;font-size:9px}#combo .branch-guide039 button{min-height:24px}#ai039 header{font-size:15px}.ai039-levels button{min-height:72px}} .ai039-levels small{white-space:normal;line-height:1.45} /* flow043.css */ /* Existing pixel typography and whole-battlefield layout are preserved. */ #roomLoadout043{display:flex;align-items:center;gap:8px;min-width:0;padding:6px 0;font-size:12px;white-space:nowrap}#roomLoadout043 select{background:#19323b;color:#f2deb0;border:1px solid #9a9d7a;border-radius:0;min-height:34px;padding:5px 10px;font:inherit}#roomLoadout043 button{min-height:34px;white-space:nowrap;font:inherit}#roomGold043{margin-left:auto;color:#edcf87;white-space:nowrap}.room-workshop043{z-index:240!important} .result043 .result-card{width:min(680px,96vw);height:min(540px,calc(var(--view-h,100dvh) - 18px));display:grid;grid-template-columns:minmax(180px,.8fr) minmax(260px,1.2fr);grid-template-rows:auto auto auto 1fr auto auto;column-gap:16px;padding:15px;overflow:hidden;text-align:center}.result043 #resultMode,.result043 #resultTitle,.result043 #resultReason,.result043 #resultReward,.result043 #resultRewardNote,.result043 #again,.result043 #backHome{grid-column:1}.result043 #resultTitle{font-size:clamp(26px,5vw,46px);margin:6px 0}.result043 #resultReason{font-size:12px;word-break:keep-all;line-height:1.5}.result043 #resultReward{color:#f4d483;font-size:27px;margin:auto 0}.result043 #resultRewardNote{font-size:11px}.result043 #resultStats,.result043 #resultUpgrade{display:none!important}#resultTable043{grid-column:2;grid-row:1/9;overflow:auto;min-height:0;border:1px solid #64847d;background:#122d36}.result-row043{display:grid;grid-template-columns:minmax(86px,1.4fr) minmax(50px,1fr) minmax(50px,1fr);align-items:center;gap:5px;padding:7px 8px;font-size:12px;white-space:nowrap;border-bottom:1px solid #35514f}.result-row043>span:first-child{text-align:left;color:#bccdbc}.result-row043>strong{font-variant-numeric:tabular-nums;font-size:12px}.result-head043{position:sticky;top:0;background:#29453f;color:#e7d69b;z-index:1}.result043 #again,.result043 #backHome{margin:4px 0;min-height:36px;padding:6px 12px} @media(max-height:400px){.result043 .result-card{padding:9px;column-gap:10px;width:min(650px,97vw)}.result-row043{padding:5px 6px;font-size:10px}.result-row043>strong{font-size:11px}.result043 #resultReason{font-size:10px}.result043 #resultReward{font-size:23px}.result043 #resultMode{font-size:10px}#roomLoadout043{gap:5px;font-size:11px;padding:3px 0}#roomLoadout043 select,#roomLoadout043 button{min-height:30px;padding:4px 7px}} @media(max-width:550px) and (orientation:portrait){.result043 .result-card{display:flex;flex-direction:column;overflow:auto;height:90dvh}#resultTable043{min-height:200px;flex:1}.result043 #resultReward{margin:5px}.result043 #resultTitle{font-size:28px}} /* release044.css */ /* Shared pixel palette, fixed landscape viewport; overflow belongs to inner panes. */ #home.release-home{padding:8px;background:linear-gradient(180deg,#142d37ed,#12242de8);overflow:hidden;align-items:stretch;justify-content:center}.legacy044{display:none!important} .release-lobby{--rim:#647d80;display:grid;grid-template-rows:38px minmax(0,1fr) 24px;gap:8px;width:min(1180px,100%);height:100%;max-height:680px;margin:auto;color:#f2eed9;font-size:14px;text-align:left;min-width:0} .release-lobby button,.release-overlay button{font:inherit;white-space:nowrap;min-width:0;border:2px solid #697e83;border-radius:2px;background:#263f4b;color:#f4efdb;padding:7px 8px;box-shadow:inset 0 -3px #142b35,1px 2px #0b1c25;cursor:pointer}.release-lobby button:hover,.release-overlay button:hover{border-color:#e2c584}.release-lobby button:focus-visible,.release-overlay button:focus-visible{outline:2px solid #fff;outline-offset:1px}.release-overlay button:disabled{opacity:.45;cursor:default}.release-lobby .primary,.release-overlay .primary{background:#aa7534;border-color:#edd397;color:#fff8df;box-shadow:inset 0 -4px #69491f,2px 3px #101c24}.release-top{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#0e2632;border:2px solid #668087;padding:0 12px;white-space:nowrap}.release-top button{border:0;background:none;box-shadow:none;padding:2px}.release-top strong{color:#f0d489}.release-body{display:grid;grid-template-columns:minmax(128px,1fr) minmax(230px,2.7fr) minmax(130px,1fr);gap:12px;min-height:0;min-width:0}.release-side{display:flex;flex-direction:column;gap:9px;min-width:0;min-height:0;overflow:auto;border:2px solid #5e7378;background:#1a303de8;padding:14px 10px;text-align:center}.release-side>strong,.release-side>small{white-space:nowrap}.release-side button{flex-shrink:0}.release-side .eyebrow{font-size:10px;color:#abbbb9}.release-brand{margin-top:auto;color:#9dafa9;font-size:9px}.release-center{display:grid;grid-template-rows:auto minmax(45px,1fr) auto 54px auto auto;gap:7px;min-height:0;min-width:0;text-align:center}.release-title{font-size:27px;font-weight:900;letter-spacing:4px;color:#f1d594;text-shadow:3px 3px #080e16}.release-stage{display:flex;align-items:center;justify-content:center;min-height:0;background:linear-gradient(0deg,#70826838 0 15%,transparent 16%),radial-gradient(ellipse,#50777988,transparent 68%);overflow:hidden}.release-army{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.release-army img{image-rendering:pixelated;object-fit:contain;width:30%;height:100%;max-height:230px;filter:drop-shadow(0 7px #0d1d2360)}.release-army img:nth-child(2){width:36%;transform:translateY(-7px)}.release-league{font-size:17px;color:#edcd8d;white-space:nowrap}.release-center .rank-start{font-size:22px;width:100%;font-weight:900;letter-spacing:1px}.release-links{display:flex;justify-content:center;gap:6px;min-width:0}.release-links button{flex:1;font-size:12px;padding:5px 3px}.release-links .hidden{display:none}.release-test-note{font-size:10px;color:#b5c5c4}.release-lobby .release-season{font-size:11px;padding:1px 8px;text-align:left;background:linear-gradient(90deg,#466764 20%,#1a303d 20%)} .release-overlay{position:fixed;inset:0;z-index:150;display:flex;align-items:center;justify-content:center;padding:10px;background:#07141eee;color:#efe9d5;font-size:14px}.release-overlay.hidden{display:none}.release-shell{height:min(620px,100%);width:min(1100px,100%);display:grid;grid-template-rows:44px minmax(0,1fr);background:#19313c;border:3px solid #6b8384;box-shadow:0 0 0 3px #0a1821;min-width:0}.release-panel-head{display:flex;align-items:center;gap:12px;padding:5px 12px;border-bottom:2px solid #546d74;min-width:0}.release-panel-head h2{font-size:18px;margin:0;white-space:nowrap}.release-panel-head span{margin-left:auto;font-size:12px;white-space:nowrap;color:#edd18e}.release-panel-head button{font-size:12px;padding:4px 10px}.release-content{min-width:0;min-height:0;overflow:auto;padding:12px;gap:12px}.release-content h3{font-size:15px;margin:5px 0;white-space:nowrap}.release-content p{margin:8px 0}.release-content small{font-size:11px;color:#bbccc9}.release-content img{image-rendering:pixelated;object-fit:contain}.shop044{display:grid;grid-template-columns:125px minmax(0,1fr);overflow:hidden}.shop-nav{display:flex;flex-direction:column;gap:8px;overflow:auto}.shop-nav button{text-align:left;flex-shrink:0}.release-overlay button.active{background:#4b6869;border-color:#ddc58e}.shop-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:12px;overflow:auto;min-width:0;min-height:0}.product044{border:2px solid #657b7e;background:#233f49;display:flex;align-items:center;flex-direction:column;padding:12px 8px;gap:8px;min-width:0;text-align:center}.product044>img{width:90px;height:72px}.product044 button{margin-top:auto;width:100%}.product044 small{white-space:nowrap}.product044 h3{font-size:14px}.pixel-chest{position:relative;flex-shrink:0;width:68px;height:51px;margin:14px auto 5px;background:linear-gradient(#c49d52 0 38%,#573b27 39% 45%,#a97439 46%);border:5px solid #e0ba6e;box-shadow:5px 5px #0e2027,inset 5px 0 #735025,inset -5px 0 #735025;image-rendering:pixelated}.pixel-chest:after{content:'';position:absolute;width:12px;height:15px;left:23px;top:16px;background:#ffdf8b;border:3px solid #6f502e}.pixel-chest.elite{filter:hue-rotate(105deg)}.pixel-chest.royal,.pixel-chest.promotion{filter:hue-rotate(220deg)}.pixel-building{width:80px;height:100px;background:repeating-linear-gradient(0deg,transparent 0 17px,#142934 18px 21px),#8b9690;border:6px solid #354f5d;box-shadow:10px 8px #0f242d;position:relative}.pixel-building:before{content:'';position:absolute;top:-20px;left:-6px;width:80px;height:22px;background:repeating-linear-gradient(90deg,#b4b398 0 15px,transparent 15px 27px)}.pixel-building:after{content:'';position:absolute;width:20px;height:36px;bottom:0;left:24px;background:#112c37}.pixel-building.tower{width:55px;height:110px}.work044{display:grid;grid-template-columns:minmax(135px,1.1fr) minmax(135px,1.3fr) minmax(210px,1.6fr);overflow:hidden}.work-list{display:flex;flex-direction:column;gap:6px;overflow:auto;min-height:0}.work-list button{text-align:left;font-size:12px;flex-shrink:0}.work-art{display:flex;flex-direction:column;justify-content:center;align-items:center;min-width:0;min-height:0;background:radial-gradient(ellipse,#486761,transparent 70%)}.work-art>img{width:100%;height:55%;max-height:220px}.work-art h3{color:#efd291}.work-detail{overflow:auto;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:8px}.work-detail p{margin:0;white-space:nowrap;font-size:14px}.work-detail button{margin-top:6px}.work-detail small{white-space:nowrap}.race044{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:center}.race-note{grid-column:1/-1;text-align:center}.chest-details044{display:grid;grid-template-columns:1fr 2fr;overflow:hidden}.chest-summary,.probabilities{overflow:auto;min-height:0}.chest-summary{text-align:center}.probabilities p{font-size:12px}.possible-cards{display:flex;gap:5px}.possible-cards>div{flex:1;min-width:0;text-align:center}.possible-cards img{width:65px;height:48px;max-width:100%}.possible-cards small{display:block;white-space:nowrap;font-size:10px}.probabilities details{font-size:12px;margin-top:12px}.probabilities summary{cursor:pointer;padding:7px;background:#2b4b54}.chest-inventory044{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start}.opening044{position:relative;display:grid;grid-template-rows:65px minmax(0,1fr) 36px;overflow:hidden}.opening044>.pixel-chest{margin:4px auto;width:64px;height:44px;z-index:1}.opening{animation:chest-shake .3s steps(2) 3}.chest-glow{position:absolute;top:0;left:30%;width:40%;height:100px;background:radial-gradient(ellipse,#e0bc6455,transparent 68%);pointer-events:none}.loot-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;overflow:auto;min-height:0}.loot-card{background:#2e4951;border:2px solid #708582;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:6px;min-width:0;animation:card-reveal .3s steps(5)}.loot-card img{width:75px;height:48px;max-width:100%}.loot-card strong{font-size:11px;white-space:nowrap}.loot-card span{font-size:13px;color:#f7d995}.loot-card.tier-3{border-color:#b193da;box-shadow:inset 0 0 12px #ac8bdd44}.loot-card.tier-4{border-color:#ffe798;box-shadow:inset 0 0 16px #ffde7955}.loot-symbol{font-size:24px;color:#f4cf85}.opening-controls{display:flex;justify-content:flex-end;gap:8px}.opening-controls button{min-width:100px;padding:4px}.pass044{display:grid;grid-template-rows:34px minmax(0,1fr);overflow:hidden}.pass-bar{display:flex;justify-content:space-between;align-items:center;gap:6px}.pass-bar button{font-size:12px;padding:5px}.pass-days{display:flex;gap:10px;overflow:auto;min-height:0}.pass-day{min-width:155px;border:2px solid #607b7d;padding:8px;display:flex;flex-direction:column;gap:5px;overflow:auto}.pass-day strong{font-size:12px;white-space:nowrap}.pass-day button{font-size:12px;padding:7px 4px;flex-shrink:0}.pass-day .premium{border-color:#c0a66a}.history-row{display:grid;grid-template-columns:1fr 2fr 1fr 1fr;gap:8px;padding:10px;border-bottom:1px solid #547078;white-space:nowrap}.match044{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.match044 h2{font-size:22px;margin:8px}.match-emblem{font-size:55px;color:#d5b36e;animation:search-pulse 1s steps(3) infinite;font-weight:900}.match-emblem.found{color:#ffe7a2;animation:none}.match044 p{font-size:13px}.release-notice{position:fixed;bottom:10px;left:50%;transform:translateX(-50%);padding:8px 16px;background:#112a35;border:2px solid #e0c587;color:#f1e5c3;z-index:9999;display:none;font-size:13px;white-space:nowrap}.release-notice.on{display:block} #result.release-result{padding:8px;overflow:hidden}#result.release-result .result-card{width:min(900px,100%);max-width:100%;max-height:100%;height:100%;display:grid;grid-template-columns:minmax(180px,1fr) minmax(250px,1.8fr);grid-template-rows:22px 40px 32px minmax(25px,1fr) 35px 35px;gap:6px 14px;padding:12px;overflow:hidden}#result.release-result #resultTable043{grid-column:2;grid-row:1/7;overflow:auto;margin:0;min-height:0}#result.release-result #resultTitle{font-size:30px;margin:0}#result.release-result #resultReason{font-size:11px;margin:0;line-height:1.4}#result.release-result #resultReward{font-size:18px;margin:0}#result.release-result #resultRewardNote{font-size:11px;margin:0;grid-row:4;align-self:end}#result.release-result #resultChest044{grid-row:5;font-size:12px;padding:4px}#result.release-result #again{grid-row:6;font-size:13px;padding:4px}#result.release-result #resultStats,#result.release-result #resultUpgrade,#result.release-result #backHome{display:none!important}#result.release-result .result-row043{padding:6px;font-size:12px;min-height:24px}#cornerControls{z-index:42}body:has(#home:not(.hidden)) #cornerControls{display:none} @keyframes chest-shake{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}@keyframes card-reveal{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes search-pulse{50%{opacity:.45}} @media(max-height:450px){.release-lobby{grid-template-rows:29px minmax(0,1fr) 19px;gap:5px;font-size:12px}.release-body{gap:7px}.release-side{gap:5px;padding:7px}.release-side button{padding:5px 4px;font-size:12px}.release-top{padding:0 7px}.release-center{grid-template-rows:23px minmax(40px,1fr) 20px 40px 12px 29px;gap:3px}.release-title{font-size:22px}.release-league{font-size:14px}.release-center .rank-start{font-size:19px}.release-lobby .release-season{font-size:10px}.release-overlay{padding:7px;font-size:12px}.release-shell{grid-template-rows:35px minmax(0,1fr)}.release-panel-head{padding:3px 8px;gap:8px}.release-panel-head h2{font-size:15px}.release-content{padding:8px;gap:8px}.shop-nav{gap:5px}.shop-nav button{padding:7px}.product044{padding:8px 5px;gap:5px}.product044>img{height:55px}.pixel-chest{margin-top:7px}.work-detail{gap:6px}.work-detail h3{margin:0}.work-detail p{font-size:12px}.work-art .pixel-building{transform:scale(.75);margin-bottom:-10px}.pass-day{min-width:145px;gap:3px;padding:6px}.pass-day h3{margin:0}.pass-day button{padding:5px}.pass044{grid-template-rows:28px minmax(0,1fr)}.match-emblem{font-size:42px}.match044 h2{font-size:18px}.chest-summary p{margin:5px 0}.release-result .result-row043{padding:4px!important}} @media(max-width:700px){.release-body{grid-template-columns:126px minmax(230px,1fr) 126px;gap:5px}.release-top{font-size:11px;gap:4px}.release-links{gap:3px}.release-links button{font-size:11px}.release-side{padding:6px 4px}.release-side .eyebrow{font-size:9px}.release-side button{font-size:11px}.release-panel-head span{font-size:10px}.shop044{grid-template-columns:94px minmax(0,1fr)}.shop-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.product044 h3{font-size:12px}.work044{grid-template-columns:135px minmax(105px,1fr) minmax(215px,1.5fr)}.work-list button{font-size:11px;padding:6px 4px}.chest-inventory044{grid-template-columns:repeat(3,minmax(0,1fr))}.loot-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.pass-bar small{font-size:10px}.pass-bar button{font-size:11px}.release-notice{font-size:11px;max-width:97%;white-space:normal}.possible-cards small{font-size:9px}.release-content small{font-size:10px}} @media(prefers-reduced-motion:reduce){.release-overlay *{animation:none!important}} #result.release-result #resultMode{grid-column:1;grid-row:1}#result.release-result #resultTitle{grid-column:1;grid-row:2}#result.release-result #resultReason{grid-column:1;grid-row:3}#result.release-result #resultReward{grid-column:1;grid-row:4;align-self:start}#result.release-result #resultRewardNote{grid-column:1;grid-row:4;align-self:end}#result.release-result #again,#result.release-result #resultChest044{grid-column:1} body:has(#result:not(.hidden)) #cornerControls,body:has(#result:not(.hidden)) #controls,body:has(#result:not(.hidden)) #hud,body:has(#result:not(.hidden)) #netStatus{display:none!important} #result.release-result .result-row043{box-sizing:border-box;height:23px;min-height:0;line-height:16px;padding:3px 5px!important} body:has(#result:not(.hidden)) #toast{display:none!important} @media(orientation:portrait){.pixel-frontline038 #rotate{display:flex!important;z-index:1000}} @media(orientation:portrait){html body.pixel-frontline038.px-front-home #rotate,html body.pixel-frontline038.px-front-network #rotate{display:flex!important;z-index:1000}} .match044 .match-wait-time{min-width:165px;margin:4px 0 8px;padding:8px 14px;border:2px solid #bca16e;background:#102a36;box-shadow:3px 3px #091922;color:#f7d995;font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em} /* mobile045.css */ /* Final layout layer: preserve pixel palette, safe areas and inner-pane scrolling. */ #home.release-home,.release-overlay{padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))} .release-lobby{--accent:#94ceeb;--glow:#2c556a}.release-lobby[data-race=elf]{--accent:#b2dc8b;--glow:#365b41}.release-lobby[data-race=demon]{--accent:#e69eac;--glow:#593d54} .release-side{border-color:var(--accent);border-top-width:3px;background:linear-gradient(180deg,var(--glow),#152d37 40%)} .release-stage{position:relative;background:radial-gradient(ellipse at 50% 70%,var(--glow),transparent 70%)}.release-army{position:relative;overflow:hidden}.legion-canvas045{display:block;width:100%;height:100%;image-rendering:pixelated} .release-lobby button,.release-overlay button{min-height:36px;touch-action:manipulation}.release-center .rank-start{min-height:44px;border-width:3px;box-shadow:inset 0 2px #f4d494,inset 0 -5px #6b481f,0 3px #101e25}.release-top button{min-height:30px}.release-top button:first-child{max-width:28%;overflow-x:auto}.release-top{min-width:0} .release-lobby .release-season{min-height:24px}.release-links button{min-height:34px}.release-panel-head button{min-height:32px}.release-panel-head h2{outline:none}.release-panel-head{gap:7px}.release-panel-head span{min-width:0}.release-content{scrollbar-width:thin;scrollbar-color:#9baa89 #142b35}.release-content :is(button,select,input):focus-visible{outline:2px solid #ffe5a1;outline-offset:-2px} .release-content :is(h3,small,strong){max-width:100%}.release-content h3,.loot-card strong{overflow-x:auto;text-overflow:clip}.race-path045{color:#f5d997;font-size:12px;white-space:nowrap}.race044 .product044{justify-content:center}.product044{border-top:3px solid #b59e6c;box-shadow:inset 0 1px #dfcf9555}.product044>img{filter:drop-shadow(2px 4px #071e2980)} .work044{grid-template-columns:minmax(150px,1.2fr) minmax(130px,1.2fr) minmax(210px,1.6fr)}.work-list{scrollbar-width:thin;scrollbar-color:#899f90 #152d37}.work-list button{min-height:36px}.work-filter045,.nickname045 input{font:inherit;color:#fff1ce;background:#102b35;border:2px solid #7c9895;padding:6px;min-height:36px;border-radius:0;flex-shrink:0;max-width:100%}.work-detail{justify-content:flex-start;padding-top:12px}.work-detail>button{flex-shrink:0}.work-detail .card-source045{min-height:32px;margin-top:0;font-size:11px;background:#1c3540}.upgrade-note045{color:#ecd08e!important}.panel-back045{font-size:11px!important;padding:3px!important;flex-shrink:0}.nickname045{display:flex;flex-direction:column;justify-content:center;max-width:400px;width:100%;margin:auto;gap:12px}.nickname045 label{font-size:13px} .pass044{grid-template-rows:38px minmax(0,1fr)}.pass-bar{justify-content:flex-start}.pass-bar>button{margin-left:auto;font-size:11px}.pass-paging045{display:flex;gap:4px}.pass-paging045 button{min-width:32px}.pass-days{scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#baa778 #142a31}.pass-day{scroll-snap-align:start;min-width:150px;flex-shrink:0;background:#213c43;border-top:3px solid #b69e68}.pass-day button{min-height:34px}.pass-day button:disabled{opacity:.65}.pass-day .premium{background:#514c38}.pass-day>small{white-space:nowrap} .shop-nav button{min-height:36px}.shop-products{padding-right:3px}.probabilities summary{min-height:36px;display:flex;align-items:center;border:1px solid #6d8783}.probabilities details p{white-space:nowrap}.opening-controls button{min-height:34px}.loot-card{min-height:100px}.loot-card.tier-4{box-shadow:inset 0 0 18px #ffcf6b60,0 0 5px #ffdf8550}.loot-card strong{width:100%;text-align:center}.release-notice{pointer-events:none} /* Research: a legible graph with explicit zoom, and short, exact recipe rows. */ #atlasV3 .v3-tier-filters button,#atlasV3 .v3-racebar button,#atlasV3 .v3-zoom button{min-height:34px;white-space:nowrap}#atlasV3 .v3-zoom button{min-width:32px}#atlasV3 .recipe-path045{color:#f1d797;white-space:nowrap;overflow-x:auto}#atlasV3 .v3-mini-unit strong{white-space:nowrap}#atlasV3 .v3-mini-unit{border-top-color:#baa16c}#atlasV3 .v3-graph-unit{opacity:.8}#atlasV3 .v3-graph-unit.related{opacity:1} #atlasV3 .v3-atlas-detail .v3-mini-unit{flex-shrink:0}#atlasV3 .v3-counter{line-height:1.55}#atlasV3 .v3-counter-row{border-left:2px solid #b39b67}.codex-overlay button,#rosterPanel button,#pausePanel button{touch-action:manipulation}#rosterPanel nav button{min-height:36px}#pausePanel button{min-height:42px}.v31-trait{min-height:60px}.v31-trait-list{scrollbar-width:thin}.v31-trait-detail{scrollbar-width:thin} #network .online-card{max-height:calc(var(--view-h,100dvh) - 16px);overflow:auto;overscroll-behavior:contain}#network input,#network select,#network button{min-height:36px;font-size:12px}#network .online-room-row strong,#network .online-member strong,#onlineRoomTitle{white-space:nowrap;overflow-x:auto;min-width:0}#network .online-note,#network .online-warning{font-size:11px;line-height:1.5}#network .online-members{gap:8px}#network .online-member{min-width:0} body:has(#network:not(.hidden)) #toast,body:has(#releasePanel:not(.hidden)) #toast,body:has(.codex-overlay:not(.hidden)) #toast{display:none!important} @media(max-height:450px){ .release-lobby{grid-template-rows:34px minmax(0,1fr) 24px;gap:4px}.release-side{gap:4px;padding:5px}.release-side .eyebrow{display:none}.release-side button{min-height:33px;padding:4px;font-size:11px}.release-side>strong{font-size:12px}.release-side>small{font-size:10px}.release-brand{display:none}.release-center{grid-template-rows:22px minmax(38px,1fr) 19px 44px 11px 34px;gap:2px}.release-title{font-size:21px}.release-center .rank-start{font-size:19px}.release-test-note{font-size:9px}.release-top{padding:0 6px}.release-shell{grid-template-rows:38px minmax(0,1fr)}.release-content{padding:7px;gap:7px}.release-panel-head h2{font-size:14px}.release-panel-head span{font-size:10px}.release-panel-head button{font-size:11px;padding:4px 8px}.work-detail{gap:5px;padding-top:0}.work-detail p{font-size:12px}.work-detail h3{font-size:13px}.work-art h3{font-size:12px}.work044{grid-template-columns:150px minmax(100px,1fr) minmax(208px,1.5fr)}.work-list{gap:4px}.work-list button{font-size:11px;padding:5px 4px}.work-list .work-filter045{font-size:11px}.race044 .product044{padding:6px;gap:5px}.race044 .product044>img{height:57px}.race-path045{font-size:10px}.pass044{grid-template-rows:36px minmax(0,1fr)}.pass-bar small{font-size:9px}.pass-bar>button{font-size:10px;padding:4px}.pass-day{padding:5px;gap:3px}.pass-day h3{font-size:14px}.pass-day button{font-size:11px;padding:4px;min-height:32px}.pass-paging045{gap:3px}.pass-paging045 button{padding:3px;min-width:30px}.product044 button{font-size:12px}.release-lobby .release-season{font-size:10px}#network .online-card{padding:8px}#network .online-card header{margin:0 0 5px}#network .online-title-row{margin:4px 0}#network .online-status{margin:5px 0;padding:5px}#network .online-warning{margin:3px 0}.v3-shell .codex-header{min-height:40px;padding:4px 8px} } @media(max-width:600px){.release-body{grid-template-columns:122px minmax(0,1fr) 122px}.release-links button{padding:3px;font-size:11px}.release-panel-head{gap:5px}.release-panel-head .panel-back045+ h2{font-size:12px}.release-panel-head .panel-back045~span{font-size:9px}.release-content h3{font-size:12px}.work044{grid-template-columns:142px minmax(95px,1fr) 205px}.work-detail p{font-size:11px}.work-list button{font-size:10px}.pass-bar>small{max-width:135px;white-space:nowrap;font-size:9px}.pass-bar>button{font-size:9px}.pass-paging045 button{min-width:28px}.release-top{font-size:11px}} @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}.release-lobby *{animation:none!important}} body:has(#network:not(.hidden)) .release-notice{display:none!important} /* Fixed-width material cards keep Korean names readable; only the material strip pans. */ #atlasV3 .v3-list .v3-materials{overflow-x:auto;overflow-y:hidden;max-width:100%;justify-content:flex-start!important;scrollbar-width:thin;scrollbar-color:#b09c70 #15323b} #atlasV3 .v3-list .v3-materials>.v3-mini-unit{flex:0 0 98px!important;width:98px!important;min-width:98px!important;max-width:98px!important} #atlasV3 .v3-list .v3-plus{flex-shrink:0} #atlasV3 .v3-results .v3-result-choice,#atlasV3 .v3-results>.v3-mini-unit{flex:0 0 104px!important;min-width:104px!important;max-width:104px!important} @media(max-width:600px){.work-art h3{font-size:11px!important}} /* Five real room rows: title, rules, loadout, two players, actions. */ .pixel-frontline038 #onlineRoom{grid-template-rows:36px 24px 40px minmax(68px,1fr) 38px;gap:6px} .pixel-frontline038 #px-frontline-slots{height:100%;min-height:0;align-self:stretch} .pixel-frontline038 #roomLoadout043{padding:0} @media(orientation:landscape) and (max-height:450px){.pixel-frontline038 #onlineRoom{grid-template-rows:33px 22px 36px minmax(56px,1fr) 36px;gap:4px}.pixel-frontline038 #px-frontline-slots .px-slot{min-height:56px}.pixel-frontline038 #network .online-card{grid-template-rows:33px minmax(0,1fr) 24px;gap:5px}} .empty045{grid-column:1/-1;display:flex;min-height:130px;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:8px}.empty045 p{font-size:12px;margin:0}.empty045 button{min-width:160px} /* Connection notices belong to a running battle, never the returned lobby. */ body:has(#home:not(.hidden)) #netStatus,body:has(#home:not(.hidden)) #toast{display:none!important} /* Mobile full-bleed pass: spend pixels on the army and controls, not outer cards. */ @media(orientation:landscape) and (max-width:1100px){ #home.release-home{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)} .release-lobby{width:100%;height:100%;max-height:none;margin:0;gap:3px;grid-template-rows:36px minmax(0,1fr) 24px} .release-top{border-width:0 0 2px;padding:0 9px;background:#0f2934e8} .release-body{gap:5px;grid-template-columns:minmax(112px,1fr) minmax(0,3fr) minmax(112px,1fr);padding:0 3px} .release-side{border-width:0 1px;padding:8px 5px;gap:7px;background:linear-gradient(180deg,var(--glow),#142f3840 75%)} .release-side button{border-width:1px;min-height:38px;box-shadow:inset 0 -2px #112b34;padding:5px 3px} .release-lobby .release-season{border-width:1px 0 0;box-shadow:none;min-height:24px;padding:2px 9px} .release-links{gap:5px}.release-links button{border-width:1px;min-height:38px;box-shadow:inset 0 -2px #102731} .release-overlay{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)} .release-shell{width:100%;height:100%;border-width:0;box-shadow:none;grid-template-rows:40px minmax(0,1fr)} .release-panel-head{padding:3px 9px;background:#122b35}.release-panel-head button{min-height:34px} .release-content{padding:8px;gap:8px}.release-content .product044{border-width:1px;border-top-width:2px} .pixel-frontline038 .codex-overlay{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)} .pixel-frontline038 .codex-overlay .codex-shell{width:100%;height:100%;max-height:100%;border-width:0;box-shadow:none!important} .pixel-frontline038 #network{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)} .pixel-frontline038 #network .online-card{width:100%;max-width:100%;height:100%;max-height:100%;border-width:0;box-shadow:none;padding:7px} .pixel-frontline038 #network[data-px-stage=login] .online-card{height:auto;max-width:680px;border-width:1px} #result.release-result{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)} #result.release-result .result-card{width:100%;max-width:100%;border-width:0;box-shadow:none!important;padding:10px} #rosterPanel{top:env(safe-area-inset-top);right:env(safe-area-inset-right);bottom:env(safe-area-inset-bottom);height:auto;max-height:100%;width:min(600px,calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right)));z-index:90;border-width:0;box-shadow:none!important} } @media(orientation:landscape) and (max-height:450px){ .release-lobby{grid-template-rows:32px minmax(0,1fr) 20px;gap:3px} .release-body{grid-template-columns:108px minmax(0,1fr) 108px;gap:4px;padding:0 2px} .release-side{padding:5px 3px;gap:5px}.release-side button{min-height:36px;font-size:11px;padding:5px 2px} .release-side>strong{font-size:12px}.release-side>small{font-size:10px} .release-center{grid-template-rows:21px minmax(48px,1fr) 19px 46px 11px 36px;gap:2px} .release-title{font-size:20px}.release-league{font-size:14px}.release-center .rank-start{font-size:20px;min-height:46px} .release-links button{min-height:36px;font-size:11px;padding:4px 3px} .release-lobby .release-season{min-height:20px;font-size:10px;padding:1px 8px} .release-shell{grid-template-rows:38px minmax(0,1fr)}.release-panel-head{padding:2px 8px} .release-content{padding:7px;gap:7px}.work-list button{min-height:36px}.work-art>img{height:61%} .pass-bar>small{font-size:10px;max-width:none}.pass-bar>button{font-size:11px;padding:4px 7px}.pass-paging045 button{min-width:32px} .pass-day{min-width:162px;padding:6px;gap:4px}.pass-day button{min-height:34px;font-size:12px} .shop044{grid-template-columns:96px minmax(0,1fr)}.shop-nav button{font-size:12px;min-height:36px} .pixel-frontline038 #network .online-card{padding:5px;gap:4px}.pixel-frontline038 #onlineRoom{gap:5px;grid-template-rows:33px 22px 36px minmax(56px,1fr) 36px} } /* Reference-derived pixel icon crops; accessible names remain on every action. */ html,body,button,input,select,textarea,dialog,h1,h2,h3,p,span,small,strong{font-family:Galmuri11,Galmuri9,monospace!important} #cornerControls{display:none!important} .icon-button045{display:flex!important;align-items:center;justify-content:center;gap:5px;white-space:nowrap} .atlas-icon045{display:block;width:36px;height:36px;flex:0 0 36px;background-image:url('assets/ui-icons146.png');background-repeat:no-repeat;background-size:400% 400%;background-position:var(--sprite-x,0%) var(--sprite-y,0%);filter:url(#pixel-cutout046);image-rendering:pixelated} .icon-caption045{min-width:0;white-space:nowrap} .release-side .icon-button045{min-height:36px;padding:0 4px!important} .release-top{grid-template-columns:1fr auto 1fr 1fr auto} .social045{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;overflow:auto} .social045 p{font-size:12px;margin:0}.rank-score045{font-size:28px;color:#f2d490} .settings045{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:12px;overflow:auto}.country-label071{display:flex;flex-direction:column;gap:7px;font-size:12px;color:#dce8dc}.country-select071{width:100%;min-height:40px;padding:7px;background:#142f3b;border:1px solid #708b8e;color:#fff2d1;font:inherit} .settings-group045{display:flex;flex-direction:column;gap:12px;min-width:0}.settings-group045 h3{margin:0}.settings-group045 small{font-size:11px;line-height:1.5}.settings-group045 button{min-height:40px;white-space:nowrap} html[data-reduced-effects=true] .opening,html[data-reduced-effects=true] .loot-card{animation:none!important} @media(orientation:landscape) and (max-height:450px){ .release-body{grid-template-columns:88px minmax(0,1fr) 78px!important}.release-side{gap:3px!important}.release-side .icon-button045{min-height:39px;height:39px;font-size:10px!important;gap:2px}.release-side .atlas-icon045{width:32px;height:32px;flex-basis:32px;background-size:400% 400%;background-position:var(--sprite-x,0%) var(--sprite-y,0%)} .release-side>strong{font-size:11px}.release-side .eyebrow,.release-brand{display:none!important}.release-side:last-child .icon-button045{justify-content:flex-start}.release-side:first-child .icon-button045{justify-content:flex-start} .shop-nav .atlas-icon045{width:28px;height:28px;flex-basis:28px}.shop-nav .icon-button045{justify-content:flex-start;font-size:11px!important;gap:2px}.release-links button{min-height:36px} } /* Final transparent cutouts replace mockup crops and CSS item stand-ins. Alpha transfer removes generated edge haze without losing interior holes. */ .pixel-chest,.pixel-building{background-image:url('assets/ui-icons146.png')!important;background-size:400% 400%!important;background-repeat:no-repeat!important;background-color:transparent!important;border:0!important;box-shadow:none!important;image-rendering:pixelated;filter:url(#pixel-cutout046);width:80px;height:80px;position:relative;flex-shrink:0} .pixel-chest{background-position:0% 0%!important;margin:4px auto!important} .pixel-chest.elite{filter:url(#pixel-cutout046) hue-rotate(105deg)} .pixel-chest.royal,.pixel-chest.promotion{filter:url(#pixel-cutout046) hue-rotate(220deg)} .pixel-chest:after,.pixel-building:before,.pixel-building:after{display:none!important} .pixel-chest.opened{background-position:66.666667% 100%!important} .opening044>.pixel-chest{width:64px!important;height:64px!important;margin:0 auto!important} .pixel-building{width:128px;height:128px;background-position:0% 100%!important} .pixel-building.tower{width:128px;height:128px;background-position:33.333333% 100%!important} .loot-icon046{width:48px;height:48px;flex-basis:48px} .chest-glow{background:transparent!important;box-shadow:-44px -16px #e9cf79,44px -8px #ffeec0,-38px 18px #e9cf79,38px 22px #ffeec0,0 -28px #fff1b0;left:50%;top:30px;width:3px;height:3px} .work-art{background:none!important}.release-stage,.release-army{image-rendering:pixelated} @media(orientation:landscape) and (max-height:450px){.product044>.pixel-chest{width:64px;height:64px}.work-art .pixel-building{transform:none;width:96px;height:96px;margin:0}.chest-summary>.pixel-chest{width:64px;height:64px}} @media(orientation:portrait) and (max-width:450px){ #releaseLobby .top047{gap:3px!important;padding:0 5px!important} #releaseLobby .top047 button:first-of-type{max-width:29%!important;font-size:10px!important;overflow:hidden!important;text-overflow:ellipsis} #releaseLobby .battle-actions047{padding:3px 5px!important;gap:4px!important;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr)!important} #releaseLobby .battle-actions047 button{padding:2px!important;font-size:10px!important;letter-spacing:-.4px!important} #releaseLobby .battle-actions047 #rankStart{font-size:15px!important;letter-spacing:-.6px!important} } /* courtyard047.css */ /* Covenant Rise: selected courtyard concept. Background art is scenery only; every action, counter, portrait and army remains live and independently placed. */ .pixel-frontline038 #home.release-home{padding:0!important;background:#112431!important} #releaseLobby{position:relative;isolation:isolate;box-sizing:border-box;width:100%;height:100%;max-width:none;max-height:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:grid;grid-template-rows:42px minmax(0,1fr) 64px 30px;gap:0;overflow:hidden;background:#36535a url('assets/lobby-human047.webp') center/cover no-repeat;image-rendering:pixelated;--landmark:112px;--tag:#102d42;--trim:#e9c46b} #releaseLobby[data-race=elf]{background-image:url('assets/lobby-elf047.webp');--tag:#123c32;--trim:#c9e197} #releaseLobby[data-race=demon]{background-image:url('assets/lobby-demon047.webp');--tag:#302039;--trim:#dba4ce} #releaseLobby .top047{display:flex;height:100%;padding:0 10px;gap:10px;border:0;border-bottom:2px solid #7e9b9e;background:#102737ed;box-sizing:border-box;font-size:14px;justify-content:flex-start;color:#fff2d1} #releaseLobby .profile047{width:38px;height:38px;object-fit:contain;image-rendering:pixelated;border:1px solid #d9bd72;background:#193a4a;flex-shrink:0} #releaseLobby .top047 button:first-of-type{max-width:26%;font-size:14px;min-height:38px;white-space:nowrap;padding:0} #releaseLobby .gold047{margin-left:auto;color:#ffe5a0;white-space:nowrap} #releaseLobby .top047 .icon-button045{width:42px;height:40px;min-height:40px;padding:0;border:0;background:transparent;box-shadow:none;flex-shrink:0} #releaseLobby .top047 .icon-caption045{display:none}#releaseLobby .top047 .atlas-icon045{width:36px;height:36px;flex-basis:36px} #releaseLobby .world047{display:block!important;position:relative;min-height:0;min-width:0;overflow:visible} #releaseLobby .title047{position:absolute;z-index:2;left:50%;top:3%;transform:translateX(-50%);font-size:clamp(21px,3.2vw,40px);color:#fff0bf;background:var(--tag);padding:3px 18px;margin:0;line-height:1.15;border:2px solid var(--trim);box-shadow:2px 3px #0a1724;white-space:nowrap;letter-spacing:1px} #releaseLobby .landmark047{position:absolute;z-index:3;display:flex!important;flex-direction:column;align-items:center;gap:0;width:calc(var(--landmark) + 18px);height:calc(var(--landmark) + 32px);min-height:44px;padding:0;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible;transform:translateX(-50%);touch-action:manipulation} #releaseLobby .landmark047 .atlas-icon045{width:var(--landmark);height:var(--landmark);flex:0 0 var(--landmark);filter:url(#pixel-cutout046) drop-shadow(2px 3px #071a2d88);background-size:400% 400%} #releaseLobby .landmark047 .icon-caption045{display:block;line-height:1;min-width:70px;padding:7px 10px;background:var(--tag);color:#fff4cb;border:2px solid var(--trim);box-shadow:2px 2px #0b1d2b;font-size:16px;text-align:center} #releaseLobby .landmark047:hover .icon-caption045,#releaseLobby .landmark047:focus-visible .icon-caption045{color:#fff;background:#48604a} #releaseLobby .guild047{left:15%;top:10%}#releaseLobby .friends047{left:85%;top:10%} #releaseLobby .shop047{left:12%;bottom:6%}#releaseLobby .chest047{left:88%;bottom:6%} #releaseLobby[data-race=elf] .guild047 .atlas-icon045{filter:url(#pixel-cutout046) hue-rotate(70deg)} #releaseLobby[data-race=demon] .guild047 .atlas-icon045{filter:url(#pixel-cutout046) hue-rotate(295deg)} #releaseLobby .chest-count047{position:absolute;right:12px;top:4px;background:#a83744;border:2px solid #fff0cf;color:white;font-size:16px;min-width:22px;line-height:24px;text-align:center;z-index:1} #releaseLobby .stage047{position:absolute;left:22%;top:16%;width:56%;height:68%;background:none!important;pointer-events:none} #releaseLobby .stage047 .release-army{height:100%;width:100%;background:none!important} #releaseLobby .legion047{position:absolute;left:50%;bottom:47px;transform:translateX(-50%);z-index:3;min-height:36px;min-width:126px;background:var(--tag);border:2px solid var(--trim);color:#fff2cf;font-size:15px;padding:3px 14px;box-shadow:2px 3px #081c2b} #releaseLobby .rank047{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);min-height:36px;min-width:240px;font-size:16px;white-space:nowrap;background:var(--tag);border:2px solid var(--trim);color:#ffe9b1;padding:3px 14px;box-shadow:2px 3px #081c2b} #releaseLobby .battle-actions047{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.8fr);gap:8px;align-items:center;padding:3px max(12px,16%);z-index:4;min-width:0} #releaseLobby .battle-actions047 button{height:100%;min-height:44px;white-space:nowrap;padding:3px 8px;font-size:16px;border:2px solid #9ec0d6;background:#12354c;color:#fff7dd;box-shadow:inset 0 -4px #092131,2px 3px #071725} #releaseLobby .battle-actions047 #rankStart{font-size:24px;background:#b98122;border:3px solid #ffdf85;color:#fff8d6;text-shadow:2px 2px #6a3917;box-shadow:inset 0 3px #f9ce65,inset 0 -5px #84501c,2px 3px #1e2026} #releaseLobby .footer047{display:flex;align-items:center;gap:8px;padding:0 10px;min-width:0;z-index:4} #releaseLobby .release-season{width:auto;max-width:70%;padding:2px 9px;background:#102b3cef;border:1px solid #a7bbad;min-height:24px;color:#fff2cf;font-size:12px;white-space:nowrap} #releaseLobby .footer047 small{margin-left:auto;padding:2px 5px;background:#102b3ce8;color:#e7f0da;font-size:10px;white-space:nowrap} #releaseLobby .resume047:not(.hidden){position:absolute;right:8px;top:45px;z-index:5;min-height:32px;background:#153847;color:#fff3d1;font-size:11px} .legion-menu047{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:center;gap:14px;padding:20px} .legion-menu047 .icon-button045{min-height:130px;flex-direction:column;gap:12px;font-size:16px;background:#163545;border:2px solid #b9a36b} .legion-menu047 .atlas-icon045{width:64px;height:64px;flex-basis:64px} @media(orientation:landscape) and (max-height:450px){ #releaseLobby{grid-template-rows:34px minmax(0,1fr) 50px 24px;--landmark:clamp(56px,18vh,80px)} #releaseLobby .top047{padding:0 6px;gap:7px;font-size:11px}#releaseLobby .profile047{width:30px;height:30px}#releaseLobby .top047 button:first-of-type{font-size:12px;min-height:32px;max-width:23%}#releaseLobby .top047 .icon-button045{height:32px;min-height:32px;width:34px}#releaseLobby .top047 .atlas-icon045{width:30px;height:30px;flex-basis:30px} #releaseLobby .title047{top:1%;font-size:20px;padding:2px 12px} #releaseLobby .guild047,#releaseLobby .friends047{top:7%}#releaseLobby .shop047,#releaseLobby .chest047{bottom:10%} #releaseLobby .landmark047{height:calc(var(--landmark) + 26px)}#releaseLobby .landmark047 .icon-caption045{font-size:12px;padding:4px 9px;min-width:54px} #releaseLobby .stage047{top:16%;height:68%;left:22%;width:56%} #releaseLobby .legion047{min-width:108px;min-height:30px;height:30px;bottom:38px;font-size:12px;padding:2px 10px} #releaseLobby .rank047{min-height:30px;height:30px;min-width:196px;font-size:12px;bottom:3px;padding:2px 8px} #releaseLobby .battle-actions047{padding:2px 16%;gap:6px}#releaseLobby .battle-actions047 button{font-size:12px;padding:2px 5px}#releaseLobby .battle-actions047 #rankStart{font-size:19px} #releaseLobby .release-season{font-size:10px;min-height:21px}#releaseLobby .footer047{padding:0 6px}#releaseLobby .footer047 small{font-size:9px} #releaseLobby .chest-count047{font-size:11px;min-width:16px;line-height:18px;right:5px;top:0} #releaseLobby .resume047:not(.hidden){top:36px;font-size:10px;min-height:28px} .legion-menu047{gap:8px;padding:12px}.legion-menu047 .icon-button045{min-height:104px;font-size:13px}.legion-menu047 .atlas-icon045{width:52px;height:52px;flex-basis:52px} } @media(min-aspect-ratio:2/1) and (max-height:450px){#releaseLobby .battle-actions047{padding-left:24%;padding-right:24%}} #releaseLobby #rankStart{font-family:Galmuri11,monospace!important;font-weight:700!important}#releaseLobby .top047 .profile047{object-fit:cover} #releaseLobby .battle-actions047 #rankStart{border:0;background:transparent url('assets/rank-button047.png') center/100% 145% no-repeat;box-shadow:none;text-shadow:1px 2px #643112,1px -1px #643112;color:#fff9df;image-rendering:pixelated} #releaseLobby .release-season{display:flex;align-items:center;gap:8px}.pass-progress047{width:70px;height:8px;accent-color:#e9bb57}.pass-progress047::-webkit-progress-bar{background:#183447}.pass-progress047::-webkit-progress-value{background:#e9bb57} /* battle048.css */ /* Landscape battle: scenery above, fixed thumb shelf below. All scrolling is local. */ .battle048{--dock048:112px;--skill-width048:128px;--draw-width048:100px} .battle048 #hud{padding:5px 7px;gap:8px;grid-template-columns:1fr 86px 1fr;align-items:start} .battle048 #hud .team{min-height:34px;height:34px;padding:4px 7px;border:1px solid #718d96;background:#102c3beb;box-shadow:inset 0 -2px #274452} .battle048 #hud .team small{font-size:11px;line-height:14px;color:#e6f3f0} .battle048 #hud .team strong{font-size:12px}.battle048 #hud .health{height:5px} .battle048 #hud .clock{min-width:0;width:86px;padding:3px 4px 5px;background:#0a283bed;border:1px solid #69848e;box-shadow:none} .battle048 #hud .clock b{font-size:26px;line-height:27px}.battle048 #hud .clock small{font-size:9px}.battle048 #hud .clock span{font-size:10px;white-space:nowrap} .battle048 #controls:before{content:'';position:absolute;bottom:0;left:0;right:0;height:var(--dock048);background:#0c2433;border-top:2px solid #b59855;box-shadow:inset 0 2px #1a4050;pointer-events:none} .battle048 .skill-controls{left:calc(var(--safe-l) + 5px);bottom:calc(var(--safe-b) + 16px);gap:5px;width:calc(var(--skill-width048) - 10px)} .battle048 .skill-controls .skill{width:calc((var(--skill-width048) - 15px)/2);height:64px;border:2px solid #6993a0;border-radius:0;background:#163b4c;box-shadow:inset 2px 2px #2c5869} .battle048 .skill svg{width:35px;height:35px}.battle048 .skill .button-name{font-size:10px;bottom:-13px;white-space:nowrap}.battle048 .skill .charges{font-size:14px;right:0;top:-10px;background:#132a38;border:1px solid #d5b571} .battle048 #summon{left:auto;right:calc(var(--safe-r) + 5px);bottom:calc(var(--safe-b) + 7px);width:calc(var(--draw-width048) - 10px);height:calc(var(--dock048) - 16px);border:2px solid #f3ce7c;border-radius:0;background:#9b6b29 url('assets/rank-button047.png') center/100% 145%;box-shadow:inset 2px 2px #ffdf98;overflow:visible} .battle048 #summon canvas{width:48px;height:42px;top:0}.battle048 #summon strong{font-size:14px;bottom:24px}.battle048 #summon .tickets{bottom:0;font-size:14px;min-width:50px;border-radius:0}.battle048 #summon .plus{right:5px;top:8px;font-size:19px}.battle048 #summon .recharge{bottom:-5px} .battle048 #combo{top:auto!important;bottom:calc(100vh - var(--view-y) - var(--view-h) + var(--safe-b) + 5px);left:calc(var(--view-x) + var(--safe-l) + var(--skill-width048));transform:none;width:calc(var(--view-w) - var(--safe-l) - var(--safe-r) - var(--skill-width048) - var(--draw-width048));max-width:none;height:calc(var(--dock048) - 11px);max-height:none;padding:0 4px;border:0!important;background:#0c2433;box-shadow:none!important;overflow:hidden} .battle048 #combo header{height:27px;min-height:0;display:flex;gap:3px;padding:0;margin:0;border:0} .battle048 #recipeMaterials{display:flex;align-items:center;gap:3px;min-width:0;flex:1;overflow:auto;scrollbar-width:none;font-size:10px} .battle048 .material048{flex:0 0 auto;display:flex;align-items:center;gap:2px;min-height:26px;padding:0 3px;border:0;background:#142f3e;white-space:nowrap;font-size:10px;color:#d7e7e7} .battle048 .material048 img{width:24px;height:24px;object-fit:contain;image-rendering:pixelated}.battle048 .combo-tools{gap:1px;flex:none}.battle048 #combo .combo-tools button{height:26px;min-height:26px;padding:1px 3px;font-size:10px} .battle048 #choices,.battle048 #choices[data-wide039="true"]{height:calc(100% - 27px);display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px!important;overflow:auto;padding:0;scrollbar-width:thin} .battle048 #choices .choice,.battle048 #choices[data-wide039="true"] .choice{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr) 13px 10px!important;gap:0!important;min-width:0!important;min-height:0!important;height:100%!important;padding:2px!important;border:1px solid #4f8396!important;background:#173645;text-align:center!important;box-shadow:inset 1px 1px #325166!important} .battle048 #choices .choice img,.battle048 #choices[data-wide039="true"] .choice img{width:38px!important;height:25px!important;grid-row:1!important;grid-column:1!important;justify-self:center;align-self:center} .battle048 #choices .choice strong,.battle048 #choices[data-wide039="true"] .choice strong{grid-row:2!important;grid-column:1!important;font-size:11px!important;line-height:13px!important;white-space:nowrap} .battle048 #choices .choice .tier,.battle048 #choices .choice>small:not(.combo-synergy),.battle048 .combo-foot,.battle048 .branch-guide039{display:none!important} .battle048 #choices .choice .combo-synergy{display:block;grid-row:3!important;grid-column:1!important;min-height:0!important;line-height:10px!important;font-size:9px!important;color:#cce99c;overflow:auto;white-space:nowrap} .battle048 #comboBadge{left:50%;right:auto;bottom:calc(var(--safe-b) + 22px);transform:translateX(-50%);height:44px;min-width:96px;border-radius:0;background:#234853;border:1px solid #8bb9bd} .battle048 .recipe-book048{position:absolute;bottom:calc(var(--safe-b) + 4px);left:calc(var(--safe-l) + var(--skill-width048));height:24px;min-height:24px;font-size:10px;padding:2px 8px;background:#183b48;border:1px solid #547383;pointer-events:auto} .battle048:has(#combo:not(.hidden)) .recipe-book048{display:none} .battle048 #menuButton{left:auto;right:calc(var(--safe-r) + 5px);top:calc(var(--hud-edge) + 5px);width:38px;height:38px;background:#163240;border:1px solid #567881}.battle048 #menuButton .atlas-icon045{width:30px;height:30px;display:block} .battle048 #rosterButton{right:calc(var(--safe-r) + 5px);top:calc(var(--hud-edge) + 47px);width:38px;height:38px}.battle048 #rosterButton svg{width:20px;height:20px}.battle048 #rosterButton span{font-size:9px} .battle048 #synergyHUD{display:none!important} .battle048 .synergy-rail048{position:absolute;left:calc(var(--safe-l) + 3px);top:calc(var(--hud-edge) + 3px);bottom:calc(var(--dock048) + 7px);width:91px;display:flex;flex-direction:column;gap:3px;overflow-y:auto;scrollbar-width:none;pointer-events:auto} .battle048 .rail-title048{font-size:9px;color:#e0efe3;text-shadow:1px 1px #082130} .battle048 .synergy-pill048{display:flex;align-items:center;gap:2px;width:100%;min-height:30px;padding:1px 2px;border:1px solid #5b7178;border-radius:0;background:#102839e6;color:#a8bdc3;text-align:left;flex:none} .battle048 .synergy-pill048.active{border-color:#c6b274;background:#354639eb;color:#ffeab0}.battle048 .synergy-pill048 img{width:25px;height:26px;object-fit:contain;image-rendering:pixelated;flex:none}.battle048 .synergy-pill048 span{min-width:0;flex:1}.battle048 .synergy-pill048 strong{display:block;font-size:10px;white-space:nowrap;font-weight:normal}.battle048 .synergy-pill048 small{display:block;font-size:8px;white-space:nowrap;color:#c1d2cc} .battle048 .toast{bottom:calc(100vh - var(--view-y) - var(--view-h) + var(--dock048) + 6px);padding:3px 7px;font-size:10px;max-width:calc(var(--view-w) - 200px)} .battle048 .merge-feed{top:calc(var(--view-y) + var(--hud-edge) + 2px);max-width:150px;pointer-events:none}.battle048 .merge-feed.mine{left:calc(var(--view-x) + var(--safe-l) + 100px)}.battle048 .merge-feed.enemy{right:calc(100vw - var(--view-x) - var(--view-w) + var(--safe-r) + 48px)}.battle048 .merge-notice{max-width:146px;padding:3px;min-height:0}.battle048 .merge-notice img{width:25px;height:28px}.battle048 .merge-notice strong{font-size:10px}.battle048 .merge-notice small,.battle048 .merge-notice span{font-size:8px} .battle048 #aimHint{top:auto;bottom:calc(var(--dock048) + 6px);font-size:11px;background:#172d3ae8;padding:5px 10px}.battle048 #aimHint small{display:none} .battle048 #atlasV3 .flow-open048{grid-template-columns:1fr!important}.battle048 #atlasV3 .flow-open048>.v3-atlas-detail{display:none!important}.battle048 #atlasV3 .flow-open048>.v3-atlas-view{display:flex!important} .flow048{min-height:0;display:flex;flex-direction:column;padding:5px!important;overflow:hidden!important}.flow-nav048{display:flex;align-items:center;gap:5px;flex:none;height:32px}.flow-nav048 strong{flex:1;min-width:0;white-space:nowrap;font-size:12px}.flow-nav048 button{min-height:30px;font-size:11px;padding:3px 8px} .flow-columns048{display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,1.1fr) minmax(0,1fr);gap:8px;min-height:0;flex:1;margin-top:6px}.flow-side048,.flow-hero048{min-width:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}.flow-side048 h3{position:sticky;top:0;background:#152c35;margin:0 0 4px;padding:5px;font-size:12px;z-index:1}.flow-node048{display:flex;align-items:center;gap:3px;width:100%;min-height:47px;padding:3px;margin-bottom:4px;border:1px solid #627d7e;background:#1c3841;text-align:left;color:#e8e4cb}.flow-node048 img{width:38px;height:38px;object-fit:contain;image-rendering:pixelated;flex:none}.flow-node048 span{min-width:0;overflow:auto}.flow-node048 strong{display:block;font-size:11px;white-space:nowrap;font-weight:normal}.flow-node048 small{display:block;font-size:10px;white-space:nowrap} .flow-hero048{display:flex;flex-direction:column;align-items:center;gap:4px;border-left:1px solid #43616a;border-right:1px solid #43616a;padding:4px 6px}.flow-hero048>img{width:68px;height:61px;object-fit:contain;image-rendering:pixelated;flex:none}.flow-name048{font-size:14px;white-space:nowrap}.flow-hero048 small{font-size:10px;text-align:center}.flow-skill048{font-size:10px;margin:2px 0;text-align:center;line-height:1.5}.flow-hero048 select{width:100%;font:10px Galmuri11,monospace;min-height:30px;background:#142a37;color:#eef2dd;border:1px solid #758878}.flow-hero048 button{width:100%;min-height:36px;white-space:nowrap}.flow-trait048{color:#ddca8a}.flow-base048{font-size:11px;padding:6px;line-height:1.5}.flow-side048>small{font-size:10px} @media(max-height:450px){.battle048{--dock048:88px;--skill-width048:103px;--draw-width048:78px}.battle048 #hud{grid-template-columns:1fr 72px 1fr;padding:3px 5px;gap:5px}.battle048 #hud .clock{width:72px}.battle048 #hud .clock b{font-size:22px;line-height:23px}.battle048 #hud .team{height:31px;min-height:31px}.battle048 #hud .team small{font-size:10px}.battle048 .skill-controls .skill{height:48px}.battle048 .skill svg{width:29px;height:29px}.battle048 #summon canvas{width:40px;height:36px}.battle048 #summon strong{font-size:12px;bottom:23px}.battle048 #summon .tickets{font-size:12px}.battle048 #combo header{height:25px}.battle048 #choices,.battle048 #choices[data-wide039="true"]{height:calc(100% - 25px)}.battle048 #choices .choice img,.battle048 #choices[data-wide039="true"] .choice img{height:21px!important;width:32px!important}.battle048 .synergy-rail048{width:85px}.battle048 .synergy-pill048 strong{font-size:9px}.battle048 .synergy-pill048 img{width:22px}.battle048 .flow-hero048>img{width:51px;height:44px}.flow-name048{font-size:12px}.flow-columns048{gap:4px;grid-template-columns:minmax(0,1fr) minmax(130px,1.05fr) minmax(0,1fr)}.flow-node048{min-height:44px}.flow-node048 img{width:30px;height:33px}.flow048 .flow-nav048{height:28px}.flow-hero048{gap:2px;padding:2px 4px}.flow-skill048{font-size:9px}.battle048 #atlasV3 .codex-header{min-height:32px}.battle048 #atlasV3 .v3-racebar button{min-height:28px;padding:3px 7px;font-size:10px}} .battle048 #hud{height:auto;min-height:0}.battle048 #hud .clock{height:54px;min-height:0;margin:0;display:flex;flex-direction:column;justify-content:center}.battle048 #hud .clock small{line-height:10px}.battle048 #hud .clock span{line-height:12px}.battle048 #controls .skill-controls{z-index:1} .battle048 .combo-preview048{position:absolute;bottom:calc(var(--safe-b) + 5px);left:calc(var(--safe-l) + var(--skill-width048));right:calc(var(--safe-r) + var(--draw-width048));height:calc(var(--dock048) - 11px);padding:0 4px;pointer-events:auto}.battle048 .combo-preview048>header{height:25px;font-size:10px;color:#d8ce99;display:flex;align-items:center;padding-left:3px}.battle048 .preview-targets048{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;height:calc(100% - 25px)}.battle048 .preview-choice048{display:grid;grid-template-rows:1fr 13px 10px;justify-items:center;align-items:center;gap:0;min-width:0;min-height:44px;padding:2px;border:1px solid #476772;background:#16313e}.battle048 .preview-choice048 img{width:30px;height:24px;object-fit:contain;image-rendering:pixelated}.battle048 .preview-choice048 strong{font-size:10px;line-height:13px;white-space:nowrap;font-weight:normal}.battle048 .preview-choice048 small{font-size:9px;line-height:10px;color:#b5c8c8}.battle048:has(#combo:not(.hidden)) .combo-preview048{display:none}.battle048 #comboBadge{left:auto;right:calc(var(--safe-r) + var(--draw-width048) + 4px);bottom:calc(var(--safe-b) + var(--dock048) - 32px);transform:none;min-width:62px;height:24px;min-height:24px;padding:1px 5px;font-size:10px;z-index:2}.battle048 .recipe-book048{left:calc(var(--safe-l) + var(--skill-width048) + 64px);bottom:calc(var(--safe-b) + var(--dock048) - 32px);z-index:2} .battle048 .settings045:has(.battle-settings048){grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:9px}.battle048 .settings045:has(.battle-settings048) .settings-group045{gap:10px}.battle048 .battle-settings048 button:last-child{color:#ffe0c7;border-color:#bd8b70}.battle048 .settings045:has(.battle-settings048) button{font-size:12px;min-height:44px;padding:4px} .flow-range051{white-space:nowrap;color:#e9d9a6} /* battle049.css */ /* One landscape screen: army shelf at rest, craft choices only when available. */ .battle049{--skill-width048:clamp(106px,17.5vw,238px);--draw-width048:clamp(94px,15vw,205px);--dock-header049:38px;--card-name049:23px;--card-info049:19px} .battle049 #controls:before{box-sizing:border-box;border:12px solid transparent;border-image:url('assets/dock-frame049.png') 160 stretch;background:#081e2b;box-shadow:none} .battle049 #combo{height:calc(var(--dock048) - 12px);padding:0 5px;background:transparent} .battle049 #combo header{height:var(--dock-header049);gap:5px} .battle049 #recipeMaterials{overflow-x:auto;overflow-y:hidden;touch-action:pan-x;gap:4px} .battle049 .material048{height:32px;font-size:12px;padding:0 5px;border:1px solid #3d6574;background:#112e3c} .battle049 .material048 img{width:25px;height:28px} .battle049 .material-plus049{font-size:16px;color:#dbc584;flex:none} .battle049 #combo .combo-tools{gap:3px} .battle049 #combo .combo-tools button{height:32px;min-height:32px;font-size:12px;padding:2px 5px;white-space:nowrap} .battle049 .combo-book049{background:#183c4e;border:1px solid #ac9255;color:#f2db9f} .battle049 #nextRecipe:disabled{opacity:.55} .battle049 #choices,.battle049 #choices[data-wide039="true"]{height:calc(100% - var(--dock-header049));gap:8px!important;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;scroll-snap-type:x proximity;grid-auto-flow:column;grid-auto-columns:calc((100% - 16px)/3);grid-template-columns:none!important} .battle049 #choices .choice,.battle049 #choices[data-wide039="true"] .choice,.battle049 .army-card049{position:relative;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr) var(--card-name049) var(--card-info049)!important;gap:0!important;padding:7px 7px 8px!important;border:0!important;border-radius:0;box-shadow:none!important;background:#142d3b url('assets/merge-panels049.webp') 100% 93.94%/300% 206.45%;text-align:center;overflow:hidden;scroll-snap-align:start;min-height:0} .battle049 [data-theme=fire]{background-position:0 0!important}.battle049 [data-theme=ice]{background-position:50% 0!important}.battle049 [data-theme=arcane]{background-position:100% 0!important}.battle049 [data-theme=nature]{background-position:0 93.94%!important}.battle049 [data-theme=blood]{background-position:50% 93.94%!important}.battle049 [data-theme=royal]{background-position:100% 93.94%!important} .battle049 #choices .choice img,.battle049 #choices[data-wide039="true"] .choice img,.battle049 .army-card049 img{width:100%!important;height:100%!important;min-height:0;max-height:128px;object-fit:contain;align-self:stretch;image-rendering:pixelated;filter:drop-shadow(1px 2px #08141c)} .battle049 #choices .choice strong,.battle049 #choices[data-wide039="true"] .choice strong,.battle049 .army-card049 strong{width:100%;max-width:100%;font-size:16px!important;line-height:var(--card-name049)!important;font-weight:700;white-space:nowrap;color:#fff2cc;background:#081626de;text-shadow:1px 1px #000;overflow:visible} .battle049 #choices .choice .combo-synergy{width:100%;display:flex!important;align-items:center;justify-content:center;gap:7px;line-height:var(--card-info049)!important;font-size:12px!important;white-space:nowrap;overflow:visible;background:#081626de;color:#c8dae2} .battle049 .choice-delta049.gain{color:#b7efab}.battle049 .choice-delta049.loss{color:#ffc6aa} .battle049 #choices .choice:active,.battle049 .army-card049:active{filter:brightness(1.3);transform:translateY(1px)} .battle049 #choices .choice:focus-visible,.battle049 .army-card049:focus-visible{outline:2px solid #ffe19d;outline-offset:-3px} .battle049 .army-shelf049{height:calc(var(--dock048) - 12px);padding:0 5px} .battle049 .army-shelf049>header{height:var(--dock-header049);font-size:13px;color:#e7dbb5} .battle049 .army-cards049{height:calc(100% - var(--dock-header049));display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:clamp(112px,18vw,166px);gap:8px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:thin} .battle049 .army-card049 small{font-size:12px;line-height:var(--card-info049);color:#c6dce4;white-space:nowrap;background:#081626de;width:100%} .battle049 .army-empty049{grid-column:1/4;align-self:center;font-size:13px;color:#b8d2d9;white-space:nowrap} .battle049 #comboBadge{bottom:calc(var(--safe-b) + var(--dock048) - 43px);height:32px;min-height:32px;font-size:12px;border-color:#e0bb73;background:#493e29} .battle049:has(#combo:not(.hidden)) #comboBadge{display:none} .battle049 .recipe-book048{left:calc(var(--safe-l) + var(--skill-width048) + 116px);bottom:calc(var(--safe-b) + var(--dock048) - 43px);height:32px;min-height:32px;font-size:12px} .battle049 .skill-controls{left:calc(var(--safe-l) + 9px);bottom:calc(var(--safe-b) + 29px);width:calc(var(--skill-width048) - 18px);gap:8px} .battle049 .skill-controls .skill{width:calc((var(--skill-width048) - 26px)/2);height:calc(var(--dock048) - 66px);max-height:142px;background:#123749;border-color:#8bd0df} .battle049 .skill svg{width:70%;height:70%;max-width:80px;max-height:80px} .battle049 .skill .button-name{font-size:13px;line-height:17px;bottom:-20px;color:#fff1c9} .battle049 .skill .charges{font-size:18px;padding:3px 6px;right:2px;top:-17px} .battle049 #summon{right:calc(var(--safe-r) + 9px);bottom:calc(var(--safe-b) + 16px);width:calc(var(--draw-width048) - 18px);height:calc(var(--dock048) - 32px);background-size:100% 145%;background-color:transparent;border:0;box-shadow:none} .battle049 #summon canvas{height:min(57%,calc(100% - 50px));width:86%;top:3px;left:7%;transform:none;object-fit:contain} .battle049 #summon strong{bottom:29px;font-size:24px;line-height:28px}.battle049 #summon .plus{font-size:28px;right:10px;top:16px}.battle049 #summon .tickets{bottom:-5px;font-size:21px;line-height:27px;min-width:70%;border:1px solid #e9c586}.battle049 #summon .recharge{bottom:-9px} .battle049 .flow-node048{min-height:52px;gap:5px;padding:4px}.battle049 .flow-node048 strong{font-size:13px}.battle049 .flow-node048 small{font-size:11px}.battle049 .flow-hero048>img{width:80px;height:76px}.battle049 .flow-name048{font-size:16px}.battle049 .flow-skill048{font-size:11px}.battle049 .flow-hero048 button{min-height:42px;font-size:13px} @media(max-height:450px){ .battle049{--dock-header049:34px;--card-name049:17px;--card-info049:13px} .battle049 .material048{font-size:11px;height:30px;gap:2px;padding:0 3px}.battle049 .material048 img{width:20px;height:25px} .battle049 #combo .combo-tools button{font-size:10px;height:30px;min-height:30px;padding:2px 3px}.battle049 #combo .combo-tools{gap:2px} .battle049 #choices,.battle049 #choices[data-wide039="true"]{gap:5px!important;grid-auto-columns:calc((100% - 10px)/3)} .battle049 #choices .choice,.battle049 #choices[data-wide039="true"] .choice,.battle049 .army-card049{padding:4px 5px 5px!important} .battle049 #choices .choice strong,.battle049 #choices[data-wide039="true"] .choice strong{font-size:13px!important} .battle049 .army-card049 strong{font-size:11px!important} .battle049 #choices .choice .combo-synergy{font-size:10px!important;gap:5px}.battle049 .army-card049 small{font-size:11px} .battle049 .army-shelf049>header{font-size:11px}.battle049 .army-cards049{gap:5px} .battle049 #comboBadge,.battle049 .recipe-book048{bottom:calc(var(--safe-b) + var(--dock048) - 39px);height:30px;min-height:30px;font-size:11px} .battle049 .recipe-book048{left:calc(var(--safe-l) + var(--skill-width048) + 120px)} .battle049 .skill-controls{left:calc(var(--safe-l) + 7px);bottom:calc(var(--safe-b) + 28px);width:calc(var(--skill-width048) - 14px);gap:5px}.battle049 .skill-controls .skill{width:calc((var(--skill-width048) - 19px)/2);height:calc(var(--dock048) - 54px)} .battle049 .skill .button-name{font-size:10px;bottom:-18px}.battle049 .skill .charges{font-size:15px;top:-14px;right:-1px} .battle049 #summon{right:calc(var(--safe-r) + 7px);bottom:calc(var(--safe-b) + 15px);width:calc(var(--draw-width048) - 14px);height:calc(var(--dock048) - 29px)}.battle049 #summon strong{font-size:18px;line-height:21px;bottom:23px}.battle049 #summon .plus{font-size:23px;top:10px;right:5px}.battle049 #summon .tickets{font-size:17px;line-height:23px} .battle049 .flow-hero048>img{width:65px;height:57px}.battle049 .flow-name048{font-size:14px}.battle049 .flow-node048 strong{font-size:12px}.battle049 .flow-node048 img{width:35px;height:38px} } /* Product collections page sideways within the fixed landscape shell. */ .battle049 .shop-products,.battle049 .chest-inventory044{grid-template-columns:none;grid-template-rows:minmax(0,1fr);grid-auto-flow:column;grid-auto-columns:minmax(176px,1fr);align-content:stretch;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;touch-action:pan-x;overscroll-behavior-x:contain} .battle049 .shop-products .product044,.battle049 .chest-inventory044 .product044{scroll-snap-align:start;min-height:0;justify-content:center} .battle049 .loot-cards{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(112px,1fr);grid-template-rows:minmax(0,1fr);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;touch-action:pan-x} .battle049 .loot-card{scroll-snap-align:start} .battle049 .pass-days{overflow-x:auto;overflow-y:hidden;touch-action:pan-x;overscroll-behavior-x:contain} .battle049 .skill-art049{width:84%;height:84%;max-width:92px;max-height:92px;object-fit:contain;image-rendering:pixelated;pointer-events:none} .battle049 .shop-nav{min-height:0;display:grid;grid-template-rows:repeat(6,minmax(0,1fr));gap:5px;overflow:hidden} .battle049 .shop-nav button{min-height:0!important;height:100%;padding:3px 4px!important;white-space:nowrap} .battle049 .skill-controls .skill{padding:0!important} /* buildings050.css */ /* Three race choices stay in one horizontal row above the landscape workshop. */ .work044{grid-template-rows:40px minmax(0,1fr)} .work-races050{grid-column:1/-1;display:flex;gap:8px;min-width:0;align-items:stretch} .work-races050 button{flex:1;min-width:0;min-height:36px;padding:4px 12px;white-space:nowrap} .work-races050 button.active{border-color:#ecd089;background:#395565;color:#fff1be} .work044[data-race=elf] .work-races050 button.active{background:#284d40;border-color:#97d6a3} .work044[data-race=demon] .work-races050 button.active{background:#4c293d;border-color:#e695a5} .work-art>.structure-art050{width:94%;height:70%;max-height:280px;min-height:0;object-fit:contain;image-rendering:pixelated;flex-shrink:1} .work-level050{color:#fff0bb;white-space:nowrap} .structure-scope050{display:block;white-space:nowrap;text-align:center;line-height:1.4} @media(orientation:landscape) and (max-height:450px){ .work044{grid-template-rows:32px minmax(0,1fr);row-gap:5px} .work-races050{gap:5px}.work-races050 button{min-height:32px;font-size:12px;padding:2px 8px} .work044 .work-detail{gap:4px;padding-top:0;overflow-y:auto} .work044 .work-detail h3{margin:0;line-height:16px} .work044 .work-detail p{line-height:16px} .work044 .work-detail button{min-height:32px;margin-top:2px;padding:4px} .work044 .work-detail small{line-height:13px;font-size:10px} .work044 .work-art h3{margin:4px 0;line-height:15px} .work044 .work-level050{font-size:13px;line-height:16px} .work044 .structure-scope050{font-size:10px!important} } /* social051.css */ /* Fixed landscape panel: navigation left, content right, horizontal collections. */ #releasePanel:has(.friends051) .release-panel-head>span{display:none} .release-content.friends051{display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px;overflow:hidden;min-height:0} .friends-nav051{display:flex;flex-direction:column;gap:7px;min-height:0;padding-right:10px;border-right:1px solid #537b84} .friends-me051{display:grid;grid-template-columns:45px minmax(0,1fr);grid-template-rows:24px 20px;align-items:center;margin-bottom:4px;min-width:0} .friends-me051 img{width:42px;height:44px;grid-row:span 2;image-rendering:pixelated;object-fit:contain}.friends-me051 strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.friends-me051 small{font-size:10px;color:#a3c2c9} .friends051 button{white-space:nowrap;min-height:38px;padding:5px 8px;font-size:12px;border:1px solid #527680;background:#183746;color:#f2e4bd;box-shadow:inset 0 -2px #0b2331} .friends051 button.active{background:#37515a;border-color:#e7c584;color:#fff1b8}.friends051 button:disabled{opacity:.5}.friends051 button:focus-visible{outline:2px solid #f9d886;outline-offset:-3px} .friends-main051{display:grid;grid-template-rows:38px minmax(0,1fr) 38px;min-width:0;min-height:0;gap:8px}.friends-tools051,.friends-footer051{display:flex;align-items:center;gap:8px;min-width:0}.friends-tools051>strong{font-size:14px;white-space:nowrap}.friends-tools051>small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.friends-tools051>button{margin-left:auto}.friends-footer051{justify-content:space-between;border-top:1px solid #355a65;padding-top:4px}.friends-status051{font-size:11px;min-width:0;color:#b8d2d5;line-height:1.4} .friends-view051{min-width:0;min-height:0;overflow:hidden;border:1px solid #365d6a;background:#0e2733}.friends-empty051{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;padding:12px;box-sizing:border-box;min-width:0}.friends-empty051 .atlas-icon045{width:55px;height:55px}.friends-empty051 h3{font-size:15px;margin:0;color:#ecdba9;white-space:nowrap}.friends-empty051 p{font-size:12px;margin:0;color:#b3c9cd;text-align:center} .friend-cards051{display:grid;grid-auto-flow:column;grid-auto-columns:170px;grid-template-rows:minmax(0,1fr);gap:8px;padding:8px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;scroll-snap-type:x proximity}.friend-card051{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:0;background:#193849;border:1px solid #658c91;scroll-snap-align:start}.friend-card051>img{width:64px;height:58px;object-fit:contain;image-rendering:pixelated}.friend-card051>strong{font-size:13px;max-width:94%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.friend-card051>small{font-size:11px}.friend-card051 .online{color:#a9eeaf}.friend-card051>div{display:flex;gap:6px} .friend-add051{display:flex;gap:6px;margin-left:auto;min-width:0}.friends051 input{min-width:0;width:100%;font:inherit;font-size:12px;border:1px solid #618493;background:#092333;color:#f3eacb;border-radius:0;padding:6px 8px;box-sizing:border-box}.friend-add051 input{max-width:145px} .friend-messages051{display:grid;grid-template-rows:34px minmax(0,1fr) 38px;gap:6px;padding:6px}.friend-peers051{display:flex;gap:5px;overflow-x:auto;overflow-y:hidden}.friend-peers051 button{min-height:30px;flex:none}.friend-log051{overflow-y:auto;min-height:0;padding:4px 6px;scrollbar-width:thin}.friend-log051 p{width:fit-content;max-width:88%;margin:4px 0;padding:6px 8px;font-size:12px;line-height:1.4;overflow-wrap:anywhere;background:#264759}.friend-log051 p.mine{margin-left:auto;background:#425239}.friend-compose051{display:flex;gap:6px;min-width:0} #onlineRoom .px-room-tools{gap:5px}#onlineFriends051{white-space:nowrap} @media(max-height:450px){.release-content.friends051{grid-template-columns:112px minmax(0,1fr);gap:8px}.friends-nav051{gap:6px;padding-right:7px}.friends-main051{grid-template-rows:32px minmax(0,1fr) 34px;gap:6px}.friends051 button{min-height:32px;font-size:11px;padding:4px 7px}.friends-me051{grid-template-columns:37px minmax(0,1fr)}.friends-me051 img{width:35px;height:39px}.friends-empty051 .atlas-icon045{width:42px;height:42px}.friends-empty051{gap:6px;padding:8px}.friends-empty051 h3{font-size:13px}.friends-empty051 p,.friends-status051{font-size:10px}.friends-tools051>strong{font-size:12px}.friend-cards051{grid-auto-columns:145px;padding:5px;gap:6px}.friend-card051{gap:3px}.friend-card051>img{width:43px;height:38px}.friend-card051>strong{font-size:12px}.friend-add051 input{max-width:110px}.friends-tools051{gap:5px}.friend-messages051{grid-template-rows:30px minmax(0,1fr) 32px;padding:4px;gap:4px}.friend-log051 p{font-size:11px;margin:2px 0;padding:4px 6px}#onlineFriends051{font-size:10px;padding:4px 6px}} #releasePanel:has(.friends051) .release-panel-head>button:last-child{margin-left:auto} /* identity051.css */ .battle049 #choices .choice .tier,.battle049 .army-card049 .rarity051{display:block!important;position:absolute;left:6px;top:5px;z-index:1;padding:2px 4px;font-size:10px;line-height:12px;white-space:nowrap;background:#071b2feb;border:1px solid currentColor;text-shadow:1px 1px #071220;box-shadow:1px 1px #071220;pointer-events:none} .battle048 #hud .team:first-child{border-color:#6cdbff}.battle048 #hud .team:last-child{border-color:#ff9a83}.battle048 #hud .team:first-child .health>i{background:#6cdbff}.battle048 #hud .team:last-child .health>i{background:#ff9a83} .identity-guide051{display:grid;grid-template-rows:28px minmax(0,1fr) 28px;gap:8px;overflow:hidden}.identity-key051,.identity-teams051{margin:0;align-self:center;text-align:center;font-size:13px;white-space:nowrap}.identity-frames051{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:8px;min-height:0}.identity-card051{min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;background:#142d3b url('assets/merge-panels049.webp') 100% 93.94%/300% 206.45%;text-align:center}.identity-card051 img{min-height:0;height:60%;width:80px;object-fit:contain;image-rendering:pixelated}.identity-card051 strong{font-size:13px;background:#0b2230de;white-space:nowrap}.identity-card051 small{font-size:11px;background:#0b2230de;white-space:nowrap}.identity-teams051{color:#d3e8ee} @media(max-height:450px){.battle049 #choices .choice .tier,.battle049 .army-card049 .rarity051{font-size:9px;line-height:10px;padding:1px 3px;left:5px;top:4px}.identity-guide051{grid-template-rows:20px minmax(0,1fr) 20px;gap:5px}.identity-key051,.identity-teams051{font-size:10px}.identity-frames051{gap:5px}.identity-card051{padding:6px;gap:2px}.identity-card051 img{width:50px;height:47%}.identity-card051 strong{font-size:11px}.identity-card051 small{font-size:9px}} .battle049 #choices .choice .class051,.battle049 .army-card049 .class051{position:absolute;right:6px;top:5px;z-index:1;padding:2px 4px;font-size:10px;line-height:12px;color:#d8e6eb;background:#102332f0;border:1px solid #648493;white-space:nowrap;pointer-events:none} @media(max-height:450px){.battle049 #choices .choice .class051,.battle049 .army-card049 .class051{right:5px;top:4px;font-size:9px;line-height:10px;padding:1px 3px}} /* chrome052.css */ /* ImageGen component kit. Nine-slice corners keep their size on narrow screens; text, prices and hit areas remain live DOM, independent of the artwork. */ :root{--plate052:url('assets/label-navy052.png');--green052:url('assets/label-green052.png');--blue052:url('assets/button-blue052.png');--gold052:url('assets/button-gold052.png');--panel052:url('assets/panel-navy052.png');--premium052:url('assets/panel-purple052.png')} #releaseLobby .title047,#releaseLobby .landmark047 .icon-caption045, #releaseLobby .legion047,#releaseLobby .rank047,#releaseLobby .resume047, #releaseLobby .release-season,#releaseLobby .top047 .wallet052, #releasePanel button,#releasePanel input,#releasePanel select{ border:2px solid transparent;border-radius:0;border-image:var(--plate052) 28 fill / 9px / 0 stretch; background:#082337;background-clip:padding-box;box-shadow:none;image-rendering:pixelated;color:#fff2d0;text-shadow:1px 1px #071522; } #releaseLobby .title047{padding:5px 20px;border-image-width:13px;letter-spacing:1px} #releaseLobby .landmark047 .icon-caption045{padding:8px 15px;min-width:78px;line-height:1.1} #releaseLobby .legion047,#releaseLobby .rank047{padding-inline:15px} #releaseLobby .legion047{border-image-width:10px} #releaseLobby[data-race=elf] .legion047{border-image-source:var(--green052)} #releaseLobby[data-race=demon] .legion047{border-image-source:var(--premium052)} #releaseLobby .release-season{border-image-source:var(--green052);border-image-width:7px;padding-inline:10px} #releaseLobby .top047{background:#071a2ce8;border-bottom:2px solid #bd9b57;box-shadow:0 2px #06131e} #releaseLobby .profile047{border-color:#c9a159;box-shadow:inset 0 0 0 2px #102336} #releaseLobby .top047 .wallet052{padding:3px 10px;min-height:28px;border-image-width:7px;line-height:20px;white-space:nowrap} #releaseLobby .top047 .gold047{display:flex;align-items:center;color:#ffe09b} #releaseLobby .top047 .diamond052{color:#b8f0ff} #releaseLobby .battle-actions047 .battle-secondary047{ border:2px solid transparent;border-image:var(--blue052) 32 fill / 13px / 0 stretch; background:#0757b1;background-clip:padding-box;box-shadow:none;color:#fff9e4;text-shadow:1px 2px #082143;image-rendering:pixelated; } #releaseLobby .battle-actions047 .battle-secondary047:active{filter:brightness(.86)} #releaseLobby button:focus-visible,#releasePanel button:focus-visible{outline:2px solid #fff2ac;outline-offset:-4px} #releaseLobby .landmark047:focus-visible{outline:none} #releaseLobby .landmark047:focus-visible .icon-caption045{outline:2px solid #fff2ac;outline-offset:2px} /* The shared shell also keeps friends, upgrades, pass and settings in this family. */ #releasePanel{background:#061323d9} #releasePanel .release-shell{border:3px solid transparent;border-image:var(--panel052) 32 fill / 12px / 0 stretch;background:#071e30;background-clip:padding-box;box-shadow:none;image-rendering:pixelated} #releasePanel .release-panel-head{margin:3px 4px 0;padding:3px 9px;background:#0d293c;border-bottom:2px solid #aa884b} #releasePanel .release-panel-head h2{color:#ffe5ab;text-shadow:1px 2px #051728} #releasePanel .release-panel-head>span{color:#f2dca0} #releasePanel button{border-image-width:8px} #releasePanel button:hover:not(:disabled){filter:brightness(1.13)} #releasePanel button:active:not(:disabled){filter:brightness(.86)} #releasePanel button.active,#releasePanel button.primary,#releasePanel .product-price052{ border-image-source:var(--gold052);border-image-slice:32;border-image-width:9px;background:#d18a10;background-clip:padding-box;color:#fffbea;text-shadow:1px 1px #714013;font-weight:700; } #releasePanel button:disabled{filter:saturate(.35);opacity:.58;text-shadow:1px 1px #071522} #releasePanel .product044,#releasePanel .pass-day{ border:2px solid transparent;border-image:var(--panel052) 32 fill / 12px / 0 stretch; background:#082438;background-clip:padding-box;box-shadow:none;padding:12px;image-rendering:pixelated; } #releasePanel .product044.premium052,#releasePanel .product044:has(.royal),#releasePanel .product044:has(.promotion){border-image-source:var(--premium052);background-color:#231337} #releasePanel .product044>h3,#releasePanel .pass-day>h3{ border:0 solid transparent;border-image:var(--plate052) 28 fill / 7px / 0 stretch; padding:7px 10px;margin:0;color:#fff0c9;width:100%;box-sizing:border-box;font-weight:700;line-height:1.2;white-space:nowrap; } #releasePanel .pass-day>h3{border-image-source:var(--green052)} #releasePanel .pass-day button.premium{border-image-source:var(--premium052);background:#2c1b3c;background-clip:padding-box;color:#eed9ff} #releasePanel .product044>small{color:#c6d9df} #releasePanel .product044>button{min-height:38px;padding:6px 12px} #releasePanel .work-list button{padding-inline:10px} #releasePanel :is(input,select){padding-inline:10px} #releasePanel .probabilities summary{background:#10344b;border:2px solid transparent;border-image:var(--plate052) 28 fill / 8px / 0 stretch;padding:7px 10px} /* A horizontal collection with a fixed price row; large screens do not stretch tiny items into almost empty full-height columns. */ .battle049 #releasePanel .shop044{grid-template-columns:116px minmax(0,1fr);gap:12px;padding:14px} .battle049 #releasePanel .shop-nav{height:100%;max-height:400px;align-self:center;gap:7px} .battle049 #releasePanel .shop-nav button{padding:4px 10px!important;justify-content:flex-start;gap:5px;border-image-width:10px;font-size:13px} #releasePanel .shop-nav .atlas-icon045{width:28px;height:28px;flex-basis:28px} #releasePanel .shop-nav .active{color:#fffbe5;text-shadow:1px 1px #6c3f18} .battle049 #releasePanel .shop-products{height:100%;max-height:400px;align-self:center;grid-auto-columns:minmax(184px,1fr);gap:12px;padding:0 2px 3px} .battle049 #releasePanel .shop-products .product044{display:flex;justify-content:flex-start;gap:9px;padding:12px;overflow:hidden} .product-art052{display:flex;position:relative;isolation:isolate;align-items:center;justify-content:center;flex:1;min-height:0;width:100%;overflow:hidden} .product-art052:after{content:'';position:absolute;z-index:-1;width:70%;height:7px;left:15%;bottom:14%;background:#154b60;border:1px solid #47768b;box-shadow:0 3px #051827} .premium052 .product-art052:after{background:#463368;border-color:#9874b9} #releasePanel .product-art052>img{width:100%;height:100%;max-height:150px;object-fit:contain;image-rendering:pixelated} #releasePanel .product-art052 .pixel-chest,#releasePanel .product-art052 .atlas-icon045{width:100px;height:100px;flex-basis:100px;max-height:100%;margin:0!important} .shop-note052{align-self:center;text-align:center;font-size:12px;color:#c8d9dd;line-height:1.7;padding:14px;min-width:0} #releasePanel .shop-products>.shop-note052 button{display:block;margin:12px auto 0;max-width:100%;font-size:12px} .battle049 #releasePanel .shop-products .product-price052{margin-top:0;flex-shrink:0} @media(orientation:landscape) and (max-height:450px){ #releaseLobby .title047{padding:4px 15px;border-image-width:10px;font-size:20px} #releaseLobby .landmark047 .icon-caption045{padding:5px 11px;min-width:62px;font-size:12px;border-image-width:7px} #releaseLobby .legion047,#releaseLobby .rank047{border-image-width:8px} #releaseLobby .battle-actions047 .battle-secondary047{border-image-width:10px} #releaseLobby .top047{gap:6px} #releaseLobby .top047 .wallet052{padding:1px 8px;min-height:25px;line-height:19px;border-image-width:6px} #releaseLobby .release-season{border-image-width:5px;padding-inline:8px} #releasePanel .release-shell{border-width:0;border-image-width:5px} #releasePanel .release-panel-head{margin:0 3px;padding:2px 6px} #releasePanel .release-content{padding:8px;gap:8px} #releasePanel .product044,#releasePanel .pass-day{padding:8px;border-image-width:9px} #releasePanel .product044>h3,#releasePanel .pass-day>h3{padding:5px 7px;font-size:12px;border-image-width:6px} #releasePanel .product044>button{min-height:35px;padding:5px 10px} .battle049 #releasePanel .shop044{grid-template-columns:104px minmax(0,1fr);gap:8px;padding:8px} .battle049 #releasePanel .shop-nav{gap:5px} .battle049 #releasePanel .shop-nav button{padding:3px 9px!important;gap:4px;border-image-width:8px;font-size:11px} #releasePanel .shop-nav .atlas-icon045{width:24px;height:24px;flex-basis:24px} .battle049 #releasePanel .shop-products{gap:8px;grid-auto-columns:minmax(182px,1fr)} .battle049 #releasePanel .shop-products .product044{padding:9px;gap:6px} #releasePanel .product-art052 .pixel-chest,#releasePanel .product-art052 .atlas-icon045{width:84px;height:84px;flex-basis:84px} #releasePanel .product-art052>img{max-height:120px} .shop-note052{font-size:11px;padding:10px} } /* combo053.css */ /* Both shelf modes use the same two controls at the same coordinates. */ .combo053 #comboBadge,.combo053 .recipe-book048{display:block!important;position:absolute;top:auto;bottom:calc(var(--safe-b) + var(--dock048) - 43px);left:auto;transform:none;height:32px;min-height:32px;min-width:64px;width:64px;padding:1px 3px;z-index:6;pointer-events:auto;font-size:12px} .combo053 #comboBadge{right:calc(var(--safe-r) + var(--draw-width048) + 8px);background:#264353;border:1px solid #dfc17d} .combo053 #comboBadge b{margin-left:4px}.combo053.craft-open053 #comboBadge b{display:none} .combo053 #comboBadge.hidden{display:none!important} .combo053 .recipe-book048{right:calc(var(--safe-r) + var(--draw-width048) + 78px);background:#173847} .combo053 #combo header,.combo053 .army-shelf049>header{padding-right:144px} .combo053 #combo .combo-tools{display:none} .combo053 #choices,.combo053 #choices[data-wide039="true"]{grid-auto-columns:max(128px,calc((100% - 16px)/3))!important;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding-bottom:5px;scrollbar-width:thin;scrollbar-color:#e6c276 #112d3a} .combo053 #choices .choice{outline:1px solid #dfce9055;outline-offset:-4px} .combo053.craft-ready053 #combo{filter:drop-shadow(0 0 5px #f6d27b80)} .combo053.craft-ready053 #comboBadge{box-shadow:0 0 12px #ffd77c80,inset 0 0 7px #ffd77c40;animation:craft-glow053 1.8s ease-in-out infinite} .combo053.craft-open053 #controls:before{border-top-color:#ffe2a0;box-shadow:0 -5px 16px #f8d47e55} .recipe-strip053{position:absolute;bottom:calc(var(--safe-b) + var(--dock048) + 5px);left:calc(var(--safe-l) + var(--skill-width048));right:calc(var(--safe-r) + var(--draw-width048));display:flex;gap:5px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;scroll-snap-type:x mandatory;scrollbar-width:thin;pointer-events:auto;z-index:5;padding:2px;background:#102735d9} .recipe-strip053[hidden]{display:none}.recipe-strip053 button{flex:0 0 108px;min-height:32px;scroll-snap-align:start;border:1px solid #708b92;background:#1d3c4d;font-size:12px;color:#d6e6e5;white-space:nowrap} .recipe-strip053 button[aria-pressed=true]{border-color:#ffe19a;background:#645330;color:#fff1c6} .choice-hint053{position:absolute;right:10px;bottom:2px;font-size:9px;line-height:11px;color:#fff1c1;background:#102434e8;pointer-events:none} .choice-hint053[hidden]{display:none} .choice.choice-merged{animation:choice-flash053 .45s cubic-bezier(.16,1,.3,1) forwards;outline:2px solid #fff8d6!important;z-index:10} .merge-light053{position:fixed;inset:auto 0 0;height:calc(var(--dock048) + 36px);pointer-events:none;z-index:30;opacity:0;border:3px solid #ffdf96;box-shadow:inset 0 0 45px #ffe0a8,0 0 45px #ffda83cc,0 -6px 28px rgba(255,225,140,0.55)} .merge-light053.active{animation:merge-light053 .85s ease-out} @keyframes craft-glow053{50%{box-shadow:0 0 18px #ffd77ca0,inset 0 0 10px #ffd77c50}} @keyframes merge-light053{0%{opacity:1;transform:scaleY(1.06)}30%{opacity:.65}100%{opacity:0;transform:scaleY(1)}} @keyframes choice-flash053{0%{transform:scale(.95);filter:brightness(2.1) contrast(1.2);box-shadow:0 0 28px #ffe39a}40%{transform:scale(1.08);filter:brightness(1.6);box-shadow:0 0 34px #ffd77c}100%{transform:scale(1);filter:none}} @media(max-height:450px){.combo053 #comboBadge,.combo053 .recipe-book048{bottom:calc(var(--safe-b) + var(--dock048) - 39px);height:30px;min-height:30px;min-width:56px;width:56px;font-size:11px}.combo053 .recipe-book048{right:calc(var(--safe-r) + var(--draw-width048) + 68px)}.combo053 #combo header,.combo053 .army-shelf049>header{padding-right:124px}.combo053 #choices,.combo053 #choices[data-wide039="true"]{grid-auto-columns:max(124px,calc((100% - 10px)/3))!important}.recipe-action053>span{font-size:25px}.recipe-strip053 button{min-height:30px}.recipe-action053>small{font-size:12px}} @media(prefers-reduced-motion:reduce){.combo053 #comboBadge,.merge-light053.active{animation:none}.merge-light053.active{opacity:.35}} html[data-reduced-effects=true] #comboBadge,html[data-reduced-effects=true] .merge-light053.active{animation:none} html[data-reduced-effects=true] .merge-light053.active{opacity:.25} .motion-stage053{display:grid;grid-template-columns:1fr 1.5fr;width:100%;align-items:center;flex-shrink:0;gap:2px;background:#102c38}.motion-stage053>img{width:100%;height:66px;object-fit:contain;image-rendering:pixelated}.motion-stage053>canvas{width:100%;height:78px;object-fit:contain;image-rendering:pixelated}.motion-controls053{display:grid;grid-template-columns:repeat(4,1fr);grid-column:1/-1;gap:2px;width:100%}.flow-hero048 .motion-controls053 button{min-height:30px;padding:2px 0;font-size:10px}.motion-controls053 button[aria-pressed=true]{border-color:#ffe2a0;background:#5c4e2c;color:#fff2c6} /* The combat clock shows time and wave timing only. */ .combo053 #modeLabel{display:none!important} /* Anchor to the same visual viewport as the battle dock, including browser chrome. */ .battle049.combo053 #combo{top:calc(var(--view-y) + var(--view-h) - var(--safe-b) - var(--dock048) + 7px)!important;bottom:auto;box-sizing:border-box;display:grid;grid-template-rows:var(--dock-header049) minmax(0,1fr);min-height:0;overflow:hidden} .battle049.combo053 #combo>header{min-width:0;max-width:100%;box-sizing:border-box;overflow:hidden} .battle049.combo053 #recipeMaterials{min-width:0;max-width:100%} .battle049.combo053 #choices,.battle049.combo053 #choices[data-wide039="true"]{height:auto;min-height:0;max-height:100%;box-sizing:border-box;grid-template-rows:minmax(0,1fr);align-items:stretch} .battle049.combo053 #choices .choice{height:100%!important;min-height:0!important;max-height:100%;box-sizing:border-box} /* Recipe center: one stationary attack preview and authoritative unit information. */ .flow-hero048 .attack-preview078{display:block;background:radial-gradient(ellipse at center,#294b53,#102c38 75%);border-radius:4px} .flow-hero048 .attack-preview078>canvas{display:block;width:100%;height:auto;max-height:140px;aspect-ratio:12/7;object-fit:contain} .flow-hero048>*{flex-shrink:0}.flow-hero048 .flow-name048,.flow-hero048 .flow-range051{white-space:normal;overflow-wrap:anywhere;text-align:center} .flow-position078{display:flex;width:100%;gap:3px;margin:3px 0}.flow-position078 span{flex:1;min-width:0;text-align:center;font-size:10px;line-height:24px;background:#132a35;color:#8dabae;border:1px solid #36555e;border-radius:3px}.flow-position078 .active{background:#5e4e2b;border-color:#e8c67b;color:#fff0b9;font-weight:bold} .flow-skill-name078{font-size:12px;color:#ffe0a0;text-align:center;overflow-wrap:anywhere}.flow-abilities078{width:100%;font-size:10px;line-height:1.65;overflow-wrap:anywhere}.flow-abilities078 p{margin:0;padding:6px 2px;border-top:1px solid #34535b} @media(max-height:450px){.flow-hero048 .attack-preview078>canvas{max-height:90px}.flow-skill-name078{font-size:11px}} /* ui058.css */ /* Keep army/recipe switching usable without covering the recipe cards. */ #result .result-card{position:relative}#resultClose058{position:absolute;right:10px;top:8px;min-width:36px;min-height:36px;z-index:2} .atlas-army058{scrollbar-width:none;display:flex;gap:4px;align-items:center;overflow-x:auto;flex:0 0 58px;min-height:58px;padding:3px 8px;background:#0e2935;touch-action:pan-x;border-bottom:1px solid #47676a} .atlas-army058[hidden]{display:none}.atlas-army058>strong{flex:0 0 45px;font-size:11px;color:#eddaad}.atlas-army058 button{flex:0 0 90px;display:grid;grid-template-columns:30px 1fr;gap:2px;padding:3px;min-height:46px;font-size:10px;background:#203e48;border:1px solid #65847e;color:#e2e9dd}.atlas-army058 img{width:30px;height:36px;object-fit:contain;grid-row:1/3}.atlas-army058 small{font-size:10px;color:#ecd395} .atlas-army058::-webkit-scrollbar{display:none} /* Let header gaps pass taps through to recipe/toggle controls without lifting the opaque dock over recipes. */ .combo053 #combo,.combo053 #combo header,.combo053 #recipeMaterials{pointer-events:none} .combo053 #choices,.combo053 #recipeMaterials button{pointer-events:auto} @media(max-width:900px),(max-height:500px){.atlas-army058{display:none}} /* loading059.css */ #loading059{position:fixed;inset:0;z-index:190;background:#102735;display:flex;align-items:center;justify-content:center;padding:20px;color:#e8eddb}.loading-card059{width:min(500px,90vw);text-align:center}.loading-logo071{margin:2px 0 4px;font:900 clamp(34px,7vw,68px)/.95 Galmuri11,monospace;letter-spacing:clamp(3px,1vw,10px);color:#fff0b1;text-shadow:4px 4px #542934,-2px -2px #294f66,0 0 18px #efc86b}.loading-card059 h2{font-size:26px;color:#f0d39b}.loading-card059 p{min-height:24px;font-size:14px}.loading-card059 progress{display:block;width:100%;height:18px;margin:20px 0 8px;accent-color:#e2c27f}.loading-card059 strong{font:18px monospace}.loading-card059 button{padding:10px 22px;margin:16px 6px 0;background:#345664;border:1px solid #8faaa2;color:#edf0df}.loading-card059 [hidden]{display:none}#loadingError059{color:#ffb69a} #loading059{background:#102735 url('assets/loading-adventure061.png') center center/cover no-repeat;align-items:flex-end;padding:3vh 20px}#loading059::before{content:'';position:absolute;inset:0;background:linear-gradient(transparent 22%,#0817204d 48%,#081720f2);pointer-events:none}.loading-card059{position:relative;width:min(520px,88vw);text-shadow:0 2px 5px #000}.loading-card059 h2{margin:8px 0;font-size:clamp(18px,2.6vw,25px)}.loading-card059 p{margin:8px 0}.loading-card059 progress{margin:12px 0 6px}.loading-card059 button{margin-top:8px;background:#183342dc}@media(max-height:420px){#loading059{padding:8px 20px}.loading-card059 small{display:none}.loading-logo071{font-size:34px;margin:0}.loading-card059 h2{font-size:17px;margin:3px}.loading-card059 p{font-size:11px;margin:3px 0}.loading-card059 progress{height:11px;margin:5px 0 3px}.loading-card059 button{padding:6px 18px}.loading-card059 strong{font-size:14px}} #loading059 .loading-card059>small{display:block;font-size:clamp(10px,1.6vw,13px);line-height:1.25;margin:0 0 3px;color:#fff0b1} #boot074>.probability-notice199,#loading059>.probability-notice199{position:absolute;z-index:1;top:calc(12px + env(safe-area-inset-top,0px));right:calc(14px + env(safe-area-inset-right,0px));margin:0;padding:3px 6px;color:#fff;background:rgba(0,0,0,.58);border-radius:3px;font:500 12px/1.5 "Malgun Gothic","Noto Sans KR",sans-serif;letter-spacing:0;white-space:nowrap;pointer-events:none;text-shadow:0 1px 2px #000} /* results060.css */ #resultTable043 [hidden]{display:none!important}#resultTable043{overscroll-behavior:contain}.result-tabs060{display:flex;gap:6px;position:sticky;top:0;background:#152f3a;z-index:1;padding:0 0 8px}.result-tabs060 button,.stats-sides060 button{min-height:34px;padding:6px 10px;border:1px solid #597c86;color:#dce8e6;background:#203f4b;font:inherit}.result-tabs060 button[aria-pressed=true],.stats-sides060 button[aria-pressed=true]{background:#53654d;border-color:#d5c47e;color:#fff1bc}.stats-toolbar060{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.stats-sides060{display:flex;gap:4px;flex:1}.stats-sides060 button{flex:1;font-size:11px}.stats-toolbar060 select{max-width:100%;padding:7px;background:#203f4b;color:#e8eeee;border:1px solid #597c86;font:inherit;font-size:12px}.stats-note060{font-size:11px;color:#b6c9c6;margin:8px 0;line-height:1.5}.unit-stat060{display:flex;gap:9px;padding:10px 0;border-bottom:1px solid #35545e;text-align:left}.stat-portrait060{flex:0 0 42px;width:42px;height:46px;display:grid;place-items:center;font-size:11px;background:#203f4b;border:1px solid #526e73}.stat-portrait060 img{width:40px;height:44px;object-fit:contain;image-rendering:pixelated}.stat-body060{min-width:0;flex:1}.stat-title060{display:flex;justify-content:space-between;gap:10px;font-size:13px}.stat-title060 b{color:#f1d890;font-variant-numeric:tabular-nums}.stat-bar060{height:5px;background:#10242b;margin:6px 0}.stat-bar060 span{display:block;height:100%;background:#cfab61}.stat-values060{display:flex;gap:3px 12px;flex-wrap:wrap;color:#b9cecf;font-size:10px}.stats-empty060{font-size:13px;padding:18px 8px;line-height:1.6}.result060 .result-head043 span{overflow-wrap:anywhere}#result.result060 .result-card{grid-template-columns:minmax(150px,.8fr) minmax(290px,2fr)}@media(max-width:650px){#result.result060 .result-card{grid-template-columns:minmax(120px,.65fr) minmax(240px,1.7fr);gap:5px 8px;padding:9px}.stat-values060{gap:3px 8px}.stats-sides060 button{padding:5px;font-size:10px}.result-tabs060 button{font-size:12px}}@media(max-width:450px) and (min-height:501px){#result.result060 .result-card{display:flex;flex-direction:column}#result.result060 #resultTable043{flex:1;min-height:0}#result.result060 #resultTitle{font-size:24px}#result.result060 #resultRewardNote{margin:0}#result.result060 #again{min-height:36px;flex-shrink:0}} #result.result060 #resultTable043{padding:6px;min-width:0}.result-tabs060{padding-right:34px;flex-wrap:wrap}.result060 .result-head043{position:static;white-space:normal}.result060 #roomReturn053{grid-column:1;grid-row:5;font-size:10px;line-height:1.4;margin:0;align-self:center}.result060 .result-row043{white-space:normal} /* recovery066.css */ #recovery066{position:fixed;inset:0;z-index:250;display:grid;place-items:center;padding:16px;background:#071a27dd;color:#eff4e6;text-align:center}#recovery066>div{width:min(480px,100%);max-height:100%;overflow:auto;padding:22px;border:2px solid #bda96c;background:#122e40}#recovery066 h2{font-size:20px;margin:0 0 14px}#recoveryTime066{font-size:32px;color:#f3d18a;font-variant-numeric:tabular-nums}#recovery066 p{font-size:13px;line-height:1.7}#recovery066 button{min-height:40px;margin:5px;padding:8px 16px;background:#244b61;color:#fff;border:1px solid #90a9b4;font:inherit} /* story068.css */ .story-entry068{border:0;background:none;color:#ffe4a6;font:inherit;text-shadow:0 3px #192d32;cursor:pointer;padding:6px 20px}.story-entry-sub068{display:block;font:600 11px/1.5 sans-serif;color:#dae9cf;letter-spacing:1px}.story-panel068{max-width:940px!important}.story-panel068 p{line-height:1.65;color:#d6e2dc}.story-hero068{padding:16px 20px;border:1px solid #667866;background:linear-gradient(110deg,#213e3a,#343a29);border-radius:10px}.story-hero068 h2{color:#f5d694;margin:8px 0}.story-hero068>small{color:#a4d9bd;letter-spacing:2px}.story-xp068{display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:#f5d694;font-weight:700}.story-xp068 small{width:100%;font-weight:400;color:#acbdaf}.story-xp068 progress{height:9px;width:140px;accent-color:#e6bd62}.story-chapters068{display:flex;gap:8px;overflow-x:auto;padding:16px 0;scroll-snap-type:x proximity}.story-chapter068{min-width:158px;white-space:normal;scroll-snap-align:start;background:#273e40;border:1px solid #667568;padding:12px;text-align:left;color:#e0e6d8;border-radius:6px}.story-chapter068[aria-pressed=true]{border-color:#f2c570;background:#48533c;color:#ffe7ac}.story-chapter068.locked068{color:#96a49c}.story-detail068 h3{font-size:21px;color:#f6d58c}.story-rounds068{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.story-round068{padding:14px 12px;min-height:76px;background:#2a4242;border:1px solid #697c6c;color:#edf1df;text-align:left;border-radius:7px;line-height:1.45}.story-round068 small{display:block;color:#b9caba;margin-top:5px}.story-round068:disabled{opacity:.45;cursor:default}.story-round068.cleared068{border-color:#9aca85;background:#354b39}.story-meeting068,.story-hint068{padding:12px 16px;background:#3e4633;border-left:3px solid #dfbe74}.story-enemies068{display:flex;flex-wrap:wrap;gap:12px}.story-enemies068>div{display:flex;align-items:center;gap:8px;padding:8px;background:#263b3e;border-radius:6px}.story-enemies068 img{width:50px;height:54px;object-fit:contain;image-rendering:pixelated}.story-back068{margin-bottom:12px}.story-panel068 .primary{margin-top:12px;width:100%}@media(max-width:650px){.story-rounds068{grid-template-columns:repeat(2,minmax(0,1fr))}.story-round068{font-size:12px;padding:10px;min-height:68px}.story-hero068{padding:12px}.story-hero068 h2{font-size:20px}.story-entry068{font-size:25px}} #releasePanel .story-chapters068 .story-chapter068{flex:0 0 170px!important;min-width:170px!important;white-space:normal!important;min-height:54px;line-height:1.5}#releasePanel .story-round068{white-space:normal!important}#releasePanel .story-panel068{max-width:none!important;width:100%!important} @media(max-height:500px){#releasePanel .story-hero068{padding:8px 12px}#releasePanel .story-hero068 h2{display:none}#releasePanel .story-hero068 p{margin:4px 0;font-size:11px}#releasePanel .story-xp068{gap:6px;font-size:12px}#releasePanel .story-xp068 small{font-size:10px}#releasePanel .story-chapters068{padding:8px 0}#releasePanel .story-chapters068 .story-chapter068{min-height:42px}#releasePanel .story-detail068 h3{margin:6px 0;font-size:17px}#releasePanel .story-detail068>p{font-size:11px;margin:6px 0}#releasePanel .story-round068{min-height:48px;padding:8px}} /* auth070.css */ #releaseLobby .top047 #account070{flex-shrink:0;min-height:34px;padding:4px 12px;border:1px solid #cab179;border-radius:5px;background:#18354a;color:#fff0c9;font-family:inherit;font-weight:700;font-size:13px;white-space:nowrap} #releaseLobby .top047 #account070.connected070{color:#bfeeca;border-color:#8ac99b} #releasePanel .account-panel070{display:flex;flex-direction:column;align-items:stretch;gap:14px;max-width:540px;margin:0 auto;padding:18px;overflow:auto} .account-intro070{text-align:center}.account-intro070 small{font-size:11px;letter-spacing:3px;color:#d9bc81}.account-intro070 h3{font-size:23px;margin:7px 0}.account-intro070 p{margin:6px 0;overflow-wrap:anywhere} .account-providers070{display:grid;gap:10px} #releasePanel .provider070{display:flex;justify-content:center;align-items:center;gap:14px;min-height:48px;padding:10px 18px;border:1px solid #b4bbc4;border-image:none;border-radius:7px;background:#fff;color:#202124;text-shadow:none;font-size:15px;image-rendering:auto} #releasePanel .provider070.apple{background:#111;color:#fff;border-color:#777} #releasePanel .provider070.facebook{background:#0866ff;color:#fff;border-color:#73a9ff} #releasePanel .provider070:disabled{opacity:.62;cursor:not-allowed}.provider070 small{font-size:11px;font-weight:400} .account-note070{font-size:12px;line-height:1.6;color:#c4d0dc;margin:0;padding:12px;background:#102537;border:1px solid #496373;border-radius:5px} .account-status070{font-size:13px;line-height:1.5;color:#ffe0a0;margin:0;min-height:20px} .account-actions070{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.account-actions070 button{min-height:40px;padding:8px 15px} #releasePanel .account-panel070 button:focus-visible,#account070:focus-visible{outline:3px solid #ffe69c;outline-offset:3px} @media(max-height:500px){#releasePanel .account-panel070{gap:8px;padding:10px;max-width:680px}.account-intro070 h3{font-size:18px;margin:3px 0}.account-intro070 small{display:none}.account-providers070{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}#releasePanel .provider070{flex-direction:column;gap:4px;font-size:13px;padding:8px}.account-note070{padding:7px;font-size:11px}} @media(max-width:720px){#releaseLobby .top047 #account070{padding:3px 7px;font-size:12px}} .account-entry070{position:fixed;inset:0;z-index:200;box-sizing:border-box;display:grid;place-items:center;padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));overflow:auto;background:linear-gradient(180deg,#0c1c2a99,#06111bea),url('assets/loading-adventure061.png') center/cover;color:#e5edf1;font-family:inherit} .account-entry070[hidden]{display:none} .account-entry-card070{box-sizing:border-box;display:grid;gap:18px;width:min(100%,500px);padding:28px;border:2px solid #ad925e;box-shadow:0 0 0 3px #122a35,0 12px 48px #0008;background:linear-gradient(160deg,#193847f5,#0a1d2df7)} .account-entry070 .account-intro070 h1{margin:10px 0;color:#fff0cc;font-size:26px;line-height:1.3;text-shadow:0 2px #051522} .account-entry070 .account-intro070 h1:focus{outline:none} .account-entry070 .account-intro070 p{color:#cbd8de;font-size:14px;line-height:1.6;margin:8px 0 0} .account-entry070 .provider070{display:flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:12px 16px;border:1px solid #bbc3cc;border-radius:6px;background:#fff;color:#202124;text-shadow:none;font-family:inherit;font-size:16px;font-weight:700;cursor:pointer} .account-entry070 .provider070.apple{background:#111;color:#fff;border-color:#777} .account-entry070 .provider070.facebook{background:#0866ff;color:#fff;border-color:#73a9ff} .account-entry070 button:disabled{opacity:.58;cursor:not-allowed} .account-entry070 .account-status070:empty{display:none} .account-entry-guest070{display:grid;justify-items:center;gap:6px;padding-top:14px;border-top:1px solid #3d5561} .account-entry-guest070 small{max-width:380px;color:#a7bac5;text-align:center;font-size:11px;line-height:1.5;overflow-wrap:anywhere} .account-guest070,#releasePanel .account-guest070{min-height:34px;padding:6px 12px;background:transparent;border:1px solid #708c99;border-radius:4px;color:#c0d1d9;font-family:inherit;font-size:12px;font-weight:400;cursor:pointer} .account-entry070 button:focus-visible{outline:3px solid #ffe69c;outline-offset:3px} @media(max-height:500px){.account-entry070{padding:12px max(14px,env(safe-area-inset-right)) 12px max(14px,env(safe-area-inset-left))}.account-entry-card070{width:min(100%,650px);padding:18px;gap:12px}.account-entry070 .account-intro070 small{display:block;font-size:10px}.account-entry070 .account-intro070 h1{font-size:22px;margin:5px 0}.account-entry070 .account-intro070 p{font-size:12px;margin-top:5px}.account-entry070 .provider070{min-height:58px;padding:9px;font-size:14px;flex-direction:column;gap:4px}.account-entry-guest070{padding-top:10px}.account-entry-guest070 small{max-width:560px;font-size:10px}} @media(max-width:540px){.account-entry-card070{padding:20px}.account-entry070 .account-intro070 h1{font-size:22px}.account-entry070 .account-providers070{grid-template-columns:1fr}.account-entry070 .provider070{min-height:48px;flex-direction:row}} .account-legal070{display:grid;gap:10px;padding:14px;border:1px solid #637d87;background:#091c29;font-size:13px;line-height:1.5} .account-legal070>div{display:flex;gap:8px;justify-content:space-between;align-items:center;flex-wrap:wrap}.account-legal070 label{display:flex;gap:8px;align-items:center;min-height:32px;cursor:pointer}.account-legal070 input{width:18px;height:18px;accent-color:#e9c176;flex-shrink:0}.account-legal070 a{color:#ffe2a6;text-decoration:underline;padding:5px}.account-legal070 small{color:#b9ccd5;font-size:11px}.account-legal070 button{min-height:44px;background:#b88737;color:#fff;border:1px solid #ecd2a0;border-radius:4px;font:inherit}.account-entry070{align-items:safe center}.account-entry-card070{margin:auto} /* boot074.css */ /* Match Rhythm School's WorkTimeSoftBootIntro (2-second publisher card). */ #boot074{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;background:linear-gradient(#03050a,#07111c,#020307);color:#fff;touch-action:none} #boot074[hidden]{display:none} #boot074 .boot-brand074{font-family:Outfit,"Malgun Gothic","Noto Sans KR",Arial,sans-serif!important} #boot074 .boot-brand074{margin:0;font:900 58px/1 Outfit,"Malgun Gothic","Noto Sans KR",Arial,sans-serif;letter-spacing:0;text-shadow:0 0 22px #6be7ff8c,0 0 8px #ffffff59;animation:boot-brand074 .42s cubic-bezier(.215,.61,.355,1) both} #boot074 .boot-track074{position:absolute;left:22%;right:22%;bottom:calc(92px + env(safe-area-inset-bottom,0px));height:3px;border-radius:999px;overflow:hidden;background:#ffffff1f} #boot074 .boot-track074::after{content:'';display:block;width:100%;height:100%;background:#6be7ff;transform-origin:left;animation:boot-progress074 2s ease-in-out both} @media(max-width:559px),(max-height:559px){#boot074 .boot-brand074{font-size:min(38px,10vw)}#boot074 .boot-track074{bottom:calc(72px + env(safe-area-inset-bottom,0px))}} @keyframes boot-brand074{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}} @keyframes boot-progress074{from{transform:scaleX(0)}to{transform:scaleX(1)}} @media(prefers-reduced-motion:reduce){#boot074 .boot-brand074,#boot074 .boot-track074::after{animation:none}} /* Orientation prompts and game overlays must never cover the publisher. */ html.publisher-intro088 body> :not(#boot074){visibility:hidden!important}html.publisher-intro088 #boot074{visibility:visible!important;z-index:2147483647;inset:0;width:100vw;height:100dvh} /* outcome075.css */ #outcome075[hidden]{display:none!important} #outcome075{position:fixed;inset:0;z-index:18000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:radial-gradient(ellipse at center,#123c4bef,#061017ed 65%);color:#ffe3a0;text-align:center;isolation:isolate} #outcome075::before{content:"";position:absolute;left:0;right:0;top:50%;height:140px;transform:translateY(-50%);background:linear-gradient(90deg,transparent,#175e7280,transparent);border-block:2px solid #79d5e980;z-index:-1} #outcome075 h1{font-size:clamp(48px,10vw,94px);letter-spacing:.16em;margin:0 0 0 .16em;text-shadow:0 3px #183d50,0 0 25px #8edfff;animation:outcome075 .25s ease-out both} #outcome075 small{font-size:18px;letter-spacing:.4em;color:#b8efff} #outcome075 .outcome-crest075{font-size:48px;color:#ffe3a0;text-shadow:0 0 25px #60bfe1} #outcome075 button{margin-top:22px;padding:12px 32px;min-height:44px;border:1px solid #ffe3a0;background:#0a2537;color:#fff0c4;font:inherit;cursor:pointer} #outcome075[data-outcome=loss]{background:radial-gradient(ellipse at center,#521d2aef,#160a10ed 65%);color:#f6b4aa} #outcome075[data-outcome=loss]::before{background:linear-gradient(90deg,transparent,#862d4380,transparent);border-color:#d9878780} #outcome075[data-outcome=loss] h1{text-shadow:0 3px #492028,0 0 25px #d46b79} #outcome075[data-outcome=loss] small{color:#ffbab3} @keyframes outcome075{from{opacity:1;transform:scale(1.05)}to{opacity:1;transform:scale(1)}} @media(prefers-reduced-motion:reduce){#outcome075 h1{animation:none}} @media(max-height:420px){#outcome075{gap:4px}#outcome075 .outcome-crest075{font-size:24px}#outcome075 h1{font-size:52px}#outcome075 button{margin-top:10px}} /* workshop076.css */ .release-content.work076{grid-template-columns:110px minmax(0,1fr);grid-template-rows:40px minmax(0,1fr);overflow:hidden} .work076 .work-list{gap:10px;overflow-y:auto;overflow-x:hidden} .work076 .work-list>button{min-height:60px;text-align:center;font-size:15px} .work-browser076{min-height:0;min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:10px;overflow:hidden} .work-browser076>.work-filter045{justify-self:start;min-width:130px} .work-grid076{display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));gap:12px;padding:7px;overflow-y:auto;overflow-x:hidden;align-content:start;min-height:0;overscroll-behavior:contain;scrollbar-gutter:stable} .work-grid076 .work-card076{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 6px;min-width:0;min-height:176px;border:2px solid #678a9b;background:linear-gradient(#315a70,#142e43);box-shadow:0 4px #081c2a;cursor:pointer} .work-card076>img{width:100%;height:94px;object-fit:contain;pointer-events:none} .work-card076>strong{font-size:13px;line-height:1.4;white-space:normal;overflow-wrap:anywhere} .work-card076>span{font-size:12px;color:#f4dfa6} .work-card076>small{font-size:11px;color:#cbdeda} .work-card076.tier-3{border-color:#b29bdf;background:linear-gradient(#554171,#252440)} .work-card076.tier-4{border-color:#e4bc63;background:linear-gradient(#705626,#312c26)} .work-grid076 .can-upgrade076{border-color:#b5fba0;box-shadow:0 0 8px #a5ed9299,inset 0 0 18px #acf28b40;animation:upgrade-glow076 1.8s ease-in-out infinite alternate} .upgrade-ready076{font-size:11px;color:#d3ffaf;background:#234c2c;padding:3px 8px;border:1px solid #8dc47a} .work-selected-body076{min-height:0;min-width:0;display:grid;grid-template-columns:minmax(110px,1fr) minmax(180px,1fr);grid-template-rows:auto minmax(0,1fr);gap:10px;overflow-y:auto;overflow-x:hidden} .work-selected-body076>.work-back076{grid-column:1/-1;justify-self:start;padding:6px 12px} .work-selected-body076>.work-art,.work-selected-body076>.work-detail{grid-row:2} .work076 .work-detail small,.work076 .work-detail p{white-space:normal} @keyframes upgrade-glow076{to{box-shadow:0 0 14px #b8ffb8cc,inset 0 0 24px #aaff864f}} @media(max-height:450px),(max-width:600px){.release-content.work076{grid-template-columns:78px minmax(0,1fr);grid-template-rows:32px minmax(0,1fr);gap:6px}.work076 .work-list>button{min-height:46px;font-size:12px;padding:6px}.work-grid076{grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:8px;padding:5px}.work-grid076 .work-card076{min-height:146px;padding:6px 4px;gap:3px}.work-card076>img{height:76px}.work-card076>strong{font-size:11px}.work-browser076{gap:5px}.work-selected-body076{gap:5px;grid-template-columns:minmax(86px,1fr) minmax(150px,1.5fr)}} @media(max-width:420px){.release-content.work076{grid-template-columns:62px minmax(0,1fr)}.work-grid076{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.work-selected-body076{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 130px auto}.work-selected-body076>.work-art{grid-row:2}.work-selected-body076>.work-detail{grid-row:3}.work-selected-body076 .work-art>img{height:80px}} @media(prefers-reduced-motion:reduce){.work-grid076 .can-upgrade076{animation:none}} /* Keep global gold button skins from obscuring card rarity and readiness. */ .work-grid076 .work-card076{height:auto!important;max-height:none!important;min-height:216px;border-image:none!important;border:2px solid var(--card-edge,#678a9b)!important;background:var(--card-fill,linear-gradient(#315a70,#142e43))!important;white-space:normal!important} .work-grid076 .work-card076.tier-3{--card-edge:#b29bdf;--card-fill:linear-gradient(#554171,#252440)} .work-grid076 .work-card076.tier-4{--card-edge:#e4bc63;--card-fill:linear-gradient(#705626,#312c26)} .work-grid076 .work-card076.can-upgrade076{border-color:#b5fba0!important} @media(max-height:450px),(max-width:600px){.work-grid076 .work-card076{min-height:180px}} /* pixel079.css */ /* Shared pixel chrome: 48px SVG nine-slice artwork; corners never stretch. Reuse .pixel-button079 / .pixel-panel079 with data-tone="gold|silver|teal". Artwork stays decorative; existing DOM labels, focus and click handlers remain. */ :root{--pixel-gold079:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%20shape-rendering%3D%22crispEdges%22%3E%0A%3Cpath%20fill%3D%22%2307131e%22%20d%3D%22M6%200H42V2H46V6H48V42H46V46H42V48H6V46H2V42H0V6H2V2H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23deb96a%22%20d%3D%22M6%202H42V4H44V6H46V42H44V44H42V46H6V44H4V42H2V6H4V4H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23fff1b3%22%20d%3D%22M6%202H42V4H8V6H6V40H4V6H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23886037%22%20d%3D%22M42%206H44V42H42V44H6V42H40V40H42Z%22%2F%3E%0A%3Cpath%20fill%3D%22%2334302e%22%20d%3D%22M10%206H38V8H40V10H42V38H40V40H38V42H10V40H8V38H6V10H8V8H10Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23133b49%22%20d%3D%22M12%208H36V10H38V12H40V36H38V38H36V40H12V38H10V36H8V12H10V10H12Z%22%2F%3E%0A%3Cpath%20fill%3D%22%230c2635%22%20d%3D%22M8%2032H40V36H38V38H36V40H12V38H10V36H8Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23886037%22%20d%3D%22M12%208H36V10H12ZM10%2010H12V12H10ZM8%2012H10V30H8Z%22%2F%3E%0A%3Cpath%20fill%3D%22%2334302e%22%20d%3D%22M5%204h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2363d4df%22%20d%3D%22M6%205h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23fff1b3%22%20x%3D%226%22%20y%3D%225%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%2334302e%22%20d%3D%22M39%204h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2363d4df%22%20d%3D%22M40%205h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23fff1b3%22%20x%3D%2240%22%20y%3D%225%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%2334302e%22%20d%3D%22M5%2038h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2363d4df%22%20d%3D%22M6%2039h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23fff1b3%22%20x%3D%226%22%20y%3D%2239%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%2334302e%22%20d%3D%22M39%2038h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2363d4df%22%20d%3D%22M40%2039h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23fff1b3%22%20x%3D%2240%22%20y%3D%2239%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3C%2Fsvg%3E');--pixel-teal079:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%20shape-rendering%3D%22crispEdges%22%3E%0A%3Cpath%20fill%3D%22%2307131e%22%20d%3D%22M6%200H42V2H46V6H48V42H46V46H42V48H6V46H2V42H0V6H2V2H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%2369acac%22%20d%3D%22M6%202H42V4H44V6H46V42H44V44H42V46H6V44H4V42H2V6H4V4H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23c2f5e9%22%20d%3D%22M6%202H42V4H8V6H6V40H4V6H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23356773%22%20d%3D%22M42%206H44V42H42V44H6V42H40V40H42Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23183642%22%20d%3D%22M10%206H38V8H40V10H42V38H40V40H38V42H10V40H8V38H6V10H8V8H10Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23153b49%22%20d%3D%22M12%208H36V10H38V12H40V36H38V38H36V40H12V38H10V36H8V12H10V10H12Z%22%2F%3E%0A%3Cpath%20fill%3D%22%230c2635%22%20d%3D%22M8%2032H40V36H38V38H36V40H12V38H10V36H8Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23356773%22%20d%3D%22M12%208H36V10H12ZM10%2010H12V12H10ZM8%2012H10V30H8Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23183642%22%20d%3D%22M5%204h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%23f2d78e%22%20d%3D%22M6%205h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23c2f5e9%22%20x%3D%226%22%20y%3D%225%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%23183642%22%20d%3D%22M39%204h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%23f2d78e%22%20d%3D%22M40%205h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23c2f5e9%22%20x%3D%2240%22%20y%3D%225%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%23183642%22%20d%3D%22M5%2038h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%23f2d78e%22%20d%3D%22M6%2039h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23c2f5e9%22%20x%3D%226%22%20y%3D%2239%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%23183642%22%20d%3D%22M39%2038h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%23f2d78e%22%20d%3D%22M40%2039h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23c2f5e9%22%20x%3D%2240%22%20y%3D%2239%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3C%2Fsvg%3E');--pixel-silver079:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%20shape-rendering%3D%22crispEdges%22%3E%0A%3Cpath%20fill%3D%22%2307131e%22%20d%3D%22M6%200H42V2H46V6H48V42H46V46H42V48H6V46H2V42H0V6H2V2H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%2394aab0%22%20d%3D%22M6%202H42V4H44V6H46V42H44V44H42V46H6V44H4V42H2V6H4V4H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23e1e9e3%22%20d%3D%22M6%202H42V4H8V6H6V40H4V6H6Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23506876%22%20d%3D%22M42%206H44V42H42V44H6V42H40V40H42Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23263944%22%20d%3D%22M10%206H38V8H40V10H42V38H40V40H38V42H10V40H8V38H6V10H8V8H10Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23253b49%22%20d%3D%22M12%208H36V10H38V12H40V36H38V38H36V40H12V38H10V36H8V12H10V10H12Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23152735%22%20d%3D%22M8%2032H40V36H38V38H36V40H12V38H10V36H8Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23506876%22%20d%3D%22M12%208H36V10H12ZM10%2010H12V12H10ZM8%2012H10V30H8Z%22%2F%3E%0A%3Cpath%20fill%3D%22%23263944%22%20d%3D%22M5%204h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2385c9dc%22%20d%3D%22M6%205h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23e1e9e3%22%20x%3D%226%22%20y%3D%225%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%23263944%22%20d%3D%22M39%204h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2385c9dc%22%20d%3D%22M40%205h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23e1e9e3%22%20x%3D%2240%22%20y%3D%225%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%23263944%22%20d%3D%22M5%2038h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2385c9dc%22%20d%3D%22M6%2039h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23e1e9e3%22%20x%3D%226%22%20y%3D%2239%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3Cpath%20fill%3D%22%23263944%22%20d%3D%22M39%2038h4v1h1v4h-1v1h-4v-1h-1v-4h1Z%22%2F%3E%3Cpath%20fill%3D%22%2385c9dc%22%20d%3D%22M40%2039h2v1h1v2h-1v1h-2v-1h-1v-2h1Z%22%2F%3E%3Crect%20fill%3D%22%23e1e9e3%22%20x%3D%2240%22%20y%3D%2239%22%20width%3D%221%22%20height%3D%221%22%2F%3E%3C%2Fsvg%3E')} html.pixel-ui038 :is(.pixel-button079,#outcome075 button,#result button,#pausePanel button,.px-dialog button,#atlasV3 .close,#atlasV3 .flow-nav048 button,#atlasV3 .v3-tabs button,#atlasV3 .v3-racebar>button,#atlasV3 .v3-tier-filters button,#atlasV3 .flow-hero048>button,#synergyGuide .close){--pixel-frame079:var(--pixel-teal079);border:2px solid transparent;border-radius:0;border-image:var(--pixel-frame079) 12 fill / 10px / 0 stretch;background:transparent;box-shadow:0 3px 0 #06131c;color:#e3f4eb;text-shadow:1px 2px 0 #071925;image-rendering:pixelated;transition:filter .12s;cursor:pointer} html.pixel-ui038 :is(.pixel-button079,#outcome075 button,#result button,#pausePanel button,.px-dialog button,#atlasV3 .close,#atlasV3 .flow-nav048 button,#atlasV3 .v3-tabs button,#atlasV3 .v3-racebar>button,#atlasV3 .v3-tier-filters button,#atlasV3 .flow-hero048>button,#synergyGuide .close):hover:not(:disabled){filter:brightness(1.18)} html.pixel-ui038 :is(.pixel-button079,#outcome075 button,#result button,#pausePanel button,.px-dialog button,#atlasV3 .close,#atlasV3 .flow-nav048 button,#atlasV3 .v3-tabs button,#atlasV3 .v3-racebar>button,#atlasV3 .v3-tier-filters button,#atlasV3 .flow-hero048>button,#synergyGuide .close):active:not(:disabled){filter:brightness(.88);box-shadow:0 1px 0 #06131c} html.pixel-ui038 :is(.pixel-button079,#outcome075 button,#result button,#pausePanel button,.px-dialog button,#atlasV3 .close,#atlasV3 .flow-nav048 button,#atlasV3 .v3-tabs button,#atlasV3 .v3-racebar>button,#atlasV3 .v3-tier-filters button,#atlasV3 .flow-hero048>button,#synergyGuide .close):focus-visible{outline:2px solid #fff0a4;outline-offset:3px} html.pixel-ui038 :is(.pixel-button079,#outcome075 button,#result button,#pausePanel button,.px-dialog button,#atlasV3 .close,#atlasV3 .flow-nav048 button,#atlasV3 .v3-tabs button,#atlasV3 .v3-racebar>button,#atlasV3 .v3-tier-filters button,#atlasV3 .flow-hero048>button,#synergyGuide .close):disabled{filter:grayscale(.65);opacity:.5;cursor:default} html.pixel-ui038 :is(.pixel-button079[data-tone=gold],#outcome075 button,#result #again,#pausePanel #continue,.px-dialog .px-primary,#atlasV3 .flow-hero048>.primary,#atlasV3 button.active,#result button[aria-pressed=true]){--pixel-frame079:var(--pixel-gold079);color:#fff0bc} html.pixel-ui038 :is(.pixel-button079[data-tone=silver],#result .close,#result #resultClose058,#pausePanel #quit,.px-dialog .px-close,#atlasV3 .close,#synergyGuide .close){--pixel-frame079:var(--pixel-silver079)} html.pixel-ui038 :is(.pixel-panel079,#result .result-card,#pausePanel .pause-card,.px-dialog,#atlasV3 .codex-shell,#synergyGuide .codex-shell){border:3px solid transparent;border-radius:0;border-image:var(--pixel-gold079) 12 fill / 14px / 0 stretch;background:transparent;box-shadow:0 6px 0 #030e17,0 12px 30px #0008;image-rendering:pixelated} html.pixel-ui038 #outcome075 button{min-width:180px;min-height:52px;padding:14px 32px;letter-spacing:.1em;border-image-width:12px} html.pixel-ui038 .pixel-button079{padding:10px 20px;min-height:42px;font:inherit} @media(max-height:420px){html.pixel-ui038 #outcome075 button{min-height:44px;padding:10px 26px}} @media(prefers-reduced-motion:reduce){html.pixel-ui038 .pixel-button079{transition:none}} /* account085.css */ #releaseLobby .top047 .account-level085{display:flex;flex-direction:column;justify-content:center;gap:3px;min-width:52px;padding:3px 6px;color:#ffe6aa;font:inherit;background:#183746;border:1px solid #a6905d;cursor:pointer;flex-shrink:0} .account-level085 progress{display:block;width:100%;height:5px;accent-color:#e6bd62}.account-panel085{line-height:1.6}.account-panel085 progress{display:block;width:100%;height:16px;accent-color:#e6bd62}.account-panel085 h2{color:#ffe6aa}.account-panel085 p{overflow-wrap:anywhere} /* new086.css */ .has-new086{position:relative}.new086{display:inline-flex;align-items:center;justify-content:center;background:#f04f4f;color:#fff8dc;border:2px solid #ffce7a;box-shadow:2px 2px 0 #462b30;font:bold 11px monospace;width:17px;height:17px;line-height:1;flex-shrink:0;margin-left:5px;pointer-events:none}.work-card076>.new086,.landmark047>.new086,.legion047>.new086{position:absolute;right:4px;top:4px;z-index:2}.recent-materials086{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;background:#183b48;border:2px solid #bb9b5b}.recent-materials086 h3,.recent-materials086>small{width:100%;margin:0}.recent-item086{display:inline-flex;align-items:center;white-space:normal;padding:7px} /* draw088.css */ /* Keep the original summon button exposed; no duplicate controls or commands. */ .battle048 #atlasV3.live-draw088{right:auto;width:calc(var(--view-w) - var(--draw-width048) - var(--safe-r));max-width:calc(100% - var(--draw-width048) - var(--safe-r));padding-right:4px;box-sizing:border-box} .battle048 #atlasV3.live-draw088>.codex-shell{width:100%;max-width:100%;min-width:0} /* Summon button bounce, pulse & radiant glow feedback */ .summon.summon-pressed{animation:summon-pop088 .32s cubic-bezier(.175,.885,.32,1.275);box-shadow:0 0 22px #ffd77ce6,inset 0 0 14px #ffecb4!important} @keyframes summon-pop088{0%{transform:scale(.91);filter:brightness(1.35)}50%{transform:scale(1.09);filter:brightness(1.55)}100%{transform:scale(1);filter:none}} @media(prefers-reduced-motion:reduce){.summon.summon-pressed{animation:none}} /* workshop089.css */ /* ImageGen reference: square portrait collection, fixed rail, vertical scroll. */ .release-content.work089{background:#0d1a29;gap:10px;padding:10px;grid-template-columns:108px minmax(0,1fr)} .work089 .work-races050{grid-column:2;gap:5px}.work089 .work-races050 button{background:#17283a;border:1px solid #52616f;color:#bdc5cb}.work089 .work-races050 button.active{border-color:#efd08a;color:#fff0bd;background:#3b3628} .work089 .work-list{grid-column:1;grid-row:1/3;display:flex;flex-direction:column;gap:8px;padding:3px}.work089 .work-list>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:108px;border:2px solid #435567;background:#122436;color:#bdc7d2}.work089 .work-list>button.active{border-color:#ffe09b;color:#fff1bb;background:#31392f;box-shadow:0 0 9px #e5c27944}.work089 .work-category-art089{width:48px!important;height:48px!important;object-fit:contain;flex-shrink:0;pointer-events:none} .work089 .work-browser076{grid-column:2;grid-row:2;gap:6px}.work-toolbar089{display:flex;justify-content:space-between;align-items:center;gap:8px;color:#9eacbb;font-size:12px}.work-toolbar089 .work-filter045{max-width:145px;min-width:0;font:inherit;background:#132637;color:#eddeb8;border:1px solid #6b6e69;padding:4px} .work089 .work-grid076{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:5px;scrollbar-color:#82909e #142434;scrollbar-width:thin} .work089 .work-grid076 .work-card076{display:block;aspect-ratio:1/1;min-height:0!important;height:auto!important;padding:0;gap:0;border:2px solid #a9946c!important;background:#182638!important;box-shadow:2px 3px 0 #050c16;overflow:hidden;text-align:center} .work089 .work-card076>.work-portrait089{position:absolute;inset:0 0 auto;width:100%;height:calc(100% - 53px);object-fit:cover;image-rendering:pixelated;pointer-events:none} .work089 .work-card076>.work-name089{position:absolute;left:0;right:0;bottom:25px;height:28px;display:flex;align-items:center;justify-content:center;padding:0 3px;font-size:12px;line-height:13px;overflow:hidden;color:#f5efdf;background:#101c29} .work089 .work-card076>.work-level089{position:absolute;left:5px;top:5px;padding:2px 4px;border:1px solid #899398;background:#07131fe8;font:bold 12px monospace;color:white;z-index:1} .work-material089{position:absolute;left:5px;right:5px;bottom:5px;height:17px;border:1px solid #79867f;background:#0e1c28;overflow:hidden}.work-material089 progress{appearance:none;display:block;width:100%;height:100%;border:0;background:#132131;accent-color:#7ed849}.work-material089 progress::-webkit-progress-bar{background:#132131}.work-material089 progress::-webkit-progress-value{background:#78c94b}.work-material089 progress::-moz-progress-bar{background:#78c94b}.work-material089 small{position:absolute;inset:0;color:#fff;font:bold 11px/15px monospace;text-shadow:1px 1px #07121d;text-align:center} .work089 .work-card076.tier-3{border-color:#b49ad6!important}.work089 .work-card076.tier-4{border-color:#f0cc7b!important}.work089 .work-grid076 .can-upgrade076{border:3px solid #adf27a!important;box-shadow:0 0 9px #a2ec7766,inset 0 0 8px #a2ec7733;animation:none}.work089 .upgrade-ready076{position:absolute;right:3px;top:4px;font-size:9px;padding:3px;border:1px solid #b8ed7c;color:#e5ffbd;background:#204421}.work089 .work-card076>.new086{top:auto;bottom:56px;right:5px;z-index:2} .work089 .work-selected-body076{grid-column:2;grid-row:2}.work089 .work-detail{background:#15293a;padding:12px}.work089 .work-art{background:#15293a}.work089 .work-art>img{object-fit:contain} @media(min-width:1500px){.work089 .work-grid076{grid-template-columns:repeat(6,minmax(0,1fr))}} @media(max-height:450px),(max-width:800px){.release-content.work089{grid-template-columns:72px minmax(0,1fr);gap:6px;padding:6px}.work089 .work-list{gap:5px}.work089 .work-list>button{min-height:70px;font-size:11px;padding:4px}.work089 .work-category-art089{width:30px!important;height:30px!important}.work089 .work-grid076{gap:8px}.work089 .work-name089{font-size:10px!important}.work089 .work-level089{font-size:10px!important}.work089 .upgrade-ready076{font-size:8px}.work-toolbar089{font-size:10px}} @media(max-width:700px){.work089 .work-grid076{grid-template-columns:repeat(4,minmax(0,1fr))}} @media(max-width:480px){.work089 .work-grid076{grid-template-columns:repeat(2,minmax(0,1fr))}.release-content.work089{grid-template-columns:60px minmax(0,1fr)}.work-toolbar089>strong{display:none}} .work089 .work-grid076{grid-auto-rows:max-content;align-items:start}.work089 .work-grid076 .work-card076{min-height:auto!important} /* chest090.css */ /* ImageGen storyboard: seal, gold shaft, portrait reveal. Transform/opacity only in timelines. */ .chest-opening090{--chest-color:#78cbe6;--chest-secondary:#244771;display:grid!important;grid-template-columns:minmax(190px,32%) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 42px!important;background:radial-gradient(ellipse at 20% 65%,#263259,#080f20 70%);isolation:isolate;gap:12px;padding:16px!important} .chest-opening090[data-chest=elite]{--chest-color:#c3a0ff;--chest-secondary:#5e288d}.chest-opening090[data-chest=royal],.chest-opening090[data-chest=promotion]{--chest-color:#ffe19b;--chest-secondary:#944fc6} .chest-stage090{position:relative;grid-row:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid #b8995840;background:linear-gradient(180deg,#070e2000,#16182d90);contain:paint} .chest-stage090>.pixel-chest{position:absolute;top:40%;width:min(86%,240px)!important;height:auto!important;aspect-ratio:1;margin:0!important;z-index:3;background-image:url('assets/chest090.png')!important;background-size:200% 100%!important;background-position:0 0!important;filter:none!important;animation:chest-charge090 .75s ease-out both} .chest-stage090>.pixel-chest.opened{background-position:100% 0!important;animation:chest-impact090 .55s ease-out both}.chest-opening090[data-chest=supply] .pixel-chest{filter:saturate(.45) hue-rotate(145deg)!important}.chest-opening090[data-chest=elite] .pixel-chest{filter:hue-rotate(15deg)!important} .chest-label090,.chest-status090{position:absolute;left:4px;right:4px;text-align:center;z-index:5}.chest-label090{top:9%;font-size:clamp(14px,1.8vw,23px);color:var(--chest-color);text-shadow:0 2px #000;letter-spacing:2px}.chest-status090{bottom:6%;font-size:11px!important;color:#d4c2e5!important} .chest-ring090{position:absolute;width:80%;aspect-ratio:1;top:49%;border:3px double var(--chest-color);box-shadow:0 0 22px var(--chest-secondary),inset 0 0 15px var(--chest-secondary);transform:rotateX(65deg) rotateZ(45deg);border-radius:50%;opacity:.65}.chest-ring090:after{content:'';position:absolute;inset:13%;border:2px dashed var(--chest-color);border-radius:50%} .chest-rays090{position:absolute;inset:12% -35% -40%;background:repeating-conic-gradient(from 0deg,transparent 0 17deg,var(--chest-secondary) 18deg 23deg,transparent 24deg 36deg);opacity:0;transform:scale(.4)} .chest-beam090{position:absolute;top:10%;bottom:25%;width:30%;background:linear-gradient(0deg,var(--chest-color),#f6d98488,transparent);clip-path:polygon(10% 0,90% 0,65% 100%,35% 100%);opacity:0;transform-origin:50% 100%} .chest-burst090{position:absolute;top:56%;left:50%;width:30px;height:30px;border:4px solid var(--chest-color);border-radius:50%;opacity:0} .chest-spark090{position:absolute;left:50%;top:65%;width:5px;height:8px;background:var(--chest-color);opacity:0;pointer-events:none} [data-phase=reveal] .chest-rays090{animation:chest-rays090 1.2s ease-out both}[data-phase=reveal] .chest-beam090{animation:chest-beam090 1.5s ease-out both}[data-phase=reveal] .chest-burst090{animation:chest-ring090 .75s ease-out both}[data-phase=reveal] .chest-spark090{animation:chest-spark090 1.2s var(--delay) ease-out both} [data-phase=complete] .chest-rays090{opacity:.18;transform:scale(1)}[data-phase=complete] .chest-beam090{opacity:.2} .chest-opening090 .loot-cards{grid-column:2;grid-row:1;display:grid!important;grid-auto-flow:row!important;grid-auto-columns:auto!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:none!important;grid-auto-rows:max-content;align-content:center;overflow:auto!important;padding:8px;gap:12px;min-width:0} .chest-opening090 .loot-card{position:relative;min-height:145px;padding:10px 5px;background:linear-gradient(145deg,#243954,#111b2d);border:2px solid #708eb0;box-shadow:inset 0 0 0 3px #080f22,0 3px 0 #020714;animation:loot-rise090 .5s cubic-bezier(.16,1,.3,1) both} .chest-opening090 .loot-card img{width:84px;height:84px}.chest-opening090 .loot-card strong{font-size:11px;white-space:normal;overflow:visible}.chest-opening090 .loot-card>span{font-size:15px;margin-top:4px}.chest-opening090 .loot-card.tier-3{border-color:#d4a0ff;background:radial-gradient(ellipse at top,#633785,#211936);box-shadow:inset 0 0 0 3px #1d0e35,0 0 12px #b872ec60}.chest-opening090 .loot-card.tier-4{border-color:#ffe3a1;background:radial-gradient(ellipse at top,#82642e,#322638);box-shadow:inset 0 0 0 3px #382614,0 0 20px #f4bf6860}.chest-opening090 .loot-card.tier-4:before{content:'전설';color:#ffe4a6;font-size:10px;letter-spacing:2px}.chest-opening090 .loot-card.tier-3:before{content:'유니크';color:#e2baff;font-size:10px} .chest-opening090 .opening-controls{grid-column:1/-1;grid-row:2;display:flex;justify-content:center;gap:12px;z-index:6}.chest-opening090 .opening-controls button{min-width:120px;min-height:38px} #resultChest044.chest-award090{position:relative;overflow:hidden;border:2px solid #c2a0ff!important;background:linear-gradient(110deg,#352450,#603c7a,#30223e)!important;box-shadow:0 0 18px #c288fc55;color:#fff2d2!important;animation:award-pop090 .7s ease-out both} #resultChest044.chest-upgraded090{border-color:#ffe19b!important;box-shadow:0 0 28px #ffca7170,inset 0 0 18px #d1904b44;background:linear-gradient(110deg,#3a254f,#7d552e,#392652)!important} #resultChest044.chest-award090:after{content:'';position:absolute;inset:-50%;background:linear-gradient(110deg,transparent 40%,#fff2b855 49%,transparent 58%);transform:translateX(-80%);animation:award-shine090 1.3s .4s ease-out 2;pointer-events:none} @keyframes chest-charge090{0%{transform:translateY(8px) scale(.9)}50%{transform:translateY(-4px) rotate(-2deg)}70%{transform:rotate(2deg)}100%{transform:none}}@keyframes chest-impact090{0%{transform:scale(.92)}30%{transform:scale(1.09) translateY(-4px)}100%{transform:none}}@keyframes chest-rays090{0%{opacity:0;transform:scale(.4) rotate(-10deg)}25%{opacity:.7}100%{opacity:.18;transform:scale(1) rotate(8deg)}}@keyframes chest-beam090{0%{opacity:0;transform:scaleY(.1)}20%{opacity:1;transform:scaleY(1)}100%{opacity:.2}}@keyframes chest-ring090{0%{opacity:1;transform:translate(-50%,-50%) scale(.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(10)}}@keyframes chest-spark090{0%{opacity:0;transform:rotate(var(--angle)) translateX(10px)}20%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateX(var(--distance)) rotate(90deg)}}@keyframes loot-rise090{from{opacity:0;transform:translateY(22px) scale(.85) rotateY(45deg)}to{opacity:1;transform:none}}@keyframes award-pop090{0%{transform:scale(.85);opacity:.4}60%{transform:scale(1.04)}100%{transform:none;opacity:1}}@keyframes award-shine090{to{transform:translateX(80%)}} @media(max-height:450px){.chest-opening090{grid-template-columns:minmax(135px,27%) minmax(0,1fr);gap:6px;padding:8px!important;grid-template-rows:minmax(0,1fr) 36px!important}.chest-stage090>.pixel-chest{top:22%;width:min(90%,180px)!important}.chest-label090{top:4%;font-size:13px}.chest-status090{bottom:3%;font-size:9px!important}.chest-opening090 .loot-cards{grid-template-columns:repeat(4,minmax(0,1fr))!important;align-content:start;gap:7px;padding:4px}.chest-opening090 .loot-card{min-height:104px;padding:4px}.chest-opening090 .loot-card img{width:55px;height:55px}.chest-opening090 .loot-card strong{font-size:9px}.chest-opening090 .opening-controls button{min-height:32px}} @media(max-width:600px){.chest-opening090 .loot-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}} @media(prefers-reduced-motion:reduce){.chest-opening090 *,.chest-award090,.chest-award090:after{animation:none!important}} html[data-reduced-effects=true] .chest-opening090 *,html[data-reduced-effects=true] .chest-award090,html[data-reduced-effects=true] .chest-award090:after{animation:none!important} .chest-stage090{container-type:size}.chest-stage090>.pixel-chest{top:25%;width:min(86%,240px,70cqh)!important} .chest-opening090 .loot-cards{align-content:start} /* profile091.css */ #releaseLobby .lobby-units091{position:absolute;bottom:47px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:3} #releaseLobby .lobby-units091 .legion047{position:relative;left:auto;bottom:auto;transform:none;min-width:110px;white-space:nowrap} #releaseLobby .lobby-units091 .upgrade091{border-image-source:var(--green052);color:#efffd6} #releaseLobby #myPage091{cursor:pointer;text-decoration:underline;text-underline-offset:4px} .mypage091{display:grid;grid-template-columns:minmax(170px,28%) minmax(0,1fr);overflow:hidden;background:#112334} .profile-card091{display:flex;flex-direction:column;align-items:stretch;gap:10px;overflow:auto;min-height:0;padding:14px;background:linear-gradient(#293e58,#18263b);border:1px solid #ad945b;text-align:center} .profile-card091>img{width:100px;height:100px;align-self:center}.profile-card091 h2{font-size:18px;margin:0;overflow-wrap:anywhere}.profile-card091 progress{width:100%;height:12px;accent-color:#e9c86f}.profile-card091 strong{font-size:13px}.profile-card091 button{min-height:36px} .profile-records091{min-width:0;overflow:auto;padding:10px;background:#12212f}.profile-records091>h3{font-size:18px}.profile-records091>p{color:#bfccd8}.profile-records091 .history-row{grid-template-columns:1fr 1.4fr 1fr 1fr;gap:6px;font-size:12px;border-left:3px solid #9a96a2;margin-bottom:7px;background:#203446}.profile-records091 .outcome-win{border-left-color:#75d0ba}.profile-records091 .outcome-loss{border-left-color:#ce858d}.profile-records091 .outcome-win>strong{color:#a5efda}.profile-records091 .outcome-loss>strong{color:#edacb4} .legion-menu047{grid-template-columns:repeat(2,minmax(0,1fr))} @media(max-height:450px){#releaseLobby .lobby-units091{bottom:38px;gap:5px}#releaseLobby .lobby-units091 .legion047{min-width:92px;padding-inline:10px}.profile-card091{gap:6px;padding:8px}.profile-card091>img{width:64px;height:64px}.profile-card091 h2{font-size:15px}.profile-records091{padding:4px}.profile-records091 .history-row{font-size:10px;padding:8px 4px}.mypage091{grid-template-columns:minmax(145px,28%) minmax(0,1fr)}} @media(max-width:480px){.mypage091{grid-template-columns:1fr;overflow:auto}.profile-card091,.profile-records091{overflow:visible}.profile-card091>img{width:65px;height:65px}} /* lobby092.css */ #releaseLobby .top047 .rank047{position:static;left:auto;bottom:auto;transform:none;min-width:0;width:auto;max-width:175px;min-height:30px;font-size:12px;white-space:nowrap;padding:3px 10px;flex-shrink:0} #releaseLobby .upgrade091{left:15%;top:46%;bottom:auto;width:110px;height:115px;z-index:4} #releaseLobby .blacksmith092{width:86px;height:86px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(2px 3px #071a2d80)} #releaseLobby .lobby-units091{bottom:12px}#releaseLobby .lobby-units091 .legion047{min-width:126px} @media(max-height:450px){#releaseLobby .top047 .rank047{font-size:10px;min-height:24px;padding:2px 6px;max-width:140px}#releaseLobby .upgrade091{top:41%;width:80px;height:80px}#releaseLobby .blacksmith092{width:56px;height:56px}#releaseLobby .lobby-units091{bottom:6px}} @media(max-width:700px){#releaseLobby .top047{gap:4px;padding-inline:4px}#releaseLobby .top047 .profile047{width:24px;height:24px}#releaseLobby .top047 button:first-of-type{max-width:20%;overflow:hidden;text-overflow:ellipsis;font-size:11px}#releaseLobby .top047 .rank047{font-size:9px;padding-inline:5px}#releaseLobby .top047 .account-level085{min-width:35px}#releaseLobby .gold047,#releaseLobby .diamond052{font-size:10px}} #releaseLobby .guild047,#releaseLobby .upgrade091,#releaseLobby .shop047{height:30%;justify-content:center;bottom:auto} #releaseLobby .guild047{top:0}#releaseLobby .upgrade091{top:33%}#releaseLobby .shop047{top:66%} #releaseLobby .guild047 .atlas-icon045,#releaseLobby .shop047 .atlas-icon045{width:min(78px,14vh);height:min(78px,14vh);flex-basis:min(78px,14vh)} #releaseLobby .blacksmith092{width:min(84px,14vh);height:min(84px,14vh)} @media(min-width:1024px){#releaseLobby .upgrade091 .blacksmith092{margin-bottom:-10px}} /* story093.css */ /* One readable story sign above the gate, without nested button frames. */ #releaseLobby .title047.story-sign093{top:3%;padding:0!important;border:0!important;border-image:none!important;box-shadow:none!important;background:transparent!important;line-height:1;letter-spacing:0;width:218px;max-width:38%;overflow:visible} #releaseLobby .story-sign093 .story-entry068{position:relative;display:grid;grid-template-columns:1fr 20px;grid-template-rows:auto auto;column-gap:10px;row-gap:6px;width:100%;min-height:68px;padding:12px 18px!important;background:linear-gradient(180deg,#374448,#142c36)!important;border:2px solid #d6b875!important;border-image:none!important;border-radius:0!important;box-shadow:inset 0 0 0 2px #172a30,0 3px 0 #091b25,0 4px 8px #07162460!important;color:#ffedc4;text-shadow:0 2px #112329;text-align:left;touch-action:manipulation} #releaseLobby .story-label093{font-family:inherit;font-size:24px;font-weight:bold;grid-column:1;grid-row:1;letter-spacing:3px;line-height:1.15} #releaseLobby .story-arrow093{grid-column:2;grid-row:1/3;align-self:center;font-size:30px;color:#e4c489;line-height:1} #releaseLobby .story-entry-sub068{grid-column:1;grid-row:2;display:block;font-family:inherit;font-size:11px;line-height:1.2;letter-spacing:0;color:#dbd6be;white-space:nowrap} #releaseLobby .story-entry068:hover{background:linear-gradient(#485653,#223b43)!important}#releaseLobby .story-entry068:focus-visible{outline:2px solid #fff1bc;outline-offset:3px} #releaseLobby[data-race=elf] .story-entry068{background:linear-gradient(#3b5148,#193c35)!important;border-color:#d5d9a1!important} #releaseLobby[data-race=demon] .story-entry068{background:linear-gradient(#48344c,#2e2037)!important;border-color:#d7acd5!important} @media(max-height:450px){#releaseLobby .title047.story-sign093{top:2%;width:165px;max-width:37%}#releaseLobby .story-sign093 .story-entry068{min-height:48px;padding:7px 12px!important;row-gap:3px;column-gap:5px}#releaseLobby .story-label093{font-size:18px;letter-spacing:2px}#releaseLobby .story-entry-sub068{font-size:10px}#releaseLobby .story-arrow093{font-size:23px}} /* growth095.css */ .growth095{border-top:2px solid #9f8859;margin-top:14px;padding-top:10px;color:#e6e8d4;min-width:0}.growth095 h3{margin:8px 0}.growth095 small{display:block;line-height:1.55;color:#bdcdbc}.growth095 p{line-height:1.5;overflow-wrap:anywhere}.growth095 button{white-space:normal;min-height:36px;font-size:12px}.wildcard095{display:flex;gap:8px;align-items:center;margin:10px 0}.wildcard095 input{width:18px;height:18px;flex:none}.evolution-grid095{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}.evolution095{padding:10px;background:#18333e;border:2px solid #557270;min-width:0;font-size:12px}.evolution095.equipped095{border-color:#ebc978;box-shadow:inset 0 0 0 1px #756135}.book-preview095:not(:empty){padding:10px;border:2px solid #d1b474;margin-top:8px;background:#263b40}.growth095 button:disabled{opacity:.45}@media(max-width:650px){.evolution-grid095{grid-template-columns:1fr}.growth095{font-size:12px}.growth095 h3{font-size:14px}} /* Shared lobby labels and right-aligned profile order. */ #releaseLobby .top047 .gold047{margin-left:0}#releaseLobby .top047 #myPage091{max-width:140px;overflow:hidden;text-overflow:ellipsis;padding:0 3px;font-size:13px}#releaseLobby .profile047{display:none}#releaseLobby .profile-flag095{font-size:18px;flex:none}#releaseLobby .top047 .rank047{margin-left:auto}#releaseLobby .top047 .diamond052{display:flex;align-items:center;gap:3px;white-space:nowrap}#releaseLobby .diamond095{width:27px;height:27px;flex:0 0 27px;background-size:400% 400%;--sprite-x:100%;--sprite-y:66.6667%} #releaseLobby .title047.story-sign093{width:auto;max-width:38%}#releaseLobby .story-sign093 .story-entry068{display:block;width:auto;min-width:90px;min-height:0;padding:7px 10px!important;background:#082337!important;background-clip:padding-box!important;color:#fff2d0;border:2px solid transparent!important;border-image:var(--plate052) 28 fill / 9px / 0 stretch!important;box-shadow:none!important;text-align:center;line-height:1}#releaseLobby .story-label093{font-size:16px;letter-spacing:0;line-height:1}#releaseLobby .story-arrow093{display:none}#releaseLobby .story-entry-sub068{font-size:10px;line-height:1.2;margin-top:4px;letter-spacing:0;color:#e4dfc3}#releaseLobby .story-entry068:hover{background:#48604a!important} @media(max-width:700px){#releaseLobby .top047{gap:3px}#releaseLobby .top047 #myPage091{max-width:86px;font-size:11px}#releaseLobby .profile-flag095{font-size:15px}#releaseLobby .top047 .rank047{max-width:112px}#releaseLobby .diamond095{width:22px;height:22px;flex-basis:22px}#releaseLobby .story-label093{font-size:13px}#releaseLobby .story-sign093 .story-entry068{padding:5px 8px!important}} .work-skills099{margin-top:14px;padding:12px;background:#18333e;border:2px solid #557270;min-width:0}.work-skills099 h3{margin:0 0 6px;color:#f1ce83}.work-skills099 small{color:#bdcdbc}.work-skills099 p{margin:8px 0 0;line-height:1.55;overflow-wrap:anywhere} /* chrome101.css */ /* Keep decorative corners outside a real, opaque text area. */ #releaseLobby .landmark047 .icon-caption045{display:block;box-sizing:border-box;min-height:34px;padding:7px 14px;line-height:16px;border-image-slice:28;background:#082337;text-shadow:0 1px #071522;white-space:nowrap} #releaseLobby :is(.legion047,.rank047,.resume047,.release-season,.wallet052){border-image-slice:28;line-height:1.4;text-shadow:0 1px #071522} #releaseLobby .story-sign093 .story-entry068{border-image-slice:28!important;line-height:1.4;background:#082337!important} #releaseLobby .story-entry068 :is(.story-label093,.story-entry-sub068){background:none;border:0;box-shadow:none;line-height:1.4} #releasePanel :is(button,input,select){border-image-slice:28;line-height:1.5;text-shadow:0 1px #071522;white-space:normal;overflow-wrap:anywhere} #releasePanel :is(button.active,button.primary,.product-price052){border-image-slice:32} #releasePanel :is(.product044>h3,.pass-day>h3){border-image-slice:28;background:#082337;white-space:normal;line-height:1.5;padding:9px 12px} #releasePanel :is(.work-card076,.work-list button){line-height:1.2} html.pixel-ui038 :is(.pixel-button079,#outcome075 button,#result button,#pausePanel button,.px-dialog button,#atlasV3 .close,#atlasV3 .flow-nav048 button,#atlasV3 .v3-tabs button,#atlasV3 .v3-racebar>button,#atlasV3 .v3-tier-filters button,#atlasV3 .flow-hero048>button,#synergyGuide .close){border-image-slice:12;background-color:#133b49;line-height:1.5;text-shadow:0 1px #071925;padding-block:9px;min-height:38px;white-space:normal;overflow-wrap:anywhere} @media(max-height:450px){#releaseLobby .landmark047 .icon-caption045{min-height:30px;padding:5px 12px;line-height:16px}#releaseLobby .release-season{line-height:16px;min-height:24px}#releasePanel :is(.product044>h3,.pass-day>h3){padding:7px 10px}} /* layout121.css */ /* Explicit lanes prevent the optional materials banner from displacing products. */ .battle049 #releasePanel .shop044{display:flex;flex-direction:column;gap:10px;padding:12px;overflow:auto} .battle049 #releasePanel .shop-nav{display:flex;flex-direction:row;flex:none;height:auto;max-height:none;min-height:44px;width:100%;align-self:stretch;gap:6px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x} .battle049 #releasePanel .shop-nav button{flex:1 0 100px;min-height:44px!important;height:44px;padding:5px 10px!important;justify-content:center;white-space:nowrap} .battle049 #releasePanel .recent-materials086{flex:none;flex-wrap:nowrap;gap:8px;padding:8px;overflow-x:auto;min-height:54px;max-width:100%;box-sizing:border-box;touch-action:pan-x} .battle049 #releasePanel .recent-materials086 h3{width:auto;flex:none;font-size:12px;max-width:85px;white-space:normal} .battle049 #releasePanel .recent-materials086>small{display:none} .battle049 #releasePanel .recent-item086{flex:none;min-height:40px;font-size:12px} .battle049 #releasePanel .shop-products{flex:1 0 230px;width:100%;height:auto;min-height:230px;max-height:none;align-self:stretch;grid-auto-columns:minmax(190px,1fr);overflow-x:auto;overflow-y:hidden;padding:0 0 5px} .battle049 #releasePanel .shop-products .product044{gap:7px;padding:10px;min-width:0} .battle049 #releasePanel .product044 h3{margin:0;font-size:15px;flex:none} .battle049 #releasePanel .product044 small{white-space:normal;flex:none;font-size:12px} .battle049 #releasePanel .product044>button{flex:none;min-height:40px} .battle049 #releasePanel .product-art052{min-height:45px} #releaseLobby .top047 .rank047{margin-left:0} #releaseLobby .top047 .gold047{margin-left:auto} #releaseLobby .top047 #myPage091{flex:0 1 auto;min-width:30px;max-width:140px} #releaseLobby .top047 .account-level085{flex-shrink:0} @media(max-height:450px){ .battle049 #releasePanel .shop044{gap:6px;padding:7px} .battle049 #releasePanel .shop-products{flex-basis:220px;min-height:220px} .battle049 #releasePanel .recent-materials086{padding:4px 7px;min-height:46px} .battle049 #releasePanel .shop-products .product044{padding:7px;gap:4px} } @media(max-width:700px){ #releaseLobby .top047{gap:4px} #releaseLobby .top047 #myPage091{max-width:88px;font-size:11px} #releaseLobby .top047 .rank047{max-width:106px;padding:3px 5px;font-size:9px} .battle049 #releasePanel .shop-nav button{flex-basis:88px;font-size:12px} } /* Vertical reward grids must override the old horizontal carousel's touch lock. */ .battle049 #releasePanel .chest-opening090{min-height:0;overflow:hidden} .battle049 #releasePanel .chest-opening090 .loot-cards{min-height:0;touch-action:pan-y;overscroll-behavior-y:contain;scroll-padding:8px;padding-bottom:16px;scrollbar-gutter:stable} .battle049 #releasePanel .chest-opening090 .loot-card{box-sizing:border-box;min-width:0;overflow-wrap:anywhere} .battle049 #releasePanel .chest-opening090 .opening-controls{min-height:0} .battle049 #releasePanel .chest-opening090 .opening-controls button{min-width:0} .battle049 #releasePanel .release-content:not(.shop044):not(.chest-opening090){overscroll-behavior:contain} .loot-scroll122{align-self:center;white-space:nowrap;font-size:11px;color:#c9d9e8;flex:none} .chest-opening090 .opening-controls .primary{flex:1} /* Show complete rows at rest; more rewards remain reachable by vertical swipe. */ @media(orientation:landscape){ .battle049 #releasePanel .chest-opening090 .loot-cards{grid-auto-rows:max(104px,calc((100% - 8px)/2));padding:4px;gap:8px;scroll-snap-type:y proximity} .battle049 #releasePanel .chest-opening090 .loot-card{scroll-snap-align:start;min-height:0;justify-content:center} } /* brand.css */ .loading-logo071 { font-size: clamp(22px, 4.3vw, 44px) !important; letter-spacing: .02em !important; overflow-wrap: anywhere; } #home .home-card h1 { font-size: clamp(20px, 3.2vw, 38px) !important; letter-spacing: 0 !important; } .release-title { font-size: clamp(18px, 2.5vw, 26px); letter-spacing: .02em; } #home .home-footer { white-space: normal; } /* story-map185.css */ /* Faction campaign maps: edge-to-edge landscape art, horizontal touch scrolling. */ #releasePanel .story-map185{display:grid!important;grid-template-rows:auto minmax(0,1fr) auto;gap:6px;overflow:hidden;padding:8px;min-height:0;background:#101f27;color:#eee8d5} #releasePanel .story-map-header185{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 3px} #releasePanel .story-map-header185 h2{margin:2px 0;font-size:18px;color:#f3d391} #releasePanel .story-map-header185 small{font-size:10px;color:#b9c9c4} #releasePanel .story-map-progress185{display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:11px} #releasePanel .story-map-progress185 strong{font-size:20px;color:#e9cf93} #releasePanel .story-map-layout185{display:grid;grid-template-rows:minmax(0,1fr) 100px;grid-template-columns:minmax(0,1fr);gap:6px;min-height:0;min-width:0} #releasePanel .story-map-viewport185{overflow-x:auto;overflow-y:hidden;min-width:0;min-height:0;background:#192727;border:1px solid #79694f;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#ae9667 #182a31;touch-action:pan-x} #releasePanel .story-map-board185{position:relative;width:100%;min-width:1280px;height:100%;min-height:0;isolation:isolate;overflow:hidden} #releasePanel .story-map-art185{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:fill;image-rendering:auto;user-select:none;pointer-events:none;filter:brightness(.82)} #releasePanel .story-map-paths185{position:absolute;width:100%;height:100%;inset:0;pointer-events:none;z-index:1} #releasePanel .story-map-place185{position:absolute;z-index:2;transform:translate(-50%,-50%);padding:2px 7px;background:#101b20cc;color:#efdfba;font-size:11px;white-space:nowrap;pointer-events:none} #releasePanel button.story-map-node185{position:absolute;z-index:3;transform:translate(-50%,-50%);display:flex;flex-direction:column;gap:2px;align-items:center;justify-content:center;width:44px!important;min-width:44px!important;height:44px;min-height:44px;padding:2px!important;line-height:1!important;background:#21333ded!important;border:2px solid #829596!important;border-image:none!important;border-radius:9px!important;box-shadow:0 3px 0 #081216!important;color:#e9efdc;font:inherit;touch-action:manipulation} #releasePanel .story-map-node185 strong{font-size:17px;white-space:nowrap;flex-shrink:0} #releasePanel button.story-map-node185[data-state=locked]{background:#222932e8!important;border-color:#737b7c!important;color:#c2c6c4} #releasePanel button.story-map-node185[data-state=done]{border-color:#a5cba5!important;color:#cceacd;background:#214332f0!important} #releasePanel button.story-map-node185[data-state=open]{border-color:#ffda73!important;background:#725221f5!important;color:#fff4ce} #releasePanel button.story-map-node185[aria-pressed=true]{outline:3px solid #fff1c7;outline-offset:3px} #releasePanel button.story-map-node185[data-state=done]::after{content:"✓";position:absolute;right:-3px;top:-8px;background:#214332;color:#cdf5d7;border-radius:50%;font-size:14px;padding:1px 3px} #releasePanel button.story-map-node185[data-state=locked]::after{content:"잠김";display:block;font-size:9px;color:#c2c6c4} #releasePanel .story-map-detail185{display:grid;grid-template-columns:minmax(95px,.8fr) minmax(190px,1.5fr) minmax(150px,1fr) 130px;align-items:center;gap:12px;overflow:hidden;min-width:0;padding:7px 10px;background:#172b32;border-top:1px solid #6c6047} #releasePanel .story-stage-identity186>strong{font-size:15px;color:#e9cf93} #releasePanel .story-stage-identity186{min-width:0;overflow:hidden!important} #releasePanel .story-stage-identity186 h3{margin:3px 0 0;font-size:12px;line-height:1.3;color:#d4dccc;white-space:normal;overflow:hidden;word-break:keep-all} #releasePanel .story-combatants185{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-width:0} #releasePanel .story-opponent185,#releasePanel .story-speaker185{display:flex;align-items:center;gap:7px;white-space:pre-line;font-size:12px;line-height:1.4;color:#e0d9c4;min-width:0} #releasePanel .story-combatants185 [data-side=ally]{color:#b6e5d6} #releasePanel .story-combatants185 [data-side=enemy]{color:#ffc5b4} #releasePanel .story-opponent185 img{width:36px;height:42px;object-fit:contain;image-rendering:pixelated;flex-shrink:0} #releasePanel .story-rewards185{display:flex;flex-direction:column;gap:2px;color:#ebd6a3;min-width:0} #releasePanel .story-rewards185>small{font-size:10px;color:#bacdc4} #releasePanel .story-rewards185 strong{font-size:15px;line-height:1.3} #releasePanel .story-reward-card185{display:flex;align-items:center;gap:5px;font-size:11px} #releasePanel .story-reward-card185 img{width:24px;height:24px;object-fit:contain;image-rendering:pixelated} #releasePanel .story-map-detail185 .story-upgrade-note185{display:none} #releasePanel .story-map-primary185{width:100%!important;min-height:44px;padding:7px!important;white-space:normal!important;font-size:14px} #releasePanel .story-map-footer185{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#b5c4bd;font-size:10px} #releasePanel .story-map-footer185 button{padding:3px 10px;min-height:28px;font-size:11px} #releasePanel .story-brief185{display:flex!important;flex-direction:column;gap:8px;background:#15272e;min-height:0;overflow:hidden} #releasePanel .story-back068{align-self:flex-start;min-height:40px;margin:0} #releasePanel .story-brief-layout185{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:16px;min-height:0} #releasePanel .story-dialogue185,#releasePanel .story-brief-summary185{min-height:0;overflow:auto;scrollbar-width:thin;padding:5px 8px} #releasePanel .story-dialogue185{border-right:1px solid #475957} #releasePanel .story-dialogue185 h2{font-size:21px;color:#edce8a;margin:10px 0} #releasePanel .story-dialogue185 p{font:15px/1.8 system-ui,sans-serif;color:#dddcd1;margin:12px 0;max-width:65ch;word-break:keep-all} #releasePanel .story-speaker185{font-size:15px;color:#eddda9} #releasePanel .story-speaker185 img{width:76px;height:86px;object-fit:contain;image-rendering:pixelated} #releasePanel .story-brief-summary185{display:flex;flex-direction:column;gap:10px} #releasePanel .story-brief-summary185>*{flex-shrink:0} #releasePanel .story-brief185 .story-enemies068{display:flex;gap:7px;flex-wrap:wrap} #releasePanel .story-brief185 .story-enemies068>div{display:flex;flex-direction:column;gap:3px;background:transparent;padding:0;flex:1 0 52px} #releasePanel .story-enemies068 img{width:40px;height:44px;object-fit:contain;image-rendering:pixelated} #releasePanel .story-enemies068 small{font-size:10px;text-align:center} #releasePanel .story-rule185{font-size:11px;line-height:1.6;color:#a9bdb6;margin:0} #releasePanel .story-epilogue185{padding:10px 0;border-top:1px solid #596351} #releasePanel .story-epilogue185 summary{color:#e7cc8f;cursor:pointer} #releasePanel .story-map185 button:focus-visible,#releasePanel .story-brief185 button:focus-visible{outline:3px solid #e5f9ff;outline-offset:2px} @media(max-height:500px),(max-width:900px){ #releasePanel .story-map185{padding:4px;gap:3px} #releasePanel .story-map-header185 h2{font-size:13px;margin:0} #releasePanel .story-map-header185>div>small{display:none} #releasePanel .story-map-progress185 strong{font-size:15px} #releasePanel .story-map-progress185 small{font-size:9px} #releasePanel .story-map-layout185{gap:3px;grid-template-rows:minmax(0,1fr) 78px} #releasePanel .story-map-detail185{grid-template-columns:90px minmax(175px,1.4fr) minmax(130px,1fr) 108px;gap:7px;padding:4px 6px} #releasePanel .story-stage-identity186>strong{font-size:12px} #releasePanel .story-stage-identity186 h3{font-size:10px} #releasePanel .story-map-detail185 .story-opponent185{font-size:10px;gap:3px;line-height:1.25} #releasePanel .story-map-detail185 .story-opponent185 img{width:27px;height:32px} #releasePanel .story-map-detail185 .story-rewards185 strong{font-size:12px} #releasePanel .story-map-detail185 .story-rewards185>small{font-size:8px} #releasePanel .story-map-detail185 .story-reward-card185{font-size:9px} #releasePanel .story-map-detail185 .story-reward-card185 img{width:18px;height:18px} #releasePanel .story-map-detail185 .story-map-primary185{font-size:11px} #releasePanel .story-map-footer185{font-size:9px} #releasePanel .story-map-footer185 button{min-height:26px} #releasePanel .story-brief-layout185{grid-template-columns:minmax(0,1fr) 235px;gap:8px} #releasePanel .story-dialogue185 h2{font-size:16px;margin:6px 0} #releasePanel .story-dialogue185 p{font-size:13px;line-height:1.6;margin:8px 0} #releasePanel .story-speaker185 img{width:54px;height:60px} #releasePanel .story-speaker185{font-size:12px} } @media(max-width:650px){ #releasePanel .story-map-detail185{grid-template-columns:52px minmax(164px,1.3fr) minmax(120px,1fr) 90px;gap:4px;padding:3px} #releasePanel .story-stage-identity186 h3{display:none} #releasePanel .story-map-detail185 .story-opponent185 img{width:23px;height:28px} #releasePanel .story-map-detail185 .story-combatants185{gap:3px} #releasePanel .story-map-footer185>span{font-size:8px} } #releasePanel .story-brief-summary185>.story-map-primary185{order:-1;min-height:44px} /* request-protection.css */ #covenantMaintenance,.covenantChallenge{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;background:rgba(5,18,30,.96);color:#fff4cc;padding:max(16px,env(safe-area-inset-top));font-family:inherit;box-sizing:border-box} #covenantMaintenance>div,.covenantChallenge>div{max-width:min(560px,100%);padding:clamp(18px,4vw,40px);text-align:center;background:#102c40;border:3px solid #c9a850;box-shadow:0 0 0 3px #071724;box-sizing:border-box} #covenantMaintenance h1{font-size:clamp(24px,4vw,36px);margin:0 0 20px} #covenantMaintenance p,.covenantChallenge p{line-height:1.7;word-break:keep-all;overflow-wrap:anywhere} #covenantMaintenance button,.covenantChallenge button{min-height:44px;min-width:110px;padding:10px 20px;margin-top:14px;font:inherit;color:#fff4cc;background:#235574;border:2px solid #c9a850;cursor:pointer} /* service-settings.css */ .settings045 .service-settings183{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding-top:12px;border-top:1px solid #708b8e} .service-settings183 h3,.service-settings183 small{grid-column:1/-1} .service-settings183 .service-link183{display:flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;padding:8px;color:#fff2d1;background:#142f3b;border:1px solid #708b8e;text-align:center;text-decoration:none;font-size:clamp(11px,1.5vw,14px);overflow-wrap:anywhere} .service-settings183 .service-link183:focus-visible{outline:2px solid #ffd675;outline-offset:2px} .service-settings183 .service-link183:hover{background:#234657} .service-settings183 .service-version183{overflow-wrap:anywhere} @media(min-width:900px){.settings045 .service-settings183{grid-template-columns:repeat(4,minmax(0,1fr))}} /* economy/probability.css */ .loot-probability{min-width:0;max-width:100%;font-size:13px;line-height:1.5}.loot-probability p,.loot-probability small{white-space:normal!important;overflow-wrap:anywhere}.loot-probability .loot-version{font-size:11px;opacity:.8}.loot-probability-scroll{max-width:100%;overflow:auto;max-height:400px;scrollbar-width:thin;overscroll-behavior:contain}.loot-probability table{width:100%;border-collapse:collapse;font-size:12px;table-layout:fixed}.loot-probability caption{text-align:left;padding:8px 0}.loot-probability th,.loot-probability td{padding:8px 5px;border-bottom:1px solid #617a8140;text-align:left;overflow-wrap:anywhere;white-space:normal}.loot-probability th{position:sticky;top:0;background:#12304a;z-index:1}.loot-probability th:first-child{width:28%}.loot-probability small{display:block;margin-top:8px}.loot-probability button{min-height:36px}.probability-catalog-controls{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.probability-catalog-controls select{max-width:100%;padding:10px;background:#19332f;color:#f0e4cc;border:1px solid #ad9670}.probability-loading{padding:20px;border:1px solid #617a81}.document .loot-probability{margin-top:25px}.document .loot-probability-scroll{max-height:60svh}.document .loot-probability th{background:#19332f}@media(max-height:420px){.loot-probability-scroll{max-height:190px}.loot-probability td,.loot-probability th{padding:6px 4px}.loot-probability{font-size:12px}}@media(max-width:520px){.loot-probability table{font-size:11px}.loot-probability th,.loot-probability td{padding:6px 3px}} /* tutorial190.css */ #tutorial190{position:fixed;z-index:410;top:64px;left:50%;transform:translateX(-50%);width:min(330px,48vw);box-sizing:border-box;padding:9px 12px;background:#142a32f5;border:1px solid #edcf87;border-radius:8px;color:#fff3d1;pointer-events:none;font-size:12px;line-height:1.4;box-shadow:0 3px 12px #0006} #tutorial190 strong{display:block;font-size:13px;color:#ffe1a0}#tutorial190 p{margin:4px 0 0}#tutorial190.atlas190{top:auto;bottom:8px;width:min(410px,65vw)} #tutorialTarget190{position:fixed;z-index:409;box-sizing:border-box;border:3px solid #ffe196;border-radius:8px;pointer-events:none;box-shadow:0 0 0 2px #142a32} #tutorial190[hidden],#tutorialTarget190[hidden]{display:none!important} @media(max-height:360px){#tutorial190{top:45px;padding:5px 8px;font-size:11px;width:280px;max-width:49vw}#tutorial190 strong{font-size:12px}#tutorial190 p{margin-top:2px}} /* tutorial260.css */ .tutorial-block260{position:fixed;z-index:9997;background:#03121ad1;touch-action:none} #tutorialRing260{position:fixed;z-index:9998;border:3px solid #ffe09a;border-radius:12px;box-sizing:border-box;pointer-events:none;box-shadow:0 0 0 2px #112a32} #tutorial260{position:fixed;z-index:9999;left:50%;top:max(12px,env(safe-area-inset-top));transform:translateX(-50%);width:min(440px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;box-sizing:border-box;border:2px solid #e9cc87;border-radius:10px;padding:12px 16px;background:#102c37;color:#fff3d0;box-shadow:0 4px 18px #0009;font:14px/1.45 system-ui} #tutorial260 strong{display:block;font-size:18px;color:#ffe198}#tutorial260 small{font-size:11px;color:#b3cbd0}#tutorial260 p{margin:6px 0 8px}#tutorial260 button{display:block;margin:8px auto 0;min-height:42px;padding:8px 18px;border:1px solid #e9cc87;border-radius:7px;background:#305669;color:#fff;font:inherit;font-weight:700} #tutorial260.tutorial-bottom260{top:auto;bottom:max(12px,env(safe-area-inset-bottom))} #tutorial260[hidden],#tutorialRing260[hidden],.tutorial-block260[hidden],#tutorial260 button[hidden]{display:none!important} .mandatory-training260 #tutorial190,.mandatory-training260 #tutorialTarget190{display:none!important} @media(max-height:420px){#tutorial260{width:min(380px,calc(100vw - 24px));padding:7px 11px;font-size:12px;line-height:1.35}#tutorial260 strong{font-size:15px}#tutorial260 p{margin:3px 0 4px}#tutorial260 button{min-height:36px;margin-top:5px}} /* growth-guide192.css */ .first-upgrade192{padding:8px 10px;border-left:3px solid #e9ce89;background:#203940;color:#f5e9c9;font-size:12px;line-height:1.5;margin:0 0 8px} #upgrade044.first-upgrade-target192{outline:2px solid #ffe19a;outline-offset:2px} #resultUpgrade:not(.hidden){white-space:normal;min-height:44px;line-height:1.4} #result.result043 #resultUpgrade:not(.hidden){display:block!important;grid-column:1;margin:4px 0;font-size:12px;padding:6px} /* context-guide193.css */ .context-guide193{grid-column:1/-1;box-sizing:border-box;flex:none;width:100%;padding:8px 10px;border:1px solid #76928d;background:#18353d;color:#eee5ce;font-size:12px;line-height:1.5} .context-guide193 summary{cursor:pointer;min-height:28px;display:list-item;color:#f4d997;font-weight:700;padding:4px} .context-guide193 p{margin:6px 0 0}.evolution-guide193{margin-top:10px}.evolution-guide193>summary{min-height:36px} .evolution-guide193>p{border-left:2px solid #e2c87d;padding-left:8px} .context-target193{outline:2px solid #f1d18a;outline-offset:2px} /* nickname195.css */ .nickname-entry195{width:min(460px,90vw);max-height:90dvh;box-sizing:border-box;color:#f8ebce;background:#182426;border:2px solid #b89a59;border-radius:16px;padding:20px;box-shadow:0 18px 70px #000b}.nickname-entry195::backdrop{background:#061112d9}.nickname-entry195 form{display:grid;gap:10px}.nickname-entry195 h2,.nickname-entry195 p{margin:0}.nickname-entry195 p{font-size:13px;line-height:1.4}.nickname-entry195 input:not([type=checkbox]){font:inherit;min-height:44px;border:1px solid #b89a59;border-radius:8px;padding:0 12px;background:#081619;color:#fff}.nickname-entry195 button{min-height:44px;background:#dac28b;color:#182426;border:0;border-radius:8px;font-weight:800}.nickname-entry195 [role=status]{color:#ffb5a1}.nickname-confirm195{display:flex;gap:8px;align-items:center;font-size:13px;min-height:32px}@media(max-height:380px){.nickname-entry195{padding:12px}.nickname-entry195 form{gap:6px}.nickname-entry195 h2{font-size:19px}} /* player-policy238.css */ .account-age238,.account-guardian238{display:grid;gap:8px;border:2px solid #816647;padding:10px;background:#171b25;color:#eee3c9} .account-age238 input,.account-guardian238 input,.guardian-page238 input:not([type=checkbox]){min-height:44px;box-sizing:border-box;width:100%;background:#242d3b;color:#fff3cc;border:2px solid #8d7858;padding:8px;font:inherit} .account-guardian238 button,.guardian-page238 button{min-height:44px;padding:8px 12px;background:#334753;color:#fff3cc;border:2px solid #baa174;font:inherit;cursor:pointer} .account-guardian238 a,.guardian-page238 a{color:#ffdc82;overflow-wrap:anywhere} .guardian-page238{box-sizing:border-box;max-width:720px;margin:16px auto;padding:16px;background:#171b25;color:#eee3c9;border:3px solid #816647;display:grid;gap:12px;font:16px/1.5 monospace} body:has(.guardian-page238){margin:0;padding:8px;background:#0b1019} .guardian-page238 h1{font-size:22px;margin:0}.guardian-page238 p{margin:0} .guardian-button238{display:inline-flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;padding:8px 12px;background:#334753;border:2px solid #baa174;text-decoration:none}.guardian-page238 h2{font-size:18px}.guardian-page238 details{overflow-wrap:anywhere} .account-entry070 input[type=date]{min-width:0;max-width:100%;min-height:44px} .account-legal070 .account-age238{display:grid;grid-template-columns:minmax(0,1fr);min-width:0;align-items:stretch;cursor:default} .account-legal070 .account-age238 input{width:100%;min-width:0;height:44px;flex-shrink:1} .account-entry-card070>*,.account-legal070>*{min-width:0;box-sizing:border-box;overflow-wrap:anywhere} .account-entry070 .account-entry-card070{max-height:calc(100dvh - 16px);overflow:auto;box-sizing:border-box} .account-entry070 button{min-height:44px}.account-entry070 details>summary{min-height:36px;cursor:pointer} @media(max-height:430px){.account-entry070{padding:8px}.account-entry070 .account-entry-card070{padding:12px;gap:8px}.account-entry070 h1{font-size:20px}.account-entry070 .account-intro070 p{margin:4px 0}.account-age238,.account-guardian238{padding:8px}.account-legal070 details{max-height:112px;overflow:auto}} /* passes248.css */ /* Four independent passes, compact landscape layout. */ .release-content.pass044{display:grid;grid-template-rows:max-content max-content minmax(0,1fr);align-content:start;gap:8px;overflow:hidden} .pass044>.pass-paging045{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px} .pass044>.pass-bar{display:flex;flex-wrap:wrap;gap:6px;min-height:0;align-items:center} .pass044>.pass-bar>small{flex:1 1 220px;max-width:none;white-space:normal} .pass044 .pass-days{min-height:0;align-items:stretch;grid-auto-columns:minmax(240px,30%);overflow-x:auto;overflow-y:auto} .pass044 .pass-day{min-width:0;align-content:start} .pass044 .pass-day button{white-space:normal;line-height:1.5;overflow-wrap:anywhere;height:auto;min-height:34px} @media(max-height:450px){.release-content.pass044{gap:4px;padding:5px}.pass044>.pass-paging045 button{padding:4px 7px;font-size:11px}.pass044 .pass-days{grid-auto-columns:220px}.pass044 .pass-day{gap:2px;padding:5px}.pass044 .pass-day button{font-size:11px;line-height:1.3;min-height:28px}} .pass044 .pass-day{flex:0 0 280px;width:280px;max-width:280px;box-sizing:border-box} .pass044 .pass-day button{width:100%;max-width:100%;box-sizing:border-box} @media(max-height:450px){.pass044 .pass-day{flex-basis:240px;width:240px;max-width:240px}} /* story-dialogue252.css */ .story-vn252[hidden]{display:none} .story-vn252{position:fixed;inset:0;z-index:16000;color:#fff2d6;box-sizing:border-box;isolation:isolate;background:#172c32} .story-vn-backdrop252{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1} .story-vn-scene252{position:absolute;top:3%;left:2%;max-width:70%;padding:8px 18px;background:#102332e8;border:1px solid #c5a765;font:600 clamp(11px,1.6vw,17px) system-ui;color:#f3db9f} .story-vn-portrait252{position:absolute;left:0;bottom:0;width:30%;height:56%;object-fit:contain;object-position:bottom;z-index:2;image-rendering:pixelated;filter:drop-shadow(3px 0 3px #051a2388);pointer-events:none} .story-vn-body252{position:absolute;left:28%;right:2%;bottom:3%;height:27%;min-height:120px;box-sizing:border-box;display:flex;flex-direction:column;padding:18px 24px 12px 5%;border:2px solid #c5a765;border-radius:6px;background:linear-gradient(115deg,#102337f5,#132c3fef);box-shadow:inset 0 0 0 3px #10202e,0 3px 14px #0008} .story-vn-speaker252{position:absolute;top:0;left:3%;transform:translateY(-65%);font:700 clamp(14px,2vw,22px) system-ui;margin:0;padding:5px 20px;color:#f2d394;background:#132738;border:2px solid #c5a765;border-radius:4px} .story-vn-line252{min-height:0;overflow-y:auto;white-space:pre-wrap;word-break:keep-all;overflow-wrap:break-word;flex:1;font:400 clamp(14px,1.9vw,22px)/1.65 system-ui;margin:4px 0} .story-vn-count252{position:absolute;bottom:8px;left:5%;color:#afc3c9;font-size:11px} .story-vn-actions252{display:flex;justify-content:flex-end;flex-shrink:0} .story-vn-actions252 button{min-height:36px;padding:5px 14px;border-radius:5px;border:1px solid #baa263;background:#284650;color:#fff2d6;font:600 13px system-ui;cursor:pointer} .story-vn-actions252 .story-vn-next252{background:#806331;border-color:#f2d394} .story-vn-actions252 .story-vn-skip252{position:fixed;right:2%;top:3%;border-radius:20px;background:#102332e8} @media(max-height:440px){.story-vn-body252{height:33%;min-height:110px;padding:14px 12px 5px 5%}.story-vn-line252{font-size:14px;line-height:1.45}.story-vn-speaker252{font-size:14px;padding:3px 12px}.story-vn-actions252 button{min-height:32px}.story-vn-portrait252{height:62%}} @media(max-width:500px) and (orientation:portrait){.story-vn-body252{left:3%;right:3%;height:31%;padding:20px 14px 12px}.story-vn-portrait252{bottom:34%;width:52%;height:37%}.story-vn-line252{font-size:16px}.story-vn-scene252{max-width:60%}} /* reward-icons254.css */ .reward-icon254{display:inline-block;width:24px;height:24px;flex:0 0 24px;vertical-align:middle;background-image:url('assets/ui-icons146.png');background-size:400% 400%;background-repeat:no-repeat;image-rendering:pixelated;margin:0 3px} #resultReward{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;gap:8px} .reward-item254{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:6px;white-space:nowrap;font-size:clamp(16px,2.4vw,22px);width:100%;text-align:left}.reward-label260{font-size:12px;color:#dce8dc;white-space:normal;word-break:keep-all}.reward-item254 strong{text-align:right;font-variant-numeric:tabular-nums} .reward-item254 .reward-icon254{width:34px;height:34px;flex-basis:34px} .release-panel-head .reward-icon254{width:20px;height:20px;flex-basis:20px} @media(max-height:430px){#resultReward{gap:4px}.reward-item254{grid-template-columns:26px minmax(0,1fr) auto;gap:4px;font-size:18px}.reward-label260{font-size:10px}.reward-item254 .reward-icon254{width:26px;height:26px;flex-basis:26px}} /* tier-guide254.css */ #techTree [data-tier="1"]{--guide-tier:#b5c8bc} #techTree [data-tier="2"]{--guide-tier:#8ed5db} #techTree [data-tier="3"]{--guide-tier:#cbb7f0} #techTree [data-tier="4"]{--guide-tier:#f1ce83} #techTree .tech-column>h3{color:var(--guide-tier);border-bottom:2px solid var(--guide-tier);padding-bottom:5px} #techTree .tech-unit{border-left:3px solid var(--guide-tier)} #techTree .tech-unit>strong{color:var(--guide-tier)} #atlasV3 [data-unit-tier="1"]{--guide-tier:#b5c8bc} #atlasV3 [data-unit-tier="2"]{--guide-tier:#8ed5db} #atlasV3 [data-unit-tier="3"]{--guide-tier:#cbb7f0} #atlasV3 [data-unit-tier="4"]{--guide-tier:#f1ce83} #atlasV3 .v3-tier-filters [data-unit-tier],#atlasV3 .v3-col-label{color:var(--guide-tier);border-bottom:3px solid var(--guide-tier)} #atlasV3 .v3-mini-unit,#atlasV3 .flow-node048{border-left:3px solid var(--guide-tier)} #atlasV3 .v3-mini-unit>strong,#atlasV3 .flow-node048 strong,#atlasV3 .v3-detail-hero>small,#atlasV3 .v3-detail-hero>h3,#atlasV3 .flow-name048,#atlasV3 .flow-range051{color:var(--guide-tier)} html.pixel-ui038 #atlasV3 .v3-tier-filters button[data-unit-tier]{color:var(--guide-tier)!important}