/* Campaign, room lobby and accessible dialogs. The battlefield remains fixed. */
body{background:radial-gradient(ellipse at 10% 0,#fff1c7,transparent 45%),radial-gradient(ellipse at 90% 25%,#d0ebc1,transparent 50%),#e9f1e3}
button{font-weight:750}button:disabled{cursor:not-allowed}.header{max-width:1360px}.header-tools{flex-wrap:wrap;justify-content:flex-end}.connection{font-size:11px;color:#a16a37}.connection.online{color:#387e5f}.connection:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:6px}
.lobby-layout{max-width:1280px;padding:20px 24px 60px;margin:auto;display:flex;flex-direction:column;gap:34px}.hero-game{position:relative;overflow:hidden;display:grid;grid-template-columns:1.1fr 1fr;min-height:380px;padding:38px 42px;border:3px solid #fff6d7;border-radius:32px;background:linear-gradient(125deg,#fff9e6,#d9ebbc);box-shadow:0 8px #bad19d,0 20px 45px #4a683219}.hero-copy{z-index:1}.hero-copy h1{font-size:clamp(30px,3.4vw,48px);max-width:610px;letter-spacing:-1.6px;line-height:1.12;margin:14px 0 20px;color:#254d40}.hero-copy p{max-width:540px;color:#567660;font-size:16px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.hero-actions .primary{width:auto;min-width:180px}.outline-button,.small-primary{border:2px solid #b8cba5;border-radius:12px;background:#fffdf1;color:#355e4d;padding:10px 16px;box-shadow:0 3px #a8bf95;font-size:13px;transition:transform .12s}.small-primary{background:linear-gradient(#ffe18b,#ffc352);border-color:#d4a24b;box-shadow:0 3px #bd8533;color:#65431b}.outline-button:active,.small-primary:active{transform:translateY(2px)}.danger{color:#a64c3f}.hero-metrics{display:flex;gap:27px;margin-top:26px}.hero-metrics>span{font-size:26px;color:#315e45;font-weight:850}.hero-metrics small{display:block;max-width:140px;font-size:11px;color:#73916e;font-weight:650;margin-top:3px}
.hero-art{position:relative;min-height:300px;align-self:center}.hero-art img{position:absolute;object-fit:contain;filter:drop-shadow(0 18px 9px #305c3a25)}.hero-disc{position:absolute;inset:15px -30px -50px 20px;border-radius:50%;background:radial-gradient(circle,#f5f6be,#accb73);border:12px solid #e8edba}.hero-player{width:210px;height:290px;left:8%;top:20px;transform:rotate(-24deg)}.hero-enemy{width:190px;height:245px;right:0;top:-8px;transform:rotate(145deg)}.hero-brick{width:170px;height:150px;right:4%;bottom:-15px;transform:rotate(-12deg)}.hero-grass{width:135px;height:140px;left:0;bottom:-20px}.hero-spark{position:absolute;width:14px;height:14px;border-radius:3px;background:#fff5ac;transform:rotate(45deg);box-shadow:0 0 20px #fff5ac}.spark-one{left:56%;top:32%}.spark-two{left:36%;bottom:5%;width:9px;height:9px}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:16px}.section-heading h2{margin:7px 0 0;font-size:27px}.room-actions{display:flex;gap:10px;flex-wrap:wrap}.section-description{margin-bottom:20px;max-width:900px}.rooms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:15px}.empty-rooms{grid-column:1/-1;border:2px dashed #bdcfaf;border-radius:20px;background:#f6f9eb;padding:30px;text-align:center}.room-card{display:flex;gap:18px;align-items:center;background:#fffdf1;border:2px solid #d8e3c5;padding:18px;border-radius:22px;box-shadow:0 4px #c0d1ae}.room-card canvas{border-radius:9px;border:4px solid #38664f;flex:none}.room-card h3{margin:7px 0;overflow-wrap:anywhere}.room-card .small-primary{margin-top:9px}.room-card .eyebrow{letter-spacing:.7px}.progress-pill{border-radius:16px;padding:12px 18px;background:#dcebc8;color:#51734b;font-size:13px}.progress-pill strong{margin-left:9px;color:#35613e}.stage-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:15px}.stage-card{position:relative;padding:12px 12px 14px;border:2px solid #c3d3aa;background:#fffdf0;border-radius:17px;box-shadow:0 4px #b2c79a;text-align:left;color:#2f5540;overflow:hidden}.stage-card canvas{width:100%;height:auto;border:3px solid #719a60;border-radius:8px;display:block}.stage-card strong{font-size:14px;display:block;margin:10px 0 5px}.stage-card small{font-size:10px;display:block;color:#779064}.stage-card.current{border-color:#cda04b;box-shadow:0 4px #b98c35;background:#fff0bb}.stage-card.locked{opacity:.65;filter:saturate(.4);cursor:not-allowed}.stage-number{position:absolute;top:16px;right:16px;padding:3px 6px;border-radius:6px;background:#214c3ce6;color:#ffeda4;font-size:12px;min-width:25px;text-align:center}
.about-game{display:grid;grid-template-columns:1fr 1fr;gap:35px;border-radius:24px;padding:28px;background:#f8faef;border:2px solid #dae5cc}.about-game h3{margin-top:22px}.enemy-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.enemy-cards figure{margin:0;text-align:center;background:#e8efda;border-radius:13px;padding:12px 5px}.enemy-cards img{width:75%;height:100px;object-fit:contain}.enemy-cards figcaption{font-size:11px;font-weight:750;min-height:30px;overflow-wrap:anywhere}.enemy-cards small{font-size:11px;color:#78906a}.buff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.buff-card{display:flex;gap:15px;padding:20px;background:#fffdf2;border:2px solid #dbe3c6;border-radius:20px;align-items:center}.buff-card h3{margin:0 0 8px;font-size:16px}.buff-card p{font-size:12px}.buff-icon{width:64px;height:64px;flex:none;background-image:url('assets/runtime/classic/powerups.webp');background-size:300% 200%;border-radius:12px}.buff-helmet{background-position:0 0}.buff-clock{background-position:50% 0}.buff-shovel{background-position:100% 0}.buff-star{background-position:0 100%}.buff-grenade{background-position:50% 100%}.buff-tank{background-position:100% 100%}.local-note{font-size:12px;text-align:center;padding:15px;border-radius:12px;background:#e1ebd5}
.boot{position:fixed;inset:62px 0 0;background:#edf3e5;z-index:20;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;padding:25px;text-align:center}.toast{position:fixed;top:78px;left:50%;transform:translate(-50%,-15px);padding:14px 22px;background:#234d41;color:#fff3ca;border:2px solid #90b57c;border-radius:15px;box-shadow:0 5px 20px #12352b30;font-size:14px;max-width:90vw;width:max-content;z-index:100;opacity:0;pointer-events:none;transition:.2s}.toast.visible{opacity:1;transform:translate(-50%,0)}
.room-heading,.waiting-panel{width:min(100%,calc(var(--field-size) + var(--hud-width)));display:flex;align-items:center;justify-content:space-between;gap:18px}.room-heading h2{margin:5px 0;font-size:20px;overflow-wrap:anywhere}.waiting-panel{background:#fcfbed;border:2px solid #cadbb6;border-radius:18px;padding:15px;flex-wrap:wrap}.waiting-panel>.primary{width:auto}.roster{display:flex;gap:18px;flex:1;flex-wrap:wrap}.roster-player{display:flex;align-items:center;gap:10px}.roster-player img{width:34px;height:46px;object-fit:contain}.roster-player strong{display:block;font-size:14px;overflow-wrap:anywhere}.roster-player span{display:block;font-size:11px;color:#678666;max-width:220px}.borrowed-note{width:100%;order:3;font-size:12px;background:#fff0bc;color:#88652e;padding:9px 12px;border-radius:10px}.arena-header h2{font-size:20px;margin:0}.battle-status{font-size:11px;color:#6a886e}.arena-stats{gap:9px;padding:12px}.hud-player-block{border-top:1px solid #507562;padding-top:9px;margin-top:9px}.hud-player{display:flex;font-weight:750;font-size:11px;margin-bottom:7px}.hud-player>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:83px}.hud-small{display:flex;justify-content:space-between;align-items:center;gap:5px;margin:3px 0;font-size:10px;color:#afccae}.hud-small strong{font-size:14px;color:#fff2b7}.hud-stage strong{font-size:25px}.hud-section strong{font-size:23px}.hud-section strong.good{font-size:17px}.network-cover{position:absolute;inset:0 var(--hud-width) 0 0;background:#214d48df;display:grid;place-items:center;z-index:12;color:#fff1b6;font-weight:800;text-align:center;padding:25px;font-size:20px}.overlay{right:var(--hud-width);padding:12px;overflow:auto;backdrop-filter:blur(3px)}.result-dialog{padding:20px;width:min(410px,100%);max-height:100%;overflow:auto;flex:none}.result-dialog h2{font-size:26px;margin:8px 0 12px}.result-dialog p{font-size:12px;margin:12px 0}.result-player{padding:10px 0;border-top:1px solid #d8dfc9;text-align:left;font-size:13px}.result-player>b{font-size:12px;color:#82702f}.tally{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:5px 0}.tally span{display:flex;align-items:center;font-size:12px;gap:3px;white-space:nowrap}.tally img{width:24px;height:31px;object-fit:contain}#resultActions{display:flex;flex-direction:column;gap:10px}.dialog .secondary{padding:5px}
.modal{width:min(560px,calc(100vw - 30px));max-height:90dvh;overflow:auto;border:3px solid #eff5da;border-radius:25px;padding:28px;background:#fffdf2;color:#315245;box-shadow:0 8px #557451,0 20px 70px #183c3350}.modal::backdrop{background:#173e3b88;backdrop-filter:blur(5px)}.modal h2{font-size:27px;margin-right:20px}.modal form>label{display:block;font-size:13px;font-weight:750;margin:16px 0;color:#55745d}.modal input:not([type=radio]),.modal select{display:block;width:100%;padding:12px 13px;font:inherit;border:2px solid #c1d2b2;border-radius:11px;background:#f9fbee;color:#315245;margin-top:7px}.modal input:focus,.modal select:focus{outline:3px solid #d5e9b9;outline-offset:1px}.dialog-close{position:absolute;right:16px;top:14px;width:32px;height:32px;border:0;border-radius:50%;font-size:24px;background:#e8efda;color:#64845a}.dialog-actions{display:flex;gap:12px;margin-top:22px}.dialog-actions>.primary{width:auto;flex:1}.mode-options{display:flex;flex-direction:column;gap:8px}.mode-option{display:grid;grid-template-columns:20px 1fr;column-gap:10px;border:2px solid #e0e8cd;border-radius:13px;padding:12px;cursor:pointer}.mode-option:has(input:checked){border-color:#d2a13b;background:#fff1c3}.mode-option input{grid-row:1/3;accent-color:#a68121}.mode-option strong{font-size:13px}.mode-option small{font-size:11px;color:#74836a;margin-top:5px;line-height:1.5}.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.profile-stats>span{font-size:11px;padding:12px;background:#edf1df;border-radius:12px}.profile-stats strong{display:block;font-size:23px;margin-top:5px;color:#4c744b}
@media(max-width:1000px){.stage-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.hero-game{padding:30px}.hero-player{width:165px;height:250px}.hero-enemy{width:145px;height:195px}.hero-brick{width:130px}.buff-grid{grid-template-columns:repeat(2,1fr)}.about-game{gap:20px}}
@media(max-width:800px){.header{flex-wrap:wrap}.header-tools{gap:6px}.header-tools .connection{display:none}.lobby-layout{padding:12px 16px 35px;gap:28px}.hero-game{grid-template-columns:1.2fr .8fr;padding:25px;min-height:320px}.hero-copy p{font-size:13px}.hero-actions{gap:8px}.hero-actions .primary{font-size:14px;min-width:130px}.hero-metrics{gap:15px}.hero-metrics>span{font-size:22px}.hero-art{min-height:230px}.hero-player{width:130px;height:190px;left:0;top:40px}.hero-enemy{width:120px;height:165px;right:-10px}.hero-brick{width:100px;height:100px;bottom:-5px}.hero-grass{width:85px;height:100px}.hero-disc{inset:40px -30px -30px 0}.about-game{grid-template-columns:1fr}.stage-grid{gap:10px}.stage-card{padding:8px}.stage-number{top:11px;right:11px;font-size:10px}.room-heading{gap:8px;flex-wrap:wrap}.arena-stats{gap:7px;padding:11px 8px}.hud-player-block{padding-top:5px;margin-top:5px}.hud-small{font-size:9px;margin:2px 0}.hud-small strong{font-size:12px}.hud-player{font-size:10px;gap:5px;margin-bottom:3px}.hud-player img{width:19px;height:26px}.hud-section strong.good{font-size:14px}.arena-header h2{font-size:17px}.arena-header{padding:10px 12px;min-height:39px}.waiting-panel{padding:12px}}
@media(max-width:520px){.header{gap:8px}.header-tools{width:100%;justify-content:space-between}.header-tools select{max-width:110px}.header-tools .small-button{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero-game{display:block;padding:24px 21px}.hero-copy h1{font-size:33px;max-width:330px}.hero-copy p{font-size:14px}.hero-art{height:205px;min-height:0;margin-top:15px}.hero-disc{inset:25px -20px -40px 10px}.hero-player{width:130px;height:200px;left:16%;top:0}.hero-enemy{width:120px;height:155px;right:8%;top:-5px}.hero-brick{width:115px;height:105px;right:9%;bottom:-10px}.hero-grass{left:9%;bottom:-6px}.hero-actions .primary{flex:1}.hero-metrics{justify-content:space-between}.hero-metrics small{font-size:10px}.stage-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.stage-card strong{font-size:12px}.section-heading h2{font-size:24px}.room-actions{gap:7px}.outline-button,.small-primary{padding:9px 11px;font-size:11px}.buff-grid{grid-template-columns:1fr}.about-game{padding:20px}.rooms-grid{grid-template-columns:1fr}.room-card{padding:14px;gap:12px}.room-card canvas{width:85px;height:85px}.enemy-cards img{height:75px}.buff-card{padding:15px}.room-heading h2{font-size:17px}.roster-player strong{font-size:12px}.roster-player span{font-size:10px}.waiting-panel>.primary{font-size:12px;padding:9px}.roster{gap:10px}.hud-player>span{max-width:39px;font-size:8px}.hud-player img{width:13px;height:20px}.hud-player{gap:3px}.arena-stats{gap:5px;padding:7px 5px}.hud-small{font-size:7px;margin:1px 0;gap:2px}.hud-small strong{font-size:9px}.hud-section strong{font-size:16px}.hud-section strong.good{font-size:10px}.hud-section>span,.hud-section div>span{font-size:8px}.hud-stage{gap:3px}.hud-stage svg{width:13px;height:19px}.hud-stage strong{font-size:18px}.hud-player-block{margin-top:3px;padding-top:3px}.arena-header h2{font-size:15px}.battle-status{font-size:9px}.arena-footer>span:last-child{font-size:9px}.result-dialog{padding:12px;border-radius:15px}.result-dialog h2{font-size:21px}.result-player{font-size:11px;padding:6px 0}.tally{gap:2px}.tally span{font-size:9px;gap:0}.tally img{width:17px;height:23px}.result-dialog p{font-size:10px}.result-dialog .primary{font-size:12px;padding:9px}.modal{padding:25px 20px}.profile-stats{gap:5px}.profile-stats>span{padding:8px;font-size:10px}.profile-stats strong{font-size:20px}.network-cover{font-size:14px;padding:15px}}
@media(max-height:500px) and (min-width:600px){:root{--field-size:calc(100dvh - 100px);--hud-width:106px}.header{min-height:48px;padding:5px 12px}.brand svg{height:30px;width:30px}.brand strong{font-size:17px}.brand small{display:none}.room-heading{position:absolute;right:12px;top:100px;max-width:130px;flex-direction:column;align-items:flex-start}.room-heading h2{font-size:13px}.room-heading .room-actions{flex-direction:column}.arena-header{min-height:32px;padding:5px 12px}.arena-footer{min-height:22px;padding:4px 10px}.layout{padding:0 12px 15px;gap:5px}.touch-controls{position:absolute;left:12px;top:110px;width:150px;padding:0;flex-wrap:wrap;gap:20px}.touch-fire{width:65px;height:65px}.touch-pad{grid-template-columns:repeat(3,31px);grid-template-rows:repeat(3,31px)}.touch-pad button{min-height:31px;font-size:20px}.guide{margin-top:3px}.arena-stats{padding:7px 8px;gap:5px}.hud-small{font-size:8px}.hud-small strong{font-size:10px}.hud-player-block{padding-top:3px;margin-top:3px}.hud-player img{height:20px}.enemy-token{height:10px}.enemy-queue{gap:2px}.hud-section strong{font-size:18px}.hud-stage strong{font-size:19px}.waiting-panel{position:relative;z-index:2}.room-heading .eyebrow{font-size:8px}.result-dialog h2{font-size:20px}}
.arena-panel{width:min(100%,calc(var(--field-size) + var(--hud-width) + 2px))}
@media(max-width:800px){:root{--field-size:min(calc(100dvh - 154px),calc(100vw - 26px - 106px))}.arena-panel{width:100%}}
@media(max-width:520px){:root{--field-size:calc(100vw - 26px - 70px)}.arena-stats{gap:3px;padding:5px}.hud-player-block{display:grid;grid-template-columns:1fr 1fr;gap:1px;padding-top:2px;margin-top:2px}.hud-player{grid-column:1/-1;margin:0}.hud-player img{height:16px}.hud-small{margin:0;font-size:7px;line-height:1.1}.hud-small strong{font-size:9px}.hud-small>span{display:none}.hud-small:nth-child(2):before{content:'♥';color:#c8e6b3}.hud-small:nth-child(4):before{content:'★';color:#ffdc78}.hud-small:nth-child(3){grid-column:1/-1;order:3}.hud-small:nth-child(3):before{content:'●';color:#f1cb64}.hud-stage svg{height:16px}.hud-stage strong{font-size:16px}}
@media(max-height:500px) and (min-width:600px){.arena-panel{width:calc(var(--field-size) + var(--hud-width) + 2px);max-width:100%}}
@media(max-width:350px){.enemy-queue{grid-template-columns:repeat(10,4px);gap:1px}.enemy-token{width:4px;height:7px}.room-heading{display:grid;grid-template-columns:1fr 110px;gap:6px}.room-heading .room-actions{flex-direction:column;gap:4px}.room-heading .outline-button{font-size:8px;padding:6px}.room-heading .eyebrow{font-size:8px;letter-spacing:1px}.room-heading h2{font-size:13px}.arena-header h2{font-size:14px}.arena-footer>span:last-child{font-size:8px}}
@media(max-height:500px) and (min-width:600px){.touch-controls{display:flex}.enemy-queue{grid-template-columns:repeat(10,6px);gap:2px}.enemy-token{width:6px;height:9px}.hud-section{gap:3px}.hud-section>span,.hud-section div>span{font-size:9px}.hud-section strong.good{font-size:12px}.hud-stage svg{height:20px;width:18px}.hud-player-block{display:grid;grid-template-columns:1fr 1fr;gap:2px}.hud-player{grid-column:1/-1;margin:0;gap:4px;font-size:9px}.hud-player>span{max-width:65px}.hud-player img{width:17px;height:18px}.hud-small{margin:0;font-size:8px;line-height:1.1}.hud-small>span{display:none}.hud-small:nth-child(2):before{content:'♥';color:#c8e6b3}.hud-small:nth-child(4):before{content:'★';color:#ffdc78}.hud-small:nth-child(3){grid-column:1/-1;order:3}.hud-small:nth-child(3):before{content:'●';color:#f1cb64}.hud-stage strong{font-size:18px}}
/* Server-ranked campaign standings. */
.leaderboard-dialog{width:min(720px,calc(100vw - 28px))}.board-description{font-size:13px;margin-bottom:16px}.board-mine{margin:12px 0;padding:11px 14px;border-radius:11px;background:#e7eed7;font-size:13px;color:#47684c}.leaderboard-table{width:100%;table-layout:fixed;border-collapse:collapse;font-size:14px;margin:15px 0}.leaderboard-table .board-place{width:10%}.leaderboard-table .board-name{width:32%}.leaderboard-table .board-stage{width:17%}.leaderboard-table .board-score{width:25%}.leaderboard-table .board-wins{width:16%}.leaderboard-table th,.leaderboard-table td{padding:10px 6px;text-align:right;border-bottom:1px solid #d8e3c9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leaderboard-table thead th{font-size:12px;color:#6c8662;background:#f1f4e6}.leaderboard-table th:nth-child(2){text-align:left}.leaderboard-table tbody th{text-align:left;font-weight:750}.leaderboard-table th:first-child,.leaderboard-table td:first-child{text-align:center}.leaderboard-table tbody tr:nth-child(-n+3) td:first-child{font-weight:850;color:#9b7229}.leaderboard-table .board-own{background:#fff0bd}.board-empty{padding:25px 15px;border:2px dashed #cad9b8;border-radius:15px;font-size:14px;text-align:center}
.board-mobile-stats{display:none}
@media(max-width:520px){.leaderboard-dialog{padding:22px 14px}.leaderboard-table{font-size:13px}.leaderboard-table th,.leaderboard-table td{padding:10px 4px}.leaderboard-table thead th{font-size:12px}.leaderboard-table :is(th,td):nth-child(3),.leaderboard-table :is(th,td):nth-child(5),.leaderboard-table .board-stage,.leaderboard-table .board-wins{display:none}.leaderboard-table .board-place{width:10%}.leaderboard-table .board-name{width:57%}.leaderboard-table .board-score{width:33%}.leaderboard-table tbody th{white-space:normal;overflow-wrap:anywhere}.board-mobile-stats{display:block;font-size:11px;font-weight:500;color:#5e7859;margin-top:5px}.board-description,.board-mine{font-size:13px}}
