:root{--ink: #15121e;--panel: rgba(21, 18, 30, .86);--panel2: rgba(43, 33, 54, .9);--cream: #efe4c4;--gold: #efb93a;--red: #e04a4a;--green: #84c45a;--blue: #6ec0e6;--font: "Silkscreen", "Press Start 2P", monospace;--font2: "VT323", "Silkscreen", monospace}html,body{margin:0;padding:0;background:#15121e;overflow:hidden;width:100%;height:100%}#game{display:block;image-rendering:pixelated;position:absolute;left:0;top:0}#hud{position:fixed;inset:0;pointer-events:none;font-family:var(--font2);font-size:20px;color:var(--cream);user-select:none}#hud *{box-sizing:border-box}#hud button{font-family:inherit;color:inherit}.dim{opacity:.65;font-size:.85em}.bad{color:#ff8a8a}.good{color:var(--green)}.topbar{position:absolute;left:0;right:0;top:0;display:flex;align-items:stretch;gap:10px;padding:8px 12px;pointer-events:auto;background:linear-gradient(to bottom,#15121eeb,#15121e00)}.brand{display:flex;flex-direction:column;justify-content:center;padding:4px 12px;background:var(--panel);border:2px solid var(--cream);box-shadow:4px 4px 0 var(--ink)}.logo{font-family:var(--font);font-size:15px;letter-spacing:2px;color:var(--gold)}.era{font-size:16px;opacity:.85}.ver{font-size:12px;opacity:.5;margin-left:8px}.resources{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.res{display:flex;align-items:baseline;gap:5px;padding:4px 9px;background:var(--panel);border:2px solid rgba(239,228,196,.6);border-left:4px solid var(--c);box-shadow:3px 3px 0 var(--ink);min-width:92px;transition:transform .1s}.res .ico{font-size:16px}.res .val{font-family:var(--font);font-size:13px}.res .rate{font-size:14px;opacity:.8}.res .rate.up{color:var(--green)}.res .rate.down{color:#ff8a8a}.res.full .val{color:var(--gold)}.stats{margin-left:auto;display:flex;gap:6px;align-items:center}.stat{padding:4px 10px;background:var(--panel);border:2px solid rgba(239,228,196,.6);box-shadow:3px 3px 0 var(--ink);font-size:18px}.stat b{font-family:var(--font);font-size:12px}.bottombar{position:absolute;left:0;right:0;bottom:0;pointer-events:auto;padding:0 12px 10px;background:linear-gradient(to top,#15121ef2,#15121e00)}.tabs{display:flex;gap:4px;align-items:flex-end}.tab{background:var(--panel2);border:2px solid rgba(239,228,196,.5);border-bottom:none;padding:5px 12px 4px;font-size:17px;cursor:pointer;display:flex;gap:6px;align-items:center;opacity:.85}.tab span{color:var(--gold)}.tab:hover{opacity:1;background:#3b3350}.tab.active{opacity:1;background:var(--panel);border-color:var(--cream);color:#fff;padding-bottom:7px}.tools{margin-left:auto;display:flex;gap:4px}.tab.tool.active{background:#6a2a2a}.cards{display:flex;gap:8px;padding:10px;background:var(--panel);border:2px solid var(--cream);box-shadow:4px 4px 0 var(--ink);overflow-x:auto;min-height:118px;scrollbar-width:thin}.card{flex:0 0 auto;width:104px;background:var(--panel2);border:2px solid rgba(239,228,196,.35);padding:4px;cursor:pointer;text-align:center;display:flex;flex-direction:column;align-items:center;gap:2px;position:relative;transition:transform .08s}.card:hover{border-color:var(--cream);transform:translateY(-3px);background:#3b3350}.card.active{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold) inset}.card.locked{opacity:.45;filter:grayscale(.6)}.card.poor .cost{color:#ff8a8a}.card .icon{width:64px;height:64px;image-rendering:auto}.card .name{font-size:15px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:96px}.card .cost{font-size:13px;opacity:.9;line-height:1.1}.card .cost .lack{color:#ff8a8a}.road-icon{width:64px;height:64px;border:2px solid rgba(0,0,0,.4)}.road-icon.t0{background:repeating-linear-gradient(90deg,#8a6543 0 10px,#6b4a33 10px 14px)}.road-icon.t1{background:repeating-linear-gradient(45deg,#8e93a6 0 4px,#8a6543 4px 9px)}.road-icon.t2{background:repeating-conic-gradient(#7c8193 0 25%,#4a4e63 0 50%) 0 0 / 12px 12px}.road-icon.t3{background:linear-gradient(#3c3d49,#3c3d49) center/100% 60% no-repeat,#c1c5cf;position:relative}.road-icon.t3:after{content:"";position:absolute;left:6px;right:6px;top:50%;border-top:3px dashed #f2c94c}.status{position:absolute;left:50%;transform:translate(-50%);bottom:168px;padding:4px 14px;background:var(--panel);border:2px solid var(--green);font-size:18px;opacity:0;transition:opacity .15s;pointer-events:none;white-space:nowrap}.status.show{opacity:1}.status.bad{border-color:var(--red);color:#ff8a8a}.panel{position:absolute;right:12px;width:280px;background:var(--panel);border:2px solid var(--cream);box-shadow:4px 4px 0 var(--ink);padding:10px 12px;pointer-events:auto}.era-panel{top:76px}.era-title{font-family:var(--font);font-size:13px;color:var(--gold)}.sub{margin-bottom:8px}.next{margin:6px 0;padding:6px 8px;background:#ffffff0d;border-left:3px solid var(--blue)}.req{display:flex;justify-content:space-between;padding:2px 4px;font-size:17px;color:#ff9c9c}.req.ok{color:var(--green)}.req.ok:after{content:" ✓"}.btn{display:block;width:100%;margin-top:8px;padding:7px;background:#3b3350;border:2px solid var(--cream);font-size:17px;cursor:pointer;box-shadow:3px 3px 0 var(--ink)}.btn:hover{background:#4d4468}.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}.btn.primary{background:#2f6b3a;border-color:var(--green)}.btn.primary:hover{background:#3f8a45}.btn.primary.disabled{opacity:.5;cursor:not-allowed}.btn.danger{background:#6a2a2a;border-color:#e07555}.info-panel{top:330px}.info-panel .ph{display:flex;gap:8px;align-items:center}.info-panel .ph img{width:56px;height:56px;image-rendering:auto;background:#ffffff0d}.info-panel .x{margin-left:auto;background:none;border:none;font-size:18px;cursor:pointer;opacity:.7}.info-panel .desc{margin:6px 0;font-size:17px;opacity:.9}.bar{height:10px;background:#ffffff1a;border:1px solid rgba(255,255,255,.3);margin:6px 0 2px}.bar>div{height:100%;background:var(--gold)}.bar.eff>div{background:var(--green)}.tooltip{position:absolute;width:280px;background:var(--panel);border:2px solid var(--cream);box-shadow:4px 4px 0 var(--ink);padding:8px 10px;opacity:0;transition:opacity .1s;z-index:5}.tooltip.show{opacity:1}.tooltip b{font-family:var(--font);font-size:12px;color:var(--gold)}.tooltip .desc{margin:4px 0}.tooltip .flavor{font-style:italic;opacity:.7;font-size:16px;margin-bottom:4px}.tooltip .lines{font-size:16px;opacity:.9}.tooltip .cost{margin-top:6px;border-top:1px solid rgba(255,255,255,.15);padding-top:4px}.tooltip .cost .lack{color:#ff8a8a}.toasts{position:absolute;top:76px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;align-items:center}.toast{padding:6px 16px;background:var(--panel);border:2px solid var(--cream);box-shadow:3px 3px 0 var(--ink);opacity:0;transform:translateY(-8px);transition:all .25s;font-size:18px}.toast.show{opacity:1;transform:none}.toast.bad{border-color:var(--red);color:#ffb0b0}.toast.good{border-color:var(--green)}.toast.era{border-color:var(--gold);color:var(--gold);font-family:var(--font);font-size:13px}.float-root{position:absolute;inset:0;overflow:hidden}.float{position:absolute;font-family:var(--font);font-size:11px;text-shadow:2px 2px 0 var(--ink),-1px -1px 0 var(--ink),1px -1px 0 var(--ink),-1px 1px 0 var(--ink);white-space:nowrap}.float.big{font-size:15px}.era-flash{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.ef-inner{text-align:center;opacity:0;transform:scale(.8);transition:all .6s cubic-bezier(.2,1.4,.4,1);background:radial-gradient(ellipse at center,#15121ed9,#15121e00);padding:60px 140px}.era-flash.go .ef-inner{opacity:1;transform:scale(1)}.ef-small{font-size:22px;letter-spacing:3px;color:var(--cream)}.ef-big{font-family:var(--font);font-size:46px;color:var(--gold);text-shadow:4px 4px 0 var(--ink);margin:6px 0}.ef-sub{font-size:22px;opacity:.85}.help{position:absolute;inset:0;background:#15121e99;display:none;align-items:center;justify-content:center;pointer-events:auto}.help.show{display:flex}.help-box{width:560px;background:var(--panel);border:2px solid var(--cream);box-shadow:6px 6px 0 var(--ink);padding:18px 24px}.help-box h2{font-family:var(--font);color:var(--gold);margin:0 0 4px;letter-spacing:2px}.help-box table{width:100%;border-collapse:collapse;margin:10px 0}.help-box td{padding:3px 6px;border-bottom:1px solid rgba(255,255,255,.08)}.help-box td:first-child{color:var(--gold);white-space:nowrap;width:40%}.help-box .tip{font-size:17px;opacity:.85}.help-box .close{margin-top:8px;padding:6px 18px;background:#2f6b3a;border:2px solid var(--green);cursor:pointer;font-size:17px}.diag{position:absolute;left:12px;bottom:190px;padding:6px 10px;background:var(--panel);border:2px solid var(--cream);font-size:16px;white-space:pre;pointer-events:none;z-index:9}.intro{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:auto;background:#15121e8c;transition:opacity .6s}.intro.hide{opacity:0;pointer-events:none}.intro-box{text-align:center}.intro-title{font-family:var(--font);font-size:52px;color:var(--gold);text-shadow:5px 5px 0 var(--ink);letter-spacing:4px}.intro-sub{font-size:24px;margin:8px 0 20px;opacity:.9}.intro-btn{font-family:var(--font);font-size:16px;padding:12px 30px;background:#2f6b3a;border:3px solid var(--green);box-shadow:4px 4px 0 var(--ink);cursor:pointer;color:#fff}.intro-btn:hover{background:#3f8a45}.intro-small{margin-top:14px;font-size:18px;opacity:.7}.brand .saved{display:inline-block;margin-left:8px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#9fe6a0;opacity:0;transition:opacity .35s}.brand .saved.show{opacity:1}#hud.title-mode>:not(.title):not(.diag):not(.help):not(.toasts){opacity:0;pointer-events:none}#hud>:not(.title){transition:opacity .8s ease}.title{position:absolute;inset:0;pointer-events:auto;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:opacity .9s ease,transform .9s ease}.title.hide{opacity:0;transform:scale(1.05);pointer-events:none}.title:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 42%,#15121e00 28%,#15121e8c),linear-gradient(to bottom,#15121e66,#15121e00 28% 58%,#15121eb8)}.title canvas.fx{position:absolute;inset:0;width:100%;height:100%}.title .bar{position:absolute;left:0;right:0;height:7vh;background:var(--ink);transition:transform .9s cubic-bezier(.7,0,.3,1);z-index:2}.title .bar.top{top:0}.title .bar.bot{bottom:0}.title.hide .bar.top{transform:translateY(-100%)}.title.hide .bar.bot{transform:translateY(100%)}.title .inner{position:relative;text-align:center;z-index:1;padding:0 20px}.title .kicker{font-family:var(--font2);font-size:22px;letter-spacing:.32em;color:var(--cream);opacity:0;animation:t-rise 1.1s .15s ease both}.title .logo-big{font-family:var(--font);font-size:clamp(54px,9vw,124px);letter-spacing:.05em;line-height:1;margin:14px 0 10px;display:flex;justify-content:center}.title .logo-big span{display:inline-block;background:linear-gradient(#fff4b0,#f3c552 42%,#d9862a 78%,#a8571b);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#f3c552;filter:drop-shadow(0 3px 0 #7a4418) drop-shadow(0 3px 0 #4a2a10) drop-shadow(0 4px 0 #15121e) drop-shadow(0 0 22px rgba(239,185,58,.28));animation:t-drop .95s cubic-bezier(.18,1.45,.38,1) both,t-bob 4.2s ease-in-out infinite}.title .tag{font-family:var(--font2);font-size:26px;color:var(--cream);letter-spacing:.04em;min-height:1.3em;opacity:.95;text-shadow:2px 2px 0 var(--ink)}.title .summary{font-family:var(--font2);font-size:20px;color:var(--gold);margin-top:8px;opacity:0;animation:t-rise 1s 1.2s ease both;text-shadow:2px 2px 0 var(--ink)}.title .btns{display:flex;gap:14px;justify-content:center;margin-top:26px;opacity:0;animation:t-rise 1s 1s ease both}.title .tbtn{font-family:var(--font);font-size:15px;letter-spacing:.08em;padding:14px 30px;background:var(--panel);color:var(--cream);border:3px solid var(--cream);box-shadow:5px 5px 0 var(--ink);cursor:pointer;transition:transform .12s,background .12s,box-shadow .12s}.title .tbtn.primary{background:#2f6b3a;border-color:var(--green)}.title .tbtn.danger{background:#7a2a2a;border-color:#ff8a8a}.title .tbtn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink);background:#3f8a45}.title .tbtn.danger:hover{background:#9a3434}.title .foot{position:absolute;left:0;right:0;bottom:calc(7vh + 12px);display:flex;justify-content:space-between;padding:0 18px;font-family:var(--font2);font-size:17px;opacity:0;color:var(--cream);animation:t-rise 1s 1.6s ease both;text-shadow:1px 1px 0 var(--ink);z-index:1}.title .foot span:first-child{opacity:.55}@keyframes t-drop{0%{transform:translateY(-70px) rotate(-6deg);opacity:0}to{transform:translateY(0) rotate(0);opacity:1}}@keyframes t-bob{0%,to{translate:0 0}50%{translate:0 -5px}}@keyframes t-rise{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}