:root{--bg: #0a0e22;--bg-soft: #11162d;--bg-card: #161c36;--border: #2d3556;--border-soft: #1f254a;--text: #e8eeff;--text-mid: #a0aedc;--text-dim: #6a7596;--accent: #ffd866;--purple: #a896e8;--coral: #e8a890;--teal: #6bd6b3;--amber: #f0c876;--pink: #e89ab3;--green: #98d670;--red: #ff4a4a;--mono: "JetBrains Mono", ui-monospace, monospace;--pixel: "Press Start 2P", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg);color:var(--text);font-family:var(--mono);font-size:13px;line-height:1.6;min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 1px,transparent 3px);pointer-events:none;z-index:100}header{border-bottom:1px solid var(--border);padding:14px 28px;display:flex;align-items:center;gap:28px;background:#0a0e22d9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:sticky;top:0;z-index:50}.logo{font-family:var(--pixel);font-size:14px;color:var(--accent);letter-spacing:.04em;text-decoration:none}.logo:before{content:"◆";color:var(--purple)}.head-meta{color:var(--text-dim);font-size:11px;display:flex;gap:18px;flex-wrap:wrap}.head-meta b{color:var(--text-mid);font-weight:400}.head-right{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:11px;color:var(--text-mid)}.live-dot{width:8px;height:8px;background:var(--green);border-radius:50%;box-shadow:0 0 8px var(--green);animation:livePulse 1.8s infinite}@keyframes livePulse{0%,60%{opacity:1}70%,90%{opacity:.35}to{opacity:1}}.ver{color:var(--accent);border:1px solid var(--border);padding:2px 8px;border-radius:3px;font-size:10px}.x-link{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid var(--border);border-radius:3px;color:var(--text-mid);text-decoration:none;font-size:13px;transition:all .15s}.x-link:hover{color:var(--accent);border-color:var(--accent);background:#ffd8660f;transform:translateY(-1px)}main{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:0;min-height:calc(100vh - 110px)}.town-wrap{position:relative;border-right:1px solid var(--border);background:radial-gradient(circle at 30% 20%,rgba(120,102,196,.08) 0%,transparent 50%),radial-gradient(circle at 80% 60%,rgba(107,214,179,.05) 0%,transparent 50%),var(--bg);overflow:auto;padding:16px;min-height:820px}.town-wrap:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.4) 100%);pointer-events:none}.town-svg{width:100%;height:auto;max-height:calc(100vh - 130px);display:block;image-rendering:pixelated;filter:drop-shadow(0 0 30px rgba(120,102,196,.08));transform-origin:top left;transition:transform .18s ease-out}.zoom-ctrl{position:absolute;bottom:16px;right:16px;z-index:10;display:flex;flex-direction:column;gap:4px;background:#11162deb;border:1px solid var(--border);border-radius:3px;padding:4px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.zoom-ctrl button{width:30px;height:30px;background:transparent;border:1px solid transparent;color:var(--text-mid);font-family:var(--mono);font-size:16px;cursor:pointer;border-radius:2px;transition:all .12s}.zoom-ctrl button:hover{background:var(--bg-card);color:var(--accent);border-color:var(--border)}.zoom-ctrl button:active{transform:scale(.94)}.zoom-ctrl .zoom-val{text-align:center;font-size:9px;color:var(--text-dim);padding:2px 0}.bldg{cursor:pointer;transition:filter .15s ease}.bldg:hover{filter:brightness(1.25)}.bldg.selected{filter:brightness(1.4) drop-shadow(0 0 8px var(--accent))}.canvas-label{position:absolute;font-size:10px;color:var(--text-dim);z-index:5;pointer-events:none}.canvas-label.tl{top:10px;left:18px}.canvas-label.tr{top:10px;right:18px;text-align:right}.canvas-label.bl{bottom:14px;left:18px}.canvas-label.br{bottom:14px;right:18px;text-align:right}.canvas-label b{color:var(--text-mid);font-weight:400}.canvas-label .k{color:var(--accent)}aside{background:var(--bg-soft);padding:24px 22px;overflow-y:auto;max-height:calc(100vh - 110px);position:sticky;top:56px}.panel-section{border-bottom:1px solid var(--border-soft);padding-bottom:20px;margin-bottom:20px}.panel-section:last-child{border:none;margin:0}.panel-title{font-size:10px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.12em;margin-bottom:12px}.panel-title:before{content:"──";color:var(--border)}.empty-state{color:var(--text-mid);font-size:12px;line-height:1.7}.empty-state p+p{margin-top:12px}.empty-state .accent{color:var(--accent)}.repo-view{display:none}.repo-view.active{display:block;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.repo-path{font-size:14px;color:var(--accent);word-break:break-all;margin-bottom:4px;line-height:1.4}.repo-path .slash{color:var(--text-dim)}.repo-tag{display:inline-block;font-size:10px;padding:2px 8px;border-radius:2px;margin:6px 6px 0 0;background:var(--bg-card);border:1px solid var(--border);color:var(--text-mid)}.repo-tag.purple{color:var(--purple);border-color:#a896e84d}.repo-tag.coral{color:var(--coral);border-color:#e8a8904d}.repo-tag.teal{color:var(--teal);border-color:#6bd6b34d}.repo-tag.amber{color:var(--amber);border-color:#f0c8764d}.repo-tag.pink{color:var(--pink);border-color:#e89ab34d}.repo-tag.green,.repo-tag.live{color:var(--green);border-color:#98d6704d}.repo-tag.mirror{color:var(--text-dim)}.repo-desc{font-size:12px;color:var(--text-mid);line-height:1.7;margin-top:14px}.kv{display:grid;grid-template-columns:70px 1fr;gap:6px 12px;font-size:11px;margin-top:8px}.kv dt{color:var(--text-dim)}.kv dd{color:var(--text-mid);word-break:break-all}.clone-box{background:var(--bg);border:1px solid var(--border);border-radius:3px;padding:10px 12px;font-size:11px;color:var(--teal);overflow-x:auto;white-space:nowrap;position:relative;cursor:pointer;transition:border-color .15s}.clone-box:hover{border-color:var(--accent)}.clone-box:before{content:"$ ";color:var(--text-dim)}.clone-box:after{content:"copy";position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:9px;color:var(--text-dim);background:var(--bg);padding:2px 6px}.clone-box.copied:after{content:"✓copied";color:var(--green)}.leg-row{display:flex;align-items:flex-start;gap:10px;padding:6px 0;font-size:11px;cursor:pointer;transition:color .15s}.leg-row:hover{color:var(--accent)}.leg-swatch{width:10px;height:10px;flex-shrink:0;margin-top:3px}.leg-info b{font-weight:500;color:var(--text)}.leg-info span{color:var(--text-dim);display:block;font-size:10px;margin-top:1px}footer{border-top:1px solid var(--border);padding:10px 28px;display:flex;align-items:center;gap:24px;font-size:11px;color:var(--text-dim);flex-wrap:wrap}footer b{color:var(--text-mid);font-weight:400}footer .num{color:var(--accent)}footer a{color:var(--text-mid);text-decoration:none;border-bottom:1px dotted var(--border)}footer a:hover{color:var(--accent)}footer .spacer{flex:1}.toasts{position:fixed;bottom:60px;left:24px;z-index:60;display:flex;flex-direction:column-reverse;gap:6px;pointer-events:none;max-width:380px}.toast{background:#11162deb;border:1px solid var(--border);border-left:3px solid var(--green);padding:8px 12px;font-size:10.5px;color:var(--text-mid);border-radius:2px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:toastIn .3s ease-out,toastOut .4s ease-in 4.5s forwards;max-width:380px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;cursor:pointer}.toast .lbl{color:var(--green)}.toast .repo{color:var(--accent)}.toast .meta{color:var(--text-dim)}@keyframes toastIn{0%{transform:translate(-20px);opacity:0}to{transform:none;opacity:1}}@keyframes toastOut{to{transform:translate(-20px);opacity:0}}@media(max-width:880px){main{grid-template-columns:1fr}aside{position:static;max-height:none;border-top:1px solid var(--border)}.town-wrap{border-right:none;padding:12px;min-height:480px}header{padding:12px 16px;gap:12px;flex-wrap:wrap}.head-meta{display:none}.head-right{margin-left:0}footer{padding:10px 16px}.toasts{left:12px;bottom:80px}.canvas-label{font-size:9px}.canvas-label.tr,.canvas-label.br{display:none}}