
:root{color-scheme:dark;--ink:#eef7fb;--muted:#a6c5d3;--deep:#081a27;--panel:#112f42;--line:#35596a;--gold:#ffce64;--mint:#69debb;--cyan:#65d0ec;--red:#ff8c98;--radius:22px;font-family:"Yu Gothic UI","Meiryo",system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 5% 0%,#204f5c,transparent 50%),#081a27;color:var(--ink);min-height:100dvh}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;background:#173a4d;color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:10px 16px;font-weight:700}button:hover:not(:disabled){background:#23566a;border-color:var(--cyan)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:disabled{opacity:.48;cursor:not-allowed}.gold{background:var(--gold);color:#13293c;border-color:var(--gold);box-shadow:0 4px 0 #a87928}.gold:hover:not(:disabled){background:#ffdc88;color:#13293c;border-color:#ffdc88}.small{padding:6px 10px;font-size:13px}.quiet{background:transparent}.danger{color:var(--red)}.muted{color:var(--muted)}.mint{color:var(--mint)}.cyan{color:var(--cyan)}.gold-text{color:var(--gold)}h1,h2,h3,p{margin:0}h1{font-size:clamp(25px,3vw,42px);line-height:1.35}h2{font-size:clamp(20px,2vw,29px)}h3{font-size:18px}p{line-height:1.65}.eyebrow{font-size:12px;letter-spacing:.15em;font-weight:800;color:var(--gold)}.top{max-width:1400px;margin:auto;padding:14px 24px 8px;display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{font-weight:900;letter-spacing:.1em;font-size:20px}.top-progress{display:flex;align-items:center;gap:14px}.level-pill{background:#214957;border:1px solid #568b8c;border-radius:14px;padding:7px 15px;color:var(--gold)}.toolbar{max-width:1400px;margin:auto;padding:5px 24px 12px;display:flex;gap:7px;flex-wrap:wrap;border-bottom:1px solid #294654}.toolbar .spacer{flex:1}main{max-width:1400px;margin:auto;padding:16px 24px}.pane{animation:appear .28s ease;min-height:min(650px,calc(100dvh - 190px))}.pane-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}.pane-head p{font-size:14px;color:var(--muted)}.panel{background:linear-gradient(140deg,#15364a,#0d2635);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:0 15px 45px #0002}.screen-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.intro{position:relative;overflow:hidden;padding:40px;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:30px}.intro-copy>p{margin:16px 0}.intro-actions{display:grid;gap:14px;margin-top:24px}.intro-actions button{padding:16px 22px;text-align:left;font-size:18px}.intro-actions small{display:block;font-size:13px;margin-top:4px;font-weight:500}.intro-art{position:relative;height:400px;border-radius:20px;background-size:cover;background-position:center;overflow:hidden}.intro-art .intro-mana{position:absolute;height:85%;bottom:8%;left:19%}.intro-art .intro-ally{position:absolute;height:34%;bottom:8%;left:58%}.options-line{display:flex;flex-wrap:wrap;gap:15px;margin:18px 0 0;font-size:14px}.options-line label{display:flex;gap:7px;align-items:center}.trail{display:flex;gap:9px;color:var(--muted);font-size:13px;flex-wrap:wrap;margin-bottom:15px}.trail .active{color:var(--gold)}.roster-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:20px}.mana-card{padding:0;overflow:hidden;position:relative}.mana-portrait{position:relative;height:260px;overflow:hidden;background:radial-gradient(ellipse at 50% 85%,#40877d,#163a4d)}.mana-portrait img{position:absolute;height:425px;left:50%;transform:translateX(-50%);top:18px}.mana-level{padding:18px 22px;display:flex;gap:22px;align-items:center}.mana-level b{font-size:56px;line-height:1;color:var(--gold)}.mana-level p{font-size:14px}.growth{padding:0 22px 20px;font-size:14px}.roster-list{display:grid;gap:10px}.roster-row{width:100%;text-align:left;display:grid;grid-template-columns:82px 1fr auto;align-items:center;gap:16px;padding:10px 16px;border-radius:18px}.roster-row[aria-pressed="true"],.roster-row:hover{background:#264d56;border-color:var(--gold)}.face{width:76px;height:76px;object-fit:contain;background:radial-gradient(circle,#75c2c055,#12354a);border-radius:16px}.roster-row h3{font-size:20px;margin-bottom:5px}.tag{display:inline-flex;align-items:center;gap:5px;border-radius:8px;padding:4px 8px;background:#082333;border:1px solid #446070;font-size:12px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.stat{text-align:center;padding:14px 10px;background:#081f2d;border-radius:14px}.stat strong{display:block;font-size:29px;color:var(--gold)}.stat small{display:block;color:var(--mint);font-size:12px}.selected-stats{margin-top:14px}.end-actions{display:flex;justify-content:space-between;gap:12px;margin-top:18px;flex-wrap:wrap}.end-actions .gold{padding:12px 26px}.loadout-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:20px}.slots{display:grid;grid-template-columns:1fr 1fr;gap:12px;grid-template-areas:"a b" "n n" "c d"}.slot{min-height:130px;text-align:left;position:relative;padding:17px;background:#17394a;border-radius:16px;transition:border-color .15s}.slot:hover,.slot.drag-over{border-color:var(--gold);background:#294d57}.slot[data-slot="0"]{grid-area:a}.slot[data-slot="1"]{grid-area:b}.slot[data-slot="2"]{grid-area:c}.slot[data-slot="3"]{grid-area:d}.slot[data-slot="4"]{grid-area:n;min-height:80px;text-align:center;background:#1c4051;border-style:dashed}.slot-domain{display:block;color:var(--gold);font-size:13px;margin-bottom:7px}.slot-name{display:block;font-size:19px}.slot small{display:block;margin-top:8px;color:var(--muted);font-size:12px}.skill-pool{max-height:470px;overflow:auto;padding-right:8px}.skill-item{width:100%;margin-bottom:8px;text-align:left;display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px}.skill-item .symbol{font-size:25px;color:var(--cyan)}.skill-item[aria-pressed="true"]{border-color:var(--gold);background:#2a505a}.skill-item small{display:block;color:var(--muted);font-size:12px}.unlock-row{margin:8px 0;padding:10px;background:#071e2b;border-radius:10px;font-size:14px}.help-text{font-size:13px;color:var(--muted);margin-top:14px}.enemy-layout{display:grid;grid-template-columns:1.25fr 1fr;gap:20px}.enemy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.enemy-card{padding:14px;text-align:left;display:flex;flex-direction:column;gap:10px}.enemy-card[aria-pressed="true"]{border-color:var(--gold);background:#315257}.enemy-card img{width:100%;height:145px;object-fit:contain}.enemy-card .status{font-size:12px;color:var(--mint)}.enemy-card h3{font-size:17px}.field-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}.field-card{padding:5px;overflow:hidden;text-align:left}.field-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:9px;display:block}.field-card b{display:block;padding:9px;font-size:13px}.field-card[aria-pressed="true"]{border-color:var(--gold)}.dice-box{text-align:center;max-width:850px;margin:auto}.dice-display{display:flex;justify-content:center;gap:60px;margin:38px 0;align-items:center}.die{font-size:74px;line-height:1.2;color:var(--gold);text-shadow:0 3px 20px #f6bc5155}.dice-side img{width:100px;height:100px;object-fit:contain;display:block;margin:auto}.dice-roll{animation:shake .16s linear infinite}.dice-result{min-height:64px;font-size:22px}.dice-box .gold{font-size:19px;padding:14px 35px}.battle-frame{position:relative;overflow:hidden;border-radius:24px;border:1px solid #87c9cd88;background:#134256;height:min(560px,calc(100dvh - 267px));min-height:300px;background-size:cover;background-position:center}.battle-shade{position:absolute;inset:0;background:linear-gradient(#021a2566,#00132300 45%,#04192344)}.combatants{position:absolute;inset:0;--mana-height:clamp(185px,calc((100dvh - 267px)*.62),335px);--ally-height:calc(var(--mana-height)*.39)}.actor{position:absolute;bottom:12%;object-fit:contain;filter:drop-shadow(0 10px 6px #002a3188);transform-origin:50% 100%}.mana-actor{height:var(--mana-height);left:9%;z-index:2}.ally-actor{height:var(--ally-height);left:30%;z-index:3}.enemy-actor{height:calc(var(--ally-height)*1.15);right:12%;transform:scaleX(-1);z-index:3}.ground-shadow{position:absolute;bottom:11%;height:14px;width:9%;background:#061a2966;filter:blur(5px);border-radius:50%}.shadow-mana{left:12%}.shadow-ally{left:31%}.shadow-enemy{right:13%}.idle-breathe{animation:breathe 3s ease-in-out infinite}.hud{position:absolute;z-index:5;top:16px;left:18px;width:32%;max-width:330px;padding:12px 15px;background:#092839e8;border:1px solid #70afb399;border-radius:15px;font-size:14px}.hud.enemy{left:auto;right:18px}.hud-title{display:flex;justify-content:space-between;gap:10px;align-items:center;font-weight:800}.hp-track{height:9px;background:#03131e;border-radius:8px;overflow:hidden;margin:8px 0 5px}.hp-track span{display:block;height:100%;background:linear-gradient(90deg,#56bdb1,#94efb4);transition:width .5s}.enemy .hp-track span{background:linear-gradient(90deg,#a767b2,#f2afdb)}.sp-pips{color:#86e1f5;font-size:16px;letter-spacing:2px}.turn-badge{position:absolute;z-index:5;top:22px;left:50%;transform:translateX(-50%);background:#092637e8;border:1px solid #91bfc6;border-radius:13px;text-align:center;padding:10px 15px;font-size:13px}.turn-badge strong{display:block;font-size:18px;color:var(--gold)}.fight-center{position:absolute;z-index:6;left:50%;top:46%;transform:translate(-50%,-50%);text-align:center}.fight-center button{font-size:18px;padding:17px 24px;white-space:nowrap}.arena-caption{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);text-align:center;font-size:12px;background:#071b28c4;padding:6px 12px;border-radius:12px;white-space:nowrap}.battle-status{display:flex;justify-content:space-between;align-items:center;padding:14px 4px;font-size:14px;gap:20px}.battle-status>div{flex:1}.battle-status b{color:var(--gold)}.strategy-layout{display:grid;grid-template-columns:1.03fr 1fr;gap:20px}.strategy-buttons .slot{min-height:122px}.strategy-buttons .slot[data-slot="4"]{min-height:69px}.preview-panel{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}.preview-art{height:220px;width:100%;object-fit:contain;margin-bottom:10px;filter:drop-shadow(0 8px 6px #0003)}.move-description{font-size:15px;line-height:1.6;color:var(--muted);margin:14px 0;min-height:55px}.preview-panel .gold{font-size:18px;width:100%;padding:14px;margin-top:auto}.preview-visual{position:relative;width:100%;display:grid;place-items:center;background:radial-gradient(ellipse,#31847855,#0b223900);border-radius:20px;overflow:hidden}.preview-visual::after{content:"";position:absolute;pointer-events:none;width:100px;height:100px;border-radius:50%;opacity:0}.preview-visual.fx-thunder::after{content:"ϟ";color:#ffed90;font-size:95px;opacity:1;right:15%;top:5%;text-shadow:0 0 18px #ffcc55}.preview-visual.fx-fire::after{content:"🔥";font-size:74px;opacity:1;right:15%;top:10%}.preview-visual.fx-sleep::after{content:"✦ +HP";color:#76efb5;opacity:1;right:12%;top:14%;font-weight:900;font-size:25px}.preview-visual.fx-focus::after{content:"↑ ATK";color:#ffc67a;opacity:1;right:12%;top:14%;font-weight:900;font-size:25px}.quiz-layout{display:grid;grid-template-columns:240px 1fr;gap:25px}.guide-card{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:sticky;top:10px;align-self:start}.guide-card img{height:270px;max-width:100%;object-fit:contain;margin:10px 0}.guide-card .tag{margin:10px 0}.question-card .context{font-family:Georgia,"Yu Gothic UI",serif;font-size:clamp(16px,1.6vw,21px);line-height:1.65;background:#081f2e;border:1px solid #3e6172;border-radius:16px;padding:20px;margin:15px 0;white-space:pre-line}.question-card .scene-helper{font-size:13px;color:var(--muted);margin-top:12px}.question-card .question-stem{font-size:20px;font-weight:800;margin:18px 0}.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px}.answer{text-align:left;display:flex;gap:12px;align-items:center;min-height:67px;padding:15px 17px;font-size:16px}.answer .letter{color:var(--cyan);border:1px solid #4e7385;border-radius:8px;width:31px;min-width:31px;padding:3px;text-align:center}.question-meta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.question-card .help-text{font-size:12px}.banner{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);text-align:center;z-index:9;pointer-events:none;font-size:clamp(32px,5vw,65px);font-weight:900;white-space:nowrap;text-shadow:0 5px 1px #082131,0 0 25px #00252d}.banner small{display:block;font-size:18px;margin-top:5px}.battle-narration{position:absolute;bottom:11px;left:8%;right:8%;border-radius:12px;background:#052132ed;padding:11px 18px;text-align:center;font-weight:700;z-index:9}.command-call{position:absolute;left:25%;bottom:68%;font-size:21px;background:#fdf5da;color:#14344a;border-radius:18px 18px 18px 2px;padding:9px 16px;font-weight:800;z-index:8;max-width:50%}.fly-number{position:absolute;top:53%;right:19%;font-weight:900;font-size:40px;color:#ffd480;text-shadow:0 2px #091c29;animation:floatnum 1.2s ease-out both;z-index:8}.fly-number.ally-number{right:auto;left:34%;color:#ff91a3}.hit-shake{animation:shake .14s linear 5}.mana-command{animation:command .65s ease-out}.attack-lunge{animation:lunge 1.1s ease-in-out}.enemy-lunge{animation:enemylunge .95s ease-in-out}.celebrate-hop{animation:celebrate 1.25s ease-in-out infinite}.effect-layer{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}.guard-fx{position:absolute;left:25%;bottom:9%;height:40%;aspect-ratio:1;border:4px solid #92eeff;border-radius:45%;box-shadow:0 0 30px #65e3ff,inset 0 0 25px #65e3ff;background:#73dafa22;animation:shieldpulse .7s ease-in-out 2}.beam-fx{position:absolute;left:34%;right:22%;bottom:27%;height:14px;border-radius:50%;background:linear-gradient(90deg,#80eaff,#ffdc75);box-shadow:0 0 20px #87e9f9;transform-origin:left;animation:beam .85s ease-in-out}.counter-fx{position:absolute;left:32%;right:16%;bottom:19%;height:30%;border-top:6px solid #b993f3;border-radius:50%;box-shadow:0 -8px 15px #75dfff55;animation:arc .8s ease-in-out}.spark-fx{position:absolute;right:20%;bottom:28%;font-size:100px;color:#fff3ba;animation:burst .8s ease-out}.lightning-fx{position:absolute;right:15%;top:20%;height:65%;width:140px;background:linear-gradient(#fff8ab,#ffce65);clip-path:polygon(70% 0,40% 44%,76% 44%,15% 100%,42% 55%,5% 55%);filter:drop-shadow(0 0 15px #ffd578);animation:burst .9s ease-out}.fire-fx{position:absolute;left:35%;right:19%;bottom:22%;height:45px;border-radius:70% 50%;background:linear-gradient(90deg,#ffe88b,#ffad39,#ed6561);box-shadow:0 0 25px #ff9252;transform-origin:left;animation:beam 1.2s ease-in-out}.heal-fx{position:absolute;left:29%;bottom:35%;font-size:36px;color:#85ffcb;font-weight:900;animation:floatnum 1.4s ease-out}.focus-fx{position:absolute;left:29%;bottom:8%;height:45%;width:15%;background:linear-gradient(transparent,#ffc56055);border-radius:50%;border-bottom:3px solid #ffd278;animation:shieldpulse .7s ease-in-out 2}.confetti{position:absolute;top:0;left:var(--x);background:var(--c);height:12px;width:7px;animation:confetti var(--t) ease-in both;z-index:8}.result-panel{text-align:center;max-width:1050px;margin:auto}.recruit-image{height:185px;max-width:200px;object-fit:contain}.result-reward{display:flex;justify-content:center;align-items:center;gap:25px;padding:15px;margin:20px 0;border-radius:18px;background:#173e4d}.result-reward img{height:140px;max-width:140px;object-fit:contain}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px;text-align:center}.result-stats>div{border:1px solid var(--line);padding:10px;border-radius:12px}.result-stats strong{font-size:23px;color:var(--mint)}.modal-backdrop{position:fixed;inset:0;background:#04131dda;z-index:25;display:flex;align-items:center;justify-content:center;padding:20px}.modal{position:relative;background:#102d40;border:1px solid #527887;border-radius:22px;padding:25px;max-width:1080px;width:100%;max-height:88dvh;overflow:auto;box-shadow:0 20px 80px #0009}.modal-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.modal p{margin:10px 0}.modal img{object-fit:contain}.encyclopedia-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.book-character{border:1px solid var(--line);border-radius:16px;padding:14px;background:#0b2638}.book-character img{height:105px;width:100%;object-fit:contain}.book-character button{margin-top:12px;width:100%}.history-entry{border-bottom:1px solid var(--line);padding:17px 0;font-size:14px}.history-entry .context{white-space:pre-line;color:#ddebf3;margin:8px 0}.history-entry .choice-line{display:flex;justify-content:space-between;gap:12px}.history-filters{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}.history-filters select{background:#12394b;color:var(--ink);padding:10px;border:1px solid var(--line);border-radius:10px}.study-link{color:var(--gold);font-size:13px}.code-input{display:flex;gap:12px;margin:20px 0}.code-input input{flex:1;min-width:0;border:1px solid #618d9a;background:#082232;color:var(--ink);padding:12px;border-radius:12px}.help-steps{display:grid;grid-template-columns:1fr 1fr;gap:15px}.help-steps div{border-bottom:1px solid var(--line);padding:15px 0}.help-steps b{color:var(--gold);display:block;margin-bottom:8px}.affinity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.affinity-grid div{padding:12px;background:#071f2c;border-radius:10px;font-size:14px}footer{text-align:center;font-size:11px;padding:12px;color:#87afbf}#toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%);background:#f6e5ac;color:#15334a;font-weight:700;padding:13px 22px;border-radius:12px;z-index:40;max-width:90%;text-align:center;box-shadow:0 5px 30px #0006}#toast[hidden],#modal[hidden]{display:none}.no-motion *{animation:none!important;transition:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes appear{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes breathe{50%{filter:drop-shadow(0 10px 6px #002a3188) brightness(1.05)}}@keyframes shake{25%{translate:-4px 0}75%{translate:4px 0}}@keyframes lunge{0%,100%{translate:0 0}40%,70%{translate:70px -9px}}@keyframes enemylunge{0%,100%{translate:0 0}45%,70%{translate:-80px -4px}}@keyframes command{40%{translate:4px -2px}}@keyframes floatnum{from{opacity:1;translate:0 15px}to{opacity:0;translate:0 -60px}}@keyframes celebrate{50%{translate:0 -22px}}@keyframes shieldpulse{50%{opacity:.65;scale:1.1}}@keyframes beam{0%,100%{scale:0 1;opacity:0}25%,70%{scale:1 1;opacity:1}}@keyframes arc{0%{opacity:0;translate:0 0}50%{opacity:1;translate:25px 0}100%{opacity:0;translate:50px 0}}@keyframes burst{0%{opacity:0;scale:.2}35%{opacity:1;scale:1}100%{opacity:0;scale:1.3}}@keyframes confetti{from{translate:0 -10px;rotate:0deg;opacity:1}to{translate:40px 540px;rotate:420deg;opacity:0}}
@media(max-width:1050px){.top{padding:12px 16px 7px}.toolbar{padding:5px 16px 10px}main{padding:14px 16px}.intro{padding:26px}.intro-art{height:340px}.roster-layout{grid-template-columns:.75fr 1.25fr}.mana-portrait{height:210px}.mana-portrait img{height:360px}.enemy-grid{grid-template-columns:1fr}.enemy-card{display:grid;grid-template-columns:80px 1fr;gap:7px}.enemy-card img{grid-row:1/5;height:90px}.enemy-card h3{font-size:16px}.enemy-layout{grid-template-columns:1fr 1fr}.combatants{--mana-height:clamp(190px,calc((100dvh - 267px)*.60),285px)}.quiz-layout{grid-template-columns:175px 1fr;gap:16px}.guide-card img{height:220px}.question-card .context{padding:15px;font-size:18px}.answer{padding:13px;font-size:15px}.slot{padding:13px}.slot-name{font-size:17px}.hud{font-size:12px}.turn-badge{padding:8px;font-size:12px}.turn-badge strong{font-size:16px}}
@media(max-width:720px){.top{padding:11px 12px 5px}.brand{font-size:16px}.top-progress{gap:8px;font-size:12px}.level-pill{padding:6px 9px}.toolbar{padding:5px 12px 9px;gap:5px}.toolbar .small{font-size:11px;padding:6px 7px}.toolbar .spacer{display:none}main{padding:12px}.panel{padding:16px;border-radius:18px}.pane-head{align-items:flex-start;margin-bottom:12px}.pane-head h2{font-size:21px}.pane-head p{font-size:12px}.intro,.roster-layout,.loadout-layout,.enemy-layout,.strategy-layout,.screen-grid{grid-template-columns:1fr;gap:15px}.intro{padding:20px}.intro-art{height:250px;order:-1}.intro-actions{margin-top:18px}.intro-actions button{font-size:16px;padding:13px 16px}.intro-copy>p{margin:10px 0;font-size:14px}.mana-portrait{height:160px}.mana-portrait img{height:320px;top:5px;left:28%}.mana-level{position:absolute;right:15px;top:27px;display:block;text-align:center;background:#102c3baa;border-radius:14px;padding:12px 14px}.mana-level b{font-size:45px}.growth{padding:12px 16px;font-size:12px}.roster-row{grid-template-columns:65px 1fr auto;gap:11px}.face{width:60px;height:60px}.roster-row h3{font-size:17px}.stats{gap:8px;margin:12px 0}.stat{padding:10px}.stat strong{font-size:24px}.slots{gap:9px}.slot{min-height:112px;padding:12px}.slot-domain{font-size:12px}.slot-name{font-size:16px}.slot small{font-size:11px}.skill-pool{max-height:340px}.help-text{font-size:12px}.enemy-grid{grid-template-columns:1fr}.field-options{gap:9px}.dice-display{gap:28px;margin:22px 0}.die{font-size:60px}.dice-side img{width:80px;height:80px}.battle-frame{height:auto;min-height:0;aspect-ratio:.92;max-height:none;background-position:58% center;border-radius:18px}.combatants{--mana-height:clamp(180px,55vw,260px);--ally-height:calc(var(--mana-height)*.39)}.mana-actor{left:1%;bottom:13%}.ally-actor{left:39%;bottom:13%}.enemy-actor{right:7%;bottom:38%;height:calc(var(--ally-height)*1.05)}.shadow-mana{left:9%;bottom:12%}.shadow-ally{left:41%;bottom:12%}.shadow-enemy{right:10%;bottom:37%}.hud{left:10px;top:10px;width:47%;padding:9px 10px;font-size:11px}.hud.enemy{right:10px;left:auto}.hud-title{gap:3px}.hp-track{height:7px}.sp-pips{font-size:12px;letter-spacing:1px}.turn-badge{top:101px;left:50%;padding:6px 12px;font-size:11px}.turn-badge strong{font-size:15px}.fight-center{top:46%}.fight-center button{font-size:15px;padding:13px 15px}.arena-caption{bottom:6px;font-size:9px;padding:5px 7px;max-width:90%;white-space:normal;width:max-content}.battle-status{font-size:12px;padding:10px 2px;gap:8px;align-items:flex-start}.battle-status>div{font-size:12px}.battle-status button{font-size:11px;padding:7px}.strategy-layout{display:flex;flex-direction:column}.strategy-buttons .slot{min-height:112px}.strategy-buttons .slot[data-slot="4"]{min-height:70px}.preview-panel{padding:13px}.preview-visual{display:none}.preview-panel h3{font-size:19px}.move-description{font-size:13px;min-height:0;margin:10px 0}.preview-panel .gold{font-size:16px}.strategy-mobile-preview{display:grid;grid-template-columns:100px 1fr;gap:12px;align-items:center;margin-bottom:12px}.strategy-mobile-preview img{width:100px;height:100px;object-fit:contain}.quiz-layout{grid-template-columns:1fr;gap:10px}.guide-card{display:grid;grid-template-columns:95px 1fr;gap:9px;text-align:left;position:static;padding:10px 14px}.guide-card img{width:80px;height:95px;margin:0;grid-row:1/4}.guide-card .tag{margin:0;width:max-content}.guide-card h3{font-size:17px}.guide-card p{font-size:12px}.question-card{padding:14px}.question-card .context{font-size:17px;line-height:1.55;padding:14px;margin:13px 0}.question-card .question-stem{font-size:17px;margin:15px 0}.answers{grid-template-columns:1fr;gap:9px}.answer{font-size:15px;min-height:59px}.banner{top:39%;font-size:39px}.banner small{font-size:14px}.command-call{left:28%;bottom:62%;font-size:15px;padding:7px 10px}.battle-narration{left:4%;right:4%;bottom:10px;padding:10px;font-size:12px}.beam-fx{left:43%;right:15%;bottom:38%;transform:rotate(-23deg)}.lightning-fx{right:3%;top:12%;height:50%;width:85px}.guard-fx{left:32%;bottom:10%;height:29%}.fire-fx{left:43%;right:9%;bottom:41%;transform:rotate(-22deg)}.spark-fx{right:12%;bottom:40%;font-size:75px}.counter-fx{left:38%;right:8%;bottom:36%;height:24%}.heal-fx{left:30%;bottom:33%;font-size:26px}.focus-fx{left:32%;bottom:10%;width:30%;height:32%}.fly-number{right:10%;top:45%;font-size:30px}.fly-number.ally-number{left:42%;top:69%}.result-reward{gap:12px;font-size:14px}.result-reward img{height:100px;max-width:95px}.result-stats strong{font-size:19px}.modal-backdrop{padding:10px}.modal{padding:17px;border-radius:17px;max-height:92dvh}.modal-head{margin-bottom:14px}.modal-head h2{font-size:22px}.encyclopedia-list{grid-template-columns:1fr 1fr}.help-steps{grid-template-columns:1fr}.affinity-grid{grid-template-columns:1fr 1fr}.code-input{flex-direction:column}.history-filters{gap:8px}.history-filters select{max-width:100%;font-size:13px}.history-entry .choice-line{font-size:13px}.end-actions button{flex:1}.preview-art{height:160px}.roster-layout>.panel{padding:15px}.stat small{font-size:11px}}
@media(min-width:721px){.strategy-mobile-preview{display:none}}
@media(prefers-reduced-motion:reduce){.idle-breathe{animation:none}}
/* Latest user corrections R5-REQ-02,04,05. */
.sprite-cell{background-repeat:no-repeat;background-size:200% 200%;aspect-ratio:1;display:block;flex:none}
.intro-team{position:absolute;inset:8% 5%;display:flex;align-items:flex-end;justify-content:center;gap:4%;overflow:hidden}
.intro-art .intro-mana{position:static;height:100%;width:54%;object-fit:contain;object-position:center bottom;flex:none}
.intro-art .intro-ally{position:static;height:auto;width:38%;object-fit:contain;align-self:flex-end;flex:none;transform:translateY(4%)}
.combatants{--ally-height:calc(var(--mana-height)*.56)}
.ally-actor{left:34%}.shadow-ally{left:36%}
.preview-art.sprite-cell{height:240px;width:240px;max-width:100%;margin:0 auto}
.mobile-art{width:100px;height:100px;object-fit:contain}
.preview-visual:after{display:none}
.defense-only{display:block}.defense-only .slot{width:100%;min-height:145px!important;margin-top:18px}
.defense-notice{padding:20px;border:1px solid #64bed0;border-radius:15px;background:#103a4c;color:#dbf5ff}.defense-notice p{margin-top:10px;font-size:15px}
.move-stage{position:relative;overflow:hidden;height:min(560px,calc(100dvh - 255px));min-height:350px;border:1px solid #608a99;border-radius:24px;background:radial-gradient(ellipse at 50% 60%,#195064 0%,#0b273b 45%,#061521 100%);isolation:isolate}
.move-stage-glow{position:absolute;left:50%;top:45%;width:70%;height:65%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(ellipse,var(--move-color),transparent 65%);opacity:.12}
.move-stage-top{position:absolute;top:18px;left:20px;right:20px;z-index:5;text-align:center;display:flex;flex-direction:column;gap:5px}.move-stage-top span{font-size:11px;letter-spacing:.18em;color:var(--move-color)}.move-stage-top b{font-size:clamp(20px,3vw,30px)}
.solo-ground{position:absolute;bottom:12%;left:50%;width:40%;height:7%;transform:translateX(-50%);border:1px solid var(--move-color);border-radius:50%;box-shadow:0 0 35px #5abacc44;opacity:.4;background:#64bce51a}
.solo-actor{position:absolute;left:50%;bottom:13%;height:75%;width:75%;max-width:520px;transform:translateX(-50%);display:flex;align-items:flex-end;justify-content:center;transform-origin:center bottom;z-index:2}
.solo-sprite{width:auto;height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 12px 10px #0006)}.solo-sprite.sprite-cell{width:auto;max-height:100%;height:auto;aspect-ratio:1;flex:1;max-width:min(100%,430px)}
.move-stage-caption{position:absolute;bottom:18px;left:20px;right:20px;display:flex;justify-content:space-between;align-items:center;gap:15px;z-index:6;padding:12px 16px;border:1px solid #426579;background:#061d2dec;border-radius:12px;font-size:16px}.move-stage-caption span{color:var(--muted);font-size:12px}
.action-status{padding:16px 5px;text-align:center;color:var(--muted);font-size:14px}.art-pending{padding:25px;font-size:14px;color:var(--muted)}
.solo-fx{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0}.solo-fx.effect-active{opacity:1}
.solo-barrier{position:absolute;left:47%;bottom:17%;width:27%;height:55%;border:5px solid #a8f2ff;border-radius:40% 40% 25% 25%;background:#53ccea1a;box-shadow:0 0 35px #65dff7,inset 0 0 20px #65dff7;animation:shieldpulse 1.2s ease-in-out}
.incoming-streak{position:absolute;left:71%;top:45%;width:20%;height:6px;background:linear-gradient(90deg,#fff7c7,transparent);box-shadow:0 0 25px #fff3a1;animation:incoming 1s ease-in-out}
.block-star{position:absolute;top:43%;left:68%;font-size:75px;color:#fff1b9;animation:burst 1s ease-out}
.bash-impact,.quick-impact,.rush-impact{position:absolute;right:22%;top:39%;font-size:100px;color:#ffedb0;animation:burst 1s ease-out}.quick-impact{font-size:57px;right:28%}.rush-impact{right:12%;font-size:120px}
.move-bash .step-2{animation:bashstep 1.2s ease-in-out}.move-normal .step-2{animation:quickstep 1.2s ease-in-out}.move-charge .step-2{animation:rushstep 1.2s ease-in-out}.move-counter .step-2{animation:counterstep 1.2s ease-in-out}
.counter-ring{position:absolute;left:30%;top:28%;width:43%;height:48%;border-top:6px solid #d0b7ff;border-right:4px solid #87e2ff;border-radius:50%;animation:counterarc 1.1s ease-out}.counter-return{position:absolute;right:20%;top:24%;font-size:90px;color:#d8b6ff;animation:burst 1s}
.rush-lines{position:absolute;left:12%;top:31%;width:72%;height:42%;background:repeating-linear-gradient(0deg,transparent 0 22px,#78dafa66 23px 26px,transparent 27px 52px);clip-path:polygon(0 0,85% 20%,100% 50%,85% 80%,0 100%);animation:rushlines 1s ease-in-out}
.sleep-marks{position:absolute;left:58%;top:26%;color:#bcdeff;font-size:29px;letter-spacing:.12em;animation:floatnum 1.3s ease-out}.recovery-glow{position:absolute;left:63%;bottom:34%;color:#81f7b4;font-size:32px;animation:floatnum 1.3s ease-out}
.power-rings{position:absolute;left:30%;bottom:16%;width:40%;height:54%;border:3px solid #ffcf68;border-radius:50%;box-shadow:0 0 38px #fccc60;animation:shieldpulse 1.1s ease-in-out}.power-marks{position:absolute;right:22%;top:28%;color:#ffdf83;font-size:30px;animation:floatnum 1.2s}
.solo-lightning{position:absolute;top:15%;width:14%;height:63%;background:linear-gradient(#fff7ba,#f5ce4a);clip-path:polygon(65% 0,21% 43%,62% 43%,15% 100%,48% 56%,84% 56%,61% 38%,100% 0);filter:drop-shadow(0 0 12px #fff3ad);animation:lightflash .7s ease-out 2}.bolt-one{left:29%}.bolt-two{right:19%;transform:scale(.8)}
.solo-flame{position:absolute;left:60%;top:34%;width:29%;height:27%;border-radius:30% 70% 70% 30%;background:radial-gradient(ellipse at 10% 50%,#fff5ad,#ffaf38 40%,#f2644b 62%,transparent 73%);animation:firestream 1.2s ease-out}.fire-trail{position:absolute;left:25%;bottom:17%;width:50%;height:25%;border-radius:50%;background:radial-gradient(ellipse,#ffaa5544,transparent 72%);filter:blur(8px)}
@keyframes bashstep{0%,100%{transform:translateX(-50%)}45%{transform:translateX(-36%) rotate(-5deg)}65%{transform:translateX(-34%) rotate(3deg)}}
@keyframes quickstep{0%,100%{transform:translateX(-50%)}35%{transform:translateX(-44%)}55%{transform:translateX(-43%) rotate(-3deg)}}
@keyframes rushstep{0%{transform:translateX(-58%) scale(.94)}65%{transform:translateX(-23%) scale(1.04)}100%{transform:translateX(-36%)}}
@keyframes counterstep{0%,100%{transform:translateX(-50%)}45%{transform:translateX(-54%) rotate(-7deg)}65%{transform:translateX(-40%) rotate(5deg)}}
@keyframes counterarc{from{transform:rotate(-80deg);opacity:0}50%{opacity:1}to{transform:rotate(30deg);opacity:.15}}
@keyframes rushlines{from{transform:translateX(-12%);opacity:0}50%{opacity:1}to{transform:translateX(12%);opacity:0}}
@keyframes firestream{from{transform:scaleX(.2);opacity:0}50%{transform:scaleX(1);opacity:1}to{transform:translateX(13%) scaleX(1.1);opacity:0}}
@keyframes lightflash{0%,100%{opacity:0}25%,75%{opacity:1}}
@keyframes incoming{from{transform:translateX(90%);opacity:0}65%{transform:translateX(0);opacity:1}to{opacity:0}}
@media(max-width:1050px) and (min-width:721px){.intro{grid-template-columns:1.15fr 1fr;gap:20px}.intro-art{height:310px}.intro-team{inset:12% 3%}.intro-art .intro-mana{width:53%}.intro-art .intro-ally{width:38%}.solo-actor{height:73%;max-width:460px}}
@media(max-width:720px){.intro-team{inset:8% 9%}.intro-art .intro-mana{width:50%}.intro-art .intro-ally{width:37%}.combatants{--ally-height:calc(var(--mana-height)*.53)}.mana-actor{left:1%;height:var(--mana-height);max-width:44%}.ally-actor{left:47%;bottom:13%;max-width:36%}.enemy-actor{height:calc(var(--ally-height)*1.05);bottom:43%;right:6%;max-width:38%}.shadow-ally{left:51%}.shadow-enemy{bottom:42%}.strategy-mobile-preview .sprite-cell{width:100px;height:100px}.defense-only .slot{min-height:110px!important}.defense-notice{padding:14px;font-size:15px}.defense-notice p{font-size:13px}.move-stage{height:440px;min-height:0;border-radius:18px}.solo-actor{width:92%;height:74%;bottom:15%}.move-stage-top{top:15px}.move-stage-top b{font-size:21px}.move-stage-caption{left:12px;right:12px;bottom:13px;font-size:15px}.solo-barrier{left:48%;width:36%;height:46%;bottom:20%}.block-star{left:72%;font-size:55px}.power-marks{right:7%;font-size:22px}.recovery-glow{left:72%;font-size:24px}.sleep-marks{left:62%;font-size:23px}.solo-flame{left:59%;width:40%}.bash-impact{right:6%;font-size:80px}.quick-impact{right:16%;font-size:48px}.rush-impact{right:1%;font-size:80px}.counter-return{right:4%;font-size:60px}.move-stage .solo-lightning{width:19%}.bolt-one{left:17%}.bolt-two{right:7%}}
@media(max-width:360px){.move-stage{height:395px}.top-progress{font-size:11px}.intro-team{inset:9% 5%}}
/* Keep the mobile question button below the actors, with separate room for it. */
@media(max-width:720px){.battle-frame{aspect-ratio:.76}.combatants{inset:0 0 70px}.fight-center{top:auto;bottom:32px;transform:translateX(-50%);width:94%}.fight-center button{font-size:15px;padding:12px 15px;max-width:100%}.arena-caption{bottom:6px}}
.skill-offer{background:#254550;border:1px solid var(--gold);border-radius:14px;padding:14px;margin-bottom:16px}.skill-offer p{font-size:13px;margin:8px 0}.skill-offer .gold{font-size:14px;width:100%}.roulette-incoming{display:flex;align-items:center;justify-content:center;gap:22px;margin:12px 0}.roulette-art{width:145px;height:145px;object-fit:contain}.roulette-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.roulette-choice{text-align:left;padding:14px;border:2px solid var(--line)}.roulette-choice span{display:block;font-size:17px}.roulette-choice small{display:block;color:var(--muted);font-size:12px;margin-top:8px}.roulette-choice[aria-pressed="true"]{border-color:var(--gold);background:#4b4c37;box-shadow:0 0 18px #ffce6433}.roulette-result{padding:14px;border-radius:12px;background:#072030;text-align:center;min-height:78px}.roulette-result b{color:var(--gold);font-size:19px}.roulette-result p{font-size:13px}.roulette-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:18px}@media(max-width:720px){.roulette-choices{grid-template-columns:1fr 1fr;gap:8px}.roulette-choice{padding:10px}.roulette-choice span{font-size:14px}.roulette-choice small{font-size:11px}.roulette-art{width:112px;height:112px}.roulette-actions button{flex:1;font-size:13px}}

.modal .screen-grid{align-items:start}.modal .screen-grid>.preview-panel{position:sticky;top:0}.modal .screen-grid>div:last-child{max-height:60dvh;overflow:auto;padding-right:6px}
@media(max-width:720px){.modal .screen-grid{grid-template-columns:1fr}.modal .screen-grid>.preview-panel{position:static}.modal .screen-grid .preview-visual{display:grid}.modal .screen-grid>div:last-child{max-height:31dvh}.modal .screen-grid .preview-art{width:170px;height:170px}}

.site-return{display:flex;align-items:center;gap:16px;padding:12px max(20px,calc((100vw - 1400px)/2));border-bottom:1px solid #35596a;font-size:13px}.site-return a{color:#d4ecf4;text-decoration:none}.site-return a:hover{color:#ffce64}.site-return .current{color:#ffce64;margin-left:auto}.intro-actions button{width:100%}.intro-art{min-height:320px}


/* User correction WIL-IDEA-105: bright, cute move performances. Battle rules are unchanged. */
body:has(.move-stage){--ink:#453958;--muted:#796583;background:radial-gradient(ellipse at 15% 0%,#e9faff,transparent 60%),linear-gradient(145deg,#fff7fa,#ffe8f2 62%,#f5edff);color:var(--ink)}
body:has(.move-stage) .site-return{border-color:#dfc4d7;color:#785281}
body:has(.move-stage) .site-return a{color:#5a5279}
body:has(.move-stage) .site-return .current{color:#7e638e}
body:has(.move-stage) .toolbar{border-color:#e4c8da}
body:has(.move-stage) .toolbar button{background:#ffffffde;color:#574567;border-color:#d5b9d2}
body:has(.move-stage) .level-pill{background:#fff5da;color:#795428;border-color:#e9cb82}
body:has(.move-stage) .eyebrow{color:#a5711f}
body:has(.move-stage) footer{color:#6b5778}
.move-stage{height:min(640px,calc(100dvh - 300px));min-height:280px;border:2px solid #ecc2db;color:#453958;background:radial-gradient(ellipse at 50% 45%,#fffef7 0%,#ffe9f3 46%,#edeeff 100%);box-shadow:0 14px 45px #c886b926}
.move-stage::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 12% 21%,#fff 0 5px,transparent 6px),radial-gradient(circle at 85% 24%,#fff 0 7px,transparent 8px),radial-gradient(circle at 19% 75%,#ffbada66 0 8px,transparent 9px),radial-gradient(circle at 76% 78%,#b7e5fb88 0 10px,transparent 11px)}
.move-stage-glow{opacity:.28;width:85%;height:85%;filter:blur(8px)}
.move-stage-top span{color:#8a638c;font-weight:800}.move-stage-top b{font-size:clamp(23px,3vw,34px);text-shadow:0 2px 0 #fff}
.solo-actor{height:76%;width:80%;max-width:590px}
.solo-sprite{filter:drop-shadow(0 9px 8px #b991ba55)}.move-stage{--solo-size:clamp(160px,calc((100dvh - 300px)*.68),420px)}.solo-sprite.sprite-cell{flex:none;width:var(--solo-size);height:var(--solo-size);max-width:100%;max-height:100%;aspect-ratio:1}
.solo-ground{border-color:#cf9bbb;box-shadow:0 0 38px #fff;background:#f4c7e777;opacity:.55}
.move-stage-caption{background:#fffaffeb;border-color:#ddbdd6;color:#4e3c62;box-shadow:0 5px 14px #bd95ba22;font-size:18px}
.move-stage-caption span{color:#8c6f98}
.move-guard,.move-defend{background:radial-gradient(ellipse at 50% 45%,#fffdf5,#def8ff 50%,#fce5f4)}
.move-thunder{background:radial-gradient(ellipse at 50% 45%,#fffedc,#f8e9ff 50%,#ddeeff)}
.move-fire{background:radial-gradient(ellipse at 50% 45%,#fff9d7,#ffe4e5 50%,#fce4ff)}
.move-sleep{background:radial-gradient(ellipse at 50% 45%,#fffaf2,#fbe2f3 50%,#e2f9ed)}
.move-focus{background:radial-gradient(ellipse at 50% 45%,#fffde5,#fff2d9 50%,#fbe4fa)}
.move-stage[data-action-step="2"] .move-stage-glow{animation:cuteGlow .8s ease-out 1}
.solo-fx.effect-active .solo-lightning{filter:drop-shadow(0 0 7px #e1a128);animation:lightflash 1.1s ease-out 1}
.sleep-marks{color:#906bb4}.recovery-glow{color:#23886e;text-shadow:0 2px #fff}.power-marks{color:#a76823}.bash-impact,.quick-impact,.rush-impact,.block-star{color:#eea232;text-shadow:0 0 5px #fff}
.counter-return{color:#a07acc}.solo-barrier{border-color:#5dccec;box-shadow:0 0 30px #83def7,inset 0 0 18px #bdefff;background:#b8f0ff44}
.cute-sparks{position:absolute;inset:0;z-index:4;pointer-events:none}.cute-sparks span{position:absolute;left:var(--spark-x);top:var(--spark-y);font-size:clamp(22px,4vw,46px);font-weight:900;color:var(--spark-c);text-shadow:0 2px 0 #fff;opacity:0;transform-origin:center;animation:cuteSpark 1.25s ease-out 1;animation-delay:var(--spark-delay)}
.move-sleep .cute-sparks span{color:#dc74aa}.move-fire .cute-sparks span{color:#ec9770}.move-thunder .cute-sparks span{color:#d7a124}
@keyframes cuteSpark{0%{opacity:0;transform:translateY(20px) scale(.3) rotate(-18deg)}30%{opacity:1;transform:translateY(0) scale(1.08) rotate(9deg)}80%{opacity:.75}100%{opacity:0;transform:translateY(-35px) scale(.7) rotate(25deg)}}
@keyframes cuteGlow{0%{opacity:.22;transform:translate(-50%,-50%) scale(.8)}45%{opacity:.55;transform:translate(-50%,-50%) scale(1.12)}100%{opacity:.2;transform:translate(-50%,-50%) scale(1.2)}}
@media(max-width:720px){.move-stage{height:470px;min-height:0;--solo-size:min(290px,72vw)}.solo-actor{width:95%;height:74%;bottom:16%}.move-stage-top b{font-size:23px}.move-stage-caption{font-size:15px}.cute-sparks span{font-size:29px}}
/* 2026-10-08 user request: textbook-like questions and Mana's friendly move setup. */
body.learning-ui{color-scheme:light;--ink:#193e4d;--muted:#537784;--line:#b8d8dd;--gold:#efbc50;--cyan:#2f91a4;--mint:#268b73;background:radial-gradient(ellipse at 5% 0%,#fff4f7,transparent 48%),linear-gradient(135deg,#f2fbfb,#e7f5f5 65%,#eff8ff);color:var(--ink)}
body.learning-ui .site-return{border-color:#c6dde1}body.learning-ui .site-return a{color:#315d6d}body.learning-ui .site-return .current{color:#875b17}
body.learning-ui .toolbar{border-color:#c6dde1}body.learning-ui .toolbar button,body.learning-ui .small,body.learning-ui .end-actions>button:not(.gold){background:#fff;color:#2f5363;border-color:#bdd8df}
body.learning-ui .level-pill{background:#fff3d1;color:#725019;border-color:#e7c47a}body.learning-ui .eyebrow{color:#368fa0}body.learning-ui .trail .active{color:#986c1e}body.learning-ui footer{color:#537784}
body.learning-ui .panel{background:#ffffffde;border-color:#b8d8dd;box-shadow:0 10px 26px #668f9614}body.learning-ui .tag{color:#315d6b;background:#eef8fa;border-color:#b7d5dd}
body.learning-ui .gold{background:#ffd366;color:#2f4457;border-color:#edc155;box-shadow:0 4px 0 #b79036}body.learning-ui .gold:hover:not(:disabled){background:#ffdf87}
body.learning-ui .modal{background:#f7fcfd;color:#193e4d;border-color:#9fbfc9}body.learning-ui .modal .roulette-choice{background:#fff;color:#244555}body.learning-ui .modal .roulette-choice[aria-pressed="true"]{background:#fff2c8;border-color:#d1a432}body.learning-ui .modal .roulette-result{background:#e3f2f5}body.learning-ui .modal .roulette-result b,body.learning-ui .modal .gold-text{color:#876220}
body.learning-ui .modal .roulette-incoming{background:#edf8fa;border-radius:14px}body.learning-ui .modal .book-character{background:#eaf5f7}body.learning-ui .modal .history-entry .context{color:#234857}body.learning-ui .modal .history-filters select{background:#fff;color:#2b5366}body.learning-ui .modal .study-link{color:#815d1e}body.learning-ui .modal .affinity-grid div{background:#e1eff3}body.learning-ui .modal .help-steps b{color:#8a6523}
.mana-setup-guide{display:flex;align-items:flex-end;gap:19px;margin:8px 0 23px;min-height:153px}
.mana-setup-portrait{position:relative;flex:0 0 147px;align-self:stretch;height:163px;overflow:hidden;border-radius:75px 75px 22px 22px;background:radial-gradient(circle at 50% 45%,#fffafc 0%,#ffe3ef 68%,#f7d8e7);border:1px solid #e5cbd6}
.mana-setup-portrait img{position:absolute;width:230px;height:auto;max-width:none;left:50%;top:0;transform:translateX(-50%);object-fit:contain}
.mana-setup-bubble{position:relative;flex:1;background:#fff;border:2px solid #ecc8d9;border-radius:20px;padding:18px 22px;box-shadow:0 6px 18px #cc94ad14;align-self:center}
.mana-setup-bubble::before{content:"";position:absolute;width:16px;height:16px;left:-10px;top:56%;background:#fff;border-left:2px solid #ecc8d9;border-bottom:2px solid #ecc8d9;transform:rotate(45deg)}
.speaker-name{display:block;color:#a85c86;font-size:13px;font-weight:800;margin-bottom:4px}.mana-setup-bubble p{font-size:clamp(18px,2vw,23px);font-weight:800;line-height:1.45}.mana-setup-bubble small{display:block;font-size:14px;color:#657e8c;line-height:1.55;margin-top:9px}
.setup-pane .loadout-layout{grid-template-columns:1.05fr 1fr;align-items:start;gap:22px}.setup-panel-heading{display:flex;gap:11px;align-items:center;margin-bottom:17px}.setup-panel-heading h3{font-size:19px}.step-number{display:inline-grid;place-items:center;width:30px;height:30px;flex:none;background:#e5f4f6;color:#287f92;border:1px solid #a8ced6;border-radius:50%;font-size:17px;font-weight:900}
.setup-pane .slots{gap:13px}.setup-pane .slot{min-height:162px;padding:13px;background:#f6fbfc;border:2px solid #c3dfe3;color:#224957}.setup-pane .slot:hover{background:#eef9fa;border-color:#429aab}.setup-pane .slot.drag-over{background:#fff4ce;border-color:#bc9030;box-shadow:0 0 0 3px #edcd76}.setup-pane .slot.awaiting-move{border-color:#c2a750;border-style:dashed}
.slot-guide-row{display:flex;align-items:center;gap:10px;margin-bottom:11px}.setup-pane .slot-domain{margin:0;color:#367f92;font-size:13px}.setup-pane .slot-domain small{margin-top:2px;font-size:11px;color:#6d8995;font-weight:500}.slot-move-row{display:flex;align-items:center;gap:10px}.setup-pane .slot-name{font-size:16px;line-height:1.35}.setup-pane .slot-move-row small{font-size:11px;color:#5c7e89}
.guide-face{position:relative;display:block;flex:none;width:46px;height:46px;border:1px solid #bed6df;border-radius:50%;overflow:hidden;background:#fff}.guide-face-image{width:100%;height:100%;object-fit:cover;object-position:center 15%;display:block}.guide-face.legacy-crop .guide-face-image{position:absolute;width:145%;height:auto;max-width:none;left:50%;top:1px;transform:translateX(-50%)}
.slot-art,.candidate-art{display:block;flex:none;object-fit:contain;filter:drop-shadow(0 3px 2px #4c899d22);margin:0!important}.slot-art,.slot-art.sprite-cell{width:61px;height:61px}.candidate-art,.candidate-art.sprite-cell{width:62px;height:62px}
.setup-pane .slot.fixed-slot{min-height:84px;background:#edf3f4;border:1px dashed #b5ccd3;text-align:center;display:flex;flex-direction:column;justify-content:center;gap:4px}.setup-pane .fixed-slot .slot-domain{color:#6b8794;font-size:11px}.setup-pane .fixed-slot .slot-name{font-size:15px;color:#607c87}.setup-pane .fixed-slot small{color:#788e98;margin:0;font-size:11px}
.loadout-selection{border:1px solid #dfc36d;border-radius:12px;background:#fff8db;padding:12px 14px;margin-top:16px;display:flex;flex-direction:column;gap:5px;color:#73561d;font-size:14px;min-height:72px}.loadout-selection span{font-size:13px;line-height:1.4}
.setup-pane .skill-pool{max-height:none;overflow:visible;padding:0}.setup-pane .skill-item{grid-template-columns:62px minmax(0,1fr) 54px;gap:10px;padding:10px;border:2px solid #c1dce3;background:#f8fcfd;color:#254955;margin-bottom:10px;min-height:89px;box-shadow:0 3px 10px #7595a408}.setup-pane .skill-item:hover{border-color:#559da9;background:#eef9fc}.setup-pane .skill-item[aria-pressed="true"]{border-color:#c89c3e;background:#fff8df;box-shadow:0 0 0 2px #e6c96d55}.setup-pane .skill-item strong{font-size:16px;line-height:1.35;display:block}.setup-pane .skill-item small{color:#60818d;font-size:11px;margin-top:4px}.skill-sp{text-align:right;color:#497382;font-size:13px}
.setup-pane .skill-offer{background:#fff6dc;border-color:#dfbe62;color:#6e551e}.setup-pane .skill-offer p{color:#7c6a40}.upcoming-moves{margin-top:17px;border-top:1px solid #d9e6eb;padding-top:13px}.upcoming-moves summary{font-size:14px;color:#537987;cursor:pointer;font-weight:700;min-height:35px}.upcoming-moves>div{max-height:235px;overflow:auto;padding-right:6px}.setup-pane .unlock-row{background:#edf5f8;color:#54717f;font-size:12px}.setup-pane .unlock-row small{color:#6b8290}
.textbook-question{background:#e8f7f7;border:1px solid #c2e1e4;border-radius:24px;padding:27px 33px 22px;box-shadow:0 15px 38px #55969b15}.textbook-question-head{display:flex;align-items:flex-start;justify-content:space-between;gap:25px}.textbook-question-head .eyebrow{font-size:13px;letter-spacing:.04em;margin:0 0 12px}.textbook-question-head h2{font-size:clamp(23px,2.5vw,34px);line-height:1.3;letter-spacing:.005em;color:#163f4e}.chapter-monster{width:97px;height:91px;object-fit:contain;flex:none}.question-turn{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;color:#5a7b87;margin-top:13px}.question-turn>span{background:#fff1d2;border:1px solid #dec07e;border-radius:7px;color:#7f5d25;padding:4px 7px;font-weight:800}.question-turn b{font-size:12px;color:#4b6c78}.question-turn small{font-size:11px}
.question-guide-line{display:flex;align-items:center;gap:13px;margin:21px 0 18px}.question-guide-person{display:flex;align-items:center;gap:8px;flex:none;color:#386d7c;font-weight:800;font-size:12px}.question-guide-person .guide-face{width:58px;height:58px}.question-guide-bubble{position:relative;background:#fff;border:1px solid #b4d7de;border-radius:13px;padding:9px 13px;flex:1;min-width:0}.question-guide-bubble::before{content:"";position:absolute;left:-6px;top:22px;transform:rotate(45deg);width:10px;height:10px;background:#fff;border-left:1px solid #b4d7de;border-bottom:1px solid #b4d7de}.question-guide-bubble b{font-size:11px;color:#348ba0}.question-guide-bubble p{font-size:14px;color:#3b6474;line-height:1.45;margin-top:3px}.question-source-id{font-size:10px;color:#69818a;white-space:nowrap}
.question-situation{display:grid;grid-template-columns:minmax(0,2.65fr) minmax(225px,1fr);gap:23px;align-items:start}.question-context-block{background:#fff;border:2px solid #62a2b1;border-radius:17px;padding:21px 24px;min-height:205px}.textbook-question .context{font-family:"Yu Gothic UI","Meiryo",system-ui,sans-serif;font-size:clamp(17px,1.55vw,23px);line-height:1.75;color:#254956;white-space:pre-line}.textbook-question .scene-helper{font-size:12px;color:#60828e;line-height:1.5;margin-bottom:12px}.question-scene{margin:0;background:#fff;border:4px solid #fff;border-radius:13px;overflow:hidden;box-shadow:0 5px 15px #6194a51c}.question-scene-image{display:block;width:100%;aspect-ratio:1.5;object-fit:cover}.question-monster-scene{display:block;width:100%;height:200px;object-fit:contain;background:linear-gradient(145deg,#fffdf5,#eff9fa)}
.textbook-question .question-stem{font-size:clamp(20px,2vw,28px);font-weight:900;color:#17404f;margin:22px 0 19px;line-height:1.45}.textbook-question .answers{gap:13px;grid-template-columns:1fr 1fr}.textbook-question .answer{background:#fff;color:#244c5b;border:2px solid #c5dde2;border-radius:15px;font-size:clamp(15px,1.2vw,19px);line-height:1.55;min-height:89px;align-items:flex-start;padding:16px 19px;gap:16px;font-weight:500;box-shadow:0 3px 6px #74a1ab08}.textbook-question .answer:hover{background:#f3fcfd;border-color:#398a9c;color:#244c5b}.textbook-question .answer:focus-visible{outline-color:#cf9b32}.textbook-question .answer .letter{color:#348fa0;border:0;padding:0;width:26px;min-width:26px;font-size:26px;line-height:1.4;border-radius:0;font-weight:900}.question-footer-help{font-size:14px;color:#42889a;margin-top:19px;line-height:1.5}
.field-options{grid-template-columns:repeat(3,minmax(0,1fr))}.field-card b{font-size:11px;line-height:1.45;padding:8px 5px}.field-card img{aspect-ratio:1.45}
@media(max-width:1050px){.textbook-question{padding:22px}.question-situation{grid-template-columns:minmax(0,2fr) minmax(180px,1fr);gap:17px}.textbook-question .context{font-size:19px}.question-source-id{display:none}.setup-pane .loadout-layout{grid-template-columns:1fr 1fr;gap:17px}.setup-pane .slot{padding:11px}.slot-move-row{gap:5px}.slot-art,.slot-art.sprite-cell{width:48px;height:48px}.setup-pane .slot-name{font-size:14px}.guide-face{width:36px;height:36px}.slot-guide-row{gap:7px}.setup-pane .slot-domain{font-size:11px}.setup-pane .skill-item{grid-template-columns:50px minmax(0,1fr) 43px;gap:7px}.candidate-art,.candidate-art.sprite-cell{width:50px;height:50px}.setup-pane .skill-item strong{font-size:14px}}
@media(max-width:720px){.mana-setup-guide{gap:11px;min-height:116px;margin-bottom:17px;align-items:center}.mana-setup-portrait{flex-basis:90px;height:128px;border-radius:45px 45px 17px 17px;align-self:center}.mana-setup-portrait img{width:174px;top:1px}.mana-setup-bubble{padding:12px 13px;border-radius:15px}.mana-setup-bubble p{font-size:16px}.mana-setup-bubble small{font-size:11px;line-height:1.5;margin-top:6px}.speaker-name{font-size:11px}.mana-setup-bubble::before{top:50%}.setup-pane .loadout-layout{display:flex;flex-direction:column;gap:15px}.loadout-options{order:0;width:100%}.loadout-slots{order:1;width:100%}.setup-panel-heading{margin-bottom:13px}.setup-panel-heading h3{font-size:17px}.setup-pane .skill-pool{display:grid;grid-template-columns:1fr;gap:7px}.setup-pane .skill-item{grid-template-columns:52px minmax(0,1fr) 51px;margin:0;padding:9px;min-height:74px}.candidate-art,.candidate-art.sprite-cell{width:52px;height:52px}.setup-pane .skill-item strong{font-size:15px}.setup-pane .skill-item small{font-size:11px}.skill-sp{font-size:12px}.upcoming-moves{margin-top:12px;padding-top:10px}.setup-pane .slots{gap:10px}.setup-pane .slot{min-height:153px}.setup-pane .slot-domain{font-size:11px;line-height:1.3}.slot-guide-row{align-items:flex-start;gap:7px}.slot-guide-row .guide-face{width:32px;height:32px}.setup-pane .slot-name{font-size:14px}.slot-art,.slot-art.sprite-cell{width:48px;height:48px}.slot-move-row{flex-direction:column;align-items:flex-start;gap:4px}.setup-pane .slot-move-row small{font-size:10px}.setup-pane .fixed-slot{min-height:77px}.setup-pane .fixed-slot .slot-name{font-size:14px}.setup-pane .end-actions{position:sticky;bottom:8px;z-index:8;background:#e6f4f4e6;padding:9px 0;border-radius:10px;backdrop-filter:blur(8px)}.setup-pane .end-actions button{font-size:12px;padding:11px 9px}.setup-pane .loadout-selection{font-size:13px;min-height:71px}.setup-pane .loadout-selection span{font-size:12px}
.textbook-question{padding:17px 15px;border-radius:18px}.textbook-question-head{gap:12px}.textbook-question-head .eyebrow{font-size:10px;margin-bottom:8px}.textbook-question-head h2{font-size:23px}.chapter-monster{width:65px;height:68px}.question-turn{gap:6px;margin-top:11px;font-size:10px}.question-turn b{font-size:11px}.question-turn small{font-size:10px}.question-guide-line{gap:9px;margin:15px 0}.question-guide-person{flex-direction:column;gap:3px;font-size:10px;max-width:65px}.question-guide-person .guide-face{width:47px;height:47px}.question-guide-bubble{padding:8px 11px}.question-guide-bubble p{font-size:12px;line-height:1.5}.question-guide-bubble b{font-size:10px}.question-situation{display:flex;flex-direction:column;gap:12px}.question-context-block{padding:15px 16px;min-height:0;width:100%;border-radius:13px}.textbook-question .context{font-size:17px;line-height:1.65}.question-scene{width:100%;max-width:360px;align-self:center}.question-scene-image{aspect-ratio:1.85}.question-monster-scene{height:140px}.textbook-question .question-stem{font-size:20px;margin:18px 0 14px}.textbook-question .answers{grid-template-columns:1fr;gap:10px}.textbook-question .answer{font-size:15px;line-height:1.6;min-height:67px;padding:12px 14px;gap:12px;border-radius:12px}.textbook-question .answer .letter{font-size:24px;width:22px;min-width:22px}.question-footer-help{font-size:12px;margin-top:15px}.field-options{grid-template-columns:1fr;gap:10px}.field-card{display:grid;grid-template-columns:40% 1fr;align-items:center;gap:9px}.field-card img{aspect-ratio:1.65}.field-card b{font-size:13px}}


.mana-setup-bubble .guide-directions-stacked{display:none}
@media(max-width:720px){.mana-setup-bubble .guide-directions-wide{display:none}.mana-setup-bubble .guide-directions-stacked{display:inline}}

/* R7: optional, separate first-visit guide. User HP2 / HP3. */

.r7-learning-label{display:inline-block;max-width:100%;background:#ffce64;color:#0e3047;font-size:clamp(12px,1.1vw,15px);font-weight:800;line-height:1.4;text-align:center;padding:18px 28px;clip-path:polygon(6% 10%,14% 14%,16% 0,25% 10%,38% 2%,50% 11%,64% 1%,76% 12%,87% 5%,88% 20%,98% 24%,92% 41%,100% 52%,92% 65%,96% 85%,86% 83%,85% 99%,71% 92%,58% 100%,46% 91%,33% 98%,24% 87%,11% 93%,13% 76%,0 72%,7% 55%,0 38%,8% 30%);letter-spacing:.05em}
.intro-copy>.r7-learning-label{margin:0 0 8px}.intro-copy>h1{font-size:clamp(27px,3.6vw,49px);line-height:1.3}
.view-guide .top,.view-guide .toolbar{display:none}.view-guide main{max-width:1380px;padding:24px 24px 16px}.r7-guide{background:linear-gradient(135deg,#e8f8f8,#fffbf5);border:1px solid #b4dfe3;color:#16394b;padding:clamp(18px,3vw,38px);border-radius:24px;box-shadow:0 12px 35px #00182525}
.r7-guide-heading{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:22px}.r7-guide-heading h1{color:#16394b;font-size:clamp(28px,3.4vw,45px);line-height:1.3;margin:7px 0 8px}.r7-guide-intro{max-width:750px;color:#426977;font-size:16px;line-height:1.65}.r7-guide-skip{flex:none;align-self:center;font-size:17px;padding:17px 22px;min-height:56px;border-color:#e2b546;box-shadow:0 5px 0 #d2a43b}
.r7-guide-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(230px,1fr);gap:25px;align-items:start}.r7-guide-player{position:relative;aspect-ratio:16/9;background:#132f40;border-radius:16px;overflow:hidden;width:100%}.r7-guide-player iframe{display:block;width:100%;height:100%;position:absolute;inset:0;border:0}.r7-guide-play{display:block;position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;padding:0;background:#173a4b;color:#fff;overflow:hidden;cursor:pointer;transition:none}.r7-guide-play img{display:block;width:100%;height:100%;object-fit:cover}.r7-guide-play>span{position:absolute;inset:auto 0 0;display:flex;align-items:center;gap:13px;text-align:left;padding:18px;background:linear-gradient(transparent,#071e2df5);min-height:37%}.r7-play-disc{flex:none;display:grid;place-items:center;width:55px;height:55px;background:#ffce64;color:#16394b;border-radius:50%;font-size:25px;padding-left:4px}.r7-guide-play strong{font-size:clamp(14px,1.6vw,21px);line-height:1.35}.r7-guide-play small{display:block;font-size:12px;position:absolute;bottom:9px;left:87px;color:#fff0c4}.r7-guide-caption{font-size:13px;line-height:1.6;color:#426977;margin:12px 0 5px}.r7-guide-youtube{font-size:13px;color:#145c76;text-decoration:underline;text-underline-offset:3px}
.r7-guide-summary{background:#fff;border:1px solid #c4dfe1;border-radius:16px;padding:22px}.r7-guide-summary h2{font-size:20px;color:#16394b;line-height:1.4;margin:0 0 12px}.r7-guide-summary ol{padding-left:22px;margin:0}.r7-guide-summary li{padding:6px 0 10px}.r7-guide-summary li::marker{font-weight:800;color:#2496a5}.r7-guide-summary b{font-size:15px}.r7-guide-summary p{font-size:13px;line-height:1.6;margin:5px 0;color:#53727c}.r7-guide-summary .r7-guide-free{background:#fff3ce;border-radius:10px;color:#305466;font-size:15px;font-weight:750;padding:12px;margin:10px 0}.r7-guide-summary button{background:#edf8f8;color:#205567;border-color:#a9cfd4;min-height:44px;width:100%}.r7-guide-summary .r7-guide-reminder{font-size:12px;margin:11px 0 0}
.r7-guide button:focus-visible,.r7-guide a:focus-visible{outline:3px solid #04839b;outline-offset:4px}.r7-guide-player:focus-within{outline:3px solid #04839b;outline-offset:3px}
@media(max-width:1000px){.r7-guide-heading{gap:18px;align-items:flex-start}.r7-guide-skip{font-size:14px;padding:14px 17px;min-height:50px}.r7-guide-layout{grid-template-columns:minmax(0,1.65fr) minmax(220px,1fr);gap:18px}.r7-guide-summary{padding:17px}.r7-guide-summary h2{font-size:18px}.r7-guide-intro{font-size:14px}}
@media(max-width:720px){.view-guide main{padding:12px}.r7-guide{padding:16px;border-radius:18px}.r7-guide-heading{display:block;margin-bottom:17px}.r7-guide-heading h1{font-size:29px}.r7-guide-heading .r7-learning-label{font-size:11px;padding:15px 22px;margin:0}.r7-guide-skip{width:100%;font-size:15px;margin-top:14px;min-height:50px}.r7-guide-layout{grid-template-columns:1fr;gap:18px}.r7-guide-player{border-radius:12px}.r7-guide-play>span{padding:11px;min-height:42%;gap:9px}.r7-play-disc{width:39px;height:39px;font-size:20px}.r7-guide-play strong{font-size:13px;line-height:1.3;padding-bottom:9px}.r7-guide-play small{font-size:9px;left:60px;bottom:6px}.r7-guide-summary{padding:17px}.r7-guide-summary li{padding:5px 0 8px}.r7-guide-summary .r7-guide-reminder{margin-top:9px}.intro-copy>.r7-learning-label{font-size:11px;padding:16px 22px;margin:0 0 5px}.intro-copy>h1{font-size:27px}.site-return{gap:10px}.site-return .current{font-size:11px}.view-guide .site-return .current{display:none}}
@media(prefers-reduced-motion:reduce){.r7-guide *{animation:none;transition:none}}
