@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Barlow:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#101720;--panel:#1a2430;--line:#33404d;--muted:#a7b6c5;--orange:#ffad49;--green:#9ce08b;--blue:#a2cfff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f1f4f5;font-family:Barlow,system-ui,sans-serif;font-size:15px}button,a{touch-action:manipulation}button{font:inherit;color:inherit;background:#273442;border:1px solid #526070;border-radius:5px;padding:11px 17px;cursor:pointer}button:hover:enabled{border-color:var(--orange);background:#354355}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #ffbf61;outline-offset:4px}a{color:var(--orange)}header{max-width:1400px;margin:auto;padding:20px 36px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line)}header>a{color:inherit;text-decoration:none;display:flex;gap:12px;align-items:center;font-family:'Barlow Condensed',sans-serif;font-size:28px;font-weight:900;line-height:1}.ball{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#f7a637;color:#a34019;font-size:12px;box-shadow:inset -4px -4px 0 #c86c24,inset 3px 3px 0 #ffd184}.brand-small{display:block;font-size:11px;letter-spacing:2.6px;margin-top:4px;color:#b3becc}.build{font-size:11px;letter-spacing:1.6px;color:var(--muted);margin-left:auto}.build i{display:inline-block;height:4px;width:4px;background:var(--orange);margin:3px 12px}.text-button{border:0;background:transparent;padding:9px;color:#bec9d4;font-size:12px}main{max-width:1360px;margin:0 auto;padding:30px 36px 52px;min-height:calc(100vh - 162px)}footer{border-top:1px solid var(--line);max-width:1288px;margin:auto;padding:20px 0;display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--orange);font-weight:700}h1,h2,h3{font-family:'Barlow Condensed',sans-serif;margin:0;font-weight:800}h1{font-size:clamp(42px,6vw,76px);line-height:.98;letter-spacing:-1px}h2{font-size:28px}h3{font-size:21px}p{line-height:1.6;color:var(--muted)}.primary{background:var(--orange);color:#19202a;border-color:var(--orange);font-weight:700}.primary:hover:enabled{background:#ffc373;color:#111}.intro{display:grid;grid-template-columns:1.3fr .7fr;align-items:center;gap:32px;padding:28px 0 38px}.intro h1{margin:16px 0}.intro p{max-width:490px}.intro-art{height:245px;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 76%,#46552b 0,transparent 55%);border-bottom:1px solid #465a40}.intro-art:before{content:'Z';position:absolute;font-family:'Barlow Condensed';font-weight:900;font-style:italic;font-size:290px;color:#263324;line-height:1}.intro-art canvas{position:relative;width:300px;height:230px;image-rendering:pixelated}.tag{font-size:11px;border:1px solid #476546;color:#bcdaa6;padding:5px 9px;border-radius:3px}.mode-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);padding-bottom:16px}.mode-tabs button{background:none;border:0;color:var(--muted);padding:9px 20px}.mode-tabs .active{background:#2d342e;color:var(--orange);border-bottom:2px solid var(--orange)}.mode-tabs small{margin-left:9px;font-size:10px}.campaign{margin:25px 0;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--orange);padding:26px;display:flex;justify-content:space-between;gap:24px;align-items:center}.campaign h2{font-size:35px;margin-top:5px}.campaign p{margin:8px 0 0}.campaign-actions{display:flex;flex-direction:column;gap:10px;min-width:195px}.other-worlds{display:flex;gap:12px}.other-worlds div{flex:1;border:1px dashed var(--line);padding:18px;color:var(--muted)}.other-worlds span{float:right;font-size:12px}.starter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0}.starter{padding:24px;text-align:left;background:var(--panel);min-height:265px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}.starter .avatar{margin:auto;}.starter strong{font-family:'Barlow Condensed';font-size:30px}.starter small{color:var(--muted);line-height:1.5}.starter .select-label{font-size:12px;color:var(--orange);margin-top:auto}.placeholder{display:grid;place-items:center;width:72px;height:88px;border-radius:50% 50% 35% 35%;color:var(--char-color);background:linear-gradient(150deg,#384755,#1c2936);font-family:'Barlow Condensed';font-weight:800;font-size:30px;border:1px solid #52606e}.placeholder:after{content:'PORTRAIT À VENIR';position:absolute;visibility:hidden}.avatar{width:86px;height:100px;display:grid;place-items:center}.avatar canvas{width:86px;height:100px;image-rendering:pixelated}.run-top{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:25px}.run-top h1{font-size:38px;margin-top:6px}.run-actions{display:flex;gap:10px}.run-actions button{padding:9px 12px;font-size:12px}.layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px}.side{display:flex;flex-direction:column;gap:18px}.panel{border:1px solid var(--line);background:var(--panel);border-radius:6px}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:17px 18px;border-bottom:1px solid var(--line)}.panel-head span{font-size:11px;color:var(--muted)}.team-list{padding:4px 14px 14px}.unit{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #303c48}.unit:last-child{border:0}.unit .avatar{width:51px;height:64px;flex-shrink:0}.unit .avatar canvas{width:51px;height:64px}.unit .placeholder{width:42px;height:51px;font-size:19px}.unit-info{flex:1;min-width:0}.unit-title{display:flex;justify-content:space-between;font-size:13px;font-weight:700}.unit-title small{color:var(--orange);font-size:11px}.unit-traits{font-size:10px;color:var(--muted);margin:5px 0}.bar{height:5px;background:#3e4955;border-radius:2px;overflow:hidden}.bar span{height:100%;display:block;background:var(--green);transition:width .35s}.bar.ki{height:3px;margin-top:4px}.bar.ki span{background:var(--blue)}.unit-stats{font-size:10px;color:var(--muted);margin-top:5px;display:flex;justify-content:space-between}.transform{padding:6px 8px;font-size:10px;width:100%;margin-top:8px;background:#3c3425;border-color:#83623b;color:#ffd183}.empty-slot{border:1px dashed #3d4854;border-radius:4px;text-align:center;padding:12px;color:#8392a3;font-size:11px;margin-top:10px}.synergies{padding:15px 18px}.trait{display:flex;justify-content:space-between;gap:10px;margin:11px 0;font-size:13px}.trait.active{color:var(--orange)}.trait small{color:var(--muted);font-size:11px}.trait-desc{font-size:11px;line-height:1.6;color:var(--muted);margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.note{padding:14px 17px;font-size:12px;color:var(--muted);line-height:1.6;border-left:2px solid #65734f;background:#1d282b}.map-panel{padding:23px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#233641,#17212d 70%)}.map-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.map-title p{font-size:12px;margin:3px 0}.step-badge{font-size:11px;color:var(--orange);border:1px solid #655540;padding:6px 9px}.map{position:relative;padding:0 0 3px;min-height:487px}.map svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.map-row{position:relative;display:flex;justify-content:center;gap:48px;height:70px;align-items:center}.node{width:190px;min-height:50px;display:flex;align-items:center;gap:10px;padding:9px 12px;background:#1b2834;border:1px solid #3d5263;font-size:11px;line-height:1.25;text-align:left}.node .icon{font-size:18px;flex-shrink:0;width:21px;text-align:center;color:#b5c5d1}.node.available{border-color:var(--orange);box-shadow:0 0 0 2px #f7a93718}.node.available .icon{color:var(--orange)}.node.visited{border-color:#6a9466;color:#b7dfad;opacity:.9}.node:disabled{opacity:.55}.node.visited:disabled{opacity:.9}.node.boss{background:#372724}.node.current{background:#554026}.map-instruction{font-size:12px;margin:16px 0 0;color:#bdc9d6;text-align:center}.flash{border:1px solid #586d49;color:#cae6ba;background:#29352b;padding:11px 15px;font-size:12px;line-height:1.5;margin-bottom:14px}.battle-panel{overflow:hidden}.battle-head{padding:18px 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.battle-head small{font-size:11px;color:var(--orange)}.arena{height:300px;position:relative;overflow:hidden;background:linear-gradient(#263d54 0%,#607b83 55%,#879775 56%,#4f6a4e 57%,#263f30 100%)}.mountain{position:absolute;left:-10%;bottom:41%;width:65%;height:45%;background:#394f57;clip-path:polygon(0 100%,40% 0,70% 60%,85% 32%,100% 100%)}.mountain.second{left:45%;height:35%;width:70%;background:#435d60}.arena:after{content:'';position:absolute;width:120%;height:50px;left:-10%;bottom:25px;border-radius:50%;background:#2a432d;box-shadow:0 10px 0 #203929}.battle-sprite{position:absolute;z-index:2;bottom:55px;left:15%;width:180px;height:160px;image-rendering:pixelated;filter:drop-shadow(0 3px 0 #0004)}.foe-art{position:absolute;z-index:2;right:18%;bottom:57px;width:94px;height:148px;filter:drop-shadow(0 5px 0 #0005)}.foe-art .head{position:absolute;top:0;left:30px;width:32px;height:37px;background:#a8b3b7;border:4px solid #2b343c;border-radius:9px}.foe-art .body{position:absolute;top:37px;left:15px;width:63px;height:53px;background:#5b6871;border:5px solid #303c44;border-radius:9px}.foe-art .arm{position:absolute;top:41px;left:0;width:22px;height:64px;background:#929da3;border:4px solid #303c44}.foe-art .arm.right{left:72px}.foe-art .leg{position:absolute;top:88px;left:20px;width:23px;height:55px;background:#3d4855;border:4px solid #28363f}.foe-art .leg.right{left:51px}.fighter-label{position:absolute;z-index:3;top:21px;left:22px;font-family:'Barlow Condensed';font-size:22px;display:flex;flex-direction:column}.fighter-label.right{left:auto;right:22px;text-align:right}.fighter-label small{font-family:Barlow;font-size:10px;color:#d4dfdf}.fighter-label .bar{margin-top:6px;width:160px;height:6px}.battle-toolbar{padding:14px 20px;display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--line)}.battle-toolbar button{padding:8px 12px;font-size:12px}.battle-toolbar span{font-size:12px;color:var(--muted);margin-left:auto}.combat-log{padding:17px 22px;min-height:150px;font-size:12px;color:#c8d3df;line-height:1.7}.combat-log p{margin:2px 0;font-size:12px;color:inherit}.combat-log p:last-child{color:var(--orange)}.reward{padding:20px 22px;border-top:1px solid var(--line);background:#263527;display:flex;justify-content:space-between;align-items:center;gap:18px}.reward p{margin:4px 0;font-size:12px}.beam{position:absolute;z-index:3;left:30%;right:25%;top:55%;height:21px;background:#e9fcff;box-shadow:0 0 12px 8px #7cd7ff;border-radius:50%;animation:beam .45s ease-out forwards;pointer-events:none}.hit{animation:hit .35s}.outcome{padding:44px 30px;text-align:center}.outcome h2{font-size:50px;color:var(--orange)}.outcome p{max-width:500px;margin:18px auto}.outcome .primary{margin-top:12px}.warning{color:#ffc788;font-size:12px;margin:12px 0}.asset-warning{position:absolute;bottom:8px;right:12px;font-size:9px;z-index:3;color:#dbe7d4}.progress{display:flex;gap:6px;margin-top:15px}.progress span{height:4px;flex:1;background:#344554}.progress .done{background:var(--orange)}dialog{max-width:570px;width:calc(100% - 32px);background:#1b2734;color:#fff;border:1px solid #5a6a79;border-radius:8px;padding:26px}dialog::backdrop{background:#000b}.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:14px}.dialog-top button{font-size:23px;padding:0 10px}dialog p{font-size:13px}.storage-warning{padding:10px 15px;background:#403521;font-size:12px;color:#ffd08d}.end-team{display:flex;justify-content:center;gap:15px;margin:20px 0}.end-unit{text-align:center;font-size:12px}.end-unit .avatar{margin:auto}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);padding:12px 24px;border:1px solid #6f875f;background:#26382b;color:#cfedb7;border-radius:5px;z-index:20;font-size:13px;box-shadow:0 5px 20px #0008}@keyframes hit{20%,60%{filter:brightness(2);transform:translateX(6px)}40%,80%{transform:translateX(-6px)}}@keyframes beam{0%{opacity:0;transform:scaleX(.2)}30%{opacity:1;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1)}}@media(prefers-reduced-motion:reduce){html:not([data-reduce-motion=false]) *{animation:none!important;transition:none!important}}@media(max-width:1000px){.layout{grid-template-columns:260px minmax(0,1fr)}main{padding:25px 22px}.map-row{gap:16px}.node{width:160px;font-size:10px}.battle-sprite{left:5%}.foe-art{right:12%}footer{padding:20px 22px}}@media(max-width:760px){header{padding:15px 18px;gap:10px}.build{font-size:9px}.build i{margin:2px 6px}.brand-small{font-size:9px}.text-button{font-size:10px}.intro{grid-template-columns:1fr;padding-top:14px;gap:0}.intro-art{height:190px}.intro-art canvas{height:180px;width:240px}.intro-art:before{font-size:220px}.intro p{margin-bottom:0}.campaign{padding:20px;flex-direction:column;align-items:stretch}.campaign-actions{flex-direction:row}.campaign-actions button{flex:1}.starter-grid{gap:10px}.starter{padding:14px 10px;min-height:240px}.starter strong{font-size:25px}.starter small{font-size:11px}.mode-tabs button{padding:8px 10px;font-size:12px}.layout{display:flex;flex-direction:column}.side{order:2}.team-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 15px}.unit{border:0}.side .note{display:none}.run-top{align-items:flex-start}.run-top h1{font-size:31px}.run-actions{flex-direction:column;gap:3px}.run-actions button{font-size:10px;padding:7px 8px}.map-panel{padding:18px 12px}.map-row{gap:13px}.node{width:155px}.map-title h2{font-size:25px}.step-badge{padding:5px;font-size:10px}.arena{height:270px}.battle-sprite{left:1%;width:150px;height:145px}.foe-art{right:12%;transform:scale(.86);transform-origin:bottom}.fighter-label .bar{width:110px}.fighter-label{font-size:19px;left:13px}.fighter-label.right{right:13px}.battle-toolbar{padding:12px;gap:6px}.battle-toolbar button{padding:8px;font-size:11px}.battle-toolbar span{font-size:10px}.reward{padding:17px 15px}.reward button{font-size:12px}.reward h3{font-size:22px}.other-worlds div{font-size:13px;padding:14px 10px}.other-worlds span{float:none;display:block;margin-top:6px}footer{gap:10px;flex-direction:column;padding:17px 22px}.outcome{padding:28px 15px}.outcome h2{font-size:40px}}@media(max-width:400px){main{padding:20px 14px}.build{max-width:118px;text-align:right;line-height:1.7}.build i{display:none}.node{width:137px}.starter-grid{grid-template-columns:1fr}.starter{min-height:110px;display:grid;grid-template-columns:80px 1fr}.starter .avatar{grid-row:1 / 4}.starter strong{grid-column:2}.starter small{grid-column:2}.starter .select-label{grid-column:2}.reward{flex-direction:column;align-items:stretch}.map-title h2{font-size:23px}}

