:root{font-family:'Segoe UI',Arial,sans-serif;color:#284943;background:#eef6ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at top right,#dcf1f5,transparent 60%),#f5f7ed}button,select,input{font:inherit}button{cursor:pointer;border:1px solid #c2d7ce;background:#fffdf8;color:#294d43;border-radius:12px;padding:11px 16px;font-weight:700;touch-action:manipulation}button:hover{background:#e7f3ec}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b77626;outline-offset:3px}[hidden]{display:none!important}.topbar{display:flex;justify-content:space-between;align-items:center;padding:13px 4vw;border-bottom:1px solid #ceded3;background:#fffdf5b0}.topbar>div{display:flex;gap:10px}.brand{font-size:13px;font-weight:900;letter-spacing:2px;text-decoration:none;color:#356354}.brand span{color:#6e8b7f;font-weight:500}#setup{max-width:1400px;margin:auto;padding:25px 4vw 40px}.hero{display:grid;grid-template-columns:1fr 1.15fr;gap:30px;align-items:center}.hero-copy{padding:10px 0}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px;color:#658276}h1{font-family:Georgia,serif;font-size:clamp(52px,6vw,85px);line-height:1;letter-spacing:-4px;margin:18px 0;color:#2a665a}h1 span{color:#b87531}p{line-height:1.6;color:#5b7368}.hero p{font-size:16px;max-width:510px}.tags{display:flex;flex-wrap:wrap;gap:10px;font-size:12px;font-weight:700;color:#447361}.tags span{background:#e1eee0;border-radius:20px;padding:8px 12px}.hero-art{position:relative;margin:0;align-self:stretch;min-height:310px}.hero-art img{width:100%;height:100%;object-fit:cover;border-radius:28px;box-shadow:0 12px 30px #658a7420}.hero-art figcaption{position:absolute;bottom:15px;left:18px;background:#fff9eae6;padding:8px 15px;border-radius:20px;font-size:13px;font-weight:700;color:#527163}.story-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:24px 0;padding:18px 25px;background:#e6efe1;border-radius:18px}.story-steps b{font-size:14px;color:#3f6955}.story-steps p{font-size:13px;margin:5px 0 0}.settings{background:#fffef9;border:1px solid #dfe6d6;border-radius:24px;padding:25px 30px;box-shadow:0 10px 25px #42624808}.form-heading{display:flex;align-items:center;gap:12px;margin-bottom:18px}.form-heading h2{font-size:18px;margin:0}.step{display:grid;place-items:center;border-radius:50%;background:#e4eee0;color:#436b56;width:28px;height:28px;font-size:14px;font-weight:800}.fields{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:700}select,input{width:100%;padding:11px;border:1px solid #cdd9c9;border-radius:10px;background:white;color:#294d43;min-height:44px}fieldset{border:0;padding:15px 0;margin:0}legend{font-weight:700;font-size:14px}#tables{display:flex;gap:8px;flex-wrap:wrap}#tables label{display:block}#tables input{position:absolute;opacity:0;width:1px;height:1px;min-height:0}#tables span{display:grid;place-items:center;width:48px;height:44px;border:1px solid #b4c8c1;border-radius:10px;cursor:pointer}#tables input:checked+span{background:#397763;color:white}#tables input:focus-visible+span{outline:3px solid #b77314}.note{font-size:13px;color:#647a67;margin:14px 0 20px}.team-names{display:flex;gap:14px}.team-names label{flex:1;border-top:4px solid var(--team);padding-top:10px}.launch{display:flex;gap:30px;align-items:center;margin-top:18px}.launch p{color:#617565;font-size:13px;flex:1}.primary{background:#347764;color:white;border:0;padding:17px 25px;font-size:18px;box-shadow:0 4px 0 #215a49;white-space:nowrap}.primary:hover{background:#438c77}.primary span{margin-left:20px}
#game{padding:12px 2vw 20px;max-width:2000px;margin:auto}.gamebar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}.gamebar h2{margin:5px 0;font-size:22px}.gamebar>div:last-child{display:flex;gap:10px}.clock{font-size:36px;font-weight:900;font-variant-numeric:tabular-nums;color:#a5612a;background:#fff7df;border:1px solid #ead5a2;border-radius:16px;padding:4px 18px}.clock.urgent{color:#b33f32;animation:pulse .8s infinite alternate}.battle{display:grid;grid-template-columns:minmax(180px,.9fr) minmax(240px,1.2fr) minmax(190px,1fr);background:#fffef9;border:1px solid #d9e3cd;border-radius:22px;overflow:hidden;min-height:185px;box-shadow:0 6px 20px #3153390a}.battle-art{position:relative;overflow:hidden;min-height:185px}.battle-art img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 43%;transition:filter 1s}.magic-shield{position:absolute;left:24%;top:8%;width:51%;height:86%;border:4px solid #b9fdffc0;border-radius:50%;background:linear-gradient(120deg,#c6faff30,#ffffff20);box-shadow:0 0 12px #e5ffff,inset 0 0 15px #c5ffff;transition:opacity .4s}.battle[data-stage=cracked] .magic-shield{border-style:dashed;opacity:.75}.battle[data-stage=weak] .magic-shield{border-style:dotted;opacity:.4}.battle[data-stage=won] .magic-shield{opacity:0}.battle[data-stage=won] img{filter:brightness(1.18) saturate(1.15)}.spell-flash{position:absolute;inset:0;pointer-events:none}.hit .spell-flash{animation:flash .6s ease-out}.hit .battle-art img{animation:shake .35s}.boss-info{padding:16px 22px}.boss-info h2{margin:4px 0;font-family:Georgia,serif;font-size:28px;color:#34695a}.boss-info h2 span{font-family:'Segoe UI',sans-serif;font-size:12px;font-weight:600;color:#6f826b;white-space:nowrap}.boss-info p{font-size:13px;margin:8px 0;line-height:1.4}.shield-label{display:flex;justify-content:space-between;font-size:12px;margin:12px 0 6px}.boss-shield-bar{height:13px;background:#e7edde;border-radius:10px;overflow:hidden}#bossShield{height:100%;width:100%;background:linear-gradient(90deg,#5c9e99,#99cbbb);border-radius:10px;transition:width .45s}.boss-info .boss-rule{font-size:11px;color:#72816b}.race{align-self:center;padding:14px 20px;border-left:1px solid #e5e9d9}.lane{display:grid;grid-template-columns:1fr auto;gap:5px 8px;margin:9px 0}.lane-name{font-size:12px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lane-score{font-size:11px;color:#72806c;grid-column:2;grid-row:1}.track{grid-column:1 / -1;background:#eef0e6;height:7px;border-radius:8px;overflow:hidden}.fill{width:100%;height:100%;background:var(--team);border-radius:8px;transition:width .4s}.banner{text-align:center;padding:9px 14px;margin:10px 0;border-radius:12px;background:#e3edde;color:#527145;font-size:13px;font-weight:600}.storm .banner{background:#ffe3ad;color:#85521c}.storm .battle{border-color:#ddac65;box-shadow:0 0 20px #e9b04e35}.teams{display:grid;grid-template-columns:repeat(var(--count),minmax(0,1fr));gap:14px}.team{background:#fffefa;color:#284943;border:1px solid #dae2d3;border-top:6px solid var(--team);border-radius:20px;padding:14px;text-align:center;min-width:0;box-shadow:0 5px 18px #3c583808}.team-header{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:16px;font-weight:800}.team-header>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.team-header>span:first-child:before{content:'';display:inline-block;background:var(--team);width:15px;height:19px;clip-path:polygon(0 0,100% 0,100% 65%,50% 100%,0 65%);margin-right:8px;vertical-align:middle}.points{background:#f0f3e8;border-radius:20px;padding:6px 10px;white-space:nowrap;font-size:12px}.question{height:145px;display:flex;align-items:center;justify-content:center;font-size:clamp(30px,3.3vw,54px);font-weight:800;letter-spacing:-1px}.split-diagram{width:220px;height:140px;max-width:100%;overflow:visible}.split-diagram text{font-family:'Segoe UI',Arial,sans-serif;font-size:38px;font-weight:800;text-anchor:middle;fill:#284943;letter-spacing:0}.split-diagram path{stroke:#567969;stroke-width:3;stroke-linecap:round;fill:none}.split-diagram .missing{fill:#b57932}.answers{display:grid;grid-template-columns:1fr 1fr;gap:10px}.answers button{background:#edf3e9;color:#284943;border:2px solid #dce6d4;font-size:34px;min-height:68px;padding:8px}.answers button:hover{background:#e2edde}.answers button:disabled{opacity:.5;cursor:default}.answers button.correct{background:#bee9bb;border-color:#62a260;opacity:1}.answers button.wrong{background:#ffe1d3;border-color:#d2967d}.feedback{min-height:44px;padding-top:11px;font-size:13px;font-weight:600;color:#658365}.overlay{position:fixed;inset:0;background:#dfede8e8;z-index:10;display:grid;place-items:center;padding:20px;backdrop-filter:blur(8px)}.modal{text-align:center;background:#fffef6;color:#284943;width:min(620px,95vw);padding:24px 32px;border:1px solid #d6e2cd;border-radius:26px;max-height:95vh;overflow:auto;box-shadow:0 20px 80px #4b69562a}.modal-icon{display:block;width:190px;height:115px;border-radius:20px;margin:auto;background:url('vargos.png') center 40%/cover;font-size:0}.modal h2{font-family:Georgia,serif;font-size:34px;margin:14px 0}.modal p{color:#617561}.modal button{margin:8px}.result-row{display:flex;justify-content:space-between;background:#eef2e6;border-radius:10px;margin:7px 0;padding:10px;font-weight:700}@keyframes pulse{to{opacity:.5}}@keyframes flash{0%{background:#fff7b5d9}100%{background:transparent}}@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@media(min-width:1500px) and (min-height:850px){.battle{min-height:240px}.question{height:185px}.split-diagram{height:165px;width:250px}.answers button{min-height:95px;font-size:42px}.feedback{font-size:16px}.team-header{font-size:20px}.battle-art{min-height:240px}}
@media(max-width:1050px){.fields{grid-template-columns:repeat(2,1fr)}.hero{gap:22px}.hero p{font-size:14px}.battle{grid-template-columns:190px 1fr 180px}.boss-info{padding:12px 16px}.race{padding:12px}.teams{gap:9px}.team{padding:10px}.team-header{font-size:13px}.points{font-size:11px;padding:5px 7px}.question{font-size:32px}.feedback{font-size:12px}.gamebar h2{font-size:19px}}
@media(max-width:760px){.hero{grid-template-columns:1fr}.hero-art{min-height:0;height:260px}.hero-art img{object-position:center 45%}.story-steps{gap:14px;padding:15px}.story-steps b{font-size:12px}.story-steps p{font-size:12px}.battle{grid-template-columns:165px 1fr}.race{grid-column:1 / -1;display:flex;gap:15px;padding:6px 16px;border-left:0;border-top:1px solid #e5e9d9}.lane{flex:1;min-width:0}.battle-art{min-height:185px}.gamebar .eyebrow{font-size:9px;letter-spacing:.8px}.gamebar h2{font-size:16px}.gamebar button{font-size:12px;padding:9px}.clock{font-size:28px;padding:5px 10px}.teams{grid-template-columns:repeat(var(--count),minmax(0,1fr))}.team-names{flex-wrap:wrap}.team-names label{flex-basis:40%}.launch{flex-direction:column;gap:8px;align-items:stretch}.settings{padding:20px}.topbar{padding:12px}.brand span{display:none}.topbar button{font-size:12px;padding:9px}.banner{font-size:12px}.question{height:130px}.split-diagram{height:125px}.answers button{min-height:60px}.feedback{min-height:40px}}
@media(max-height:760px) and (min-width:1000px){.topbar{padding:8px 3vw}.battle,.battle-art{min-height:150px}.boss-info{padding:10px 18px}.boss-info h2{font-size:23px}.boss-info p{margin:5px 0}.shield-label{margin-top:7px}.question{height:120px}.split-diagram{height:115px}.answers button{min-height:58px;font-size:30px}.feedback{min-height:34px;font-size:12px}.gamebar{margin-bottom:8px}.banner{margin:7px 0}.gamebar h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* A visible, shared battlefield: knights cast spells and collect crystals. */
.battle.arena{display:block;position:relative;height:300px;min-height:0;background:#d9f0f3;border:2px solid #bfdcd0;isolation:isolate;overflow:hidden}.arena-sky{position:absolute;inset:0;background:radial-gradient(ellipse at 16% 22%,#ffffffba 0 5%,transparent 6%),radial-gradient(ellipse at 10% 25%,#ffffffba 0 6%,transparent 7%),linear-gradient(#c9eafa,#edf8e8);z-index:-2}.arena-ground{position:absolute;left:-5%;right:-5%;height:45%;bottom:-5%;background:linear-gradient(#b9d994,#d9e9ab);border-radius:50% 45% 0 0;z-index:-1;box-shadow:0 -10px 0 #d5e9b580}.arena-caption{position:absolute;top:14px;left:22px;max-width:64%;display:flex;flex-direction:column;gap:5px}.arena-caption strong{font-size:17px;color:#305f53}.arena-caption span{font-size:12px;color:#607c61}.knights{position:absolute;left:4%;width:62%;top:78px;bottom:12px;display:grid;grid-template-columns:repeat(var(--count),minmax(0,1fr));align-items:end;gap:8px}.knight{text-align:center;min-width:0;position:relative}.knight-name{font-size:12px;font-weight:800;color:#365549;background:#fffff1dc;border-bottom:3px solid var(--team);border-radius:8px;padding:4px 7px;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.knight-figure{position:relative;height:136px;margin-top:0}.knight-figure:after{content:'';position:absolute;left:21%;right:15%;bottom:1px;height:9px;border-radius:50%;background:#59734826;z-index:-1}.knight-figure img{height:100%;width:100%;object-fit:contain;transform-origin:50% 90%;animation:knight-breathe 3s ease-in-out infinite}.cast-word{position:absolute;left:0;right:0;top:20px;font-size:16px;font-weight:900;color:#2c7050;text-shadow:0 2px white,2px 0 white,-2px 0 white;opacity:0;white-space:nowrap;z-index:3}.casting .cast-word{animation:gain-word 1.15s both}.casting .knight-figure img{animation:knight-cast .75s ease-in-out}.crystal-count{font-weight:800;font-size:12px;color:#365c46;margin:3px 0 5px}.crystal-treasury{display:flex;justify-content:center;gap:3px;flex-wrap:wrap;max-width:160px;min-height:16px;margin:auto}.tiny-crystal{display:block;width:9px;height:13px;clip-path:polygon(50% 0,100% 30%,85% 80%,50% 100%,15% 80%,0 30%);background:#95ac9570}.tiny-crystal.earned{background:linear-gradient(115deg,#e4ffff 20%,#5edce1 22% 49%,#279eaf 50% 75%,#80ffff 76%);filter:drop-shadow(0 0 3px white);animation:gem-reveal .5s ease-out}.dragon-target{position:absolute;right:3%;top:20px;width:29%;bottom:18px;display:flex;flex-direction:column;align-items:center;justify-content:center}.dragon-portrait{position:relative;width:100%;height:215px}.dragon-portrait>img{height:100%;width:100%;object-fit:contain;object-position:center;border-radius:0;box-shadow:none;animation:dragon-breathe 3.6s ease-in-out infinite}.dragon-name{font-family:Georgia,serif;font-size:20px;font-weight:bold;background:#fffcdfed;border-radius:14px;padding:4px 16px;margin-top:0;z-index:2}.dragon-name span{font:700 12px 'Segoe UI',sans-serif;margin-left:12px;color:#658879}.dragon-target .boss-shield-bar{width:75%;height:7px;margin-top:5px}.shield-pieces{position:absolute;inset:0;pointer-events:none}.shield-piece{position:absolute;left:50%;top:48%;width:51%;height:53%;transform-origin:0 0;transform:rotate(calc(var(--piece) * 45deg));clip-path:polygon(0 0,100% 0,72% 72%);background:linear-gradient(130deg,#b8faff20 10%,#7de7ed60 65%,#c4ffffdc 68%,#77d7da50 72%);transition:opacity .6s,transform .6s}.shield-piece.broken{opacity:0;transform:rotate(calc(var(--piece) * 45deg)) scale(1.6)}.spell-effects{position:absolute;inset:0;pointer-events:none;z-index:5;overflow:hidden}.flying-spell{position:absolute;width:23px;height:23px;background:white;border:3px solid var(--team);border-radius:50%;box-shadow:0 0 8px 4px white,0 0 18px 9px var(--team);animation:cast-flight .6s ease-in both}.returning-crystal{position:absolute;width:24px;height:35px;clip-path:polygon(50% 0,100% 28%,85% 78%,50% 100%,15% 78%,0 28%);background:linear-gradient(115deg,#fff 20%,#81f2f0 22% 49%,#26acc1 50% 75%,#b4ffff 76%);animation:crystal-return .6s .6s ease-out both}.spell-impact{position:absolute;left:82%;top:38%;width:80px;height:80px;border:8px solid white;border-radius:50%;box-shadow:0 0 20px var(--team),inset 0 0 20px var(--team);animation:impact-ring .5s .5s ease-out both}.arena-result{position:absolute;z-index:8;top:18px;left:5%;right:5%;text-align:center;background:#fff9dbeF;border:2px solid #e0c468;color:#6d6522;padding:14px;border-radius:18px;font-size:23px;font-weight:900;box-shadow:0 8px 24px #71893e2a}.victory .dragon-portrait{animation:dragon-yield 1.7s forwards}.escaped .dragon-target{animation:dragon-escape 2s forwards}.victory .knight-figure img{animation:knight-celebrate .6s infinite alternate}.celebration-crystal{position:absolute;left:var(--from);top:-40px;width:20px;height:32px;background:linear-gradient(110deg,#fff,#67ddd9 40%,#388fa9 45%,#b3fffc);clip-path:polygon(50% 0,100% 30%,80% 80%,50% 100%,20% 80%,0 30%);animation:crystal-rain 1.7s var(--delay) ease-in both}.storm .arena-sky{background:linear-gradient(#dedbff,#f5e9cf)}.storm .dragon-portrait>img{animation:storm-dragon .45s infinite alternate}.storm .shield-piece:not(.broken){opacity:.35}.storm .arena{border-color:#d1a351}.arena.victory .shield-piece{opacity:0;transform:rotate(calc(var(--piece) * 45deg)) scale(1.8)}
@keyframes knight-breathe{50%{transform:translateY(-3px)}}@keyframes dragon-breathe{50%{transform:translateY(-4px)}}@keyframes knight-cast{20%{transform:rotate(-9deg) translateX(-5px)}55%{transform:rotate(10deg) translateX(8px)}100%{transform:none}}@keyframes gain-word{0%{opacity:0;transform:translateY(15px) scale(.6)}30%,70%{opacity:1;transform:translateY(-10px) scale(1.1)}100%{opacity:0;transform:translateY(-35px)}}@keyframes cast-flight{0%{left:var(--from);top:65%;transform:scale(.4)}90%{opacity:1}100%{left:82%;top:38%;transform:scale(1.3);opacity:0}}@keyframes crystal-return{0%{left:82%;top:38%;opacity:0;transform:scale(.5)}15%{opacity:1}100%{left:var(--from);top:85%;opacity:1;transform:scale(.7) rotate(180deg)}}@keyframes impact-ring{0%{opacity:0;transform:translate(-50%,-50%) scale(.1)}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1.7)}}@keyframes gem-reveal{0%{transform:scale(2.3)}100%{transform:scale(1)}}@keyframes dragon-yield{50%{transform:rotate(-8deg) scale(.85)}100%{transform:translateY(18px) rotate(-4deg) scale(.8);filter:saturate(.7)}}@keyframes dragon-escape{to{transform:translate(200px,-350px) rotate(-15deg);opacity:0}}@keyframes knight-celebrate{to{transform:translateY(-12px) rotate(5deg)}}@keyframes crystal-rain{to{top:110%;transform:rotate(250deg)}}@keyframes storm-dragon{to{transform:rotate(3deg) translateY(-5px)}}
@media(min-width:1400px) and (min-height:850px){.battle.arena{height:340px}.knight-figure{height:165px}.dragon-portrait{height:245px}.knight-name,.crystal-count{font-size:14px}.tiny-crystal{width:11px;height:16px}.arena-caption strong{font-size:21px}}
@media(max-width:900px){.battle.arena{height:285px}.arena-caption{top:12px;left:14px;max-width:67%}.arena-caption strong{font-size:14px}.arena-caption span{font-size:11px}.knights{left:2%;width:65%;gap:4px}.knight-name{font-size:10px;padding:4px}.knight-figure{height:120px}.crystal-count{font-size:10px}.tiny-crystal{width:7px;height:10px}.crystal-treasury{gap:2px;max-width:90px}.dragon-target{right:2%;width:29%}.dragon-portrait{height:185px}.dragon-name{font-size:18px;padding:4px 9px}.cast-word{font-size:12px}.arena-result{font-size:18px}.question{height:120px}.split-diagram{height:115px}}
@media(max-height:760px) and (min-width:1000px){.battle.arena{height:245px}.knights{top:60px;bottom:8px}.knight-figure{height:110px}.dragon-portrait{height:175px}.arena-caption{top:10px}.arena-caption strong{font-size:15px}.arena-caption span{font-size:11px}.question{height:105px}.split-diagram{height:100px}.feedback{min-height:30px}.answers button{min-height:55px}}
@media(prefers-reduced-motion:reduce){.flying-spell,.returning-crystal,.spell-impact,.celebration-crystal{display:none}.casting .cast-word{opacity:1}.knight-figure img,.dragon-portrait>img{animation:none!important}.shield-piece{transition:none}}
/* Individual dragons keep all teams playing for their own finishing place. */
.duel{position:relative}.personal-dragon{display:none}.place-label{position:absolute;left:8%;right:8%;top:45%;z-index:7;border-radius:14px;background:#ffedaa;color:#745416;border:2px solid #d4b24b;padding:8px;font-size:22px;font-weight:900;box-shadow:0 4px 14px #51693830}.arena[data-mode=race] .dragon-target{display:none}.arena[data-mode=race] .knights{left:2%;width:96%;gap:12px;top:65px;bottom:12px}.arena[data-mode=race] .arena-caption{max-width:95%}.arena[data-mode=race] .knight{border:1px solid #ffffffaa;border-bottom:4px solid var(--team);border-radius:18px;padding:8px 8px 10px;background:linear-gradient(#ffffff66,#eff9deaa)}.arena[data-mode=race] .duel{display:flex;align-items:center;height:135px;gap:0}.arena[data-mode=race] .knight-figure{width:50%;height:130px;flex-shrink:0}.arena[data-mode=race] .personal-dragon{display:block;width:50%;height:120px;position:relative}.personal-dragon>img{width:100%;height:100%;object-fit:contain;object-position:center;box-sizing:border-box;padding-bottom:22px;border-radius:0;animation:dragon-breathe 3s infinite ease-in-out}.personal-shield{position:absolute;inset:0}.dragon-health{position:absolute;left:0;right:0;bottom:-4px;text-align:center;background:#fffbe5da;border-radius:14px;padding:3px;font-size:11px;font-weight:700;color:#627647}.arena[data-mode=race] .crystal-treasury{max-width:100%;min-height:13px}.arena[data-mode=race] .cast-word{left:-5%;right:-70%;z-index:8}.defeated .personal-dragon{animation:dragon-yield 1.5s .6s forwards}.defeated .personal-shield{opacity:0;transition:opacity .8s .5s}.defeated .knight-figure img{animation:knight-celebrate .5s 1s 4 alternate}.defeated .dragon-health{display:none}.team-finished{background:linear-gradient(#fffcdd,#f3f8e5);border-color:var(--team)}.team-finished .answers{display:none}.team-finished .question{height:230px}.finish-badge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0}.finish-badge strong{display:grid;place-items:center;width:90px;height:110px;background:linear-gradient(120deg,#ffde7c,#fff2b6,#e3bd4d);clip-path:polygon(0 0,100% 0,100% 68%,50% 100%,0 68%);color:#7e591a;font-size:60px}.finish-badge span{font-size:18px;letter-spacing:1px;margin-top:8px}.escaped .knight:not(.defeated) .personal-dragon{animation:dragon-escape 2s forwards}.escaped .knight.defeated .personal-dragon{animation:none;transform:scale(.8);opacity:.5}.spell-impact{left:var(--to)}
@keyframes cast-flight{0%{left:var(--from);top:65%;transform:scale(.4)}90%{opacity:1}100%{left:var(--to);top:45%;transform:scale(1.3);opacity:0}}@keyframes crystal-return{0%{left:var(--to);top:45%;opacity:0;transform:scale(.5)}15%{opacity:1}100%{left:var(--from);top:85%;opacity:1;transform:scale(.7) rotate(180deg)}}
@media(max-width:900px){.arena[data-mode=race] .knights{gap:6px}.arena[data-mode=race] .knight{padding:6px 3px 8px;border-radius:12px}.arena[data-mode=race] .duel{height:123px}.arena[data-mode=race] .knight-figure{height:116px}.arena[data-mode=race] .personal-dragon{height:97px}.dragon-health{font-size:9px}.place-label{font-size:16px;padding:5px}.arena[data-mode=race] .knight-name{font-size:11px}.arena[data-mode=race] .tiny-crystal{width:7px;height:10px}}
@media(min-width:1400px) and (min-height:850px){.arena[data-mode=race] .duel{height:165px}.arena[data-mode=race] .knight-figure{height:160px}.arena[data-mode=race] .personal-dragon{height:145px}}
@media(max-height:760px) and (min-width:1000px){.arena[data-mode=race] .knights{top:55px;bottom:7px}.arena[data-mode=race] .duel{height:99px}.arena[data-mode=race] .knight-figure{height:100px}.arena[data-mode=race] .personal-dragon{height:89px}.arena[data-mode=race] .knight{padding:3px 7px 6px}.team-finished .question{height:215px}}
.storm .personal-dragon>img{animation:storm-dragon .45s infinite alternate}.storm .personal-shield .shield-piece:not(.broken){opacity:.35}.storm .defeated .personal-dragon>img{animation:none}.team-finished .feedback{font-size:15px;line-height:1.5}.spell-impact{top:45%}
@media(prefers-reduced-motion:reduce){.storm .personal-dragon>img{animation:none!important}}
/* Each team has its own painted knight, without a colour filter. */
.knight-figure img{filter:none}.defeated .personal-dragon{animation:none;transform:none}.personal-dragon>.surrendered-dragon{position:absolute;inset:0;object-fit:contain;border-radius:0;animation:surrender-appear 1s .65s both!important}.defeated .personal-dragon>img:first-child{animation:dragon-topple .8s .45s both!important}.defeated .personal-shield{transition:none;animation:shield-burst .9s .45s both}.defeated .knight-figure img{animation:happy-knight .65s .8s 6 alternate}.defeated .place-label{top:13%;animation:place-arrive .5s 2s both}.victory-burst{position:absolute;inset:0;pointer-events:none;z-index:9;overflow:visible}.victory-burst span{position:absolute;left:73%;top:48%;width:15px;height:22px;clip-path:polygon(50% 0,100% 25%,85% 85%,50% 100%,0 60%);background:linear-gradient(120deg,white,#76e7eb,#289daa);animation:shard-scatter 1s calc(.5s + var(--delay)) both}.victory-burst .victory-gem{animation:freed-gems 1.3s calc(.9s + var(--delay)) both}.team-finished .answers{display:block}.team-finished .question{height:105px}.finish-badge strong{height:65px;width:62px;font-size:37px}.finish-badge span{font-size:13px;margin-top:3px}.winner-scene{height:135px;position:relative;display:flex;align-items:end;justify-content:center;background:radial-gradient(ellipse,#fff2ac90,transparent 70%);border-radius:15px}.winner-scene img{object-fit:contain;width:48%;height:115px}.winner-knight{animation:happy-knight .8s infinite alternate}.winner-dragon{animation:surrender-bob 2.3s infinite ease-in-out}.winner-scene strong{position:absolute;top:0;left:0;right:0;text-align:center;color:#94711a;font-size:17px}.arena[data-mode=coop].victory .dragon-portrait>img{content:url('vargos-verslagen.png');object-fit:contain;border-radius:0;box-shadow:none}.arena[data-mode=coop].victory .dragon-portrait{animation:surrender-bob 2s infinite}.arena[data-mode=coop].victory .arena-result{font-size:19px}
@keyframes dragon-topple{30%{transform:rotate(-12deg) scale(.9)}100%{transform:translateY(22px) rotate(12deg) scale(.7);opacity:0}}@keyframes surrender-appear{0%{opacity:0;transform:translateY(-12px) scale(.7)}65%{opacity:1;transform:translateY(6px) scale(1.05)}100%{opacity:1;transform:none}}@keyframes shield-burst{to{opacity:0;transform:scale(1.8) rotate(20deg)}}@keyframes happy-knight{0%{transform:translateY(0) rotate(-5deg)}100%{transform:translateY(-15px) rotate(7deg)}}@keyframes surrender-bob{50%{transform:translateY(4px) rotate(-3deg)}}@keyframes place-arrive{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}@keyframes shard-scatter{0%{opacity:1;transform:rotate(var(--angle)) translateY(0)}100%{opacity:0;transform:rotate(var(--angle)) translateY(100px) rotate(100deg)}}@keyframes freed-gems{0%{opacity:0;transform:scale(.5)}20%{opacity:1}100%{left:23%;top:85%;opacity:0;transform:rotate(160deg) scale(.7)}}
.movement-settings{display:flex;gap:16px;background:#edf4e7;border-radius:14px;padding:15px;margin:18px 0}.movement-settings label{flex:1}.movement-overlay{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:16px;background:#d9eeeae8;backdrop-filter:blur(7px)}.movement-card{background:#fffdf1;border:3px solid #d4e5bd;border-radius:30px;width:min(540px,94vw);padding:24px;text-align:center;box-shadow:0 20px 70px #31594e33}.movement-card h2{font-family:Georgia,serif;color:#34715b;font-size:35px;margin:10px 0}.movement-card p{margin:7px 0;color:#597458;font-size:17px}.movement-demo{height:250px;position:relative;display:grid;place-items:center;margin:18px 0 5px}.movement-demo img{height:225px;width:220px;object-fit:contain;z-index:1;transform-origin:50% 90%}.movement-floor{position:absolute;bottom:0;height:20px;width:210px;background:#bdd5a970;border-radius:50%}.movement-demo[data-motion=jump] img{animation:demo-jump 1.1s infinite ease-in-out}.movement-demo[data-motion=steps] img{animation:demo-steps 2s infinite ease-in-out}.movement-demo[data-motion=squat] img{animation:demo-squat 2s infinite ease-in-out}.movement-counter{display:flex;align-items:center;justify-content:center;gap:15px;margin:10px 0}.movement-counter strong{background:#e1edce;color:#4e733d;width:65px;height:65px;border-radius:50%;display:grid;place-items:center;font-size:34px;font-variant-numeric:tabular-nums}.movement-counter span{max-width:180px;font-size:14px;color:#68845a;text-align:left}.movement-card .movement-note{font-size:12px;color:#839076}.movement-card button{margin-top:6px}
@keyframes demo-jump{0%,100%{transform:translateY(0) scaleY(.97)}45%,55%{transform:translateY(-40px) scaleY(1.03)}}@keyframes demo-steps{0%,100%{transform:translateX(-50px) rotate(-4deg)}50%{transform:translateX(50px) rotate(4deg)}}@keyframes demo-squat{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.73) scaleX(1.05)}}
@media(max-height:760px){.movement-card{padding:16px}.movement-demo{height:185px;margin:10px 0 5px}.movement-demo img{height:165px}.movement-card h2{font-size:28px}.movement-card p{font-size:15px}.movement-counter strong{height:50px;width:50px;font-size:28px}.winner-scene{height:110px}.winner-scene img{height:95px}}
@media(max-width:650px){.movement-settings{flex-wrap:wrap}.movement-settings label{flex-basis:45%}}
@media(prefers-reduced-motion:reduce){.defeated .personal-dragon>img:first-child{opacity:0}.personal-dragon>.surrendered-dragon{opacity:1}.victory-burst{display:none}.defeated .place-label{opacity:1}.movement-demo img{animation:none!important}}
.overlay[data-outcome=won] .modal-icon{background-image:url('vargos-verslagen.png');background-size:contain;background-repeat:no-repeat;background-position:center;width:240px;height:155px}

/* Keep the answer panels in the same columns as the individual battles. */
#game .teams{grid-template-columns:repeat(var(--count),minmax(0,1fr));gap:12px;margin-inline:2%}
@media(max-width:900px){#game .teams{gap:6px}.team-header{flex-wrap:wrap;justify-content:center}.team-header>span:first-child{max-width:100%}.answers{gap:6px}.answers button{font-size:28px;padding:8px 4px}#game[data-team-count="4"] .question{font-size:clamp(18px,3vw,28px)}#game[data-team-count="4"] .team{padding:8px 6px}#game[data-team-count="4"] .feedback{font-size:11px}.gamebar{flex-wrap:wrap}}
/* Painted movement poses: each frame changes the actual arms and legs. */
.movement-demo{height:280px;margin-top:10px}.movement-sprite{height:280px;width:140px;background-repeat:no-repeat;background-size:300% 100%;position:relative;z-index:1;animation:none!important;transition:none!important}.movement-demo .movement-floor{bottom:14px;width:145px}.movement-card .movement-cue{font-weight:800;color:#397053;font-size:18px;min-height:25px;margin:0 0 6px}.movement-card{max-height:96vh;overflow:auto}
@media(max-height:760px){.movement-demo{height:215px}.movement-sprite{height:215px;width:107.5px}.movement-demo .movement-floor{bottom:11px;width:115px}.movement-card .movement-cue{font-size:16px}}
.question.point-question{font-size:clamp(25px,2.7vw,44px);letter-spacing:-.6px;white-space:nowrap}
@media(max-width:900px){.question.point-question,#game[data-team-count="4"] .question.point-question{font-size:clamp(16px,2.5vw,26px)}}
.setting-help{display:block;font-size:12px;font-weight:400;line-height:1.5;color:#58735e;max-width:36em}.storm .knight:not(.defeated) .knight-figure img{filter:drop-shadow(0 0 7px #ffe785) drop-shadow(0 0 12px #ffca51)}.storm .arena-sky{background:linear-gradient(#fff0bd,#f3f6dd)}.storm .personal-dragon>img,.storm .dragon-portrait>img{animation:dragon-breathe 3s infinite ease-in-out}
/* Each pose has its own verified crop, bounded by transparent columns. */
.movement-sprite{--movement-height:280px;height:var(--movement-height);width:calc(var(--movement-height) * var(--frame-ratio,.5));background-repeat:no-repeat;overflow:hidden}
@media(max-height:760px){.movement-sprite{--movement-height:215px}}
