@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Inter:wght@500;600;700;800&display=swap');
.upgrade-card .cost small{display:block;color:var(--muted);font:700 8px Inter;text-transform:uppercase;letter-spacing:.08em}.upgrade-card .upkeep{color:#b51222;font:800 9px Inter;margin:-2px 0 7px;white-space:nowrap}.table-note{margin:0 0 6px;padding:7px 10px;border-radius:7px;background:#fff0cf;color:#9b4300;font:700 10px Inter}th small{color:var(--muted);font:700 8px Inter;letter-spacing:.04em}.level-upkeep{display:block;margin-top:2px;color:#cf2925;font:800 8px Inter;white-space:nowrap}.active-cell .level-upkeep{color:#fff3a7}
:root{--blue:#08a9f4;--navy:#082c4b;--red:#e6322b;--paper:#f7fcff;--line:#b4ccda;--muted:#668395}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(135deg,#0479be,#12b8f8 55%,#0369aa);color:var(--navy);font-family:Inter,Arial,sans-serif;display:grid;place-items:center;padding:28px}.game-shell{width:min(1120px,100%);background:var(--paper);border:5px solid white;border-radius:22px;overflow:hidden;box-shadow:0 24px 70px #00395d66}.game-header{height:138px;position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(120deg,#0aaff8,#079be5);color:white;overflow:hidden}.game-header:before,.game-header:after{content:'⚙';position:absolute;color:#d8f5ff;font-size:105px;opacity:.85}.game-header:before{left:-28px;top:-25px}.game-header:after{right:-20px;bottom:-48px}.logo-mark{position:absolute;left:74px;top:38px;font-size:37px;color:#d9f7ff}.brand{text-align:center;line-height:.72;transform:rotate(-3deg);filter:drop-shadow(0 4px 0 #0869a8);z-index:1}.brand small{display:block;letter-spacing:.28em;font:600 12px Inter;margin:0 0 8px 12px}.brand strong,.brand b{display:block;font:900 43px/32px 'Barlow Condensed';-webkit-text-stroke:2px white}.brand strong{color:#ff8b19}.brand b{color:#ed252d;margin-left:35px}.round-card{position:absolute;z-index:2;right:18px;top:17px;width:112px;background:white;border:2px solid var(--red);border-radius:10px;overflow:hidden;text-align:center;color:#222}.round-card span{display:block;padding:5px;background:var(--red);color:white;font:700 13px Inter;letter-spacing:.08em}.round-card strong{display:block;font:900 38px 'Barlow Condensed';line-height:43px}.round-card button{width:100%;border:0;background:var(--red);color:white;padding:8px;font-weight:800}.round-card i{font-style:normal;margin-left:7px}.score-strip{height:60px;display:grid;grid-template-columns:130px 180px 1fr;align-items:center;background:white;border-bottom:1px solid var(--line)}.score-strip>span{height:100%;display:grid;place-items:center;background:var(--red);color:white;font:800 18px 'Barlow Condensed';clip-path:polygon(0 0,92% 0,100% 50%,92% 100%,0 100%)}.score-strip strong{color:var(--red);font:900 28px 'Barlow Condensed';text-align:center}.score-strip small{color:var(--muted);padding:0 24px}.game-board{padding:14px}.upgrade-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}.upgrade-card{min-height:176px;border:1px solid var(--line);border-radius:11px;background:white;text-align:center;overflow:hidden;display:flex;flex-direction:column;align-items:center}.upgrade-card h2{width:100%;margin:0;padding:9px 4px;background:#e8f7ff;font:800 16px 'Barlow Condensed';text-transform:uppercase}.upgrade-card .icon{font-size:35px;line-height:48px}.upgrade-card .level{font:800 12px Inter;color:var(--muted)}.upgrade-card .cost{color:var(--red);font:800 14px 'Barlow Condensed';margin:5px 0 10px}.upgrade-card button{margin-top:auto;width:calc(100% - 14px);border:0;border-radius:7px;background:linear-gradient(#ff9e26,#f5780c);box-shadow:0 3px 0 #c55200;color:white;padding:9px 5px;font:800 13px Inter;margin-bottom:10px}.upgrade-card button:disabled{background:#b9c7ce;box-shadow:0 3px 0 #84939a;cursor:not-allowed}.upgrade-card.sales{background:#fff9ee;border-color:#f4c681}.upgrade-card.sales h2{background:#fff0cf}.upgrade-card.sales .cost{color:#0682c2;font-size:19px}.table-wrap{border:1px solid #7fa5ba;border-radius:8px;overflow:auto}table{border-collapse:collapse;width:100%;min-width:650px;background:white;table-layout:fixed}th{background:#daf2ff;padding:8px 5px;text-transform:uppercase;font:800 12px 'Barlow Condensed'}td,th{border-right:1px solid #98b8c9;border-bottom:1px solid #b7ceda;text-align:center}td{height:43px;font:700 12px Inter}tr:last-child td{border-bottom:0}td:last-child,th:last-child{border-right:0}.level-cell{width:74px}.revenue-cell{width:130px}.active-cell{background:#e5302d!important;color:white;position:relative;font-size:14px}.active-cell:after{content:'';position:absolute;inset:4px;border:1px solid #ffffff66}.revenue-active{background:#fff0cf;color:#c45100}.row-current td:first-child{background:#0da8ed;color:white}footer{height:54px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#06a8ef,#057bbc);color:white;font:800 12px Inter;letter-spacing:.08em}footer button{border:1px solid #ffffff88;border-radius:7px;background:#ffffff18;color:white;padding:7px 12px}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);background:#082c4b;color:white;border-radius:10px;padding:11px 18px;box-shadow:0 10px 30px #001c2f55;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}button{cursor:pointer}
@media(max-width:760px){
 body{display:block;padding:0;background:#079ee6;overflow-x:hidden}
 .game-shell{width:100%;border:0;border-radius:0;min-height:100dvh;box-shadow:none}
 .game-header{height:88px;justify-content:center;padding-right:76px}
 .game-header:before,.game-header:after{font-size:72px}
 .brand{transform:rotate(-2deg) scale(.86);transform-origin:center}
 .brand strong,.brand b{font-size:32px;line-height:24px}
 .brand small{font-size:8px}
 .round-card{width:72px;right:5px;top:5px;border-radius:7px}
 .round-card span{font-size:9px;padding:3px}
 .round-card strong{font-size:25px;line-height:27px}
 .round-card button{font-size:9px;padding:5px 2px}
 .logo-mark{display:none}
 .score-strip{height:43px;grid-template-columns:88px 108px minmax(0,1fr)}
 .score-strip>span{font-size:14px}
 .score-strip strong{font-size:20px}
 .score-strip small{font-size:8px;line-height:1.25;padding:0 5px;overflow-wrap:anywhere}
 .game-board{padding:6px}
 .upgrade-grid{gap:3px;margin-bottom:6px}
 .upgrade-card{min-width:0;min-height:118px;border-radius:5px}
 .upgrade-card h2{font-size:8px;padding:5px 0;white-space:nowrap}
 .upgrade-card .icon{font-size:19px;line-height:28px}
 .upgrade-card .level{font-size:7px;line-height:1.2;padding:0 1px}
 .upgrade-card .cost{font-size:9px;margin:3px 0 4px}
 .upgrade-card button{font-size:7px;padding:6px 0;margin-bottom:4px;width:calc(100% - 5px);box-shadow:0 2px 0 #c55200}
 .upgrade-card.sales .cost{font-size:10px}
 .table-wrap{width:100%;overflow:hidden;border-radius:7px}
 .table-wrap table{width:100%;min-width:0;table-layout:fixed}
 th{font-size:7px;padding:5px 0;overflow:hidden}
 td{height:32px;font-size:9px;padding:0}
 .level-cell{width:14%}
 .revenue-cell{width:20%;font-size:8px}
 .active-cell{font-size:11px}
 .active-cell:after{inset:2px}
 footer{height:36px;padding:0 8px;font-size:8px}
 footer button{font-size:8px;padding:5px 8px}
}

@media(max-width:380px){
 .game-header{padding-right:67px}
 .brand{transform:rotate(-2deg) scale(.76)}
 .round-card{width:64px}
 .score-strip{grid-template-columns:72px 95px minmax(0,1fr)}
 .score-strip>span{font-size:12px}
 .score-strip strong{font-size:17px}
 .upgrade-card h2{font-size:7px}
 .upgrade-card .icon{font-size:17px}
 .upgrade-card .level{font-size:6px}
 .upgrade-card button{font-size:6px}
 th{font-size:6px}
 .revenue-cell{font-size:7px}
}

.sale-celebration{position:fixed;z-index:50;inset:0;display:grid;place-items:center;pointer-events:none;visibility:hidden}.sale-celebration.active{visibility:visible;animation:celebrationFade 2.2s ease both}.sale-burst{position:relative;min-width:280px;padding:24px 38px 22px;text-align:center;color:white;border:3px solid #ffe588;border-radius:22px;background:radial-gradient(circle at 50% 0,#21c1ff,#0478bc 58%,#063d6a);box-shadow:0 0 0 7px #fff,0 18px 60px #001e37aa,0 0 70px #ffd13c99;animation:saleBurst 2.2s cubic-bezier(.18,.89,.32,1.28) both;overflow:hidden}.sale-burst:before{content:'';position:absolute;inset:-60%;background:conic-gradient(transparent,#ffffff77,transparent 18%);animation:shineSpin 1.6s linear infinite}.sale-burst>*{position:relative;z-index:1}.sale-burst span{display:block;color:#fff09b;font:900 17px 'Barlow Condensed';letter-spacing:.18em}.sale-burst strong{display:block;color:#fff;font:900 58px/.95 'Barlow Condensed';text-shadow:0 4px 0 #e57800,0 7px 18px #002945}.sale-burst b{display:block;color:#ffe37c;font:900 20px 'Barlow Condensed';letter-spacing:.3em;margin-left:.3em}.sale-burst small{display:block;margin-top:12px;font-weight:800}.coin-rain{position:absolute;inset:0;overflow:hidden}.coin-rain i{position:absolute;top:-35px;left:calc(5% + (var(--i) * 7%));width:23px;height:23px;border-radius:50%;display:grid;place-items:center;color:#d78b00;background:#ffd637;border:2px solid #fff09c;box-shadow:inset 0 -3px #e39a00;font-size:8px;animation:coinFall 1.5s calc(var(--i) * .055s) ease-in both}@keyframes saleBurst{0%{opacity:0;transform:scale(.25) rotate(-8deg)}16%{opacity:1;transform:scale(1.14) rotate(2deg)}26%{transform:scale(1)}78%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.8) translateY(-25px)}}@keyframes coinFall{0%{opacity:0;transform:translateY(-20px) rotate(0)}12%{opacity:1}100%{opacity:0;transform:translateY(105vh) rotate(720deg)}}@keyframes shineSpin{to{transform:rotate(360deg)}}@keyframes celebrationFade{0%,80%{background:#002e4b00}15%,65%{background:#002e4b55}100%{background:#002e4b00}}
.upgrade-celebration{position:fixed;z-index:45;top:18%;left:50%;pointer-events:none;visibility:hidden}.upgrade-celebration.active{visibility:visible}.upgrade-pop{display:flex;align-items:center;gap:14px;min-width:270px;padding:15px 22px 15px 15px;border:3px solid white;border-radius:18px;color:white;background:linear-gradient(125deg,#ff9b20,#ee3e29);box-shadow:0 13px 35px #86200066,0 0 35px #ffb52d88;animation:upgradePop 1.5s cubic-bezier(.16,.85,.26,1.2) both}.upgrade-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:14px;background:#fff;color:#222;font-size:32px;box-shadow:0 5px 0 #c93d21}.upgrade-pop small{display:block;color:#fff4b5;font:800 11px Inter;letter-spacing:.16em}.upgrade-pop strong{display:block;font:900 25px 'Barlow Condensed';line-height:1.1}.upgrade-pop strong b{display:inline-block;color:#fff083;font-size:31px;animation:plusPulse .55s ease .2s both}.upgrade-pop em{display:block;margin-top:3px;color:#fff;font:800 12px Inter;font-style:normal}@keyframes upgradePop{0%{opacity:0;transform:translate(-50%,-35px) scale(.55) rotate(-5deg)}16%{opacity:1;transform:translate(-50%,0) scale(1.1) rotate(2deg)}27%,76%{opacity:1;transform:translate(-50%,0) scale(1) rotate(0)}100%{opacity:0;transform:translate(-50%,-22px) scale(.9)}}@keyframes plusPulse{0%{transform:scale(.2)}65%{transform:scale(1.45)}100%{transform:scale(1)}}
.round-celebration{position:fixed;z-index:55;inset:0;display:grid;place-items:center;pointer-events:none;visibility:hidden}.round-celebration.active{visibility:visible;animation:roundBackdrop 2.2s ease both}.round-transition{width:min(330px,86vw);padding:17px 24px 22px;text-align:center;color:white;border:4px solid white;border-radius:24px;background:linear-gradient(150deg,#ef3b32,#b51222);box-shadow:0 0 0 8px #ffcf36,0 22px 70px #4c0010cc;animation:roundEnter 2.2s cubic-bezier(.16,.88,.25,1.2) both}.round-transition>span{display:block;color:#ffe882;font:900 15px 'Barlow Condensed';letter-spacing:.3em}.round-transition>strong{display:block;font:900 92px/.86 'Barlow Condensed';text-shadow:0 6px 0 #7d0715;animation:roundNumber .65s ease .12s both}.round-cost{margin:13px 0 10px;padding:10px;border:1px solid #ffffff66;border-radius:10px;background:#74071477}.round-cost small{display:block;font:800 9px Inter;letter-spacing:.18em}.round-cost b{display:block;color:#fff18d;font:900 26px 'Barlow Condensed'}.round-transition em{display:inline-block;padding:6px 12px;border-radius:20px;background:#fff;color:#a31621;font:900 11px Inter;font-style:normal}.round-transition.danger{animation:roundEnter 2.2s cubic-bezier(.16,.88,.25,1.2) both,warningShake .35s .55s 3}.round-transition.danger em{background:#ffd42a;color:#7d0715}@keyframes roundEnter{0%{opacity:0;transform:scale(.25) rotateY(80deg)}18%{opacity:1;transform:scale(1.1) rotateY(0)}28%,78%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.8) translateY(-30px)}}@keyframes roundNumber{0%{opacity:0;transform:scale(3)}70%{opacity:1;transform:scale(.85)}100%{transform:scale(1)}}@keyframes warningShake{25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}@keyframes roundBackdrop{0%,82%{background:#23000900}15%,70%{background:#23000988}100%{background:#23000900}}
.game-over{position:fixed;z-index:100;inset:0;display:none;place-items:center;padding:20px;background:radial-gradient(circle,#600916dd,#120006f5);pointer-events:auto}.game-over.active{display:grid;animation:gameOverFade .55s ease both}.game-over-card{width:min(350px,90vw);padding:25px;text-align:center;color:white;border:3px solid #ff4651;border-radius:22px;background:linear-gradient(160deg,#251017,#09090d);box-shadow:0 0 0 7px #160006,0 0 80px #f20b2c88;animation:gameOverDrop .75s cubic-bezier(.16,.9,.24,1.2) both}.game-over-card>span{color:#ff7b82;font:900 13px Inter;letter-spacing:.25em}.game-over-card h2{margin:8px 0 18px;color:white;font:900 72px/.72 'Barlow Condensed';letter-spacing:.04em;text-shadow:4px 5px 0 #a50018}.game-over-card>div{display:grid;grid-template-columns:1fr 1fr;gap:5px 15px;margin:0 auto 20px;padding:13px;border:1px solid #ffffff33;border-radius:10px}.game-over-card small{color:#a8a0a3;font:800 8px Inter;letter-spacing:.12em}.game-over-card strong{font:900 19px 'Barlow Condensed';color:#ffcc56}.game-over-card button{width:100%;border:0;border-radius:9px;padding:12px;background:linear-gradient(#ff4651,#cc0927);box-shadow:0 4px 0 #780014;color:white;font-weight:900}@keyframes gameOverFade{from{opacity:0}to{opacity:1}}@keyframes gameOverDrop{0%{opacity:0;transform:translateY(-80px) scale(1.35);filter:blur(8px)}65%{opacity:1;transform:translateY(8px) scale(.96);filter:none}100%{transform:none}}
.round-card small{display:block;padding:5px;background:#fff;color:var(--red);font:900 10px Inter}.game-setup{position:fixed;z-index:110;inset:0;display:grid;place-items:center;padding:20px;background:radial-gradient(circle,#057db9dd,#032840f5)}.game-setup.hidden{display:none}.setup-card{width:min(470px,94vw);padding:30px;text-align:center;color:white;border:4px solid white;border-radius:24px;background:linear-gradient(145deg,#09aef4,#0573b7);box-shadow:0 25px 80px #001b30aa}.setup-card>span{color:#ffe47b;font:900 13px Inter;letter-spacing:.22em}.setup-card h2{margin:8px 0;font:900 38px 'Barlow Condensed'}.setup-card p{margin:0 0 22px;color:#d8f5ff}.setup-card>div{display:grid;grid-template-columns:1fr 1fr;gap:14px}.setup-card button{border:2px solid #ffffff88;border-radius:15px;padding:18px 8px;color:#063456;background:white;font-weight:900;box-shadow:0 5px 0 #054d7a}.setup-card button:hover{transform:translateY(-2px)}.setup-card button strong{display:block;color:var(--red);font:900 42px 'Barlow Condensed'}.setup-card button small{display:block;margin-top:6px;color:#668395}.game-over.win{background:radial-gradient(circle,#078b52dd,#032b1bf5)}.game-over.win .game-over-card{border-color:#ffe66d;background:linear-gradient(160deg,#087744,#043421);box-shadow:0 0 0 7px #053c27,0 0 80px #ffe44d88}.game-over.win .game-over-card>span{color:#fff19a}.game-over.win .game-over-card h2{text-shadow:4px 5px 0 #075231}.game-over.win .game-over-card button{background:linear-gradient(#ffe66d,#efad18);box-shadow:0 4px 0 #a56b00;color:#3c2c00}
.setup-card.roles{width:min(720px,96vw);max-height:92vh;overflow:auto}.role-fields{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;text-align:left}.role-field{display:grid;grid-template-columns:80px 1fr;align-items:center;gap:10px}.role-field label{font-weight:900}.role-field select{width:100%;min-width:0;border:2px solid #ffffff88;border-radius:9px;padding:10px;background:white;color:#063456;font-weight:700}.role-actions{display:grid!important;grid-template-columns:1fr 2fr!important;gap:12px!important;margin-top:20px}.role-actions button{padding:12px}.role-actions .back{background:#d8ecf6;box-shadow:0 5px 0 #7ba4b9}.role-error{min-height:18px;margin:10px 0 0!important;color:#fff09b!important;font-weight:800}@media(max-width:560px){.setup-card>div,.role-actions{grid-template-columns:1fr!important}.role-field{grid-template-columns:1fr;gap:4px}}
.role-actions.single{grid-template-columns:1fr!important}
.game-over-card .new-game-button{margin-top:10px;background:#3b3034;box-shadow:0 4px 0 #171214}
.recurring-cost small{display:block;margin-top:3px;color:#668395;font-size:9px}.active-cell.recurring-cost small{color:#fff}.table-note{padding:8px 12px;color:#8a5200;background:#fff1c9;font-weight:800}.table-note strong{color:#d5232f}
