:root{--wood:#4a2d14;--wood2:#6b4320;--gold:#f2c14e;--gold2:#b8862b;--cream:#fff4dc;--ink:#2a1708;--green:#4fbf3a;--green2:#2f8a22;--red:#e0483a;--blue:#3d8bd9;--s:clamp(11px, 1.5vmin + 6px, 16px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;color:var(--cream);-webkit-user-select:none;user-select:none;touch-action:none;background:#2f6b24;margin:0;font-family:Kanit,system-ui,sans-serif;overflow:hidden}#game{position:fixed;inset:0}#ui{pointer-events:none;font-size:var(--s);position:fixed;inset:0}#ui *{pointer-events:auto}#ui .hud-v,#ui .hud-b{pointer-events:none;position:absolute;inset:0}button{font-family:inherit;font-size:inherit;cursor:pointer;color:inherit;border:0}img.ic{vertical-align:-.28em;object-fit:contain;width:1.25em;height:1.25em}img.ib{object-fit:contain;width:1.9em;height:1.9em;margin:0 auto;display:block}img.icx{width:1.8em;height:1.8em}#loader{z-index:10;background:radial-gradient(circle at 50% 40%,#4b8f2f,#1d4416);place-content:center;gap:18px;display:grid;position:fixed;inset:0}#loader img{width:min(70vw,520px)}#loader .lb{border:2px solid var(--gold2);background:#0006;border-radius:8px;height:14px;overflow:hidden}#loader i{background:linear-gradient(#ffe08a,#e0a52d);width:0;height:100%;transition:width .2s;display:block}.card{border:2px solid var(--gold2);background:linear-gradient(#5a3719ee,#3a2310ee);border-radius:12px;box-shadow:0 3px #0005,inset 0 1px #fff2}.hud-v .tl,.hud-b .tl{left:max(8px, env(safe-area-inset-left));top:max(8px, env(safe-area-inset-top));align-items:center;gap:.5em;max-width:46vw;padding:.35em .7em .35em .35em;display:flex;position:absolute}.por{border:2px solid var(--gold);object-fit:cover;object-position:top;background:#0004;border-radius:50%;width:3.2em;height:3.2em}.nm{white-space:nowrap;text-overflow:ellipsis;font-size:1.05em;font-weight:800;overflow:hidden}.sub{opacity:.95;white-space:nowrap;font-size:.82em}.quest{left:max(8px, env(safe-area-inset-left));top:calc(max(8px, env(safe-area-inset-top)) + 4.6em);max-width:min(46vw,330px);color:var(--ink);border:2px solid var(--gold2);background:#fff4dcee;border-radius:10px;padding:.35em .7em;font-size:.85em;position:absolute;box-shadow:0 3px #0004}.quest b{color:#a2560b}.tr{right:max(8px, env(safe-area-inset-right));top:max(8px, env(safe-area-inset-top));flex-direction:column;align-items:flex-end;gap:6px;display:flex;position:absolute}.res{align-items:center;gap:.3em;width:clamp(150px,26vw,250px);padding:.2em .4em;display:flex}.res .bar{background:#0007;border-radius:8px;flex:1;height:1.45em;position:relative;overflow:hidden}.res .bar i{border-radius:8px;position:absolute;inset:0 auto 0 0}.res .bar i.food{background:linear-gradient(#ff9a5c,#c8521d)}.res .bar i.wood{background:linear-gradient(#d9a46b,#8a5626)}.res .bar span{text-align:center;text-shadow:0 1px 2px #000;font-size:.85em;font-weight:600;line-height:1.7em;display:block;position:relative}.mini{gap:6px;display:flex}.mini .card{padding:.15em .55em;font-weight:600}.alert{background:var(--red);border-radius:10px;padding:.3em .9em;font-weight:800;animation:1s infinite blink;position:absolute;top:10px;left:50%;transform:translate(-50%)}@keyframes blink{50%{opacity:.55}}.attack{left:max(10px, env(safe-area-inset-left));bottom:max(10px, env(safe-area-inset-bottom));border:4px solid var(--gold);background:radial-gradient(circle at 50% 35%,#ff8a4c,#c93a1c 70%);border-radius:50%;align-content:center;place-items:center;gap:0;width:6.2em;height:6.2em;display:grid;position:absolute;box-shadow:0 5px #6b1d0b,0 8px 16px #0006}.attack .ia{width:2.8em;height:2.8em}.attack span{text-shadow:0 2px #6b1d0b;margin-top:-.2em;font-size:1.05em;font-weight:800}.attack:active,.rb:active,.pb:active,.big:active{box-shadow:none;transform:translateY(3px)}.br{right:max(8px, env(safe-area-inset-right));bottom:max(10px, env(safe-area-inset-bottom));gap:6px;display:flex;position:absolute}.rb{border:2px solid var(--gold2);background:linear-gradient(#7c5129,#4a2d14);border-radius:12px;width:4.4em;padding:.3em 0 .25em;box-shadow:0 4px #24140a}.rb span{white-space:nowrap;font-size:.72em;font-weight:600;display:block}.selp{left:50%;bottom:max(10px, env(safe-area-inset-bottom));text-align:center;max-width:calc(100vw - 16em);position:absolute;transform:translate(-50%)}.selp .st{text-shadow:0 2px 3px #000,0 0 6px #000;white-space:nowrap;margin-bottom:.3em;font-size:1.05em}.selp .st span{opacity:.9;font-size:.85em}.selp .row{justify-content:center;gap:6px;display:flex}.pb{border:2px solid var(--gold2);background:linear-gradient(#7c5129,#4a2d14);border-radius:12px;min-width:4.6em;padding:.3em .35em;box-shadow:0 4px #24140a}.pb span{font-size:.75em;font-weight:600;line-height:1.15;display:block}.pb small{white-space:nowrap;font-size:.95em;font-weight:400;display:block}.pb.up{background:linear-gradient(#5fcf47,#2f8a22);box-shadow:0 4px #1a5512}.pb.gem{background:linear-gradient(#5fcf9a,#1f8a5c);box-shadow:0 4px #145a3b}.placebar{left:50%;bottom:max(14px, env(safe-area-inset-bottom));align-items:center;gap:10px;position:absolute;transform:translate(-50%)}.hud-v.placing .br,.hud-v.placing .attack,.hud-v.placing .quest{display:none}.placebar span{background:#0009;border-radius:10px;padding:.3em .7em;font-size:.85em}.placebar button{border:3px solid #fff;border-radius:50%;width:3em;height:3em;font-size:1.4em;font-weight:800;box-shadow:0 4px #0006}.placebar .ok{background:var(--green)}.placebar .ok:disabled{opacity:.7;background:#777}.placebar .no{background:var(--red)}.modal-wrap{z-index:5;background:#0008;place-items:center;padding:10px;animation:.15s fade;display:grid;position:absolute;inset:0}@keyframes fade{0%{opacity:0}}.modal{width:min(520px,100%);max-height:calc(100% - 10px);color:var(--ink);border:3px solid var(--gold2);background:linear-gradient(#fff4dc,#f0dcb0);border-radius:16px;flex-direction:column;animation:.18s pop;display:flex;overflow:hidden;box-shadow:0 8px #0005}.modal.wide{width:min(860px,100%)}@keyframes pop{0%{transform:scale(.9)}}.mh{color:var(--cream);background:linear-gradient(#7c5129,#4a2d14);justify-content:space-between;align-items:center;padding:.45em .5em .45em .9em;font-size:1.1em;display:flex}.mh .x{background:0 0;padding:0;line-height:0}.mb{padding:.8em;overflow:auto}.big{color:#fff;text-shadow:0 2px #0005;border-radius:12px;width:100%;margin-top:.8em;padding:.6em;font-size:1.1em;font-weight:800;display:block}.big.go{background:linear-gradient(#6fdc55,#2f8a22);box-shadow:0 4px #1a5512}.big .ib{vertical-align:middle;width:1.5em;height:1.5em;display:inline-block}.center{text-align:center}.warn{color:#b3261e;font-weight:600}.empty{text-align:center;opacity:.7;padding:1em}.info{align-items:flex-start;gap:.8em;display:flex}.info img{width:34%;max-width:170px}.info table{border-collapse:collapse;width:100%}.info td{border-bottom:1px solid #0001;padding:.2em .4em}.info td.gn{color:#1f7a12;font-weight:600}.info .age{color:#b04a0a;font-weight:800}.shop{grid-template-columns:repeat(auto-fill,minmax(8.4em,1fr));gap:8px;display:grid}.shop-c{color:var(--ink);background:#fffaf0;border:2px solid #d9b77a;border-radius:12px;flex-direction:column;align-items:center;padding:.4em;display:flex;box-shadow:0 3px #c9a46a}.shop-c>img{object-fit:contain;width:100%;height:5.5em}.shop-c b{font-size:.9em}.shop-c small{opacity:.7;font-size:.75em}.shop-c .cost{font-size:.8em;font-weight:600}.shop-c.dis{filter:grayscale();opacity:.55}.army .hbar span{font-weight:600}.army .bar,.hbar .bar{background:#0002;border-radius:6px;height:12px;margin:.3em 0 .6em;display:flex;position:relative;overflow:hidden}.hbar .bar i{background:var(--green);height:100%;display:block}.hbar .bar i.q{background:#f2c14e}.queue{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:.6em;display:flex}.queue b{margin-right:.3em}.qi{color:var(--ink);background:#fffaf0;border:2px solid #d9b77a;border-radius:10px;align-items:center;gap:.2em;padding:.15em .3em;display:flex;position:relative}.qi img{object-fit:contain;width:2em;height:2em}.qi em{color:#a2560b;font-size:.75em;font-style:normal}.qi i{color:var(--red);font-style:normal;font-weight:800}.troops{grid-template-columns:repeat(auto-fill,minmax(8em,1fr));gap:8px;display:grid}.tc{text-align:center;background:#fffaf0;border:2px solid #d9b77a;border-radius:12px;flex-direction:column;align-items:center;padding:.4em;display:flex;position:relative}.tc>img{object-fit:contain;height:4.6em}.tc b{font-size:.9em}.tc small{opacity:.8;font-size:.75em}.tc .have{color:#1f7a12;font-weight:800;position:absolute;top:.3em;right:.5em}.tc .tb{gap:4px;margin-top:.3em;display:flex}.tc .tb button{color:#fff;background:linear-gradient(#6fdc55,#2f8a22);border-radius:8px;padding:.15em .6em;font-weight:800;box-shadow:0 3px #1a5512}.tc.dis img{filter:grayscale()brightness(.7)}.logs{flex-direction:column;gap:6px;display:flex}.log{border-left:6px solid var(--blue);background:#fffaf0;border-radius:10px;grid-template-columns:1fr auto auto auto;align-items:center;gap:.6em;padding:.4em .6em;display:grid}.log.d{border-left-color:var(--red)}.log .tag{background:#0001;border-radius:6px;padding:0 .4em;font-size:.75em}.log .when{opacity:.65;font-size:.75em}.log .lt{text-align:right;font-size:.8em}.log .rp{background:var(--blue);color:#fff;border-radius:8px;padding:.25em .5em;font-size:.8em}img.st{vertical-align:middle;width:1.4em;height:1.4em}img.st.off{filter:grayscale()brightness(.45);opacity:.7}.tabs{gap:6px;margin-bottom:.6em;display:flex}.tabs button{color:var(--ink);background:#0001;border-radius:10px;flex:1;padding:.4em;font-weight:600}.tabs button.on{background:var(--gold)}.rk{border-radius:10px;grid-template-columns:2em 2.4em 1fr auto auto;align-items:center;gap:.5em;padding:.3em .4em;display:grid}.rk:nth-child(odd){background:#0000000a}.rk.me{background:#ffe08a}.rk .n{text-align:center;font-weight:800}.rk img{object-fit:cover;object-position:top;border-radius:50%;width:2.2em;height:2.2em}.rk .th{opacity:.7;font-size:.75em}.set .row{align-items:center;gap:6px;margin:.4em 0;display:flex}.set .row b{flex:1}.set input{border:2px solid #d9b77a;border-radius:8px;flex:1;min-width:0;padding:.4em;font-family:monospace}.set button{color:var(--ink);background:#0001;border-radius:8px;padding:.4em .8em;font-weight:600}.set button.on{background:var(--gold)}.modal.win .mh{color:var(--ink);background:linear-gradient(#f2c14e,#b8862b)}.modal.lose .mh{background:linear-gradient(#777,#444)}.res-st img.st.bigst{width:4em;height:4em;animation:.4s backwards starIn}@keyframes starIn{0%{transform:scale(0)rotate(-90deg)}}.pct{font-size:1.2em}.lootr{font-size:1.2em;font-weight:600}.onboard{background:url(/art/title.jpg) 50%/cover;place-items:center;padding:10px;display:grid;position:absolute;inset:0;overflow:auto}.ob-in{border:3px solid var(--gold2);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#2a1708cc;border-radius:18px;flex-direction:column;gap:.6em;width:min(520px,100%);padding:1em;display:flex}.ob-in .logo{width:82%;margin:-.3em auto 0}.ob-in label{flex-direction:column;gap:.2em;font-weight:600;display:flex}.ob-in input,.ob-in select{font:inherit;border:2px solid var(--gold2);background:var(--cream);color:var(--ink);border-radius:10px;padding:.5em .7em}.ob-in .lbl{font-weight:600}.langs{justify-content:center;gap:6px;display:flex}.langs button{border:1px solid var(--gold2);background:#0005;border-radius:8px;padding:.2em .8em}.tribes{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}@media (width<=420px){.tribes{grid-template-columns:1fr 1fr}}.tribe{background:#0005;border:3px solid #fff3;border-radius:14px;flex-direction:column;align-items:center;gap:.2em;padding:.5em;display:flex}.tribe img{aspect-ratio:1;object-fit:contain;width:70%}.tribe b{font-size:1.15em}.tribe small{opacity:.9;font-size:.78em}.tribe.on{border-color:var(--gold);background:#f2c14e33;box-shadow:0 0 14px #f2c14e88}.note{opacity:.7;text-align:center;font-size:.75em}.tc2{left:50%;top:max(8px, env(safe-area-inset-top));text-align:center;padding:.25em .9em;position:absolute;transform:translate(-50%)}#b-time{font-size:1.5em;font-weight:800;line-height:1.1}#b-time small{opacity:.85;font-size:.55em;font-weight:600}.tr2{right:max(8px, env(safe-area-inset-right));top:max(8px, env(safe-area-inset-top));text-align:right;padding:.35em .7em;font-weight:600;position:absolute}.tr2 .off{opacity:.85;margin-top:.2em;font-size:.8em}.bbar{left:50%;bottom:max(8px, env(safe-area-inset-bottom));gap:6px;max-width:calc(100vw - 16px);padding:4px;display:flex;position:absolute;overflow-x:auto;transform:translate(-50%)}.tk{background:linear-gradient(#5aa0e6,#2a6bb0);border:3px solid #d7ecff;border-radius:12px;flex:none;width:4.6em;height:5.4em;position:relative;box-shadow:0 4px #173f6b}.tk img{object-fit:contain;width:100%;height:100%}.tk span{text-shadow:0 1px 2px #000,0 0 4px #000;font-weight:800;position:absolute;top:2px;left:4px}.tk.on{border-color:var(--gold);transform:translateY(-6px);box-shadow:0 10px #173f6b,0 0 14px #f2c14e}.tk.empty{filter:grayscale();opacity:.5}.sp{border:2px solid var(--gold2);background:linear-gradient(#7c5129,#4a2d14);border-radius:10px;padding:.5em 1em;font-weight:800}.sp.on{background:var(--gold);color:var(--ink)}.bact{left:max(8px, env(safe-area-inset-left));bottom:calc(max(8px, env(safe-area-inset-bottom)) + 6.6em);flex-direction:column;align-items:flex-start;gap:6px;display:flex;position:absolute}.bact .hint{background:#000a;border-radius:10px;padding:.3em .7em;font-size:.85em}.bact button{border-radius:12px;padding:.5em .9em;font-weight:800;box-shadow:0 4px #0006}.bact .nx{color:var(--ink);background:linear-gradient(#f2c14e,#b8862b)}.bact .hm{background:linear-gradient(#e0483a,#9c2216)}.toast{border:2px solid var(--gold2);z-index:9;text-align:center;background:#2a1708ee;border-radius:12px;max-width:90vw;padding:.45em 1em;font-weight:600;transition:opacity .4s;position:absolute;top:22%;left:50%;transform:translate(-50%)}.toast.bad{border-color:var(--red);color:#ffd0c8}.toast.out{opacity:0}@media (width<=640px){:is(.br .rb span,.selp .pb span:not(:has(small))){font-size:.62em}.rb{width:3.6em}.attack{width:5.2em;height:5.2em}.selp{max-width:100vw;bottom:calc(max(10px, env(safe-area-inset-bottom)) + 5.6em)}.res{width:clamp(120px,36vw,200px)}.hud-v .tl{max-width:52vw}.quest{top:calc(max(8px, env(safe-area-inset-top)) + 4.4em)}}@media (orientation:portrait){.selp{bottom:calc(max(10px, env(safe-area-inset-bottom)) + 5.8em)}.bact{bottom:calc(max(8px, env(safe-area-inset-bottom)) + 7.2em)}}.tabs.auth{margin:0}.tabs.auth button{color:var(--cream);background:#0005}.tabs.auth button.on{background:var(--gold);color:var(--ink)}.pw{gap:6px;display:flex}.pw input{flex:1;min-width:0}.pw .eye{border:2px solid var(--gold2);background:#0005;border-radius:10px;padding:0 .7em}.ob-in label.chk{flex-direction:row;align-items:center;gap:.5em;font-size:.9em;font-weight:400}.ob-in label.chk input{width:1.3em;height:1.3em;accent-color:var(--gold)}.big.out{background:linear-gradient(#e0483a,#9c2216);box-shadow:0 4px #5e1209}.helpb{color:#fff;background:linear-gradient(#5cb8ff,#1f6fc0);border:2px solid #fff;border-radius:50%;flex:none;width:1.9em;height:1.9em;margin-left:.2em;font-size:1em;font-weight:800;box-shadow:0 3px #0005}.helpb:active{box-shadow:none;transform:translateY(2px)}.help{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:.6em;display:grid}.help .hl{background:#fff8e8;border:2px solid #e8c98a;border-radius:12px;align-items:flex-start;gap:.6em;padding:.5em .6em;display:flex}.help .hl img{object-fit:contain;flex:none;width:3.6em;height:3.6em}.help .hl>div>b{color:#8a4708;margin-bottom:.15em;display:block}.help .hl p{margin:0;font-size:.88em;line-height:1.45}@media (width<=520px){.help{grid-template-columns:1fr}.help .hl img{width:2.8em;height:2.8em}}.dq{left:max(14px, env(safe-area-inset-left));bottom:calc(max(10px, env(safe-area-inset-bottom)) + 6.9em);background:radial-gradient(circle at 35% 30%,#ffe28a,#e8a020);border:3px solid #fff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:4.4em;height:4.4em;padding:0;font-size:1em;line-height:1;display:flex;position:absolute;box-shadow:0 4px #8a4d08}.dq b{font-size:1.6em;line-height:1}.dq span{color:#5a2c00;white-space:nowrap;margin-top:.2em;font-size:.62em;font-weight:800}.dq i{color:#fff;background:#e0322b;border:2px solid #fff;border-radius:1em;justify-content:center;align-items:center;min-width:1.5em;height:1.5em;padding:0 .3em;font-size:.85em;font-style:normal;font-weight:800;animation:1.2s ease-in-out infinite dqb;display:flex;position:absolute;top:-.35em;right:-.35em}@keyframes dqb{50%{transform:scale(1.18)}}.hud-v.placing .dq{display:none}@media (height<=430px){.dq{bottom:calc(max(10px, env(safe-area-inset-bottom)) + 6.5em);width:3.6em;height:3.6em}}.dq-row{background:#fff8e8;border:2px solid #e8c98a;border-radius:12px;align-items:center;gap:.7em;margin-bottom:.5em;padding:.5em .7em;display:flex}.dq-row.got{opacity:.65}.dq-row.bonus{background:#fff1c2;border-color:#e0a72a}.dq-t{flex:1;min-width:0}.dq-t b{color:#6a3405;display:block}.dq-t small{margin-top:.2em;font-size:.85em;display:block}.dq-t small .ic{vertical-align:-.2em;width:1.1em;height:1.1em}.dq-row .bar{background:#0002;border-radius:8px;height:1.2em;margin-top:.3em;position:relative;overflow:hidden}.dq-row .bar i{background:linear-gradient(#7fe05f,#3a9a2a);border-radius:8px;position:absolute;inset:0 auto 0 0}.dq-row .bar span{text-align:center;font-size:.78em;font-weight:700;line-height:1.55em;display:block;position:relative}.dq-row .pb{color:#fff;background:#9a8f80;border:none;border-radius:10px;flex:none;padding:.5em .9em;font-weight:800}.dq-row .pb.go{background:linear-gradient(#6fdc55,#2f8a22);box-shadow:0 3px #1a5512}.dq-ok{color:#2f8a22;flex:none;font-weight:800}.dq-reset{text-align:center;opacity:.8;margin:.4em 0 0;font-size:.85em}.dq-reset .ic{vertical-align:-.2em;width:1.1em;height:1.1em}.mini .clock{white-space:nowrap;font-size:.85em}.kid .hud-v .tl,.kid .hud-b .tl{left:calc(max(10px, env(safe-area-inset-left)) + 64px)}.kid .hud-v .tl{max-width:calc(46vw - 64px)}.big.kidback{background:linear-gradient(#ffb347,#e07a14);box-shadow:0 4px #8a4508}.bug .bn{margin:0 0 .5em;font-size:.9em}.bug .bcats{flex-wrap:wrap;gap:5px;margin-bottom:.5em;display:flex}.bug .bcats button{color:var(--ink);background:#0001;border-radius:999px;padding:.3em .7em;font-size:.85em;font-weight:600}.bug .bcats button.on{background:var(--gold)}.bug textarea{box-sizing:border-box;width:100%;font:inherit;resize:vertical;color:var(--ink);background:#fffaf0;border:2px solid #d9b77a;border-radius:10px;padding:.5em}.bug .bshot{align-items:center;gap:.5em;margin-top:.4em;font-size:.9em;display:flex}.bug .bshot img{border:1px solid #0003;border-radius:6px;height:48px;margin-left:auto}.bug .bmine{border-top:1px dashed #0003;margin-top:.8em;padding-top:.5em}.bug .bi{background:#fff8;border-radius:10px;margin-top:.4em;padding:.4em .6em;font-size:.85em}.bug .bi .bt{opacity:.85;word-break:break-word}.bug .bi .brep{color:#1d5e12;margin-top:.25em;font-weight:600}.bug .st{background:#0001;border-radius:999px;padding:.05em .5em;font-size:.85em}.bug .st-seen{background:#ffe08a}.bug .st-fixed{background:#a8e6a0}.big.bugb{background:linear-gradient(#8aa0b8,#4f6680);box-shadow:0 4px #2c3a4a}.buglink{color:inherit;opacity:.8;background:0 0;margin:.7em auto 0;font-size:.9em;text-decoration:underline;display:block}.toast.tap{pointer-events:auto;cursor:pointer}
