#stage canvas{touch-action:none}#top{position:fixed;top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));z-index:10;display:flex;align-items:center;gap:8px;pointer-events:none}#top>*{pointer-events:auto}#top .when{display:flex;flex-direction:column;line-height:1.1;padding:6px 12px;border-radius:12px;background:var(--panel);border:1px solid var(--line);min-width:112px}#top .when b{color:var(--gold);font-size:15px}#top .when small{color:var(--muted);font-size:12px}#top .res{display:flex;gap:6px;flex:1;flex-wrap:wrap}.pill{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;background:var(--panel);border:1px solid var(--line);font-weight:800;font-variant-numeric:tabular-nums}.pill i{font-style:normal}.pill.low b{color:#ff9fab}.pill.flash{animation:flash .6s 2}@keyframes flash{50%{background:#5a2a1a}}.speed{display:flex;border-radius:999px;overflow:hidden;border:1px solid var(--line);background:var(--panel)}.speed button{padding:7px 10px;border:0;background:none;font-size:12px;font-weight:800;letter-spacing:-2px}.speed button.on{background:linear-gradient(180deg,var(--gold),var(--ember));color:#2a1408}#goal{position:fixed;z-index:9;top:calc(max(8px,env(safe-area-inset-top)) + 46px);left:max(8px,env(safe-area-inset-left));max-width:min(340px,70vw);padding:8px 12px;border-radius:12px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:1px}#goal small{color:var(--muted);font-size:11px;text-transform:none}#goal b{font-size:14px}#goal small span{color:var(--muted)}#goal .advice{color:#ffe7a3;font-size:13px;margin-top:3px}#goal .advice:empty{display:none}#raid .btn{padding:4px 10px;font-size:13px;border-color:var(--gold)}#raid{position:fixed;z-index:11;top:calc(max(8px,env(safe-area-inset-top)) + 50px);left:50%;transform:translate(-50%);padding:10px 18px;border-radius:14px;background:linear-gradient(180deg,#8c1d2a,#5a1020);border:2px solid var(--gold);box-shadow:0 10px 30px #00000080;display:flex;gap:12px;align-items:center;font-weight:800}#raid span{font-variant-numeric:tabular-nums;color:var(--gold)}#toasts{position:fixed;z-index:12;left:max(8px,env(safe-area-inset-left));bottom:120px;display:flex;flex-direction:column;gap:6px;max-width:min(380px,80vw);pointer-events:none}.toast{padding:8px 12px;border-radius:12px;background:var(--panel);border:1px solid var(--line);font-size:14px;animation:in .25s ease-out}.toast.good{border-color:#6ad18a}.drawer-open #toasts{bottom:260px}.siege-mode #top .res,.siege-mode #btn-overlay,.siege-mode .tabs [data-tab],.siege-mode .tabs [data-tool=demolish],.siege-mode .tabs .sep,.siege-mode #goal{display:none}.toast.bad{border-color:var(--red)}@keyframes in{0%{opacity:0;transform:translateY(8px)}}#bar{position:fixed;z-index:10;left:0;right:0;bottom:0;padding:0 max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));display:flex;flex-direction:column-reverse;align-items:center;pointer-events:none}#bar>*{pointer-events:auto}.tabs{display:flex;gap:4px;padding:6px;border-radius:16px;background:var(--panel);border:1px solid var(--line);overflow-x:auto;max-width:100%;scrollbar-width:none}.tabs button{flex:none;display:flex;flex-direction:column;align-items:center;gap:1px;min-width:58px;padding:6px 6px 5px;border-radius:11px;border:0;background:none;font-size:11px;font-weight:700;color:var(--muted)}.tabs button i{font-style:normal;font-size:20px;line-height:1.1}.tabs button.on{background:#f5c5422e;color:var(--gold)}.tabs .sep{flex:none;width:1px;background:var(--line);margin:4px 2px}.drawer{margin-bottom:8px;display:flex;gap:8px;padding:8px;border-radius:16px;background:var(--panel);border:1px solid var(--line);overflow-x:auto;max-width:100%;scrollbar-width:thin}.card{flex:none;width:150px;display:flex;flex-direction:column;gap:3px;padding:9px 10px;border-radius:12px;border:1px solid var(--line);background:#ffffff0d;text-align:left}.card b{font-size:14px}.card .cost{font-size:12px;color:var(--gold);font-weight:800}.card small{font-size:11.5px;color:var(--muted);line-height:1.3}.card.on{border-color:var(--gold);background:#f5c54224}.card:disabled{opacity:.45}#inspect{position:fixed;z-index:11;right:max(8px,env(safe-area-inset-right));top:calc(max(8px,env(safe-area-inset-top)) + 50px);width:min(330px,calc(100vw - 16px));max-height:calc(100vh - 200px);overflow-y:auto;padding:14px 16px;border-radius:16px;background:var(--panel);border:1px solid var(--line);box-shadow:0 16px 40px #00000073;touch-action:pan-y}#inspect .x{position:absolute;top:6px;right:8px;border:0;background:none;font-size:22px;color:var(--muted)}#inspect h3{font-size:17px;color:var(--gold);margin:0 26px 2px 0}#inspect p{margin:4px 0;font-size:13.5px}#inspect .need{color:#ff9fab}#inspect .ok{color:#9fe08a}#inspect ul{margin:4px 0;padding-left:18px;font-size:13px}#inspect .acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}#inspect .acts .btn{padding:8px 10px;font-size:13px}.meter{height:6px;border-radius:3px;background:#ffffff1a;overflow:hidden;margin:4px 0}.meter i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--ember))}.popup{position:fixed;z-index:12;top:calc(max(8px,env(safe-area-inset-top)) + 50px);right:max(8px,env(safe-area-inset-right));width:min(320px,calc(100vw - 16px));padding:12px;border-radius:16px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}.popup h3{margin:0 0 2px}.popup .btn{text-align:left;padding:9px 12px;font-size:14px}.popup .btn small{display:block;font-weight:600;color:var(--muted);font-size:12px}.popup .btn.on{border-color:var(--gold)}#hint{position:fixed;z-index:11;left:50%;top:calc(max(8px,env(safe-area-inset-top)) + 104px);transform:translate(-50%);padding:8px 14px;border-radius:999px;background:#120b26eb;border:1px solid var(--line);font-size:14px;font-weight:700;white-space:nowrap;max-width:92vw;overflow:hidden;text-overflow:ellipsis}.scene{width:min(560px,100%)}.scene .who{margin:0;color:var(--gold);font-weight:800;font-size:15px;display:flex;align-items:center;gap:8px}.scene .who svg,.card svg{width:24px;height:24px;vertical-align:middle;flex:none}.card svg{width:18px;height:18px}.scene .line{margin:0;font-size:18px;line-height:1.5;min-height:4.5em}.title h1{font-size:clamp(40px,8vw,60px)}.chapters{display:flex;flex-direction:column;gap:8px}.chapters .btn small b{color:var(--gold)}.sandbox .btn{flex:1;font-size:14px;padding:10px 8px}@media(max-width:640px){#top{flex-wrap:wrap;row-gap:6px}#top .when{order:0;flex:1}#top .speed{order:1}#btn-overlay{order:2}#btn-menu{order:3}#top .res{order:4;flex:1 1 100%;flex-wrap:nowrap}#top .when{min-width:0;padding:5px 9px}#top .when small{display:none}.pill{padding:6px 8px;font-size:13px;gap:4px}#r-joy{display:none}.speed button{padding:6px 7px}#goal{top:calc(max(8px,env(safe-area-inset-top)) + 88px);font-size:13px;max-width:calc(100vw - 16px)}#goal b{font-size:13px}#goal .advice{font-size:12px}#raid{top:calc(max(8px,env(safe-area-inset-top)) + 88px)}#hint{top:auto;bottom:calc(96px + env(safe-area-inset-bottom));white-space:normal;text-align:center;border-radius:14px;width:max-content;max-width:calc(100vw - 24px)}.drawer-open #hint{bottom:calc(250px + env(safe-area-inset-bottom))}.drawer-open #toasts{bottom:300px}.toast{font-size:13px;padding:6px 10px}#inspect{top:auto;bottom:110px;max-height:45vh}.card{width:132px}#toasts{bottom:112px}}
