@font-face{font-family:Noto;src:url('assets/korean.woff') format('woff');font-weight:100 900;font-display:swap}
*{box-sizing:border-box} :root{font-size:18px;color-scheme:dark;--ink:#f4f7ff;--muted:#c0d0e2;--gold:#ffdb86;--line:#819bc14d;--N:#fff;--A:#71ef91;--R:#65baff;--SR:#ff666e;--SSR:#c08aff;--UR:#ffe16a}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080f1c;color:var(--ink);font-family:Noto,system-ui,sans-serif;line-height:1.45;overscroll-behavior:none}button{font:inherit;font-weight:650;line-height:1.3;min-height:48px;min-width:48px;cursor:pointer;touch-action:manipulation;color:var(--ink);background:#213449;border:1px solid #7293b478;border-radius:12px;padding:8px 10px;-webkit-tap-highlight-color:transparent}button:disabled{background:#243042!important;color:#aab8c9!important;border-color:#56677e!important;box-shadow:none!important;cursor:default}button:focus-visible{outline:3px solid #fff2a3;outline-offset:-4px}.hidden{display:none!important}h1,h2,p{margin:0}h1{font-size:1.25rem;line-height:1.25}h2{font-size:1.15rem}b{font-weight:750}small{font-size:.9rem}.line-note{font-size:.9rem;color:var(--muted);line-height:1.5;word-break:keep-all}.centered{text-align:center}.gold{color:var(--gold)}.diamond{color:#a4deff}
#app{height:100dvh;height:100svh;max-width:720px;margin:auto;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:radial-gradient(ellipse at 20% 0,#20364f,transparent 55%),#101b2c;border-inline:1px solid #819bc126;overflow:hidden}.app-header{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 8px;padding:8px 12px 0}.brand{font-size:1.04rem;white-space:nowrap;color:var(--gold);display:flex;align-items:center;gap:5px}.brand b{color:var(--ink)}.app-header>button{font-size:.9rem;padding:6px 9px;height:48px}.app-header #sound{font-size:1.4rem;width:48px}.wallet{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:1rem;padding:1px 3px}.wallet span{min-width:0;white-space:nowrap}.wallet b{font-variant-numeric:tabular-nums;font-size:1.1rem}#player-level{color:#c5ddff}.xp-track{grid-column:1/-1;height:4px;border-radius:2px;background:#34465a;margin-top:3px;overflow:hidden}.xp-track i{display:block;height:100%;width:0;background:#95b7ff}
#screens{min-height:0;overflow:hidden;padding:10px 12px}.page{height:100%;min-height:0;display:flex;flex-direction:column;gap:10px;overflow:hidden}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px;flex-shrink:0}.page-heading>span{font-size:.9rem;color:var(--muted)}.page-heading button.plain{background:transparent;border:0;padding:5px 0;font-size:1.1rem;text-align:left;min-width:0;word-break:keep-all}.small{font-size:.9rem;padding:7px 10px;flex-shrink:0}.primary{background:linear-gradient(115deg,#e8be6f,#ffe2a3);color:#162333;border-color:#ffe6ad;box-shadow:0 3px 15px #ffce6b22}.secondary{background:#243b54}.skill{background:linear-gradient(110deg,#584277,#38466c);border-color:#b9a2ff;color:#f1e8ff;font-size:1rem}.skill span{font-size:.9rem}.skill.ready{box-shadow:0 0 20px #c79fff66}.action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex-shrink:0}.action-row.thirds{grid-template-columns:repeat(3,minmax(0,1fr))}.thirds button{font-size:.9rem;padding-inline:4px}.segments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;flex-shrink:0}.segments button{font-size:.95rem;padding-inline:4px;background:#16263a}.segments button.active{background:#37516d;border-color:#bdd4f3;color:#fff}
#navigation{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:7px 7px calc(7px + env(safe-area-inset-bottom,0px));background:#0b1423;border-top:1px solid #7189a66b}#navigation button{position:relative;min-width:0;border:0;background:transparent;padding:8px 2px;font-size:.95rem;min-height:50px;color:#c5d6e8;border-radius:10px}#navigation button.active{color:#ffe7b0;background:#344759;box-shadow:inset 0 -3px #ffe093}.badge{position:absolute;top:4px;right:3px;background:#ed5c64;border:2px solid #0b1423;border-radius:50%;width:11px;height:11px}
.battlefield{position:relative;flex:1;min-height:110px;overflow:hidden;border-radius:14px;border:1px solid #7693b389;background:#0c2035}#world{display:block;width:100%;height:100%}.battle-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#071120ce,transparent 42%,transparent 75%,#0a142655)}#battle-hud{position:absolute;top:10px;left:10px;right:10px;display:flex;justify-content:space-between;gap:12px;pointer-events:none;font-size:.9rem}#battle-hud>div{max-width:51%}#battle-hud>div:first-child{width:42%}#battle-hud b{font-size:.9rem;text-shadow:0 2px 4px #000}.hp-track{height:7px;background:#162c3c;margin-top:4px;overflow:hidden;border-radius:4px}.hp-track i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#71dfbc,#bbffda)}.wave-info{text-align:right}.wave-info span{display:block;font-size:.9rem;text-shadow:0 2px 5px #000;word-break:keep-all}#boss-hud{position:absolute;top:65px;left:20%;right:20%;text-align:center;font-size:.9rem;color:#ffc8cf;text-shadow:0 2px 5px #000}#boss-fill{background:#ff6b81}#battle-caption{position:absolute;top:36%;left:12px;right:12px;text-align:center;font-size:1rem;line-height:1.6;color:#fff1c0;text-shadow:0 2px 5px #000;pointer-events:none}#stage-banner{position:absolute;left:0;right:0;top:35%;padding:12px 5px;text-align:center;background:linear-gradient(90deg,transparent,#0d1429eb,transparent);pointer-events:none}#stage-banner small{display:block;color:#e2c6ff;font-size:.9rem}#stage-banner b{display:block;font-size:1.35rem;color:var(--gold)}.road-progress{position:absolute;bottom:0;left:0;right:0;height:4px;background:#122034}.road-progress i{display:block;height:100%;width:0;background:#ffe287}#party-summary{font-size:.9rem;min-height:24px}
.weapon-showcase{position:relative;flex:1;min-height:75px;max-height:240px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:radial-gradient(ellipse at 70% 40%,#38508266,#10223b)}#weapon-preview{width:100%;height:100%;display:block}.weapon-showcase>div{position:absolute;left:14px;top:12px;pointer-events:none}.weapon-showcase span{font-size:.9rem;color:var(--gold)}.weapon-showcase h2{margin-top:4px}.info-card{border:1px solid var(--line);background:#182c41;border-radius:12px;padding:12px 14px;line-height:1.6}.info-card b{color:var(--gold)}#growth-next{min-height:27px}#growth-detail{font-size:.9rem}
.summon-feature{position:relative;flex:1;min-height:80px;max-height:270px;overflow:hidden;border:1px solid #ffe16a88;border-radius:18px;background:radial-gradient(ellipse,#7d64373d,#111d31);display:flex;align-items:center;justify-content:center}.summon-feature canvas{height:100%;width:100%;object-fit:contain;max-width:310px;filter:drop-shadow(0 0 16px #ffe16a88)}.summon-feature>div:last-child{position:absolute;bottom:8px;left:12px;text-shadow:0 2px 5px #000}.summon-feature h2{display:inline;margin-left:8px}.orbit{position:absolute;width:150px;height:150px;border:1px solid #ffe16a88;border-radius:50%;box-shadow:0 0 30px #ffe16a22,inset 0 0 25px #ffe16a22;animation:orbit 12s linear infinite}.orbit:after{content:'✧';position:absolute;top:-10px;left:40px;color:#ffe16a}.gift-button{font-size:.95rem;background:#223a55;color:#baddff;border-color:#98bfe0}.pity{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.9rem;min-height:32px}.pity b{color:#d6b1ff}.summon-actions button{min-height:64px}.summon-actions b,.summon-actions span{display:block}.summon-actions span{font-size:.95rem;margin-top:3px;color:#bde7ff}.summon-actions .primary span{color:#214167}
.rarity{font-size:.95rem;font-weight:750}.N{--rarity:var(--N)}.A{--rarity:var(--A)}.R{--rarity:var(--R)}.SR{--rarity:var(--SR)}.SSR{--rarity:var(--SSR)}.UR{--rarity:var(--UR)}.rarity{color:var(--rarity);text-shadow:0 0 10px color-mix(in srgb,var(--rarity),transparent 60%)}.party-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;flex-shrink:0}.party-slots button{position:relative;height:54px;min-width:0;padding:2px;font-size:.9rem}.party-slots canvas{width:100%;height:48px;object-fit:contain}.party-slots .locked-slot{background:#111d30;color:#c1cddb;border-style:dashed}.party-slots .empty-slot{color:#ffe3a4}.two-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;flex:1;min-height:0}.unit-card{display:flex;position:relative;flex-direction:column;align-items:stretch;min-height:0;min-width:0;padding:12px 8px;border:1px solid var(--rarity);background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--rarity),transparent 86%),#142439);box-shadow:inset 0 0 18px color-mix(in srgb,var(--rarity),transparent 92%),0 0 8px color-mix(in srgb,var(--rarity),transparent 87%);border-radius:14px;text-align:center;overflow:hidden}.unit-card .card-top{display:flex;justify-content:space-between;align-items:center;gap:3px;font-size:.9rem;flex-shrink:0}.unit-card .card-top small{font-size:.9rem}.unit-card canvas{display:block;width:100%;flex:1;min-height:40px;max-height:240px;object-fit:contain;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--rarity),transparent 45%))}.unit-card b{font-size:1rem;word-break:keep-all;overflow-wrap:anywhere;flex-shrink:0}.unit-card>small{display:block;color:#c9daec;margin-top:5px;font-size:.9rem;flex-shrink:0}.unit-card.locked canvas{opacity:.55;filter:saturate(.5)}.unit-card.equipped{outline:2px solid var(--rarity);outline-offset:-4px}.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;min-height:48px}.pager button{font-size:.9rem;padding-inline:14px}.pager span{font-size:.9rem;color:#c6d8e9}.pager:empty{display:none}
.mail-body{min-height:0;flex:1;display:flex;flex-direction:column;gap:10px;overflow:hidden}.mail-card{flex:1;min-height:0;border:1px solid #7f9ec45e;border-radius:12px;background:#1b2e45;padding:11px 12px;display:flex;flex-direction:column;justify-content:center;gap:5px}.mail-card h2{font-size:1rem;word-break:keep-all}.mail-card p{font-size:.9rem;color:#c5d7e8;line-height:1.4;word-break:keep-all}.mail-card .mail-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px}.mail-card .mail-bottom b{color:#9cdbff;font-size:1.1rem}.mail-card button{min-height:48px;font-size:.9rem}.mail-card .mission-value{display:flex;justify-content:space-between;font-size:.9rem}.mission-track{height:7px;background:#102137;border-radius:4px;overflow:hidden}.mission-track i{display:block;height:100%;background:#8dbbff}.attendance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:9px;flex:1;min-height:0}.attendance-day{border:1px solid #667f9b;background:#1b2c40;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:8px 3px}.attendance-day.checked{border-color:#a5eab8;background:#26463e}.attendance-day b{color:#b6e1ff;font-size:1.1rem}.attendance-day small,.attendance-day span{font-size:.9rem}.attendance-day.checked span{color:#b4f4c8}.empty-state{display:flex;flex:1;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:15px;line-height:1.7;color:#d0e0ef}.empty-state .big-icon{font-size:3rem;color:#ffe4a4}
#toast{position:fixed;z-index:80;top:20%;left:50%;transform:translateX(-50%);max-width:calc(100% - 24px);width:max-content;text-align:center;padding:14px 18px;font-size:1rem;line-height:1.5;border:1px solid #b6cde2;border-radius:14px;background:#152d45f5;opacity:0;pointer-events:none;transition:opacity .2s}#toast.visible{opacity:1}
#overlay{position:fixed;z-index:50;inset:0;background:#080f1df7;display:grid;place-items:center;overflow:hidden}.overlay-shell{display:flex;flex-direction:column;gap:12px;height:100%;width:100%;max-width:650px;min-height:0;padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px));background:radial-gradient(ellipse at 80% 0,#2d3e57,transparent 70%),#101d30;overflow:hidden}.overlay-heading{display:flex;gap:12px;align-items:center;flex-shrink:0;min-height:48px}.overlay-heading button{font-size:.9rem;flex-shrink:0}.overlay-heading h2{font-size:1.2rem;line-height:1.4;word-break:keep-all}#overlay-body{display:flex;flex-direction:column;flex:1;gap:12px;min-height:0;overflow:hidden}#overlay-actions{display:flex;flex-direction:column;gap:9px;flex-shrink:0}#overlay-actions .action-row{width:100%}.detail-art{flex:1;min-height:60px;max-height:230px;border:1px solid var(--rarity);border-radius:18px;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity),transparent 78%),#17263b);display:flex;align-items:center;justify-content:center;position:relative}.detail-art canvas{height:100%;width:100%;object-fit:contain;filter:drop-shadow(0 0 12px var(--rarity))}.detail-art>.rarity{position:absolute;left:12px;top:10px}.detail-description{font-size:1rem;line-height:1.6;word-break:keep-all}.stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.stat-row>div{border:1px solid var(--line);background:#1b2f45;border-radius:10px;padding:10px 5px;text-align:center}.stat-row b{font-size:1.15rem;color:var(--gold);display:block;overflow-wrap:anywhere}.stat-row small{font-size:.9rem;color:#c7d9e8;display:block}.detail-note{font-size:.9rem;line-height:1.6;color:#c5d9e9}.result-title{text-align:center;font-size:1.3rem;color:var(--gold);padding:6px 0}.result-rewards{display:flex;flex-direction:column;justify-content:center;gap:12px;flex:1;min-height:0}.result-rewards>div{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:13px 14px;border:1px solid var(--line);background:#1b3047;border-radius:12px}.result-rewards b{font-size:1.2rem;color:var(--gold)}.result-rewards span{font-size:.95rem}.portal{flex:1;display:grid;place-items:center;min-height:0;position:relative;background:radial-gradient(ellipse,#9563be44,transparent 65%)}.portal:before{content:'✧';font-size:min(55vw,250px);color:#ffe0a3;text-shadow:0 0 40px #ffd46a;animation:portal .7s ease-in-out infinite}.pull-card{animation:reveal .5s both}.pull-summary{font-size:1rem;text-align:center;color:#f8e0a9}.rates-table{width:100%;font-size:1rem;border-collapse:collapse}.rates-table th,.rates-table td{padding:10px 5px;border-bottom:1px solid var(--line);text-align:left}.rates-table th:last-child,.rates-table td:last-child{text-align:right}.copy-panel{display:flex;flex-direction:column;gap:16px;justify-content:center;flex:1;min-height:0;font-size:1rem;line-height:1.8;word-break:keep-all}.copy-panel b{color:var(--gold)}.map-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;flex:1;min-height:0}.map-grid button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:linear-gradient(140deg,#334c63,#182438);font-size:1rem}.map-grid small{font-size:.9rem}.map-grid .map-icon{font-size:2.1rem}.slot-pick{display:flex;flex-direction:column;flex:1;justify-content:center;gap:8px;min-height:0}.slot-pick button{display:flex;align-items:center;gap:14px;min-height:48px;padding:4px 12px}.slot-pick canvas{width:46px;height:46px;object-fit:contain}.level-table{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin:12px 0}.level-table div{border:1px solid var(--line);padding:9px 3px;border-radius:9px;text-align:center;font-size:.9rem}.level-table b{display:block;color:var(--gold)}
@keyframes portal{50%{transform:rotate(40deg) scale(1.17);filter:brightness(1.7)}}@keyframes reveal{from{transform:translateY(15px) scale(.9);opacity:0}to{transform:none;opacity:1}}@keyframes orbit{to{transform:rotate(360deg)}}
@media(min-width:760px){#app{max-width:760px;border-inline:1px solid #7e9dc177}.page{gap:14px}#screens{padding:14px 24px}.two-cards{max-width:620px;width:100%;align-self:center}.unit-card canvas{max-height:380px}.battlefield{min-height:220px}.summon-feature{max-height:none}.summon-feature canvas{max-width:440px}.weapon-showcase{max-height:none}}
@media(max-height:700px){.app-header{gap:3px 7px;padding-top:5px}#screens{padding-top:6px;padding-bottom:6px}.page{gap:7px}.page-heading{min-height:48px}.line-note{font-size:.9rem}#navigation{padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom,0px))}.overlay-shell{gap:8px;padding-top:8px}.info-card{padding:8px 12px}.mail-card{padding:8px 10px;gap:3px}.mail-card p{display:none}.unit-card{padding:8px 6px}.stat-row>div{padding:7px 4px}.detail-description{font-size:.95rem;line-height:1.5}.copy-panel{gap:12px;line-height:1.65}.result-rewards{gap:8px}.result-rewards>div{padding:8px 12px}.rates-table th,.rates-table td{padding:7px 5px}}
@media(max-height:570px){.brand b{font-size:.9rem}.wallet{font-size:.9rem}.page-heading h1{font-size:1.1rem}.page{gap:5px}#team-note{display:none}.app-header{padding-top:2px}.page-heading{min-height:40px}.page-heading .small{min-height:40px}.summon-feature{min-height:50px}.gift-button{min-height:44px}.line-note{line-height:1.3}.overlay-shell{gap:6px}.detail-art{min-height:40px}.detail-note{line-height:1.3}.detail-description{font-size:.9rem}.result-rewards{gap:5px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* 0.5 — readable rarity, slot-first formation and one-screen ten summons. */
#party-summary{font-size:.85rem;min-height:0}.battle-party{display:flex;gap:5px;min-height:0;flex-shrink:0}.party-chip{flex:1;min-width:0;min-height:45px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;padding:3px 1px;border:1px solid var(--rarity);background:color-mix(in srgb,var(--rarity) 9%,#102035);box-shadow:inset 0 -2px 0 var(--rarity)}.party-chip .rarity{font-size:13px}.party-chip b{font-size:12px;max-width:100%;white-space:nowrap;letter-spacing:-.4px}.battle-party:has(.party-chip:nth-child(-n+3):last-child) .party-chip b{font-size:14px}
.party-slots button{height:102px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;padding:5px 1px;overflow:hidden}.party-slots .equipped-slot{border:2px solid var(--rarity);background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--rarity),transparent 80%),#142439);box-shadow:0 0 10px color-mix(in srgb,var(--rarity),transparent 75%),inset 0 -3px var(--rarity)}.party-slots .rarity{font-size:14px;line-height:1.2}.party-slots canvas{width:100%;height:54px;min-height:0;object-fit:contain;filter:drop-shadow(0 0 5px var(--rarity))}.party-slots small{font-size:13px;line-height:1.2}.party-slots .slot-index{position:absolute;top:1px;left:3px;font-size:10px;color:#fff9}.party-slots .empty-slot b,.party-slots .locked-slot b{font-size:26px;line-height:1.3}.party-slots .empty-slot span,.party-slots .locked-slot span{font-size:13px}.duplicate-tag{font-size:12px;color:#f5d99f;margin-top:4px;line-height:1.4}.unit-card>small{font-size:.85rem}#team-note{font-size:.85rem}.growth-copy{display:grid;grid-template-columns:1fr auto;gap:3px 8px;border-left:3px solid #e6c280;padding:8px 11px;background:#ebc6740b;border-radius:0 9px 9px 0;font-size:.86rem}.growth-copy b{color:#ffdf9f}.growth-copy span{grid-column:1/-1;color:#c5d4e5;font-size:.8rem;grid-row:2}.growth-copy strong{color:#a9efbc;font-size:.8rem}.detail-note{font-size:.82rem}.detail-art{max-height:200px}.detail-description{line-height:1.5}.stat-row>div{padding:8px 4px}
.formation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:10px;min-height:0;flex:1}.formation-card{display:flex;flex-direction:column;align-items:center;min-height:0;padding:8px 4px;border:1px solid var(--rarity);background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity),transparent 90%),#15263b);overflow:hidden;gap:2px}.formation-card .rarity{font-size:.85rem}.formation-card canvas{width:100%;flex:1;min-height:10px;object-fit:contain}.formation-card b{font-size:.95rem}.formation-card small{font-size:.77rem;color:#cbd9ed}.formation-card:disabled{opacity:.65}
.menu-grid{display:grid;grid-template-rows:repeat(4,1fr);flex:1;min-height:0;gap:12px;padding:10px 0}.menu-grid button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;gap:7px;padding:12px 18px;background:linear-gradient(110deg,#28435d,#1a2b40)}.menu-grid b{font-size:1.06rem}.menu-grid small{color:#bcd1e3;font-size:.85rem}.danger-outline{border-color:#e889907d!important;background:#512d3a33!important}.danger{background:linear-gradient(110deg,#a73e4e,#c85456);border-color:#ffa2a4;color:#fff}.reset-emblem{height:90px;flex-shrink:0;display:grid;place-items:center;font-size:3rem;color:#ffaaaa;text-shadow:0 0 35px #f3787866}.reset-progress{background:#182d44;border:1px solid #8aaaca55;border-radius:10px;padding:12px 16px;color:#f1d9b0}
#overlay[data-type="pull"] .overlay-shell{max-width:950px;background:radial-gradient(ellipse at 50% 30%,#293957,transparent 75%),#0b1527}#overlay[data-type="pull"] .overlay-heading h2{font-size:1.12rem}#overlay[data-type="pull"] #overlay-body{gap:10px}.pull-summary{font-size:.84rem;line-height:1.45;flex-shrink:0}.summon-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));gap:8px;flex:1;min-height:0;padding:3px}.result-card{position:relative;display:grid;grid-template-columns:45px minmax(0,1fr);grid-template-rows:20px minmax(0,1fr) 20px;column-gap:4px;align-items:center;min-height:0;min-width:0;padding:7px 6px;border:1px solid var(--rarity);border-bottom-width:3px;border-radius:10px;background:radial-gradient(ellipse at 20% 50%,color-mix(in srgb,var(--rarity),transparent 78%),#142236);box-shadow:0 0 10px color-mix(in srgb,var(--rarity),transparent 80%);overflow:hidden;animation:card-arrive .42s backwards;animation-delay:var(--reveal-delay);text-align:left}.result-card canvas{grid-column:1;grid-row:1/4;width:100%;height:100%;min-height:0;object-fit:contain;filter:drop-shadow(0 0 7px var(--rarity))}.result-card>.rarity{grid-column:2;grid-row:1;font-size:13px}.result-card>b{grid-column:2;grid-row:2;line-height:1.2;font-size:15px;word-break:keep-all;overflow-wrap:normal;letter-spacing:-.4px}.result-card>small{grid-column:2;grid-row:3;color:#d8e6ee;font-size:10px;white-space:nowrap;letter-spacing:-.15px}.result-new{position:absolute;top:2px;right:4px;font-size:9px;color:var(--rarity);font-weight:800}.result-card.SSR,.result-card.UR{box-shadow:0 0 17px color-mix(in srgb,var(--rarity),transparent 50%),inset 0 0 18px color-mix(in srgb,var(--rarity),transparent 80%)}.result-card.SSR:after,.result-card.UR:after{content:'';position:absolute;inset:-50%;background:linear-gradient(110deg,transparent 43%,#fff3 50%,transparent 57%);animation:card-shine 3s 1s infinite;pointer-events:none}.result-hint{font-size:.8rem}.single-result{display:flex;align-items:center;justify-content:center}.single-result .result-card{width:min(100%,300px);height:100%;max-height:440px;display:flex;flex-direction:column;gap:6px;align-items:center;padding:18px}.single-result .result-card canvas{flex:1;min-height:0;order:1}.single-result .result-card>.rarity{font-size:1.15rem}.single-result .result-card>b{font-size:1.3rem;order:2}.single-result .result-card>small{font-size:1rem;order:3}.single-result .result-new{font-size:.9rem;top:15px;right:16px}
#overlay[data-type="portal"] .overlay-shell{background:radial-gradient(ellipse at 50% 50%,#233459,#070e1b 70%)}.summon-portal{flex:1;min-height:0;position:relative;isolation:isolate;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity),transparent 70%),transparent 64%)}.summon-portal:after{content:'';position:absolute;inset:0;background:radial-gradient(circle,#fff9,transparent 65%);opacity:0;animation:portal-burst 2.1s ease-in both}.portal-core{font-size:min(35vw,140px);line-height:1;color:#fff7d6;text-shadow:0 0 20px var(--rarity),0 0 60px var(--rarity),0 0 110px var(--rarity);animation:core-charge 2.1s ease-in both;z-index:2}.portal-ring{position:absolute;aspect-ratio:1;width:65%;max-width:290px;border:2px solid var(--rarity);border-radius:50%;box-shadow:0 0 25px color-mix(in srgb,var(--rarity),transparent 50%),inset 0 0 20px color-mix(in srgb,var(--rarity),transparent 70%);animation:portal-spin 3s linear infinite}.ring-two{width:82%;max-width:370px;border:1px dashed var(--rarity);animation-direction:reverse;animation-duration:6s}.ring-three{width:53%;max-width:230px;border-radius:25%;border-width:1px;animation-duration:5s}.portal-rays{position:absolute;width:130%;aspect-ratio:1;background:repeating-conic-gradient(from 0deg,transparent 0deg 14deg,color-mix(in srgb,var(--rarity),transparent 70%) 16deg 18deg,transparent 21deg 30deg);mask-image:radial-gradient(circle,transparent 17%,#0008 23%,#000 50%,transparent 68%);animation:portal-spin 13s linear infinite}.portal-spark{--a:calc(var(--i) * 30deg);position:absolute;width:6px;height:6px;left:50%;top:50%;border-radius:50%;background:#fff7c3;box-shadow:0 0 14px 3px var(--rarity);transform:rotate(var(--a)) translateX(135px);animation:spark-in 1.3s calc(var(--i) * -.09s) infinite}.summon-portal p{position:absolute;bottom:7%;font-size:.9rem;color:#e3e8f7;text-shadow:0 2px 8px #000}.portal-rarity{color:var(--rarity);text-align:center;font-size:1.08rem;font-weight:750;padding:8px 0 16px;text-shadow:0 0 20px var(--rarity)}
.sound-settings{display:flex;flex-direction:column;gap:22px;justify-content:center;flex:1;min-height:0}.sound-setting{padding:15px;border:1px solid #8aaccc55;border-radius:12px;background:#192e45}.sound-setting>div{display:flex;justify-content:space-between;align-items:center;gap:8px}.sound-setting label{font-weight:750}.sound-setting button{min-width:76px}.sound-setting input[type="range"]{accent-color:#f0cb83;width:100%;height:32px;margin:12px 0 0}.sound-status{color:#b9d6ee;text-align:center;font-size:.9rem;line-height:1.6}
@keyframes card-arrive{from{opacity:0;transform:translateY(22px) scale(.72);filter:brightness(3)}to{opacity:1;transform:none;filter:brightness(1)}}@keyframes card-shine{from{transform:translateX(-60%)}to{transform:translateX(60%)}}@keyframes portal-spin{to{transform:rotate(360deg)}}@keyframes core-charge{0%{transform:scale(.35) rotate(-45deg);filter:brightness(.7)}75%{transform:scale(1.1) rotate(20deg);filter:brightness(1.7)}100%{transform:scale(2.5) rotate(45deg);filter:brightness(4)}}@keyframes spark-in{0%{transform:rotate(var(--a)) translateX(145px);opacity:0}35%{opacity:1}100%{transform:rotate(calc(var(--a) + 55deg)) translateX(10px);opacity:0}}@keyframes portal-burst{0%,80%{opacity:0}93%{opacity:1}100%{opacity:.5}}
@media(min-width:700px){.summon-results{grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:13px}.result-card{display:flex;flex-direction:column;text-align:center;gap:8px;padding:15px 8px}.result-card canvas{flex:1;order:1;min-height:0}.result-card>b{order:2;font-size:18px}.result-card>small{order:3;font-size:13px}.result-card>.rarity{font-size:17px}.result-new{font-size:11px;top:6px;right:7px}.formation-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}}
@media(max-height:700px){.battle-party .party-chip{min-height:40px}.party-slots button{height:83px}.party-slots canvas{height:40px}.growth-copy{padding:6px 9px;gap:1px 6px}.detail-art{max-height:130px}.detail-description{font-size:.9rem}.detail-note{font-size:.77rem}.stat-row>div{padding:6px 4px}#overlay-body{gap:9px}.result-card{grid-template-columns:37px minmax(0,1fr);grid-template-rows:16px minmax(0,1fr) 17px;padding:5px 5px;column-gap:3px}.summon-results{gap:6px}.result-card>b{font-size:14px}.result-card>.rarity{font-size:12px}.result-card>small{font-size:10px}.result-new{font-size:8px}.pull-summary{font-size:.79rem}.result-hint{font-size:.77rem}.menu-grid{gap:9px}.menu-grid button{padding:10px 15px}.sound-settings{gap:14px}.reset-emblem{height:58px}.sound-setting{padding:10px 14px}}
@media(max-height:570px){.battle-party{display:none}.party-slots button{height:72px}.party-slots canvas{height:31px}.party-slots .rarity,.party-slots small{font-size:11px}.growth-copy span{display:none}.detail-art{max-height:90px}.detail-description{font-size:.8rem}.detail-note{font-size:.72rem}.reset-emblem{display:none}.result-hint{display:none}.summon-results{gap:4px}.result-card{padding:3px;grid-template-columns:30px minmax(0,1fr);grid-template-rows:14px minmax(0,1fr) 14px}.result-card>b{font-size:13px}.result-card>small{font-size:9px}.result-new{display:none}}
@media(prefers-reduced-motion:reduce){.summon-portal .portal-core{transform:none}.summon-portal:after{display:none}}

/* 0.6 — moonfall summons, actionable notifications and thumb-reachable navigation. */
.overlay-back-row{flex:0 0 48px;min-height:48px;display:flex;margin-top:0;padding-top:0}
.overlay-back-row button{width:100%;height:48px;min-height:48px;background:#15273b;border-color:#7d9cb566;color:#d8e5f3;font-size:1rem;box-shadow:0 -4px 18px #0002}
#overlay-actions:empty{display:none}
#navigation button:has(.action-badge){padding-top:12px}
.action-badge{position:absolute;top:-1px;right:2px;display:inline-flex;align-items:center;justify-content:center;min-width:21px;height:21px;padding:0 5px;background:#ffcf71;color:#192435;border:1px solid #fff1c2;border-radius:11px;box-shadow:0 2px 9px #0009;font-size:12px;font-weight:900;font-variant-numeric:tabular-nums;line-height:1;pointer-events:none}
#collection-badge{background:#86ecc1;border-color:#d6ffe8}
#summon-badge{background:#9adfff;border-color:#e4f7ff}
.upgrade-ready{border-color:#ffe0a0!important;box-shadow:inset 0 0 0 1px #ffdc8c55,0 0 14px #ffd2713d!important}
.segments .upgrade-ready{position:relative}
.segments .upgrade-ready:after{content:'●';position:absolute;right:6px;top:1px;color:#ffdf97;font-size:10px}
.unit-card.upgrade-ready:after{content:'레벨업 가능';position:absolute;bottom:7px;right:6px;padding:2px 5px;background:#fce0a6;color:#263141;border-radius:5px;font-size:10px;font-weight:800}
.unit-card.upgrade-ready{padding-bottom:29px}
.moon-descent{--rarity:var(--SSR);position:relative;isolation:isolate;flex:1;min-height:0;overflow:hidden;border-radius:20px;background:radial-gradient(ellipse at 50% 21%,#5f7496 0,#192b52 18%,#07172e 44%,#020814 70%);box-shadow:inset 0 0 55px #000a;border:1px solid #b4d4ff2b}
.moon-descent.UR{--rarity:var(--UR)}.moon-descent.SSR{--rarity:var(--SSR)}.moon-descent.SR{--rarity:var(--SR)}.moon-descent.R{--rarity:var(--R)}.moon-descent.A{--rarity:var(--A)}.moon-descent.N{--rarity:var(--N)}
.space-stars{position:absolute;inset:0;background:radial-gradient(circle at 13% 12%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 27% 65%,#cbdeff 0 1px,transparent 1.5px),radial-gradient(circle at 86% 19%,#fff 0 1px,transparent 2px),radial-gradient(circle at 74% 49%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 10% 73%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 66% 9%,#d5e9ff 0 1px,transparent 2px),radial-gradient(circle at 32% 35%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 91% 82%,#fff 0 1px,transparent 1.5px);background-size:143px 191px,211px 269px,197px 163px,139px 311px,181px 173px,223px 277px,199px 239px,169px 181px;opacity:.85;animation:starlight 2s ease-in-out infinite alternate}
.moon-rays{position:absolute;left:50%;top:22%;width:160%;aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 8deg,#e2edff00 0deg 9deg,#c9e0ff32 10deg 11deg,#e2edff00 12deg 23deg);mask-image:radial-gradient(circle,#0000 10%,#0006 17%,#000 26%,#0000 62%);animation:moon-rays-rise 3.6s ease-out both;z-index:1}
.radiant-moon{position:absolute;left:50%;top:22%;width:clamp(105px,35vw,205px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 33% 26%,#ffffee 0,#fff9d9 34%,#e2e8ed 63%,#a5b9d4 95%);box-shadow:0 0 12px 4px #fffce9,0 0 38px 12px #d5e8ffb3,0 0 90px 30px #8bbaed6b,inset -10px -8px 16px #7189a366;z-index:2;animation:moon-charge 3.6s ease-in-out both}
.radiant-moon i{position:absolute;inset:0;border-radius:50%;opacity:.36;background:radial-gradient(circle at 28% 35%,#7f8d9b 0 7%,#bdc7cb 8%,transparent 13%),radial-gradient(circle at 59% 62%,#82919e 0 11%,#d2d4cc 12%,transparent 19%),radial-gradient(circle at 69% 26%,#a3afba 0 6%,transparent 10%),radial-gradient(circle at 22% 74%,#abb7c1 0 8%,transparent 10%),radial-gradient(circle at 77% 75%,#8b9baa 0 4%,transparent 7%)}
.earth-horizon{position:absolute;left:-35%;width:170%;height:56%;bottom:-32%;border-radius:50%;background:radial-gradient(ellipse at 46% 2%,#539fc5 0,#124c77 9%,#09334f 28%,#061a2d 59%,#020713 80%);border-top:3px solid #e0ffff;box-shadow:0 -4px 10px #92efff,0 -13px 35px #3aa6edbd,0 -24px 75px #2483e059,inset 0 11px 23px #b3efff73;z-index:3}
.earth-horizon:before{content:'';position:absolute;inset:0;border-radius:inherit;opacity:.8;background:radial-gradient(ellipse at 23% 20%,#56a8ac66 0 4%,transparent 16%),radial-gradient(ellipse at 63% 22%,#63888d99 0 6%,transparent 19%),radial-gradient(ellipse at 80% 5%,#ddf2ee99 0 2%,transparent 12%);filter:blur(3px)}
.card-meteor{position:absolute;left:50%;top:22%;width:clamp(24px,7vw,42px);aspect-ratio:2/3;z-index:5;display:grid;place-items:center;border:2px solid #fff8da;border-radius:5px;background:linear-gradient(145deg,#fffada,var(--rarity) 14%,#1c2757 38%,#304675 63%,var(--rarity));box-shadow:0 0 5px #fff,0 0 16px var(--rarity),0 0 32px var(--rarity),inset 0 0 10px #fff7;color:#fffde5;opacity:0;transform:translate(-50%,-50%) scale(.1);animation:moon-card-fall 1.6s cubic-bezier(.34,.05,.75,.91) var(--meteor-delay,.8s) both;will-change:left,top,transform,opacity}
.card-meteor:after{content:'';position:absolute;inset:4px;border:1px solid #ffe7a5a6;border-radius:2px}
.card-meteor>span{font-size:clamp(18px,5vw,29px);text-shadow:0 0 7px #fff,0 0 14px var(--rarity);z-index:1}
.meteor-trail{position:absolute;bottom:80%;left:50%;width:110%;height:230px;max-height:40vh;transform:translateX(-50%);transform-origin:bottom;background:linear-gradient(to top,#fff9dce6 0,var(--rarity) 6%,color-mix(in srgb,var(--rarity) 52%,transparent) 25%,transparent 95%);clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);filter:blur(2px);mix-blend-mode:screen;pointer-events:none}
.impact-wave{position:absolute;left:50%;top:77%;width:20%;height:10%;border:3px solid #edfcff;border-radius:50%;transform:translate(-50%,-50%) scale(.1);box-shadow:0 0 20px 8px #a8edff,inset 0 0 20px 6px #9ddfff;opacity:0;animation:moon-impact 1.35s 2.25s ease-out both;z-index:6}
.summon-flash{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 78%,#fffef0,#deedff 30%,transparent 75%);opacity:0;z-index:7;pointer-events:none;animation:moon-final-flash 3.6s ease-in both}
.moon-descent>p{position:absolute;z-index:8;bottom:10px;left:8px;right:8px;text-align:center;font-size:.88rem;font-weight:650;color:#f5f2dc;text-shadow:0 2px 7px #010711,0 0 15px #06121f;background:linear-gradient(90deg,transparent,#031329b3,transparent);padding:7px 0}
#overlay[data-type="portal"] #overlay-body{gap:7px}.portal-rarity{flex-shrink:0;padding:5px 0 7px;font-size:1rem}
@keyframes starlight{to{opacity:.46}}
@keyframes moon-rays-rise{0%{opacity:.1;transform:translate(-50%,-50%) rotate(-15deg) scale(.5)}45%{opacity:1}100%{opacity:.65;transform:translate(-50%,-50%) rotate(20deg) scale(1.15)}}
@keyframes moon-charge{0%{transform:translate(-50%,-50%) scale(.83);filter:brightness(.8)}25%{transform:translate(-50%,-50%) scale(1.03);filter:brightness(1.35)}40%{filter:brightness(1.7)}75%,100%{transform:translate(-50%,-50%) scale(.92);filter:brightness(1)}}
@keyframes moon-card-fall{0%{left:50%;top:22%;opacity:0;transform:translate(-50%,-50%) rotate(-15deg) scale(.12)}9%{opacity:1}35%{opacity:1;transform:translate(-50%,-50%) rotate(var(--meteor-rotation,8deg)) scale(.75)}83%{left:var(--meteor-x,50%);top:74%;opacity:1;transform:translate(-50%,-50%) rotate(var(--meteor-rotation,8deg)) scale(1.15)}100%{left:var(--meteor-x,50%);top:81%;opacity:0;transform:translate(-50%,-50%) rotate(0deg) scale(.28);filter:brightness(3)}}
@keyframes moon-impact{0%{opacity:0;transform:translate(-50%,-50%) scale(.1)}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(6)}}
@keyframes moon-final-flash{0%,87%{opacity:0}94%{opacity:.88}100%{opacity:.15}}
@media(max-width:699px){#overlay[data-type="pull"] .overlay-shell{gap:8px}#overlay[data-type="pull"] #overlay-body{gap:7px}.summon-results{gap:6px}.result-card{grid-template-columns:36px minmax(0,1fr);grid-template-rows:17px minmax(0,1fr) 17px;padding:5px}.result-card>b{font-size:14px}.result-card>.rarity{font-size:12px}.result-card>small{font-size:10px}.result-new{font-size:8px}.result-hint{font-size:.75rem}}
@media(max-height:700px){.overlay-shell{padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));gap:7px}#overlay[data-type="unit"] #overlay-body{gap:6px}#overlay[data-type="unit"] .detail-art{min-height:38px;max-height:115px}#overlay[data-type="unit"] .detail-description{font-size:.86rem;line-height:1.35}#overlay[data-type="unit"] .stat-row>div{padding:4px 2px}#overlay[data-type="unit"] .stat-row b{font-size:1rem}#overlay[data-type="unit"] .stat-row small{font-size:.8rem}#overlay[data-type="unit"] .growth-copy{font-size:.78rem;padding:5px 8px}#overlay[data-type="unit"] .detail-note{font-size:.73rem;line-height:1.35}.moon-descent>p{font-size:.78rem;bottom:6px}.radiant-moon{width:clamp(95px,28vw,150px)}.meteor-trail{height:160px}.sound-settings{gap:10px}.sound-setting{padding:8px 12px}.sound-status{font-size:.82rem;line-height:1.4}.sound-setting input[type="range"]{margin-top:4px}.menu-grid{padding:3px 0;gap:7px}.menu-grid button{gap:3px;padding:7px 12px}.menu-grid small{font-size:.78rem}}
@media(max-height:570px){#overlay[data-type="pull"] .overlay-heading{min-height:34px}.summon-results{gap:4px}.result-card{grid-template-columns:28px minmax(0,1fr);padding:3px;grid-template-rows:13px minmax(0,1fr) 13px}.result-card>b{font-size:12px}.result-card>.rarity{font-size:10px}.result-card>small{font-size:9px}.result-hint{display:none}.overlay-shell{gap:5px}.moon-descent>p{font-size:.7rem}}
@media(prefers-reduced-motion:reduce){.moon-rays{opacity:.5;transform:translate(-50%,-50%)}.radiant-moon{transform:translate(-50%,-50%);filter:none}.card-meteor{left:var(--meteor-x,50%);top:57%;opacity:1;transform:translate(-50%,-50%) rotate(var(--meteor-rotation,0deg)) scale(1)}.meteor-trail{height:90px;opacity:.45}.summon-flash,.impact-wave{display:none}.space-stars{opacity:.7}}

/* 0.7 — equipped companions, deliberate four-card fusion and visible outcomes. */
#page-collection{gap:8px}
#page-collection .page-heading{min-height:42px}
#page-collection #party-slots{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:9px;flex:1;min-height:0}
#page-collection #party-slots button{height:auto;min-height:0;min-width:0;padding:7px 6px;gap:2px;border-radius:14px}
#page-collection #party-slots .equipped-slot{box-shadow:inset 0 -3px var(--rarity),0 0 13px color-mix(in srgb,var(--rarity),transparent 87%)}
#page-collection #party-slots .slot-index{top:5px;left:7px;font-size:11px;opacity:.8}
#page-collection #party-slots .rarity{font-size:15px;line-height:1.2;flex-shrink:0}
#page-collection #party-slots canvas{display:block;flex:1;min-height:16px;max-height:100px;width:100%;height:0;object-fit:contain}
#page-collection #party-slots b{font-size:16px;line-height:1.2;word-break:keep-all;overflow-wrap:anywhere;font-weight:750}
#page-collection #party-slots small{font-size:13px;line-height:1.2;color:#d4e2f2}
#page-collection #party-slots .slot-power,#page-collection #party-slots .party-power{font-size:13px;line-height:1.2;color:#ffe6ad;white-space:nowrap}
#page-collection #party-slots .empty-slot,#page-collection #party-slots .locked-slot{gap:5px}
#page-collection #party-slots .empty-slot b,#page-collection #party-slots .locked-slot b{font-size:30px}
#page-collection #party-slots .empty-slot span,#page-collection #party-slots .locked-slot span{font-size:15px}
#page-collection #team-note{font-size:14px;line-height:1.4;flex-shrink:0}
.collection-actions,.companion-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex-shrink:0}
.collection-actions button,.companion-toolbar button{position:relative;min-height:50px;font-size:16px}
.companion-toolbar small{font-size:13px;color:#cce0f0;white-space:nowrap}
#fusion-open{background:linear-gradient(115deg,#483d70,#283c5b);border-color:#baa2f5;color:#f4edff}
#fusion-badge{top:-6px;right:5px;background:#e9cbff;border-color:#fff0ff}
.mythic-plus{color:#ffe477;font-weight:900;text-shadow:0 0 10px #ffd96666;white-space:nowrap}
#overlay[data-type="formation"] .formation-grid,#overlay[data-type="waiting"] .formation-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:8px}
#overlay[data-type="formation"] .formation-card,#overlay[data-type="waiting"] .formation-card{gap:4px;padding:9px 4px;border-radius:12px;min-width:0}
#overlay[data-type="formation"] .formation-card .rarity,#overlay[data-type="waiting"] .formation-card .rarity{font-size:14px;line-height:1.2}
#overlay[data-type="formation"] .formation-card b,#overlay[data-type="waiting"] .formation-card b{font-size:14px;line-height:1.3;word-break:keep-all;overflow-wrap:anywhere}
#overlay[data-type="formation"] .formation-card small,#overlay[data-type="waiting"] .formation-card small{font-size:12px;line-height:1.3;text-align:center}
#overlay[data-type="waiting"] .line-note,#overlay[data-type="formation"] .line-note{font-size:14px;line-height:1.4;flex-shrink:0}
.formation-grid>.empty-state{grid-column:1/-1;grid-row:1/-1;font-size:16px;padding:15px}
.placement-grid{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0}
.placement-grid button{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1;min-height:48px;max-height:95px;padding:9px 15px;text-align:left;background:linear-gradient(110deg,#2b4660,#192b42)}
.placement-grid b{font-size:17px;color:#ffe3a9;white-space:nowrap}
.placement-grid span{font-size:16px;word-break:keep-all}
#overlay[data-type="unit"] .growth-copy span~span{grid-row:3}
.summon-probability{display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 0;flex-shrink:0;font-size:15px;color:#cbdcf0}
.summon-probability b{font-size:16px;color:#ead0ff}
.fusion-grade-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;flex-shrink:0}
.fusion-grade-tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:64px;padding:6px 2px;background:#14273c;border:1px solid color-mix(in srgb,var(--rarity),transparent 58%);border-radius:11px}
.fusion-grade-tabs button.active,.fusion-grade-tabs button[aria-pressed="true"]{background:color-mix(in srgb,var(--rarity) 17%,#16243a);border:2px solid var(--rarity);box-shadow:0 0 14px color-mix(in srgb,var(--rarity),transparent 77%)}
.fusion-grade-tabs .rarity{font-size:15px;line-height:1.2}
.fusion-grade-tabs button:has(.N){--rarity:var(--N)}.fusion-grade-tabs button:has(.A){--rarity:var(--A)}.fusion-grade-tabs button:has(.R){--rarity:var(--R)}.fusion-grade-tabs button:has(.SR){--rarity:var(--SR)}.fusion-grade-tabs button:has(.SSR){--rarity:var(--SSR)}
.fusion-available{font-size:12px;color:#d4e2f2;line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap}
.fusion-panel{display:flex;flex-direction:column;gap:13px;flex:1;min-height:0;border:1px solid #b3a1e351;border-radius:16px;padding:16px 12px;background:radial-gradient(ellipse at 50% 30%,#514d752e,transparent 65%),#142339;overflow:hidden}
.fusion-route{display:flex;align-items:center;justify-content:center;gap:12px;flex-shrink:0;font-size:22px;font-weight:750;color:#c6d7f4;line-height:1.3}
.fusion-route .rarity{font-size:21px}
.fusion-rule{font-size:15px;line-height:1.6;text-align:center;color:#d3dfef;word-break:keep-all;flex-shrink:0}
.fusion-rule b,.fusion-rule strong{color:#ffe2a0;font-weight:800}
.fusion-materials{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;flex:1;min-height:0;align-items:stretch}
.fusion-material{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:0;padding:8px 3px;border:1px solid var(--rarity,#c2cff0);border-radius:10px;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity,#c2cff0),transparent 86%),#132036);box-shadow:inset 0 0 15px #c5d7ff0a;text-align:center;overflow:hidden}
.fusion-material canvas{width:100%;height:0;min-height:25px;max-height:120px;flex:1;object-fit:contain;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--rarity,#dce7ff),transparent 50%))}
.fusion-material b,.fusion-material small,.fusion-material>span{font-size:12px;line-height:1.35;word-break:keep-all;overflow-wrap:anywhere}
.fusion-material.empty{border-style:dashed;opacity:.6}
.fusion-batch-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;flex-shrink:0}
.fusion-batch-options button{min-height:49px;font-size:15px;padding:7px 5px}
.fusion-batch-options button.active,.fusion-batch-options button[aria-pressed="true"]{color:#fff1c6;background:#42516b;border-color:#ffde95;box-shadow:inset 0 0 0 1px #ffde9538}
#fusion-consumption{font-size:14px;line-height:1.45;color:#e0d7e9;text-align:center;word-break:keep-all}
#fusion-confirm{min-height:52px;font-size:17px}
#overlay[data-type="fusion-portal"] .overlay-shell{background:radial-gradient(ellipse at 50% 30%,#283754,#0a1325 75%)}
.fusion-cinema{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:12px;flex:1;min-height:0}
.fusion-cinema.mixed{grid-template-rows:repeat(2,minmax(0,1fr))}
.fusion-ritual{position:relative;isolation:isolate;min-height:0;overflow:hidden;border:1px solid #8fa6d454;border-radius:18px;background:radial-gradient(ellipse at 50% 16%,#6a7b9e66,#132644 30%,#040c1b 77%)}
.fusion-ritual:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 14% 19%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 84% 30%,#ddeaff 0 1px,transparent 1.5px),radial-gradient(circle at 71% 74%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 29% 51%,#eff7ff 0 1px,transparent 2px);background-size:137px 181px,191px 229px,163px 199px,233px 277px;opacity:.5}
.fusion-moon{position:absolute;left:50%;top:17%;width:clamp(75px,28vw,130px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 32% 28%,#fffff1,#fff7d5 35%,#c3d6e9 80%);box-shadow:0 0 15px #fff8dccc,0 0 45px 9px #c6e4ff80,0 0 100px #8ec3ff5e,inset -7px -6px 11px #7890a688;animation:fusion-moonlight 3.1s ease-in-out both}
.fusion-moon:after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 29% 38%,#8e9aa655 0 7%,transparent 12%),radial-gradient(circle at 62% 60%,#9caebd77 0 11%,transparent 17%),radial-gradient(circle at 71% 23%,#91a3b84d 0 4%,transparent 9%)}
.fusion-beam{position:absolute;left:7%;right:7%;top:17%;height:66%;background:linear-gradient(#f6f8ffe0,#cadeff77 23%,#a5c4ff44 64%,transparent);clip-path:polygon(47% 0,53% 0,100% 100%,0 100%);mix-blend-mode:screen;filter:blur(1px);opacity:0;animation:fusion-beam-light 3.1s ease-in-out both}
.fusion-card{--card-x:calc(20% + var(--i,0) * 20%);position:absolute;left:var(--card-x);top:62%;width:clamp(38px,12vw,66px);aspect-ratio:2/3;display:grid;place-items:center;transform:translate(-50%,-50%) rotate(calc(-9deg + var(--i,0) * 6deg));border:2px solid #f0e5ba;border-radius:7px;background:linear-gradient(140deg,#8497b0,#172943 25%,#304467 70%,#e8d496);box-shadow:0 0 7px #dbeeff66,inset 0 0 0 4px #14233b99;color:#fff0bb;font-size:30px;line-height:1;z-index:3}
.fusion-card:before{content:'✧';text-shadow:0 0 8px #fff,0 0 18px #cadfff}
.fusion-card:after{content:'';position:absolute;inset:6px;border:1px solid #dbe8ff55;border-radius:3px}
.fusion-card canvas{display:block;position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);object-fit:contain;filter:drop-shadow(0 0 5px #deefff77)}
.fusion-card:has(canvas):before{display:none}
.fusion-ritual.success .fusion-card{animation:fusion-card-unite 3.1s ease-in-out both}
.fusion-ritual.failure .fusion-card{animation:fusion-card-dissolve 3.1s ease-in-out both}
.fusion-result-card{position:absolute;left:50%;top:58%;width:clamp(65px,23vw,115px);aspect-ratio:2/3;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:7px;border:2px solid var(--rarity,#ffe39b);border-radius:10px;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity,#ffe39b),transparent 62%),#193250 70%);box-shadow:0 0 22px var(--rarity,#ffe39b),0 0 60px color-mix(in srgb,var(--rarity,#ffe39b),transparent 60%),inset 0 0 15px #fff3;color:#fff4c4;font-size:48px;z-index:5;opacity:0;transform:translate(-50%,-50%) scale(.1);animation:fusion-born 3.1s ease-out both}
.fusion-result-card canvas{width:100%;height:0;min-height:0;flex:1;object-fit:contain}
.fusion-result-card .rarity{font-size:14px;line-height:1.2;flex-shrink:0;white-space:nowrap}
.fusion-result-card b,.fusion-result-card small{font-size:13px;line-height:1.3;text-align:center;word-break:keep-all}
.fusion-ritual>p,.fusion-ritual>.fusion-caption{position:absolute;bottom:12px;left:8px;right:8px;z-index:7;color:#e0ebfc;font-size:16px;font-weight:650;line-height:1.5;text-align:center;text-shadow:0 2px 5px #000;background:linear-gradient(90deg,transparent,#031127bb,transparent);padding:4px 2px}
.fusion-ritual.success>p,.fusion-ritual.success>.fusion-caption{color:#ffe7a8}
.fusion-ritual.failure>p,.fusion-ritual.failure>.fusion-caption{color:#d5d3e8}
.fusion-ritual.failure:after{content:'✦  ·  ✧  ·  ✦';position:absolute;left:10%;right:10%;top:51%;font-size:24px;word-spacing:12px;text-align:center;color:#dee9ff;text-shadow:0 0 12px #afd5ff;opacity:0;animation:fusion-stardust 3.1s ease-out both;z-index:5}
.fusion-cinema.mixed .fusion-moon{width:64px;top:20%}
.fusion-cinema.mixed .fusion-beam{top:20%;height:64%}
.fusion-cinema.mixed .fusion-card{width:34px;top:61%;font-size:22px}
.fusion-cinema.mixed .fusion-result-card{width:53px;top:59%;font-size:32px}
.fusion-cinema.mixed .fusion-result-card .rarity{font-size:12px}
.fusion-cinema.mixed .fusion-ritual>p,.fusion-cinema.mixed .fusion-ritual>.fusion-caption{font-size:14px;bottom:5px;padding:2px}
.fusion-summary{flex-shrink:0;text-align:center;font-size:16px;line-height:1.5;color:#e3deef;word-break:keep-all}
.fusion-summary b,.fusion-summary strong{color:#ffe3a0}
.fusion-results-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:8px;flex:1;min-height:0;padding:2px}
.fusion-result{position:relative;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px 4px;border:1px solid var(--rarity,#8198b8);border-radius:12px;overflow:hidden;text-align:center;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity,#becde1),transparent 87%),#14243a);animation:card-arrive .4s ease-out both}
.fusion-result.success{box-shadow:inset 0 -3px var(--rarity),0 0 12px color-mix(in srgb,var(--rarity),transparent 80%)}
.fusion-result.failure{background:linear-gradient(140deg,#222b3e,#152238);border-color:#65778d;color:#c8cedd}
.fusion-result .rarity{font-size:14px;line-height:1.2}
.fusion-result canvas{width:100%;flex:1;height:0;min-height:18px;object-fit:contain;filter:drop-shadow(0 0 7px color-mix(in srgb,var(--rarity,#b9cae5),transparent 45%))}
.fusion-result b{font-size:14px;line-height:1.3;word-break:keep-all;overflow-wrap:anywhere}
.fusion-result small,.fusion-result .fusion-order{font-size:12px;line-height:1.25;color:#c4d2e5}
.fusion-result .fusion-order{position:static;align-self:flex-start;font-size:10px;line-height:1.2;flex-shrink:0}
.fusion-result .fusion-failed-icon,.fusion-result .fusion-faded{display:grid;place-items:center;flex:1;font-size:42px;color:#91a0bd;text-shadow:0 0 20px #b1c9ff33}
#fusion-result-pager{gap:7px}
#fusion-result-pager button{padding-inline:10px}
#overlay[data-type="fusion-results"] #overlay-actions .action-row button{font-size:15px;min-height:50px}
@keyframes fusion-moonlight{0%{filter:brightness(.85);box-shadow:0 0 15px #e6f0ff,0 0 35px #a1c6ff77}38%{filter:brightness(1.55);box-shadow:0 0 24px #fff8e6,0 0 80px 24px #cde6ffa6}75%{filter:brightness(1.7)}100%{filter:brightness(1);box-shadow:0 0 18px #fff0c9,0 0 60px #c6e4ff77}}
@keyframes fusion-beam-light{0%,8%{opacity:0;transform:scaleX(.2)}33%,65%{opacity:.95;transform:scaleX(1)}100%{opacity:.28;transform:scaleX(.85)}}
@keyframes fusion-card-unite{0%,15%{opacity:1;filter:brightness(.8);left:var(--card-x);transform:translate(-50%,-50%) rotate(calc(-9deg + var(--i,0) * 6deg)) scale(.8)}48%{opacity:1;filter:brightness(1.9);left:var(--card-x);transform:translate(-50%,-60%) rotate(calc(-9deg + var(--i,0) * 6deg)) scale(1)}68%{opacity:1;filter:brightness(3);left:50%;transform:translate(-50%,-50%) rotate(0deg) scale(.7)}75%,100%{opacity:0;left:50%;transform:translate(-50%,-50%) rotate(0deg) scale(.1)}}
@keyframes fusion-card-dissolve{0%,15%{opacity:1;filter:brightness(.8);transform:translate(-50%,-50%) rotate(calc(-9deg + var(--i,0) * 6deg)) scale(.8)}48%{opacity:1;filter:brightness(2);transform:translate(-50%,-60%) rotate(calc(-9deg + var(--i,0) * 6deg)) scale(1)}65%{opacity:.8;filter:brightness(3) blur(1px);transform:translate(-50%,-75%) rotate(calc(-12deg + var(--i,0) * 8deg)) scale(.9)}85%,100%{opacity:0;filter:brightness(3) blur(8px);transform:translate(-50%,-115%) rotate(calc(-20deg + var(--i,0) * 14deg)) scale(.2)}}
@keyframes fusion-born{0%,66%{opacity:0;filter:brightness(4);transform:translate(-50%,-50%) scale(.12)}77%{opacity:1;filter:brightness(2.5);transform:translate(-50%,-50%) scale(1.2)}90%,100%{opacity:1;filter:brightness(1);transform:translate(-50%,-50%) scale(1)}}
@keyframes fusion-stardust{0%,60%{opacity:0;transform:translateY(0) scale(.6)}73%{opacity:1;transform:translateY(-5px) scale(1)}100%{opacity:0;transform:translateY(-30px) scale(1.5)}}
@media(min-width:700px){#page-collection #party-slots{gap:13px}#page-collection #party-slots b{font-size:19px}#page-collection #party-slots small,#page-collection #party-slots .slot-power,#page-collection #party-slots .party-power{font-size:15px}.fusion-panel{padding:22px;gap:18px}.fusion-rule{font-size:17px}.fusion-material b,.fusion-material small,.fusion-material>span{font-size:15px}.fusion-materials{gap:14px}.fusion-cinema.mixed{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr)}.fusion-cinema.mixed .fusion-moon{width:100px}.fusion-cinema.mixed .fusion-card{width:44px}.fusion-cinema.mixed .fusion-result-card{width:88px}.fusion-cinema.mixed .fusion-ritual>p,.fusion-cinema.mixed .fusion-ritual>.fusion-caption{font-size:16px;bottom:13px}.fusion-result b{font-size:17px}.fusion-result .rarity{font-size:17px}.fusion-result small{font-size:14px}}
@media(max-height:700px){#page-collection{gap:6px}#page-collection #party-slots{gap:7px}#page-collection #party-slots button{padding:5px 4px;gap:1px}#page-collection #party-slots .rarity{font-size:14px}#page-collection #party-slots b{font-size:15px}#page-collection #party-slots small,#page-collection #party-slots .slot-power,#page-collection #party-slots .party-power{font-size:12px}#page-collection #team-note{font-size:13px}.collection-actions button,.companion-toolbar button{min-height:48px}#overlay[data-type="fusion"] #overlay-body{gap:8px}.fusion-grade-tabs button{min-height:56px;gap:3px}.fusion-grade-tabs .rarity{font-size:14px}.fusion-panel{padding:11px 9px;gap:9px}.fusion-route{font-size:19px}.fusion-route .rarity{font-size:19px}.fusion-rule{font-size:14px;line-height:1.5}.fusion-material{padding:5px 2px;gap:3px}.fusion-materials{gap:5px}.fusion-material canvas{min-height:15px}.fusion-material b,.fusion-material small,.fusion-material>span{font-size:11px}.fusion-batch-options button{font-size:14px;min-height:48px}#fusion-consumption{font-size:13px;line-height:1.35}.fusion-summary{font-size:14px;line-height:1.4}.fusion-results-grid{gap:6px}.fusion-result{gap:3px;padding:6px 3px}.fusion-result b{font-size:13px}.fusion-result .rarity{font-size:13px}.fusion-result small{font-size:11px}.fusion-cinema.mixed{gap:8px}.fusion-cinema.mixed .fusion-moon{width:50px}.fusion-cinema.mixed .fusion-card{width:28px;font-size:18px}.fusion-cinema.mixed .fusion-result-card{width:43px;font-size:27px}.fusion-cinema.mixed .fusion-ritual>p,.fusion-cinema.mixed .fusion-ritual>.fusion-caption{font-size:13px}}
@media(max-height:570px){#page-collection #party-slots{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:5px}#page-collection #party-slots .rarity{font-size:12px}#page-collection #party-slots b{font-size:13px}#page-collection #party-slots small,#page-collection #party-slots .slot-power,#page-collection #party-slots .party-power{font-size:11px}#page-collection #team-note{display:none}.fusion-grade-tabs button{min-height:48px}.fusion-panel{padding:7px;gap:6px}.fusion-rule{font-size:12px;line-height:1.35}.fusion-route .rarity{font-size:17px}.fusion-material b,.fusion-material small,.fusion-material>span{font-size:10px}.fusion-batch-options button{min-height:44px}.fusion-cinema.mixed{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr)}.fusion-cinema.mixed .fusion-card{width:22px}.fusion-cinema.mixed .fusion-ritual>p,.fusion-cinema.mixed .fusion-ritual>.fusion-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.fusion-moon{filter:none}.fusion-beam{opacity:.35;transform:none}.fusion-ritual.success .fusion-card{opacity:0}.fusion-result-card{opacity:1;transform:translate(-50%,-50%);filter:none}.fusion-ritual.failure .fusion-card{opacity:.2;border-style:dashed;filter:saturate(.3);transform:translate(-50%,-50%) rotate(0deg)}.fusion-ritual.failure:after{opacity:.4;transform:none}}

/* 0.8 — automatic moonlight, instant formations and individual attack identities. */
#skill.skill{--charge:0%;flex:1;min-width:0;min-height:54px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;position:relative;overflow:hidden;padding:7px 4px;border:1px solid #c4b5f28c;border-radius:12px;background:linear-gradient(90deg,#b5a4ff26 var(--charge),transparent var(--charge)),#242c4a;color:#f2eaff;isolation:isolate}
#skill .skill-label{font-size:16px;line-height:1.3;font-weight:750;white-space:nowrap}
#skill .skill-auto{font-size:10px;vertical-align:2px;background:#dad5ff;color:#343154;border-radius:4px;padding:2px 3px;margin-left:3px;font-weight:900;letter-spacing:.25px}
#skill #skill-charge{display:block;font-size:12px;color:#d2defa;font-weight:650;line-height:1.2}
#skill.skill.ready{border-color:#e8dba9;background:linear-gradient(100deg,#4d4668,#343653);box-shadow:inset 0 0 14px #deceff33,0 0 12px #d2baff22}
#skill.skill.ready .skill-auto{background:#fff1ba;color:#3d3550}
#page-summon .summon-probability{font-size:13px;gap:5px;line-height:1.5}
#page-summon .summon-probability b{font-size:15px;color:#f4d2ff}
.summon-feature.rarity-SR{background:radial-gradient(ellipse,#cc586c28,transparent 66%)}
.summon-feature.rarity-SR .orbit{border-color:#ff8d9680;box-shadow:0 0 22px #ff637222}
.fusion-only-note{color:#e3bcff;font-weight:750}
.attack-identity{display:flex;align-items:center;justify-content:space-between;gap:4px 8px;border-left:3px solid var(--rarity);padding:5px 8px;border-radius:0 7px 7px 0;background:color-mix(in srgb,var(--rarity) 8%,#12243b);flex-wrap:wrap;flex-shrink:0}
.attack-identity b{font-size:14px;color:var(--rarity)}
.attack-identity span{font-size:12px;color:#d4e0ef}
#overlay[data-type="unit"] .detail-description{font-size:14px;line-height:1.4;flex-shrink:0}
#overlay[data-type="unit"] .detail-art{flex:1;min-height:35px;max-height:200px}
#overlay[data-type="unit"] .detail-note{font-size:13px;line-height:1.4;flex-shrink:0}
#overlay[data-type="unit"] .growth-copy{flex-shrink:0}
#overlay[data-type="rates"] .rates-table td:nth-child(2){font-weight:750;white-space:nowrap}
#page-collection #party-slots .SSR{box-shadow:inset 0 -3px #c08aff,0 0 15px #a574ff44}
#page-collection #party-slots .UR{box-shadow:inset 0 -3px #ffe16a,0 0 19px #ffe16a44}
@media(max-height:700px){#overlay[data-type="unit"] #overlay-body{gap:7px}#overlay[data-type="unit"] .detail-art{max-height:105px}#overlay[data-type="unit"] .detail-description{font-size:13px;line-height:1.35}.attack-identity{padding:4px 7px;gap:1px 5px}.attack-identity b{font-size:13px}.attack-identity span{font-size:11px}#overlay[data-type="unit"] .detail-note{font-size:12px}.summon-feature.rarity-SR .rarity{font-size:14px}}
/* v0.9: larger battle controls and a persistent, nonblocking journey strip. */
#app{grid-template-rows:auto minmax(0,1fr) auto auto}
#journey-status{display:flex;align-items:center;gap:7px;padding:8px 12px max(8px,env(safe-area-inset-bottom));background:#112c3b;border-top:1px solid #53748b;font-size:12px;min-height:52px}
#journey-status>div{flex:1;display:flex;align-items:center;gap:10px;min-width:0}#journey-status button{font-size:12px;min-height:36px;padding:5px 8px}#journey-label{line-height:1.4}#stage-countdown{font-size:32px;color:#ffdf98;min-width:20px;line-height:1}.stage-complete{background:linear-gradient(90deg,#28494c,#273455)!important}
#page-battle{gap:7px}#page-battle .page-heading{min-height:38px}#page-battle>.action-row button{min-height:48px;font-size:16px}#skill.skill{min-height:58px;cursor:pointer}#skill .skill-label{font-size:18px}#skill .skill-auto{font-size:10px}#skill-charge{font-size:12px}#battle-hud b,.wave-info span{font-size:16px}.hp-track{height:10px}#boss-hud{font-size:16px;top:64px}.party-chip{min-height:48px!important}.party-chip.empty-slot{border:1px dashed #cbeac4;background:#1e4143;color:#dcffc5;min-width:52px}.party-chip.empty-slot span{font-size:11px}.party-chip.empty-slot b{font-size:22px}.slot-unlocked{animation:slot-light 1.2s ease-in-out 3}@keyframes slot-light{50%{box-shadow:0 0 18px #c6ffc7,inset 0 0 18px #b1ed9970}}
.lightning-reveal{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:15px;overflow:hidden;width:100%;height:100%;min-height:300px;padding:30px 12px;border:1px solid var(--rarity);background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--rarity) 35%,#14223f),#081020 72%);border-radius:18px;color:#fff}.lightning-reveal>b{font-size:25px;color:var(--rarity);z-index:1}.lightning-reveal>span:last-child{font-size:14px;z-index:1}.sealed-card{position:absolute;top:26%;left:calc(50% - 56px);width:112px;height:148px;border:2px solid var(--rarity);border-radius:14px;background:linear-gradient(145deg,#283e5f,#0b142d);display:grid;place-items:center;font-size:48px;box-shadow:0 0 38px var(--rarity);transform:rotate(-5deg)}.lightning-bolt{position:absolute;inset:0;width:100%;height:73%;z-index:2;overflow:visible;filter:drop-shadow(0 0 9px var(--rarity));pointer-events:none}.lightning-bolt path{fill:none;stroke:#ecf5ff;stroke-width:4;stroke-linejoin:bevel;animation:lightning-strike 1.8s ease-out infinite}.lightning-cloud{position:absolute;inset:0;opacity:.3;background:radial-gradient(ellipse at top,#fff,transparent 65%);animation:lightning-strike 1.8s ease-out infinite}@keyframes lightning-strike{0%,100%{opacity:.15}8%,18%{opacity:1}30%,80%{opacity:.2}}
#overlay[data-type=lightning] #overlay-body{display:flex;flex:1}#overlay[data-type=lightning] .overlay-back-row{display:none}.fusion-result.failure canvas{width:100%;height:70px}.fusion-result.failure{border-color:#85a4c2}
@media(max-height:700px){#screens{padding:5px 10px}#page-battle{gap:5px}#page-battle .page-heading{min-height:30px}#page-battle>.action-row button{min-height:44px}#skill.skill{min-height:50px}#party-summary{font-size:12px}.battlefield{min-height:150px}#journey-status{padding:5px 10px;min-height:46px}.party-chip{min-height:40px!important}}
@media(prefers-reduced-motion:reduce){.lightning-bolt path,.lightning-cloud,.slot-unlocked{animation:none}.lightning-bolt path{opacity:.85}}


.special{--rarity:#b6d8ff}.level-table div{font-size:12px}.fusion-summary small{line-height:1.5}#collection-count{font-size:14px;white-space:nowrap}

/* Special results occupy their own screen, with grade-scaled lightning. */
#overlay[data-type=card-reveal] .overlay-back-row{display:none}
.card-spotlight{position:relative;isolation:isolate;display:flex;flex:1;min-height:0;overflow:hidden;border-radius:20px;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity) 28%,#0c142a),#080e1b 75%)}
.card-spotlight .summon-results{position:relative;z-index:2;width:100%;padding:22px}
.card-spotlight .result-card{width:min(100%,280px);max-height:440px;box-shadow:0 0 24px var(--rarity);animation:spotlight-arrive .55s ease-out}
.card-spotlight .result-card canvas{width:100%;height:100%;object-fit:contain}
.reveal-halo{position:absolute;inset:12%;border:2px solid var(--rarity);border-radius:50%;box-shadow:0 0 35px var(--rarity);opacity:.4;animation:spotlight-halo 1.4s ease-out}
.reveal-bolt{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;transform:translateX(calc((var(--bolt-index) - 1)*16%));filter:drop-shadow(0 0 12px var(--rarity))}
.reveal-bolt path{fill:none;stroke:var(--rarity);stroke-width:4;animation:result-strike .7s ease-out both;animation-delay:calc(var(--bolt-index)*.12s)}
.card-spotlight.SR .reveal-bolt{transform:none}.card-spotlight.SSR .reveal-bolt path{stroke-width:6}.card-spotlight.UR .reveal-bolt path{stroke-width:8}.card-spotlight.UR .reveal-halo{inset:0;box-shadow:0 0 75px var(--rarity),inset 0 0 75px var(--rarity)}
.card-spotlight.SSR .result-card{box-shadow:0 0 45px var(--rarity)}.card-spotlight.UR .result-card{box-shadow:0 0 70px var(--rarity)}
@keyframes result-strike{0%{opacity:0}12%{opacity:1}35%{opacity:.7}100%{opacity:0}}
@keyframes spotlight-arrive{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes spotlight-halo{from{transform:scale(.3);opacity:1}to{transform:scale(1.5);opacity:.4}}
@media(prefers-reduced-motion:reduce){.reveal-bolt path{opacity:.45}.reveal-halo{opacity:.25}}

.speed-options{display:flex;flex:1;flex-direction:column;justify-content:center;gap:16px}.speed-options button{min-height:64px;font-size:22px}
#page-battle #skill{width:100%;grid-column:1/-1}

/* Battle-first layout: the field gets the stage and party rows back. */
#app:has(#page-battle:not(.hidden)){height:100dvh;max-width:960px}
#app:has(#page-battle:not(.hidden)) .app-header{grid-template-columns:minmax(0,1fr) 48px;gap:2px 6px;padding:4px 8px 0}
#app:has(#page-battle:not(.hidden)) .brand{display:none}
#app:has(#page-battle:not(.hidden)) .wallet{grid-column:1;grid-row:1;font-size:14px;gap:8px}
#app:has(#page-battle:not(.hidden)) .wallet b{font-size:16px}
#app:has(#page-battle:not(.hidden)) #sound{grid-column:2;grid-row:1;height:44px;min-height:44px}
#app:has(#page-battle:not(.hidden)) .xp-track{margin-top:0;height:3px}
#screens:has(#page-battle:not(.hidden)){padding:0}
#page-battle{position:relative;display:grid;grid-template-rows:minmax(0,1fr) 48px 44px;gap:4px;padding:0 0 4px}
#page-battle .battlefield{grid-row:1;min-height:0;border-radius:0;border-inline:0}
#page-battle>.page-heading{position:absolute;inset:6px 8px auto;z-index:2;min-height:44px;pointer-events:none}
#page-battle>.page-heading button{pointer-events:auto;background:#102036c9;border:1px solid #7293b478;min-height:44px;padding:6px 10px;font-size:16px}
#page-battle #battle-hud{top:60px}
#page-battle #boss-hud{top:114px}
#page-battle>.battle-party{position:absolute;bottom:128px;left:8px;right:8px;z-index:2;display:flex}
#page-battle .party-chip{min-height:36px!important;padding:2px;background:#102035df}
#page-battle .party-chip b{font-size:12px}
#page-battle #party-summary{position:absolute;bottom:106px;left:8px;right:8px;z-index:2;font-size:12px;line-height:18px;color:#e5efff;text-shadow:0 1px 3px #000}
#page-battle>.action-row{margin-inline:8px}
#page-battle>.action-row:has(#skill){grid-row:2}
#page-battle>.action-row.thirds{grid-row:3}
#page-battle #skill.skill{min-height:48px;height:48px;padding:4px 8px}
#page-battle>.action-row.thirds button{min-height:44px;height:44px;font-size:14px;padding:4px}
#app:has(#page-battle:not(.hidden)) #navigation{padding-top:3px;padding-bottom:3px}
#app:has(#page-battle:not(.hidden)) #navigation button{min-height:44px;padding:5px 2px;font-size:16px}
#app:has(#page-battle:not(.hidden)) #journey-status{min-height:40px;padding:3px 8px max(3px,env(safe-area-inset-bottom))}
@media(max-height:570px){#page-battle #battle-hud{top:54px}#page-battle #battle-hud b,#page-battle .wave-info span{font-size:13px}#page-battle #boss-hud{top:103px}}



/* v19: rare and hero share an amber pre-reveal; exact rarity remains hidden. */
.premium-summon.special{--summon-color:#ff9e35;background:radial-gradient(ellipse at 50% 35%,#a7501c88,#251326 55%,#071021)}
.premium-summon.special .radiant-moon{background:radial-gradient(circle at 35% 30%,#fff9cf,#ffba57 52%,#ee7328);box-shadow:0 0 30px #ffbd61,0 0 80px #ff942ca6,0 0 140px #ff801d66}
.premium-summon.special .moon-rays{filter:sepia(1) saturate(4);opacity:.9}
.portal-rarity.special{color:#ffd08a;text-shadow:0 0 16px #ff9829;font-size:17px}