:root{--bg: #f4f1ea;--panel: #ffffff;--ink: #23262d;--muted: #6b7280;--line: #d9d4c7;--accent: #d97706;--accent-soft: #fff7ed;--ok: #16a34a;--ok-soft: #dcfce7;--bad: #dc2626;--bad-soft: #fee2e2}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--ink);overflow:hidden}.app{display:grid;grid-template-columns:220px 1fr 300px;grid-template-rows:52px 1fr 64px;grid-template-areas:"top top top" "left city right" "stats stats stats";height:100%}.topbar{grid-area:top;position:relative;display:flex;align-items:center;gap:14px;padding:0 16px;background:var(--panel);border-bottom:1px solid var(--line)}.legal{height:100%;overflow:auto;background:var(--bg)}.legal article{max-width:720px;margin:0 auto;padding:32px 16px 64px;line-height:1.6;font-size:15px}.legal h1{margin:16px 0 4px;font-size:28px}.legal h2{margin:28px 0 6px;font-size:18px}.legal .muted{color:var(--muted);margin-top:0}.legal a{color:#9a4a12}.legal .install-steps{padding-left:22px}.legal .install-steps li{margin:0 0 10px}.legal .install-files{list-style:none;padding:0;margin:8px 0 12px;display:flex;flex-direction:column;gap:6px}.legal .install-files a.button{color:inherit}.install-code{display:flex;gap:8px;align-items:flex-start;margin:6px 0 2px}.install-code pre{flex:1 1 auto;min-width:0;margin:0;padding:8px 10px;border:1px solid var(--line);border-radius:6px;overflow-x:auto;font:12.5px/1.5 ui-monospace,monospace;background:#80808014}.legal-links{display:flex;gap:12px;margin-top:16px;font-size:12px}.legal-links a{color:var(--muted)}.share-popover{position:absolute;right:12px;top:48px;width:360px;z-index:20;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 8px 24px #00000029}.share-popover p{margin:6px 0;color:var(--muted);font-size:12px}.account-popover .provider-list{display:flex;flex-direction:column;gap:6px;margin:10px 0}.account-popover .provider-button{display:block;padding:7px 10px;border:1px solid var(--line);border-radius:6px;background:#fff;color:inherit;text-align:center;text-decoration:none;font-size:13px}.account-popover .provider-button:hover{border-color:var(--muted)}.account-popover .account-error{color:#b3261e}.share-menu{width:400px;max-height:calc(100vh - 64px);overflow:auto}.share-menu .copy-field{display:flex;flex-direction:column;gap:3px;margin:8px 0;font-size:12px}.share-menu .copy-field label{color:var(--muted)}.share-menu .copy-field input{width:100%;padding:5px 7px;border:1px solid var(--line);border-radius:6px;font:12px ui-monospace,monospace;min-width:0}.share-menu #share-title{font:inherit;font-size:13px}.share-menu .copy-row{display:flex;gap:6px}.share-menu .share-preview{display:block;width:100%;margin:8px 0;border:1px solid var(--line);border-radius:6px}button.small.primary{border-color:var(--accent);background:var(--accent-soft)}.embed-message{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--muted)}.embed-message a{color:#9a4a12}.share-popover textarea{width:100%;resize:vertical;font:11px ui-monospace,monospace}.embed{height:100%;position:relative;background:var(--bg)}.embed-city{height:100%;min-height:0}.embed-brand{position:absolute;right:12px;bottom:10px;padding:4px 7px;border-radius:4px;color:#fff;background:#23262db8;font-size:11px;font-weight:700;letter-spacing:.08em;pointer-events:none}.brand{font-weight:700;letter-spacing:.04em}.balance{font-weight:700;font-size:18px;font-variant-numeric:tabular-nums}.spacer{flex:1}.muted{color:var(--muted)}.small{font-size:12px}.mono{font-family:ui-monospace,monospace;font-size:11px}.segmented{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}.segmented button{border:0;background:#fff;padding:6px 12px;cursor:pointer;font:inherit}.segmented button.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.segmented button:disabled{color:#b8b8b8;cursor:not-allowed}button.icon{border:1px solid var(--line);background:#fff;border-radius:6px;padding:6px 10px;font:inherit}button:disabled{opacity:.6;cursor:not-allowed}.panel{background:var(--panel);padding:12px;overflow:auto;font-size:13px}.panel.left{grid-area:left;border-right:1px solid var(--line)}.panel.right{grid-area:right;border-left:1px solid var(--line)}h2{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:10px 0 8px}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.tool{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;text-align:center;padding:6px 3px;border:1px solid var(--line);border-radius:6px;background:#fff;cursor:pointer;font:inherit}.tool.active{border-color:var(--accent);background:var(--accent-soft)}.tool-icon{flex:none;width:40px;height:40px;color:var(--muted)}.tool-icon.placeholder{border-radius:6px;background:var(--bg)}svg.tool-icon{padding:8px}.tool-name{font-size:11px;font-weight:600;line-height:1.2;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.tool-cost{font-size:11px;color:var(--muted)}.row{display:flex;gap:6px;margin:6px 0}button.small{border:1px solid var(--line);background:#fff;border-radius:6px;padding:5px 8px;font:inherit;font-size:12px;cursor:pointer}.hint{color:var(--muted);font-size:12px;line-height:1.4}.check{display:block;font-size:12px;margin:6px 0}.city{grid-area:city;position:relative;min-width:0;min-height:0}.viewport{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.variants{position:absolute;left:50%;bottom:12px;transform:translate(-50%);display:flex;gap:8px;padding:6px;border-radius:8px;background:#ffffffd1;box-shadow:0 2px 8px #0000002e}.variant{display:block;width:56px;height:56px;padding:0;border:2px solid transparent;border-radius:6px;background:var(--panel);cursor:pointer}.variant.active{border-color:var(--accent)}.confirm{position:absolute;display:flex;gap:6px;transform:translate(-50%,-100%);pointer-events:auto}.confirm button{width:32px;height:32px;padding:0;border-radius:50%;border:1px solid rgb(0 0 0 / 25%);font-size:16px;line-height:1;color:#fff;cursor:pointer;box-shadow:0 2px 6px #0000004d}.confirm-rotate{background:#4b5563}.confirm-yes{background:#16a34a}.confirm-remove{background:#dc2626;font-size:14px}.confirm-no{background:#6b7280}.status{padding:8px 10px;border-radius:6px;background:#f3f4f6;min-height:40px;line-height:1.45}.status.ok{background:var(--ok-soft)}.status.bad{background:var(--bad-soft)}dl{display:grid;grid-template-columns:90px 1fr;gap:4px 8px;margin:0}dt{color:var(--muted)}dd{margin:0;word-break:break-all}.stats{grid-area:stats;display:flex;align-items:stretch;background:var(--panel);border-top:1px solid var(--line)}.stat{flex:1;display:flex;flex-direction:column;justify-content:center;padding:0 20px;border-right:1px solid var(--line)}.stat:last-child{border-right:0}.stat-label{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.stat-value{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums}.changes{display:flex;flex-direction:column;gap:4px;align-items:stretch}.changes button{text-align:left}.building-dialog{position:absolute;top:12px;left:12px;width:240px;padding:12px;border-radius:8px;background:#fffffff0;box-shadow:0 2px 10px #0003;font-size:13px;pointer-events:auto}.building-dialog header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.building-dialog h3{margin:0;font-size:15px}.level-badge{padding:1px 7px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:700}.dialog-close{margin-left:auto;border:none;background:none;font-size:14px;cursor:pointer;color:var(--muted)}.building-dialog dl{display:grid;grid-template-columns:80px 1fr;gap:4px 8px;margin:0 0 10px}.building-dialog dt{color:var(--muted)}.building-dialog dd{margin:0;font-weight:600}.upgrade-button{width:100%;padding:8px;border:1px solid var(--accent);border-radius:6px;background:var(--accent);color:#fff;font:inherit;font-weight:600;cursor:pointer}.upgrade-button:disabled{background:#e5e1d8;border-color:var(--line);color:var(--muted)}.dialog-note{margin:6px 0 0;font-size:12px}.dialog-note.warn{color:#b42318}.legal table.usage{border-collapse:collapse;width:100%;margin:8px 0 16px;font-size:13px}.legal table.usage th,.legal table.usage td{text-align:left;padding:4px 8px;border-bottom:1px solid rgba(128,128,128,.25)}.legal table.usage .num{text-align:right;font-variant-numeric:tabular-nums}.stat-button{border:0;border-right:1px solid var(--line);background:none;font:inherit;text-align:left;cursor:pointer;color:inherit}.stat-button:hover .stat-value{color:var(--accent)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#00000059}.modal{width:min(720px,calc(100vw - 32px));max-height:calc(100vh - 64px);overflow:auto;padding:16px;border-radius:10px;background:#fff;box-shadow:0 8px 30px #0000004d;font-size:13px}.modal header{display:flex;align-items:center;gap:8px;margin-bottom:10px}.modal h3{margin:0;font-size:16px}.modal-totals{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0 0 12px;padding:0;list-style:none}.modal-totals li{display:flex;gap:8px;align-items:baseline}.modal-totals span{color:var(--muted)}.modal-table{width:100%;border-collapse:collapse}.modal-table th,.modal-table td{text-align:left;padding:5px 8px;border-bottom:1px solid var(--line);vertical-align:top}.modal-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.usage-panel{max-width:720px}.usage-chart{display:flex;align-items:flex-end;gap:2px;height:110px;margin:4px 0 6px;padding:0 2px;border-bottom:1px solid var(--line)}.usage-bar{flex:1 1 0;min-width:3px;background:var(--accent);border-radius:2px 2px 0 0}.usage-axis{display:flex;justify-content:space-between;gap:8px;margin:0 0 12px;font-size:11px}.connect-signin{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.connect-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}.connect-tabs button.small.active{border-color:var(--accent);background:var(--accent-soft)}.connect-command{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.connect-command code{padding:6px 8px;border:1px solid var(--line);border-radius:6px;font:12px ui-monospace,monospace;overflow-wrap:anywhere}
