:root{--bg: #0e1116;--panel: rgba(18, 22, 29, .9);--panel-2: rgba(28, 33, 42, .9);--line: #2e3542;--text: #e6e9ee;--dim: #8d97a5;--accent: #ffd166;--pos: #6fbf73;--neg: #e06c6c;--font: system-ui, -apple-system, "Segoe UI", sans-serif;--serif: Georgia, "Times New Roman", serif}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;background:var(--bg);color:var(--text);font:13px/1.4 var(--font);overflow:hidden}canvas{display:block;position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none}button{font:inherit;color:var(--text);background:linear-gradient(#2a3140,#222834);border:1px solid var(--line);border-radius:5px;padding:3px 9px;cursor:pointer;box-shadow:0 1px #ffffff0a inset,0 1px 2px #00000059}button:hover{background:linear-gradient(#333b4c,#2a3140);border-color:#3c4556}button:active{transform:translateY(1px)}button.on{background:var(--accent);color:#111;border-color:var(--accent)}button.primary{background:var(--accent);color:#111;font-weight:600;padding:8px 18px}input,select{font:inherit;color:var(--text);background:#161b23;border:1px solid var(--line);border-radius:4px;padding:2px 6px}input[type=range]{width:110px;vertical-align:middle}h1,h2,h3{margin:0}h3{margin:12px 0 4px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim)}.dim{color:var(--dim)}.pos{color:var(--pos)}.neg{color:var(--neg)}.link{cursor:pointer;text-decoration:underline}.row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.hud>*{pointer-events:auto}.topbar{position:absolute;top:0;left:0;right:0;display:flex;gap:14px;align-items:center;padding:6px 12px;background:linear-gradient(#181d26f5,#10141bf0);border-bottom:1px solid var(--line);box-shadow:0 2px 8px #00000059;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.topbar .date{font:600 15px/1.2 var(--serif);letter-spacing:.02em;min-width:120px;color:#f2eee4}.topbar .speeds button{min-width:34px}.topbar .tools{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}.topbar label.tax{display:flex;align-items:center;gap:6px}.feed{position:absolute;left:0;top:44px;bottom:28px;width:300px;overflow-y:auto;padding:8px;background:var(--panel);border-right:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);scrollbar-width:thin;scrollbar-color:#3a4352 transparent}.feed .ev{padding:5px 8px 5px 10px;border-radius:4px;cursor:pointer;color:var(--dim);border-left:2px solid transparent;margin-bottom:2px;line-height:1.35}.feed .ev:hover{background:var(--panel-2);border-left-color:var(--accent)}.feed .ev.urgent{border-left-color:var(--neg)}.feed .ev.urgent{color:var(--text)}.feed .ev.discovery{color:var(--accent)}.feed .ev.hunger,.feed .ev.emigration,.feed .ev.bailout,.feed .ev.closed{color:#f0a3a3}.feed .ev.built,.feed .ev.founded,.feed .ev.road{color:#a3d9a5}.feed .when{color:var(--dim);font-variant-numeric:tabular-nums;margin-right:4px}.panel{position:absolute;right:0;top:44px;bottom:28px;width:400px;overflow-y:auto;padding:12px 14px;background:var(--panel);border-left:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);scrollbar-width:thin;scrollbar-color:#3a4352 transparent}.panel .head{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:6px}.panel .head h2{font:700 20px/1.2 var(--serif);letter-spacing:.01em;color:#f2eee4}.panel .close{border:none;background:transparent;box-shadow:none;font-size:18px;color:var(--dim)}.panel .close:hover{color:var(--text);background:transparent}.panel.tech,.panel.help,.panel.shortages,.panel.budget,.panel.policies{right:400px;width:360px}.panel.policies .policy{padding:8px 0;border-top:1px solid rgba(255,255,255,.08)}.panel.policies .policy .row{display:flex;justify-content:space-between;align-items:center;gap:8px}.panel.policies .policy.on b{color:var(--pos)}.topbar .treasury.link{text-decoration:none;padding:2px 6px;border-radius:4px}.topbar .treasury.link:hover,.topbar .treasury.on{background:var(--panel-2)}.panel.shortages .shortrow{padding:8px 0;border-bottom:1px solid var(--line);font-size:13px;line-height:1.45}.panel.shortages .shortrow .row{display:flex;justify-content:space-between;gap:8px}.panel.shortages a{color:#ffe066;cursor:pointer}.panel.shortages a:hover{text-decoration:underline}.topbar .people{color:#f2eee4}.topbar button.warn{border-color:#b8433a}.alone .panel{right:0}.alert{background:#4a2a2a;border:1px solid #7a3a3a;padding:6px 8px;border-radius:4px;margin-top:8px;display:flex;justify-content:space-between;align-items:center;gap:8px}.bar{display:grid;grid-template-columns:70px 1fr 40px;gap:8px;align-items:center;margin:2px 0}.track{height:8px;background:#1c222b;border-radius:4px;overflow:hidden;box-shadow:0 1px 1px #0006 inset}.fill{height:100%;background:linear-gradient(90deg,#e6b94f,var(--accent));border-radius:4px}table.prices{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}table.prices th{text-align:right;color:var(--dim);font-weight:500;padding:2px 4px}table.prices td{text-align:right;padding:2px 4px;border-top:1px solid #1c222b}table.prices th:first-child,table.prices td:first-child{text-align:left}.buildings .btype{display:flex;gap:10px;align-items:center;padding:3px 0;border-top:1px solid #1c222b}.buildings .btype .lbl{flex:1}.buildings .sub{color:var(--dim)}.proposal{display:flex;justify-content:space-between;align-items:center;padding:4px 0}.actions{display:flex;flex-direction:column;gap:6px}.buildmenu{display:flex;flex-wrap:wrap;gap:5px;align-items:center}.buildmenu button.on .dim{color:#333}.actions label{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.panel.tree{left:300px;right:0;width:auto;display:flex;flex-direction:column;padding-bottom:0}.panel.tree .head .dim{flex:1;margin:0 14px}.treebody{flex:1;overflow:auto;position:relative}.treecanvas{position:relative}.treelines{position:absolute;left:0;top:0;pointer-events:none}.eralabel{position:absolute;font:600 11px/1.2 var(--font);text-transform:uppercase;letter-spacing:.08em;color:var(--dim)}.technode{position:absolute;padding:6px 8px;border-radius:6px;border:1.5px solid #3a4352;background:linear-gradient(#1e242f,#161b23);cursor:pointer;overflow:hidden}.technode .row{gap:6px;flex-wrap:nowrap}.technode b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.technode .cat{font-size:10px;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.technode .small{font-size:11px}.technode.locked{opacity:.45}.technode.known{background:linear-gradient(#22302a,#182019)}.technode.reachable{box-shadow:0 0 0 1px #ffd16626,0 0 14px #ffd16614}.technode.picked{box-shadow:0 0 0 2px var(--accent);opacity:1}.treedetail{border-top:1px solid var(--line);padding:10px 0 12px;display:flex;flex-direction:column;gap:6px}.genius{padding:6px 0;border-top:1px solid #1c222b}.toasts{position:absolute;right:410px;top:52px;display:flex;flex-direction:column;gap:6px;max-width:360px}.toast{background:linear-gradient(#2c323ef7,#222731f7);border:1px solid #4a5262;border-left:3px solid var(--accent);padding:8px 12px;border-radius:6px;cursor:pointer;box-shadow:0 6px 18px #00000073}.statusline{position:absolute;left:0;right:0;bottom:0;height:28px;padding:4px 12px;background:linear-gradient(#10141bf0,#181d26f5);border-top:1px solid var(--line);color:var(--dim);display:flex;gap:16px;align-items:center;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.statusline .cancel{margin-left:auto}.buildfab-wrap{position:absolute;left:50%;bottom:40px;transform:translate(-50%)}.buildfab{font:700 16px/1 var(--serif);letter-spacing:.04em;padding:12px 34px;border-radius:24px;border:1px solid var(--accent);background:linear-gradient(#3a3320,#262117);color:var(--accent);box-shadow:0 6px 18px #00000080,0 0 0 4px #ffd16614}.buildfab:hover{background:linear-gradient(#4a4128,#2e281b)}.buildfab.on{background:var(--accent);color:#111}.buildfab:active{transform:translateY(1px)}.modal.build{max-width:min(1180px,calc(100vw - 340px));max-height:calc(100vh - 80px);overflow-y:auto;text-align:left;padding:16px 22px 20px;scrollbar-width:thin;scrollbar-color:#3a4352 transparent}.modal.build .head{display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding-bottom:8px}.modal.build .head h2{font:700 20px/1.2 var(--serif);color:#f2eee4}.modal.build .head .dim{flex:1}.modal.build .head .close{border:none;background:transparent;box-shadow:none;font-size:18px;color:var(--dim)}.modal.build section p{margin:0 0 6px}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:8px}.card{display:flex;gap:10px;padding:8px;border:1px solid var(--line);border-radius:6px;background:var(--panel-2);cursor:pointer}.card:hover{border-color:var(--accent)}.card.blocked{opacity:.55;cursor:not-allowed}.card.blocked:hover{border-color:var(--line)}.card .pic{width:72px;height:64px;flex:none;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 60%,#2a3a2a,#161b23 80%);border-radius:5px;overflow:hidden}.card .pic img{max-width:68px;max-height:60px;image-rendering:auto}.card .body{flex:1;min-width:0}.card .body .row{gap:6px}.card .small{font-size:11.5px;line-height:1.3}.modal-back{position:absolute;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center}.modal{background:linear-gradient(#1e242f,#161b23);border:1px solid var(--accent);padding:26px 34px;border-radius:10px;max-width:480px;text-align:center;box-shadow:0 20px 60px #0009,0 0 0 6px #ffd16614}.modal h1{color:var(--accent);margin:6px 0 12px;font-family:var(--serif)}.menu{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:radial-gradient(ellipse at center,#1b2533,#0e1116 70%)}.menu h1{font:700 56px/1.1 var(--serif);letter-spacing:.06em;color:var(--accent);text-shadow:0 2px 18px rgba(255,209,102,.25)}.menu .form{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}.menu .form label{display:flex;flex-direction:column;gap:4px}.menu .form input[type=range]{width:200px}.menu .file input{display:none}.menu .file{cursor:pointer;text-decoration:underline;color:var(--dim)}.loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--dim)}.summary{display:flex;justify-content:space-between;gap:12px;margin:6px 0 8px}.needs{background:var(--panel-2);border:1px solid var(--line);border-radius:6px;padding:6px 8px;margin-bottom:8px;height:172px;overflow:hidden}.needs .caption{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--dim);margin-bottom:4px}.needs .caption .dim{text-transform:none;letter-spacing:0}.wantgrid{display:grid;grid-template-columns:1fr 1fr;column-gap:12px}.wantgrid .bar{grid-template-columns:62px 1fr 34px;font-size:11.5px;margin:1px 0}.wantgrid .bar .track{height:6px}.shortlist{height:56px;overflow:hidden;margin-top:4px;border-top:1px solid var(--line);padding-top:4px}.needs .short{padding:2px 0}.content{color:var(--pos);margin-bottom:8px}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);padding-bottom:6px;margin-bottom:8px}.tabs button{border-radius:5px 5px 0 0;box-shadow:none}.tabs button.on{background:var(--accent)}.tabbody .kv{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:4px 0}.tabbody .kv span:nth-child(odd){color:var(--dim)}.bgroup{border-top:1px solid #1c222b}.bitem{padding:3px 0 3px 14px;color:var(--text)}.bitem:hover{background:#222a36}label.check{display:flex;gap:6px;align-items:center}.crumb{font-size:12px;margin-bottom:2px}.panel.building .kv{display:grid;grid-template-columns:auto 1fr;gap:3px 12px}.panel.building .kv span:nth-child(odd){color:var(--dim)}.tooltip{position:absolute;pointer-events:none;background:#10151cf0;border:1px solid #3a4352;border-radius:5px;padding:6px 9px;font-size:12px;color:var(--text);max-width:240px;z-index:5;box-shadow:0 4px 14px #0006}.tooltip .title{font-weight:600}.family{padding:3px 0;border-top:1px solid #1c222b}.workers{line-height:1.5}.panel.budget .bsummary{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;align-items:center;padding:6px 0 8px;border-bottom:1px solid var(--line);margin-bottom:4px}.panel.budget .bsummary>div{display:flex;flex-direction:column;gap:1px;font-size:13px}.panel.budget .bsummary b{font-size:16px;font-variant-numeric:tabular-nums}.panel.budget .bsummary .toggle{grid-column:1 / -1;flex-direction:row;gap:4px}.panel.budget .bsummary .toggle button{padding:2px 8px;font-size:12px}.panel.budget h3{display:flex;justify-content:space-between;align-items:baseline;margin:10px 0 4px;font-size:14px}.panel.budget .bgroup{margin:4px 0 8px}.panel.budget .gtitle{display:flex;justify-content:space-between;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--dim);margin:6px 0 2px}.panel.budget .bline{display:grid;grid-template-columns:1fr 70px 78px;gap:8px;align-items:center;padding:2px 0;font-size:13px}.panel.budget .bline .lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel.budget .bline .bar{height:6px;background:#ffffff0f;border-radius:3px;overflow:hidden}.panel.budget .bline .bar .fill{display:block;height:100%;border-radius:3px}.panel.budget .bline .bar .fill.pos{background:var(--pos)}.panel.budget .bline .bar .fill.neg{background:var(--neg);opacity:.8}.panel.budget .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.panel.budget .small{font-size:12px;line-height:1.4;margin-top:10px}
