*{box-sizing:border-box} :root{--bg:#101615;--panel:#171f1e;--line:#34413a;--gold:#deb574;--muted:#8e9b93;--cream:#f2eddb;--cyan:#77cbd4}body{margin:0;background:radial-gradient(ellipse at 50% 20%,#26332b55,transparent 55%),var(--bg);color:var(--cream);font-family:'DM Sans',sans-serif;font-size:14px}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:disabled{opacity:.5;cursor:wait}a{color:inherit;text-decoration:none}.topbar{height:86px;padding:0 4%;border-bottom:1px solid #34413a88;display:flex;align-items:center;justify-content:space-between;gap:30px;background:#0c1211b0}.brand{display:flex;gap:12px;align-items:center;font-family:Cinzel,serif;font-size:17px;font-weight:800;letter-spacing:1px}.brand small{display:block;font:9px 'DM Sans',sans-serif;letter-spacing:3.1px;color:#93a398;margin-top:3px}.brand-mark{font-family:Cinzel,serif;color:var(--gold);font-size:29px;border:1px solid #9c8157;padding:0 7px;transform:rotate(-6deg);line-height:38px}.brand-mark span{font-size:18px;margin-left:-9px}nav{height:100%;display:flex;gap:34px}.nav-item{border:0;background:none;font-size:11px;letter-spacing:1.4px;color:var(--muted);border-bottom:2px solid transparent}.nav-item.active{color:var(--gold);border-color:var(--gold)}.header-right{display:flex;gap:12px;align-items:center;font-size:9px;letter-spacing:1.1px;color:#aab7ad}.live-dot,.ready-light{width:6px;height:6px;background:#92bd96;display:inline-block;border-radius:50%;box-shadow:0 0 8px #79b78770}.icon-button{border:1px solid #354039;background:#1b2421;width:31px;height:31px;font-size:20px;color:#c3cabe}.header-right .icon-button:first-of-type{margin-left:15px}main{max-width:1440px;margin:auto;padding:0 4%}.intro{text-align:center;padding:33px 0 24px}.eyebrow{display:flex;gap:14px;align-items:center;justify-content:center;font-size:9px;letter-spacing:3px;color:var(--gold);font-weight:700}.eyebrow span{height:1px;width:30px;background:#a17b40}h1{font:600 clamp(24px,3.2vw,44px)/1.2 Cinzel,serif;margin:13px 0 10px;letter-spacing:-1.2px}h1 em{font-style:normal;color:var(--gold)}.intro p{color:#a4afa5;font-size:12px;letter-spacing:.2px;margin:0}.mobile-br{display:none}.modebar{display:flex;justify-content:center;margin-bottom:22px;gap:5px}.mode{background:#141c19;border:1px solid #354139;padding:10px 18px;display:flex;gap:8px;align-items:center;font-size:10px;letter-spacing:.8px;transition:.2s}.mode>span{font-size:17px;color:var(--gold)}.mode small{color:#829083;font-size:10px;letter-spacing:0;margin-left:4px}.mode.active{background:#b08e491a;border-color:#a78a57;color:#f1d4a1}.mode:hover{background:#344034}.duel-preview{height:330px;position:relative;display:flex;justify-content:space-between;border:1px solid #61715966;overflow:hidden;background:#101b1c}.preview-backdrop{position:absolute;inset:0;background:linear-gradient(90deg,#111b1acc,transparent 40%,transparent 60%,#111b1acc),linear-gradient(0deg,#0a1212 1%,#0a11126b 35%,#0a151c55),url('/assets/arena.webp') center 43%/cover;opacity:.75}.arena-location{position:absolute;z-index:1;left:50%;transform:translateX(-50%);top:15px;white-space:nowrap;font-size:8px;letter-spacing:1.8px;color:#bbcbc1;display:flex;align-items:center;gap:9px}.fighter-preview{position:relative;width:40%;--element:#f29b52;display:flex;align-items:center;justify-content:center}.fighter-preview.p2{--element:#70d8e2}.player-ribbon{position:absolute;top:22px;left:24px;color:var(--gold);font-size:10px;letter-spacing:1.4px;font-weight:700;z-index:2}.player-ribbon span{display:block;font-size:8px;color:#8e9f98;letter-spacing:1px;margin-top:4px}.p2 .player-ribbon{left:auto;right:24px;text-align:right;color:var(--cyan)}.hero{position:absolute;height:258px;width:258px;object-fit:contain;bottom:38px;filter:drop-shadow(0 0 23px color-mix(in srgb,var(--element) 25%,transparent));animation:float 4s ease-in-out infinite;z-index:1}.p1 .hero{transform:scaleX(-1);animation-name:float-left}.p2 .hero{animation-delay:-2s}.character-floor{position:absolute;width:235px;height:62px;border:1px solid color-mix(in srgb,var(--element) 40%,transparent);border-radius:50%;bottom:31px;background:radial-gradient(ellipse,color-mix(in srgb,var(--element) 20%,transparent),transparent 65%);box-shadow:0 0 0 7px #d5b77507,0 0 0 8px #d5b77519}.fighter-caption{position:absolute;bottom:18px;left:23px;z-index:2;text-shadow:0 2px 10px #000}.fighter-caption>span{font-size:8px;letter-spacing:1.8px;color:#aeb6a7}.fighter-caption h2{font:600 30px Cinzel,serif;margin:3px 0 8px}.fighter-caption>div{display:flex;align-items:center;gap:9px;font-size:8px;color:#afbaae;letter-spacing:.8px}.element-badge{color:var(--element);background:#0c1411c9;border:1px solid color-mix(in srgb,var(--element) 40%,transparent);padding:4px 8px;font-size:8px}.p2 .fighter-caption{left:auto;right:23px;text-align:right}.p2 .fighter-caption>div{justify-content:end}.versus{position:absolute;left:50%;top:87px;transform:translateX(-50%);display:flex;align-items:center;flex-direction:column;z-index:2}.versus>span{font-size:9px;letter-spacing:2.3px;color:var(--gold)}.versus strong{font:600 68px Cinzel,serif;color:#f3dfb7;text-shadow:0 4px 25px #df9d5033;line-height:1.3}.match-dots{display:flex;gap:7px;align-items:center}.match-dots i{width:7px;height:7px;transform:rotate(45deg);border:1px solid #ab9470}.match-dots b{font-weight:400;color:#626f63;margin:0 5px}.versus small{font-size:7px;letter-spacing:1.5px;color:#8c9a8f;margin-top:23px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:20px 0 12px;gap:10px}.section-heading>div{display:flex;align-items:center;gap:11px}.section-number{font:10px Cinzel,serif;color:#9b885e;border:1px solid #4b503c;padding:3px 4px}h3{font-size:10px;letter-spacing:1.5px;font-weight:600;margin:0}.muted{font-size:10px;color:#8d9a8f;letter-spacing:.1px}.player-toggle{display:flex;gap:4px}.player-toggle button{font-size:9px;padding:7px 10px;background:#18211b;border:1px solid #3c473b;color:#869688}.player-toggle button.active{border-color:#b49561;color:#efd5a3;background:#b4925015}.roster{display:grid;grid-template-columns:repeat(11,1fr);gap:7px}.dragon-card{position:relative;min-width:0;border:1px solid #35443a;background:linear-gradient(160deg,#26332999,#141e1977);height:108px;padding:2px 3px 9px;display:flex;align-items:center;flex-direction:column;transition:transform .2s,border-color .2s;overflow:hidden}.dragon-card:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at center,var(--color),transparent 70%);opacity:.07}.dragon-card:hover{transform:translateY(-4px);border-color:var(--color)}.dragon-card img{width:80px;max-width:100%;height:80px;object-fit:contain;filter:drop-shadow(0 4px 6px #0008);position:relative}.dragon-card>span{font-size:8px;letter-spacing:.9px;color:#b0bbae}.dragon-card.selected-p1{border-color:#d9b170;background:#73503135;box-shadow:inset 0 -2px #d9b170}.dragon-card.selected-p2{border-color:#72c7d1;box-shadow:inset 0 -2px #72c7d1}.card-tag{position:absolute;right:4px;top:4px;font:700 7px 'DM Sans',sans-serif;background:#deb574;color:#192018;padding:2px 3px;z-index:2}.card-tag.p2{background:#77cbd4}.bottom-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:26px;margin-top:16px}.evolution-panel{border:1px solid #334039;background:#19221d77;padding:0 18px 12px}.evolution-panel .section-heading{margin:13px 0 0}.evolution-track{display:flex;align-items:center;justify-content:space-around;margin:6px 0}.evo{display:flex;flex-direction:column;align-items:center;position:relative}.evo img{height:59px;width:68px;object-fit:contain}.evo span{font-size:7px;letter-spacing:.8px;color:#9caaa0}.evo:first-child span{color:var(--gold)}.evo-arrow{font-size:17px;color:#635c41}.evolution-panel>p{font-size:9px;color:#8e9c90;text-align:center;margin:10px 0 0;line-height:1.5}.evolution-panel b{color:#bbc6b6;font-weight:500}.launch-panel{display:flex;justify-content:center;flex-direction:column;gap:12px}.launch-panel>div{display:flex;align-items:center;justify-content:center;gap:7px;font-size:8px;letter-spacing:1.6px;color:#a7b59f}.fight-button{background:linear-gradient(120deg,#e2c48b,#bb9455);box-shadow:inset 0 0 0 1px #ffe1a755,0 4px 22px #0004;color:#25271d;border:1px solid #ddbb7c;padding:19px 26px;display:flex;justify-content:space-between;align-items:center;gap:24px;font:700 16px Cinzel,serif;letter-spacing:1px;transition:filter .2s,transform .2s}.fight-button:hover{filter:brightness(1.14);transform:translateY(-2px)}.fight-button>span{font-size:23px;line-height:1}.launch-panel>p{font-size:9px;color:#8d9a8a;text-align:center;margin:0}.controls-strip{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #34413a;border-bottom:1px solid #34413a;padding:15px 0;margin-top:24px}.controls-strip>div{display:flex;align-items:center;gap:11px;flex-wrap:wrap}.controls-strip span{font-size:8px;color:#97a494;white-space:nowrap}.controls-strip .control-player{font-weight:700;color:var(--gold);margin-right:4px;font-size:10px}.controls-strip .cyan{color:var(--cyan)}kbd{display:inline-block;border:1px solid #495044;border-bottom-width:2px;padding:3px 5px;min-width:19px;text-align:center;background:#202921;font:8px 'DM Sans',sans-serif;color:#d1d8c7;border-radius:3px;margin:0 2px 0 0}footer{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.3px;color:#6e7b6d;padding:18px 0 24px}footer i{font-style:normal;margin:0 12px}footer>span:last-child{letter-spacing:.3px}.hidden{display:none!important}.online-panel{border:1px solid #647557;padding:13px;margin-bottom:16px;background:#27302688}.online-panel>div{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.online-panel label{font-size:9px;letter-spacing:1px}.online-panel input{background:#111a14;border:1px solid #536349;color:#f0e5ce;padding:8px 10px;width:170px;font-size:12px}.small-button{font-size:10px;letter-spacing:.6px;background:#263226;border:1px solid #586449;padding:9px 12px}.small-button:hover{background:#3d4a34}.online-panel p{margin:10px 0 0;color:#b7c6ab;font-size:11px}.battle-top{display:flex;justify-content:space-between;align-items:center;padding:22px 0 13px}.battle-top>span{font-size:10px;letter-spacing:2px;color:var(--gold)}.game-wrap{position:relative;border:1px solid #7a7956;background:#0d1719;overflow:hidden}canvas{display:block;width:100%;aspect-ratio:16/9;touch-action:none}.battle-hints{display:flex;justify-content:space-between;align-items:center;padding:14px 0;font-size:10px;color:#b5c1ae}.battle-hints b{font-size:9px;letter-spacing:1.5px;color:#8b9d8c}.battle-hints kbd{font-size:10px}.match-end{position:absolute;inset:0;background:#071310e8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:4}.match-end p{font-size:10px;color:var(--gold);letter-spacing:3px}.match-end h2{font:700 clamp(24px,4vw,55px) Cinzel,serif;margin:0;text-align:center}.match-end>span{color:#b0c6b2;font-size:17px;margin-bottom:10px}.connection-banner{position:absolute;top:110px;left:50%;transform:translateX(-50%);background:#161e12ee;border:1px solid #bc995a;color:#efdab0;padding:15px 24px;text-align:center;z-index:5;min-width:240px}.touch-controls{display:none;gap:6px;margin-top:10px;justify-content:center}.touch-controls button{background:#26342b;color:#e6d8b9;border:1px solid #708163;padding:13px 10px;font-size:10px;touch-action:none;user-select:none}.touch-controls button:active{background:#726346}dialog{background:#17211c;border:1px solid #a3895d;color:var(--cream);padding:38px;max-width:750px;width:90%;box-shadow:0 20px 100px #000a}dialog::backdrop{background:#06120cc9;backdrop-filter:blur(5px)}dialog h2{font:600 28px Cinzel,serif;text-align:center}.dialog-close{position:absolute;right:12px;top:9px;background:transparent;border:0;color:#d5bc8a;font-size:26px}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}.help-grid b{font-size:10px;letter-spacing:1px;color:var(--gold)}.help-grid p,.help-foot{font-size:12px;line-height:1.8;color:#b0bfae}.help-foot{border-top:1px solid #4c5641;padding-top:20px;font-size:11px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);opacity:0;transition:.2s;background:#344533;border:1px solid #b59b60;padding:13px 23px;font-size:12px;color:#efe4c5;pointer-events:none;z-index:30;max-width:90%;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}@keyframes float{50%{transform:translateY(-7px)}}@keyframes float-left{0%,100%{transform:scaleX(-1)}50%{transform:scaleX(-1) translateY(-7px)}}@media(min-width:1500px){main{padding:0 30px}.duel-preview{height:365px}.hero{height:285px;width:285px}.dragon-card{height:119px}.dragon-card img{height:89px;width:89px}}@media(max-width:1100px){.header-right>span:not(.live-dot){display:none}.controls-strip{flex-direction:column;gap:12px}.roster{gap:5px}.dragon-card{height:92px}.dragon-card img{height:65px}.dragon-card>span{font-size:7px}.mode small{display:none}.fighter-caption h2{font-size:27px}.hero{height:238px;width:238px}.section-heading .muted{font-size:9px}.bottom-grid{gap:14px}.fight-button{font-size:13px;padding:19px}.topbar{gap:14px}.versus small{display:none}}@media(max-width:700px){.topbar{height:65px;padding:0 5%;gap:10px}.brand{font-size:12px}.brand small{font-size:7px;letter-spacing:2px}.brand-mark{font-size:24px;line-height:30px}.header-right{gap:5px}.header-right .live-dot{display:none}.header-right .icon-button:first-of-type{margin:0}nav{display:none}main{padding:0 4%}.intro{padding:26px 0 20px}h1{font-size:28px;line-height:1.35}.mobile-br{display:block}.intro p{font-size:10px;max-width:260px;margin:auto;line-height:1.6}.eyebrow{font-size:8px;letter-spacing:2px}.modebar{gap:4px;margin-bottom:14px}.mode{padding:8px 9px;font-size:8px;gap:5px}.mode>span{font-size:15px}.duel-preview{height:287px}.arena-location{font-size:6px;letter-spacing:1px;top:12px}.player-ribbon{top:34px;left:12px;font-size:8px}.player-ribbon span{font-size:6px}.p2 .player-ribbon{right:12px}.fighter-preview{width:45%}.hero{width:177px;height:177px;bottom:67px}.character-floor{width:125px;bottom:56px;height:31px}.versus{top:91px}.versus strong{font-size:42px}.versus>span{font-size:6px;letter-spacing:1px}.match-dots{gap:4px}.match-dots i{width:5px;height:5px}.fighter-caption{left:12px;bottom:15px}.p2 .fighter-caption{right:12px}.fighter-caption h2{font-size:24px}.fighter-caption>span{font-size:6px}.fighter-caption>div{font-size:6px;display:block}.fighter-caption>div>span:last-child{display:block;margin-top:6px}.element-badge{font-size:6px;padding:3px 5px}.section-heading>div{gap:6px}h3{font-size:8px;letter-spacing:.8px}.roster-section .muted{display:none}.section-number{font-size:8px}.player-toggle button{font-size:7px;padding:6px}.roster{grid-template-columns:repeat(6,1fr);gap:5px}.dragon-card{height:83px}.dragon-card img{height:60px;width:62px}.dragon-card>span{font-size:6px;letter-spacing:.5px}.bottom-grid{grid-template-columns:1fr;gap:22px}.evolution-panel{padding:0 12px 12px}.evo img{height:59px}.launch-panel{gap:12px}.fight-button{justify-content:center;font-size:15px}.controls-strip{gap:16px}.controls-strip>div{gap:7px}.controls-strip span{font-size:7px}.controls-strip kbd{font-size:7px;min-width:15px;padding:3px}footer{font-size:6px;letter-spacing:.8px}footer>span:last-child{display:none}.battle-top{padding:15px 0 10px}.battle-top>span{font-size:8px}.small-button{font-size:8px;padding:8px}.battle-hints b{display:none}.battle-hints{font-size:8px}.touch-controls{display:flex;flex-wrap:wrap}.help-grid{grid-template-columns:1fr;gap:8px}dialog{padding:30px 22px}dialog h2{font-size:22px}.help-grid p{font-size:11px}.match-end{gap:8px}.match-end p{font-size:7px;margin:0}.match-end>span{font-size:11px;margin-bottom:0}.match-end .fight-button{padding:9px 18px;font-size:10px}.connection-banner{top:55px;padding:8px;font-size:10px}.online-panel input{width:140px}}@media(pointer:coarse){.touch-controls{display:flex}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}.reduced-motion *{animation:none!important}