@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=Inter:wght@400;500;700&display=swap";:root{--canvas:#0a0d3a;--surface-indigo:#1e2353;--surface-onyx:#23272a;--primary:#5865f2;--green:#35ed7e;--magenta:#ec48bd;--link:#00b0f4;--ink:#fff;--ink-dark:#000;--muted:#9aa0d4;--hairline:#2a2f63;--r-sm:12px;--r-md:14px;--r-lg:16px;--r-xl:28px;--display:"Space Grotesk", system-ui, sans-serif;--body:"Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--body);color:var(--ink);background:radial-gradient(1200px 700px at 15% -10%, #5865f273, transparent 60%), radial-gradient(900px 600px at 95% 10%, #ec48bd59, transparent 55%), var(--canvas);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}.shell{flex-direction:column;height:100%;display:flex}.topbar{justify-content:space-between;align-items:center;gap:16px;padding:12px 20px;display:flex}.brand{font-family:var(--display);letter-spacing:.5px;font-size:22px;font-weight:700}.brand span{color:var(--magenta)}.coins{font-family:var(--display);background:var(--primary);border-radius:var(--r-lg);padding:8px 18px;font-size:20px;font-weight:700}.body{flex:1;gap:20px;min-height:0;padding:0 20px 20px;display:flex}.stage{background:var(--surface-indigo);border:2px solid var(--hairline);border-radius:var(--r-xl);flex-direction:column;flex-shrink:0;gap:14px;width:380px;min-width:0;padding:16px;display:flex}.zonebar{background:var(--canvas);border-radius:var(--r-md);align-items:center;gap:10px;padding:8px 12px;display:flex}.zonelabel{font-family:var(--display);color:var(--muted);font-size:14px;font-weight:700}.zoneselect{background:var(--surface-indigo);color:var(--ink);border:1px solid var(--hairline);border-radius:var(--r-sm);font-family:var(--display);cursor:pointer;flex:1;padding:10px 12px;font-size:15px;font-weight:700}.zoneselect:focus{outline:2px solid var(--primary)}.block-head{text-align:center}.block-head h2{font-family:var(--display);margin:6px 0 2px;font-size:30px;font-weight:700}.badge{color:#fff;border-radius:var(--r-lg);text-shadow:0 1px 2px #0006;padding:3px 12px;font-size:13px;font-weight:700;display:inline-block}.muted{color:var(--muted);font-size:14px}.canvas-wrap{border-radius:var(--r-xl);cursor:pointer;touch-action:none;background:radial-gradient(circle at 50% 45%,#5865f240,#0000 70%);flex:1;justify-content:center;align-items:center;min-height:240px;display:flex;position:relative}.canvas-wrap canvas{width:100%;height:100%;display:block}.tap-hint{text-align:center;font-family:var(--display);letter-spacing:1px;color:var(--muted);pointer-events:none;font-size:13px;font-weight:700;position:absolute;bottom:14px;left:0;right:0}.floaters{pointer-events:none;z-index:6;position:absolute;inset:0;overflow:hidden}.floater{white-space:nowrap;font-family:var(--display);text-shadow:0 2px 5px #0009;font-weight:700;animation:.85s ease-out forwards floatUp;position:absolute}.fl-dmg{color:#fff;font-size:17px}.fl-drop{color:#fff;-webkit-text-stroke:.5px #0006;font-size:23px}@keyframes floatUp{0%{opacity:0;transform:translate(-50%,-30%)scale(.7)}20%{opacity:1;transform:translate(-50%,-60%)scale(1.05)}to{opacity:0;transform:translate(-50%,-150%)scale(1)}}.progress{background:var(--surface-indigo);border-radius:var(--r-lg);height:16px;overflow:hidden}.progress-fill{border-radius:var(--r-lg);background:linear-gradient(90deg, var(--green), var(--link));width:0%;height:100%;transition:width 60ms linear}.dock{background:var(--surface-indigo);border-radius:var(--r-xl);flex-direction:column;flex:1;gap:12px;min-width:0;padding:16px;display:flex;overflow:hidden}.tabs{flex-wrap:wrap;gap:8px;display:flex}.tabs button{border-radius:var(--r-sm);cursor:pointer;font-family:var(--display);white-space:nowrap;background:var(--canvas);color:var(--muted);border:none;flex:auto;padding:10px 12px;font-size:14px;font-weight:700}.qolbox{background:var(--canvas);border-radius:var(--r-md);padding:10px 12px;font-size:13px}.finbox{background:var(--canvas);border-radius:var(--r-md);flex-direction:column;gap:5px;padding:12px 14px;font-size:14px;display:flex}.finrow{justify-content:space-between;align-items:center;display:flex}.fintotal{border-top:1px solid var(--hairline);margin-top:3px;padding-top:6px;font-size:15px}.pos{color:var(--green)}.neg{color:#ff8a8a}.qolbar{background:var(--surface-onyx);border-radius:8px;height:10px;margin-top:6px;overflow:hidden}.qolfill{background:linear-gradient(90deg, var(--magenta), var(--green));border-radius:8px;height:100%;transition:width .3s}.tabs button.on{background:var(--primary);color:#fff}.list{flex-direction:column;gap:10px;padding-right:4px;display:flex;overflow-y:auto}.row{background:var(--canvas);border-radius:var(--r-md);justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;font-size:15px;display:flex}.row.owned{outline:2px solid var(--primary)}.tag{background:var(--surface-onyx);border-radius:var(--r-lg);padding:4px 12px;font-size:13px;font-weight:700}.invend{align-items:center;gap:8px;display:flex}.invitem{align-items:center;gap:10px;min-width:0;display:flex}.icon{width:34px;height:34px;image-rendering:pixelated;image-rendering:crisp-edges;filter:drop-shadow(0 1px 2px #0006);flex-shrink:0}.lselect{background:var(--canvas);color:var(--ink);border:1px solid var(--hairline);border-radius:var(--r-sm);font-family:var(--body);flex:130px;padding:10px 12px;font-size:14px}.lselect:focus{outline:2px solid var(--primary)}.btn-green{background:var(--green);color:var(--ink-dark);cursor:pointer;font-family:var(--display);border-radius:var(--r-sm);border:none;padding:10px 16px;font-size:14px;font-weight:700}.btn-green:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff;cursor:pointer;text-align:center;font-family:var(--display);border-radius:var(--r-sm);border:none;padding:14px 18px;font-size:15px;font-weight:700}.btn-primary.file{display:inline-block}.settings code{background:var(--canvas);border-radius:6px;padding:1px 6px}.coins .rate{color:var(--green);font-size:13px;font-family:var(--body);margin-left:6px}.banner{background:var(--magenta);color:#fff;border-radius:var(--r-lg);cursor:pointer;margin:0 20px 12px;padding:12px 16px;font-size:15px}.banner .muted{color:#ffffffb3}.center{justify-content:center;align-items:center;height:100%;padding:20px;display:flex}.auth{background:var(--surface-indigo);border-radius:var(--r-xl);flex-direction:column;gap:14px;width:100%;max-width:380px;padding:28px;display:flex}.brand.big{text-align:center;margin-bottom:6px;font-size:30px}.auth input{background:var(--canvas);border:1px solid var(--hairline);color:var(--ink);border-radius:var(--r-sm);font-size:16px;font-family:var(--body);padding:14px 16px}.auth input:focus{outline:2px solid var(--primary)}.err{color:#ff6b6b;font-size:14px}.right{align-items:center;gap:10px;display:flex}.logout{background:var(--surface-indigo);color:var(--ink);cursor:pointer;border-radius:var(--r-sm);border:none;width:42px;height:42px;font-size:18px}.profile-btn{cursor:pointer;background:var(--primary);color:#fff;width:42px;height:42px;font-family:var(--display);border:none;border-radius:50%;font-size:18px;font-weight:700}.profile-overlay{z-index:50;background:#00000080;justify-content:flex-end;align-items:flex-start;padding:66px 20px 20px;display:flex;position:fixed;inset:0}.profile-menu{background:var(--surface-indigo);border:1px solid var(--hairline);border-radius:var(--r-xl);flex-direction:column;gap:12px;width:380px;max-width:92vw;max-height:82vh;padding:18px;display:flex;overflow-y:auto}.profile-head{font-family:var(--display);align-items:center;gap:10px;font-size:19px;font-weight:700;display:flex}.profile-av{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;display:inline-flex}.profile-title{font-family:var(--display);color:var(--muted);border-top:1px solid var(--hairline);padding-top:12px;font-size:14px;font-weight:700}.logout-full{background:var(--surface-onyx);color:var(--ink);border:1px solid var(--hairline);cursor:pointer;border-radius:var(--r-sm);font-family:var(--display);margin-top:4px;padding:12px;font-size:15px;font-weight:700}.profile-menu code{background:var(--canvas);border-radius:6px;padding:1px 6px}@media (width<=820px){.body{flex-direction:column;gap:12px;padding:0 12px 12px}.stage{background:0 0;border:none;width:auto;padding:0}.dock{width:auto;max-height:42vh}.canvas-wrap{min-height:200px}.block-head h2{font-size:24px}.brand{font-size:18px}}
