/* A summon card fills the first page; its actions never become a later page. */
#page-summon.viewport-paged>.page-heading{flex:none;min-height:30px;margin:0;padding:0;align-items:center}
#page-summon.viewport-paged #summon-heading{font-size:20px;line-height:28px}
#page-summon.viewport-paged .summon-heading-note{display:none}
#page-summon.viewport-paged>.summon-gallery-tools{flex:none;min-height:36px}
#page-summon.viewport-paged .summon-gallery-tools button{min-height:36px;padding:5px 8px}
#page-summon .summon-book .summon-gallery{display:contents!important}
#page-summon .summon-book .summon-panel{height:100%;min-height:0;max-height:100%;margin:0!important;padding:9px;display:flex;flex-direction:column;gap:3px;break-inside:avoid;box-sizing:border-box}
#page-summon .summon-book .summon-panel>*{flex:none;margin:0}
#page-summon .summon-book .summon-select{min-height:16px;height:16px;padding:0;line-height:14px}
#page-summon .summon-book .summon-select:after{display:none}
#page-summon .summon-book .summon-kicker{margin:0!important;line-height:12px}
#page-summon .summon-book .summon-panel h2{font-size:23px;line-height:29px;margin:0}
#page-summon .summon-book .summon-copy{display:none}
#page-summon .summon-book .summon-illustration{flex:1 1 0;min-height:26px;max-height:none;height:auto;width:100%;margin:2px 0}
#page-summon .summon-book .summon-illustration:before{height:70%;width:auto;aspect-ratio:1;max-width:85%;max-height:180px}
#page-summon .summon-book .summon-illustration canvas{height:100%;max-height:250px;width:46%;bottom:0}
#page-summon .summon-book .summon-illustration canvas.summon-side{height:80%;max-height:200px;width:37%}
#page-summon .summon-book #featured-equipment .item-art{width:auto!important;height:95%;max-height:230px;max-width:54%;bottom:0}
#page-summon .summon-book #featured-equipment .item-art.item-side{height:72%;max-width:36%}
#page-summon .summon-book .summon-rule{min-height:0;font-size:10px;line-height:15px;margin:2px 0}
#page-summon .summon-book .summon-actions{gap:7px}
#page-summon .summon-book .summon-actions button{min-height:48px;gap:3px;padding:5px;font-size:12px}
#page-summon .summon-book .summon-actions button span{font-size:10px}
#page-summon .summon-book .summon-collection{margin:4px 0 0}
#page-summon .summon-book .summon-collection-track{margin-top:4px}
@media(min-width:720px) and (min-height:600px){
 #page-summon .summon-book .summon-gallery{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));height:100%;gap:16px;break-inside:avoid;margin:0}
}