[hidden]{display:none!important}.preview-transform{margin-top:17px;font-size:12px;padding:9px 14px;background:#263128;color:#d4e8bc;border-color:#637d51}.taking-hit{animation:damage-shake .35s}.beam{opacity:0;animation-fill-mode:both;transform-origin:left center}
#evolution{width:min(620px,calc(100% - 28px));max-width:620px;padding:24px 28px;background:#101924;border:1px solid #8a713f;box-shadow:0 20px 100px #0008;overflow:hidden}.evolution-top{display:flex;align-items:center;justify-content:space-between;gap:15px}.evolution-top .text-button{color:#c7d1db}#evolution-title{font-size:38px;text-align:center;margin:20px 0 2px}.evolution-scene{height:290px;position:relative;display:grid;place-items:center;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 77%,#314344 0,transparent 65%)}.evolution-scene canvas{position:relative;z-index:3;width:340px;height:280px;image-rendering:pixelated}.evolution-ground{position:absolute;bottom:30px;width:210px;height:15px;background:#405444;border-radius:50%;box-shadow:0 2px 0 #6a825a;z-index:0}.evolution-aura{position:absolute;bottom:31px;width:152px;height:192px;opacity:0;transform:scale(.6);border-radius:55% 55% 33% 33%;background:radial-gradient(ellipse,#e6fbff80 0,#90dfff40 50%,#6dd8fa00 70%);box-shadow:0 0 32px #86d5ff60;transition:opacity .3s,transform .4s;background-color:transparent;z-index:1}.evolution-scene[data-phase=charge] .evolution-aura{opacity:.75;transform:scale(1);animation:aura-breathe .5s ease-in-out infinite alternate}.evolution-scene[data-phase=change] .evolution-aura,.evolution-scene[data-phase=reveal] .evolution-aura,.evolution-scene[data-phase=complete] .evolution-aura{opacity:1;transform:scale(1.1);background:radial-gradient(ellipse,#ffec9180 0,#ffc34370 50%,#ffb12e00 72%);box-shadow:0 0 42px #ffd46465}.evolution-scene[data-phase=complete] .evolution-aura{opacity:.7;transform:scale(1)}.evolution-rays{position:absolute;inset:30px 0 -10px;background:repeating-conic-gradient(from 0deg at 50% 85%,transparent 0deg 13deg,#add9f90b 14deg 15deg,transparent 16deg 28deg);opacity:0}.evolution-scene[data-phase=charge] .evolution-rays,.evolution-scene[data-phase=change] .evolution-rays,.evolution-scene[data-phase=reveal] .evolution-rays{opacity:1}.evolution-flare{position:absolute;inset:0;z-index:4;pointer-events:none;background:radial-gradient(ellipse,#ffeeb6c0 0,#ffe7aa30 60%,transparent 90%);opacity:0}.evolution-scene[data-phase=change] .evolution-flare{animation:evolution-flare .7s ease-out both}#evolution-caption{min-height:28px;font-size:13px;text-align:center;margin:8px 0 20px;color:#c7d5df}.evolution-bottom{border-top:1px solid #45503c;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:66px}.evolution-bottom span{font-size:13px;color:#ffda81}.evolution-bottom button{font-size:13px}@keyframes aura-breathe{from{opacity:.55;transform:scale(.96)}to{opacity:.85;transform:scale(1.04)}}@keyframes evolution-flare{0%{opacity:0}50%{opacity:.85}100%{opacity:0}}@keyframes damage-shake{25%{transform:translateX(-7px);filter:brightness(1.7)}60%{transform:translateX(4px)}100%{transform:translateX(0)}}@media(prefers-reduced-motion:reduce){html:not([data-reduce-motion=false]) .evolution-flare{display:none}html:not([data-reduce-motion=false]) .evolution-aura,html:not([data-reduce-motion=false]) .evolution-rays{animation:none!important;transition:none!important}}@media(max-width:500px){#evolution{padding:17px 14px}#evolution-title{font-size:30px;margin-top:13px}.evolution-top .eyebrow{font-size:9px}.evolution-top button{font-size:10px}.evolution-scene{height:270px}.evolution-scene canvas{width:320px;height:264px}.evolution-bottom span{font-size:11px}}