/* Keep the prompt and all four answers together in one screen-sized column. */
#page-dungeon .quiz-question-page{height:100%;width:100%;min-height:0;display:flex;flex-direction:column;gap:5px;margin:0!important;break-inside:avoid;box-sizing:border-box}
#page-dungeon .quiz-question-page>*{flex:none;margin:0}
#page-dungeon .quiz-question-page .quiz-top{min-height:36px}
#page-dungeon .quiz-question-page .quiz-top button{min-height:36px;padding:4px 8px}
#page-dungeon .quiz-question-page .quiz-top b{display:inline;margin-left:4px}
#page-dungeon .quiz-question-page .quiz-progress{height:4px}
#page-dungeon .quiz-question-page .quiz-arena{height:51px;min-height:0;gap:1px}
#page-dungeon .quiz-question-page .arena-rune{display:none}
#page-dungeon .quiz-question-page .arena-label{font-size:7px;letter-spacing:1px}
#page-dungeon .quiz-question-page .knowledge-trail{margin-top:2px;gap:5px}
#page-dungeon .quiz-question-page .knowledge-trail i{width:12px;height:12px;font-size:9px}
#page-dungeon .quiz-question-page .quiz-card{flex:1 1 0;min-height:0;display:flex;flex-direction:column;gap:5px;padding:9px;break-inside:avoid}
#page-dungeon .quiz-question-page .quiz-type{flex:none;font-size:10px;line-height:14px;margin:0}
#page-dungeon .quiz-question-page .quiz-prompt{flex:none;font-size:18px!important;line-height:1.35;margin:1px 0}
#page-dungeon .quiz-question-page .quiz-prompt.word{font-size:26px!important;line-height:1.35;margin:3px 0}
#page-dungeon .quiz-question-page .quiz-listen{flex:none;min-height:32px;min-width:100px;margin:0 auto;padding:4px 9px;font-size:11px}
#page-dungeon .quiz-question-page .quiz-hint{font-size:10px;line-height:1.4;margin:0;padding:4px 7px}
#page-dungeon .quiz-question-page .quiz-options{flex:1 1 0;min-height:94px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(44px,1fr));gap:6px;margin:2px 0 0;max-height:260px}
#page-dungeon .quiz-question-page .quiz-options button{min-width:0;min-height:44px;padding:6px;gap:5px;font-size:13px;position:relative;box-sizing:border-box}
#page-dungeon .quiz-question-page .quiz-options button>span{width:20px;height:20px;font-size:10px}
#page-dungeon .quiz-question-page .quiz-options button>b{line-height:1.35;word-break:keep-all;overflow-wrap:anywhere}
#page-dungeon .quiz-question-page .quiz-options button>em{position:absolute;right:3px;bottom:2px;font-size:8px}
.auto-equip-button{width:100%;min-height:44px;font-size:13px;break-inside:avoid}
@media(max-height:570px){
 #page-summon.viewport-paged>.page-heading{display:none}
 #page-summon.viewport-paged>.summon-gallery-tools{min-height:30px}
 #page-summon.viewport-paged .summon-gallery-tools button{min-height:30px;padding:3px 8px}
 #page-summon .summon-book .summon-panel{display:grid;grid-template-columns:90px minmax(0,1fr);grid-template-rows:14px 23px minmax(12px,1fr) 44px 20px;padding:6px;gap:2px 9px}
 #page-summon .summon-book .summon-panel>.summon-select{grid-column:2;grid-row:1;height:14px;min-height:14px}
 #page-summon .summon-book .summon-panel>h2{grid-column:2;grid-row:2;font-size:19px;line-height:23px}
 #page-summon .summon-book .summon-panel>.summon-illustration{grid-column:1;grid-row:1/6;width:90px;height:100%;margin:0}
 #page-summon .summon-book .summon-panel>.summon-rule{grid-column:2;grid-row:3;font-size:9px;line-height:12px}
 #page-summon .summon-book .summon-panel>.summon-actions{grid-column:2;grid-row:4}
 #page-summon .summon-book .summon-panel .summon-actions button{min-height:44px}
 #page-summon .summon-book .summon-panel>.summon-collection{grid-column:2;grid-row:5;margin:0}
 #page-dungeon .quiz-question-page{gap:3px}
 #page-dungeon .quiz-question-page .quiz-arena{display:none}
 #page-dungeon .quiz-question-page .quiz-card{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(0,1.3fr);grid-template-rows:auto 1fr auto;gap:3px 10px;padding:7px}
 #page-dungeon .quiz-question-page .quiz-type{grid-column:1;grid-row:1}
 #page-dungeon .quiz-question-page .quiz-prompt{grid-column:1;grid-row:2;align-self:center}
 #page-dungeon .quiz-question-page .quiz-listen,#page-dungeon .quiz-question-page .quiz-hint{grid-column:1;grid-row:3}
 #page-dungeon .quiz-question-page .quiz-options{grid-column:2;grid-row:1/4;min-height:94px;height:100%;margin:0}
 #page-dungeon .quiz-answer-stage{break-inside:avoid}
 #page-dungeon .quiz-answer-stage .quiz-feedback{display:grid;grid-template-columns:minmax(120px,.75fr) minmax(0,1.25fr);grid-template-rows:auto auto auto;gap:3px 10px;padding:7px;break-inside:avoid}
 #page-dungeon .quiz-feedback>b{grid-column:1;grid-row:1;font-size:11px;line-height:1.3}
 #page-dungeon .quiz-feedback>p{grid-column:2;grid-row:1/3;margin:0;font-size:12px;line-height:1.35}
 #page-dungeon .quiz-feedback>p>span{display:inline;font-size:9px;margin-right:5px}
 #page-dungeon .quiz-feedback>small{grid-column:2;grid-row:3;font-size:10px;line-height:1.35}
 #page-dungeon .quiz-feedback>.quiz-listen{grid-column:1;grid-row:2;min-height:30px;margin:0!important;padding:3px 6px;font-size:10px}
 #page-dungeon .quiz-feedback>.feedback-growth{grid-column:1;grid-row:3;margin:0;padding-top:3px;font-size:9px;line-height:1.3}
 #page-dungeon .quiz-answer-stage>#quiz-next{min-height:36px;margin-top:4px;padding:4px;font-size:13px}
}

/* Hero reveal: a rising moon opens a large crimson beam after the sealed card. */
.card-spotlight.hero-reveal{isolation:isolate;background:radial-gradient(ellipse at 50% 22%,#9f273e99,transparent 58%),linear-gradient(#120c23,#2c0c22 64%,#110e21)!important;overflow:hidden}
.hero-awakening{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.hero-moon{position:absolute;z-index:3;left:50%;top:5%;width:clamp(70px,19vh,155px);aspect-ratio:1;border-radius:50%;transform:translateX(-50%);background:radial-gradient(ellipse at 28% 30%,#b575796b 0 9%,transparent 10%),radial-gradient(ellipse at 67% 65%,#a755636b 0 14%,transparent 15%),radial-gradient(circle at 34% 31%,#fffce6,#ffe3bf 38%,#ffa29b 73%,#ab2742);border:2px solid #ffe4c5;box-shadow:0 0 18px #ffe6bdaa,0 0 55px #ff425cb3,0 0 110px #ea124266;animation:hero-moon-rise 1.1s cubic-bezier(.12,.7,.2,1) both}
.hero-red-beam{position:absolute;z-index:1;left:50%;top:20%;width:140%;height:88%;transform:translateX(-50%);transform-origin:50% 0;clip-path:polygon(48% 0,52% 0,100% 100%,0 100%);background:linear-gradient(90deg,transparent 3%,#e8003c55 24%,#ff244bbb 43%,#fff1cbe6 50%,#ff244bbb 57%,#e8003c55 76%,transparent 97%);filter:drop-shadow(0 0 14px #ff234c);animation:hero-beam-open 1.6s ease-out both}
.hero-ray{position:absolute;left:50%;top:21%;width:7px;height:90%;transform-origin:50% 0;background:linear-gradient(#fff1bd,#ff365fcc,transparent);filter:drop-shadow(0 0 7px #ff234a);animation:hero-ray-ignite 1.4s ease-out both}
.hero-ray.ray-left{transform:rotate(29deg)}.hero-ray.ray-right{transform:rotate(-29deg)}
.hero-moon-ring{position:absolute;left:50%;top:19%;width:50px;aspect-ratio:1;border:2px solid #ffb3a3;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 30px #ff2754;animation:hero-ring-burst 1.5s .25s ease-out both}
.hero-impact-ring{position:absolute;left:15%;right:15%;bottom:3%;height:12%;border:2px solid #ff785f;border-radius:50%;box-shadow:0 0 18px #ff1644,inset 0 0 22px #ff245766;animation:hero-impact 1.4s .35s ease-out both}
.hero-reveal-label{position:absolute;top:3%;left:0;right:0;z-index:5;color:#ffe3ad;text-align:center;font-size:clamp(19px,5vw,30px);letter-spacing:6px;text-shadow:0 0 16px #ff2146,0 2px #4c1524;animation:hero-title-in 1.2s ease-out both}
.card-spotlight.hero-reveal .reveal-halo{background:radial-gradient(ellipse,#ff524b77,transparent 62%);opacity:.9}
.card-spotlight.hero-reveal .reveal-bolt{filter:drop-shadow(0 0 14px #ff2447);opacity:.8}
.card-spotlight.hero-reveal .reveal-bolt path{stroke:#ffada1}
.card-spotlight.hero-reveal .summon-results{height:100%;padding:8px 20px 18px;align-items:flex-end}
.card-spotlight.hero-reveal .result-card{height:64%;max-height:330px;width:min(74%,250px);border-color:#ffd8a0!important;box-shadow:0 0 28px #ff2b59b3,inset 0 0 22px #ed365133!important;animation:hero-card-arrive 1.3s cubic-bezier(.18,.75,.2,1) both}
@keyframes hero-moon-rise{from{opacity:0;transform:translate(-50%,70px) scale(.45)}55%{opacity:1}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes hero-beam-open{0%,24%{opacity:0;transform:translateX(-50%) scaleX(.015)}48%{opacity:1;transform:translateX(-50%) scaleX(1)}100%{opacity:.55;transform:translateX(-50%) scaleX(.92)}}
@keyframes hero-ray-ignite{0%,30%{opacity:0}50%{opacity:1}100%{opacity:.45}}
@keyframes hero-ring-burst{from{opacity:0;scale:.4}25%{opacity:.9}to{opacity:0;scale:12}}
@keyframes hero-impact{from{opacity:0;transform:scale(.1)}45%{opacity:1}to{opacity:.55;transform:scale(1)}}
@keyframes hero-title-in{0%,35%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes hero-card-arrive{0%,35%{opacity:0;transform:translateY(65px) scale(.6)}70%{opacity:1;transform:translateY(-4px) scale(1.04)}100%{opacity:1;transform:none}}
@media(max-height:570px){.hero-moon{left:24%;top:15%;width:65px}.hero-red-beam{left:31%;top:35%}.hero-reveal-label{top:auto;bottom:8%;left:3%;right:auto;font-size:18px}.card-spotlight.hero-reveal .summon-results{justify-content:flex-end;align-items:center;padding:5px 20px}.card-spotlight.hero-reveal .result-card{height:92%;width:45%}.hero-moon-ring{left:24%;top:35%}}
@media(prefers-reduced-motion:reduce){.hero-awakening *,.hero-reveal-label,.card-spotlight.hero-reveal .result-card{animation:none!important}.hero-moon-ring{display:none}.hero-red-beam{opacity:.55}.hero-ray{opacity:.45}}

/* v38: one-tap speed, reachable moonlight and a clear summon-to-learning route. */
#page-battle{grid-template-rows:minmax(0,1fr) 44px}
#page-battle>.action-row.thirds{grid-row:2}
#page-battle>.battle-party{left:8px;right:158px;bottom:61px;gap:3px;min-height:32px}
#page-battle .party-chip{flex:1;min-width:0;max-width:42px;min-height:32px!important;padding:1px}
#page-battle .party-chip canvas{width:28px;height:28px}
#page-battle .party-chip b{font-size:9px}
#page-battle #party-summary{left:8px;right:158px;bottom:97px;font-size:10px;line-height:14px}
#page-battle>.battle-objective{position:absolute;z-index:3;bottom:117px;left:8px;right:158px;min-height:36px;margin:0;padding:5px 7px;font-size:11px}
#page-battle .battlefield #skill.skill{position:absolute;z-index:4;right:10px;bottom:12px;width:138px;height:64px;min-height:64px;padding:7px 5px;border-radius:17px;touch-action:manipulation}
#page-battle .battlefield #skill.skill:before{left:6px;top:7px;font-size:23px;opacity:.38}
#page-battle #skill .skill-label{font-size:16px}
#page-battle #skill #skill-charge{font-size:11px}
#page-battle #skill .skill-auto{font-size:9px}
.summon-actions button.needs-diamonds{border-color:#8499ac!important;background:#263b4e!important;color:#e6eef6!important}
.summon-shortfall{text-align:center;line-height:1.6;padding:12px 4px}
.summon-shortfall h3{margin:6px 0}.summon-shortfall p{margin:8px 0}
.summon-shortfall b,.shortfall-gem{color:#b9e5fa}.shortfall-gem{font-size:44px}
.summon-shortfall small{font-size:12px;color:#b9cbdc}
@media(max-height:570px){
 #page-battle>.battle-objective{display:none}
 #page-battle #party-summary{display:none}
 #page-battle>.battle-party{right:146px;bottom:54px}
 #page-battle .battlefield #skill.skill{width:128px;right:8px;bottom:8px;height:54px;min-height:54px}
 #page-battle>.adventure-toolbar{right:146px;top:89px}
 .summon-shortfall{padding:0;font-size:12px}.shortfall-gem{display:none}
}
