:root{--night:#0a0f30;--indigo:#16225b;--peri:#4f64aa;--ice:#b7cded;--parch:#e3d4b0;--card:#f6f5fb;--stat:#e8e07a;--loot:#c0622a;
  --ink:#2f354a;--txt:#eef2ff;--mute:#9fb0dc;--red:#e23c4b;--green:#3ccf7a;--purple:#7b5cd6;
  --font:ui-monospace,"SF Mono",Menlo,Consolas,"DejaVu Sans Mono",monospace;--wallH:96px}
*{box-sizing:border-box}
html,body{margin:0;background:var(--night);color:var(--txt);font-family:var(--font);-webkit-text-size-adjust:100%}
body{background:radial-gradient(circle at 30% -10%,#26357e 0,var(--indigo) 30%,var(--night) 75%) fixed;min-height:100vh}
a{color:var(--ice)}
button,input,select,textarea{font:inherit}
.wrap{max-width:600px;margin:0 auto;padding:0 10px calc(78px + env(safe-area-inset-bottom))}
.px{border:3px solid var(--ink);border-radius:8px;box-shadow:0 0 0 2px var(--peri) inset,0 4px 0 #050822}
.panel{background:var(--indigo);margin:8px 0;padding:9px}
.parch{background:var(--parch);color:var(--ink);box-shadow:0 0 0 2px #fff6dc inset,0 4px 0 #050822}
.cardw{background:var(--card);color:var(--ink);box-shadow:0 0 0 2px #fff inset,0 4px 0 #050822}
h2{font-size:12px;letter-spacing:1px;margin:0 0 7px;color:var(--stat);display:flex;align-items:center;justify-content:space-between;gap:6px;text-shadow:1px 1px 0 var(--ink)}
.parch h2,.cardw h2{color:var(--indigo);text-shadow:none}
h3{font-size:11px;margin:10px 0 6px;color:var(--ice)}
.mute{color:var(--mute);font-size:10px}.parch .mute,.cardw .mute{color:#6a6f86}
.small{font-size:10px}.tiny{font-size:8.5px}
.row{display:flex;gap:6px;align-items:center}.grow{flex:1;min-width:0}.wrapf{flex-wrap:wrap}
.btn{text-decoration:none;display:inline-block;background:var(--peri);color:#fff;border:2px solid var(--ink);border-radius:6px;padding:6px 10px;font-size:11px;font-weight:bold;cursor:pointer;box-shadow:0 2px 0 var(--ink);white-space:nowrap}
.btn:active{transform:translateY(2px);box-shadow:none}
.btn.gold{background:var(--stat);color:var(--ink)}.btn.red{background:var(--red)}.btn.green{background:var(--green);color:var(--ink)}.btn.loot{background:var(--loot)}
.btn.ghost{background:transparent;color:var(--ice);border-color:var(--peri)}.btn.sm{padding:3px 7px;font-size:9.5px}
.btn[disabled]{opacity:.45}
input,select,textarea{width:100%;background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:5px;padding:7px;font-size:12px}
textarea{min-height:70px;resize:vertical}
label{display:block;font-size:10px;margin:8px 0 3px;color:var(--ice);font-weight:bold}
.parch label,.cardw label{color:var(--indigo)}
.chip{display:inline-block;font-size:8.5px;font-weight:bold;padding:2px 5px;border:2px solid var(--ink);border-radius:10px;color:var(--ink);white-space:nowrap;background:var(--ice)}
.s-handoff{background:#ffd27a}.s-research{background:#a6e3ff}.s-qc{background:#c9b6ff}.s-deliverables{background:#ffb37a}.s-approved{background:#8ff0b0}
.ex{display:inline-block;font-size:7.5px;font-weight:bold;color:var(--ink);background:var(--stat);border:1px solid var(--ink);border-radius:3px;padding:0 3px;vertical-align:1px}
.err{background:#ffd9d9;color:#7a1020;border:2px solid var(--ink);border-radius:6px;padding:6px;font-size:11px;margin:6px 0}
.ok{background:#d9ffe6;color:#0d5a2c;border:2px solid var(--ink);border-radius:6px;padding:6px;font-size:11px;margin:6px 0}
.note-ai{background:#fff7d6;color:var(--ink);border:2px dashed var(--loot);border-radius:6px;padding:6px;font-size:10.5px}
/* header */
.top{position:sticky;top:0;z-index:30;background:linear-gradient(var(--night),rgba(10,15,48,.93));padding:calc(6px + env(safe-area-inset-top)) 10px 6px;border-bottom:2px solid var(--peri)}
.top .in{max-width:600px;margin:0 auto;display:flex;align-items:center;gap:8px}
.top h1{font-size:14px;margin:0;color:var(--stat);letter-spacing:1px;text-shadow:2px 2px 0 var(--ink)}
.top .sub{font-size:9px;color:var(--mute)}
.lang{display:flex;border:2px solid var(--ink);border-radius:12px;overflow:hidden;flex:none}
.lang button{border:0;background:var(--indigo);color:var(--ice);font-size:10px;font-weight:bold;padding:4px 8px;cursor:pointer}
.lang button.on{background:var(--stat);color:var(--ink)}
/* bottom nav */
.nav{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--night);border-top:3px solid var(--peri);padding-bottom:env(safe-area-inset-bottom)}
.nav .in{max-width:600px;margin:0 auto;display:flex}
.nav a{flex:1;text-align:center;text-decoration:none;color:var(--mute);font-size:9px;padding:6px 0 7px;font-weight:bold}
.nav a i{display:block;font-style:normal;font-size:17px;line-height:20px}
.nav a.on{color:var(--stat);background:linear-gradient(transparent,rgba(79,100,170,.35))}
/* world map */
.map{position:relative;border-radius:8px;overflow:hidden;background:
  radial-gradient(circle at 20% 30%,rgba(255,255,255,.08) 0 30px,transparent 31px),
  repeating-linear-gradient(45deg,rgba(0,0,0,.05) 0 4px,transparent 4px 8px),linear-gradient(#5fae5a,#3f8d48)}
.map .water{position:absolute;right:-30px;bottom:-30px;width:150px;height:110px;border-radius:50%;background:repeating-linear-gradient(0deg,#4a90d6 0 6px,#5aa2e6 6px 12px);border:3px solid var(--ink)}
.map svg.path{position:absolute;inset:0;width:100%;height:100%}
.bld{position:absolute;transform:translate(-50%,-100%);text-align:center;cursor:pointer;text-decoration:none}
.bld svg{display:block;margin:0 auto;image-rendering:pixelated;filter:drop-shadow(0 3px 0 rgba(0,0,0,.25))}
.ribbon{display:inline-block;position:relative;background:var(--parch);color:var(--ink);font-size:8.5px;font-weight:bold;padding:2px 8px;border:2px solid var(--ink);margin-top:-4px;max-width:118px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ribbon:before,.ribbon:after{content:"";position:absolute;top:3px;width:6px;height:10px;background:#c9b88e;border:2px solid var(--ink);z-index:-1}
.ribbon:before{left:-7px;border-right:0}.ribbon:after{right:-7px;border-left:0}
.bld .cnt{position:absolute;top:-6px;right:-4px;background:var(--red);color:#fff;font-size:9px;font-weight:bold;min-width:17px;height:17px;line-height:13px;border:2px solid var(--ink);border-radius:9px}
.bld .team{display:flex;justify-content:center;margin-top:2px}
.bld .team span{width:16px;height:16px;border:1px solid var(--ink);border-radius:50%;overflow:hidden;background:#1d2350;margin:0 -2px}
.bld .team svg{width:16px;height:16px}
.bld.sel .ribbon{background:var(--stat)}
/* office scene */
.ohead{display:flex;align-items:center;gap:6px;margin:10px 0 5px}
.ohead b{font-size:12px;color:var(--stat)}
.pipe{display:flex;align-items:center;justify-content:space-between;padding:5px;gap:2px;background:var(--indigo)}
.pipe .st{flex:1;text-align:center;min-width:0}.pipe .st b{display:block;font-size:14px}.pipe .st span{font-size:7px;color:var(--mute)}
.pipe .ar{color:var(--peri);font-size:10px}
.scene{position:relative;overflow:hidden;border-radius:8px;user-select:none;-webkit-user-select:none;background:#3a2b22}
.wall{position:absolute;left:0;right:0;top:0;height:var(--wallH);background:
  repeating-linear-gradient(90deg,rgba(0,0,0,.12) 0 2px,transparent 2px 40px),
  repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 2px,transparent 2px 14px),linear-gradient(#e9c9a0,#d9b385)}
.wall:before{content:"";position:absolute;left:0;right:0;top:0;height:14px;background:repeating-linear-gradient(90deg,#ce7d88 0 14px,#b8646f 14px 16px);border-bottom:3px solid var(--ink)}
.wall:after{content:"";position:absolute;left:0;right:0;bottom:0;height:9px;background:#8a5a3a;border-top:3px solid var(--ink)}
.floor{position:absolute;left:0;right:0;top:var(--wallH);bottom:0;background:
  repeating-linear-gradient(90deg,rgba(0,0,0,.16) 0 2px,transparent 2px 34px),repeating-linear-gradient(0deg,rgba(0,0,0,.1) 0 2px,transparent 2px 17px),linear-gradient(#b07a4c,#8d5b36)}
.lane-line{position:absolute;left:3%;right:3%;height:0;border-top:2px dashed rgba(47,53,74,.25)}
.lounge{position:absolute;left:6px;right:6px;border:3px solid var(--ink);border-radius:8px;background:repeating-linear-gradient(45deg,#7b5cd6 0 6px,#6c4fc4 6px 12px);opacity:.35}
.lounge-l{position:absolute;left:12px;font-size:8px;font-weight:bold;color:#fff;background:var(--ink);padding:1px 5px;border-radius:3px;z-index:2}
.prop{position:absolute;top:12px;transform:translateX(-50%)}
.prop svg{display:block;image-rendering:pixelated}
.zlabel{position:absolute;transform:translateX(-50%);top:calc(var(--wallH) + 3px);font-size:7.5px;font-weight:bold;color:var(--ink);background:var(--parch);border:2px solid var(--ink);padding:1px 4px;border-radius:3px;white-space:nowrap;z-index:2}
.badge{position:absolute;top:-4px;right:-8px;background:var(--red);color:#fff;font-size:9px;font-weight:bold;min-width:16px;height:16px;line-height:12px;text-align:center;border:2px solid var(--ink);border-radius:8px;padding:0 2px}
.gate{position:absolute;top:14px;bottom:0;transform:translateX(-50%);width:64px;pointer-events:none;z-index:1}
.gate .pil{position:absolute;bottom:0;top:26px;width:9px;border:3px solid var(--ink);background:repeating-linear-gradient(0deg,#b7cded 0 10px,#8ea6cc 10px 12px)}
.gate .pil.l{left:0}.gate .pil.r{right:0}
.gate .arch{position:absolute;left:-4px;right:-4px;top:12px;height:18px;border:3px solid var(--ink);border-radius:30px 30px 0 0;background:linear-gradient(#dfe8f8,#9fb3d8)}
.gate .banner{position:absolute;left:50%;top:0;transform:translateX(-50%);background:var(--red);color:#fff;font-size:7.5px;font-weight:bold;padding:1px 4px;border:2px solid var(--ink);border-radius:2px;white-space:nowrap}
.gate .beam{position:absolute;left:9px;right:9px;top:30px;bottom:0;opacity:0}
.gate.active .beam{opacity:1;background:linear-gradient(180deg,rgba(183,205,237,0),rgba(183,205,237,.3) 50%,rgba(183,205,237,0));animation:beam 2s linear infinite;background-size:100% 60px;background-repeat:no-repeat}
@keyframes beam{0%{background-position:0 -60px}100%{background-position:0 1400px}}
.stamp{position:absolute;width:42px;height:42px;border:3px solid var(--red);border-radius:50%;color:var(--red);text-align:center;font-weight:bold;transform:translateX(-50%) rotate(-14deg);z-index:6;background:rgba(255,246,227,.92);display:flex;flex-direction:column;justify-content:center;line-height:1.05;box-shadow:0 0 0 2px var(--ink)}
.stamp small{font-size:5.5px}.stamp b{font-size:10px}.stamp em{font-style:normal;font-size:7px}
.stamp.thump{animation:thump 1s ease-out}
@keyframes thump{0%{transform:translateX(-50%) rotate(-14deg) scale(2.2);opacity:0}45%{transform:translateX(-50%) rotate(-14deg) scale(.9);opacity:1}100%{transform:translateX(-50%) rotate(-14deg) scale(1)}}
.agent{position:absolute;width:70px;height:var(--laneH);transform:translateX(-50%);transition:left 2.2s linear;z-index:5;cursor:pointer}
.agent .sprite{position:absolute;left:0;right:0;bottom:14px;height:64px;animation:bob 1.6s ease-in-out infinite}
.agent .sprite svg{width:70px;height:64px;display:block;overflow:visible}
.agent .face{transition:transform .2s;transform-origin:8px 10px}
.agent.flip .face{transform:scaleX(-1)}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
.agent.walking .sprite{animation:walkbob .35s steps(2) infinite}
@keyframes walkbob{0%{transform:translateY(0)}100%{transform:translateY(-3px)}}
.legs-b{display:none}
.agent.walking .legs-a{animation:legA .35s steps(1) infinite}
.agent.walking .legs-b{display:inline;animation:legB .35s steps(1) infinite}
@keyframes legA{0%{opacity:1}50%{opacity:0}}@keyframes legB{0%{opacity:0}50%{opacity:1}}
.agent .shadow{position:absolute;left:19px;right:19px;bottom:12px;height:6px;border-radius:50%;background:rgba(20,10,30,.35)}
.nameplate{position:absolute;left:50%;bottom:0;transform:translateX(-50%);display:flex;white-space:nowrap;border:2px solid var(--ink);border-radius:4px;overflow:hidden;line-height:10px;font-size:7.5px;font-weight:bold}
.nameplate .lv{background:var(--ink);color:var(--stat);padding:0 3px}
.nameplate .nm{background:var(--purple);color:#fff;padding:0 4px;max-width:78px;overflow:hidden;text-overflow:ellipsis}
.agent .bubble{position:absolute;bottom:80px;left:var(--bl,-28px);width:max-content;max-width:128px;background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:8px;padding:2px 5px;font-size:8px;line-height:1.25;box-shadow:0 2px 0 rgba(0,0,0,.3);z-index:7}
.agent .bubble:after{content:"";position:absolute;bottom:-7px;left:calc(var(--tail,50%) - 5px);border:5px solid transparent;border-top-color:var(--ink);border-bottom:0}
.bubble .tag{display:inline-block;font-size:6.5px;font-weight:bold;color:#fff;background:var(--c);border-radius:2px;padding:0 3px;margin-right:3px;vertical-align:1px}
.bubble .txt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bubble.pop{animation:pop .35s ease-out}@keyframes pop{0%{transform:scale(.6)}100%{transform:scale(1)}}
.agent.mini{width:54px;height:66px}
.agent.mini .sprite{bottom:12px;height:50px}.agent.mini .sprite svg{width:54px;height:50px}
.agent.mini .shadow{left:14px;right:14px;bottom:10px}
.agent.mini .bubble{display:none}
.orb{animation:glowp 1.2s ease-in-out infinite}
@keyframes glowp{0%,100%{opacity:.35}50%{opacity:.9}}
.grim{animation:floaty 1.6s ease-in-out infinite}.petg{animation:floaty 1.1s ease-in-out infinite}.accg{animation:floaty 2s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}
.acc-glow,.perk-aura{animation:glowp 2s ease-in-out infinite}
.magnifier{transform-box:fill-box;transform-origin:50% 100%}
.agent.inspecting .magnifier{animation:inspect 1.8s ease-in-out infinite}
@keyframes inspect{0%,100%{transform:rotate(0)}30%{transform:rotate(-14deg)}60%{transform:rotate(6deg)}}
.agent.working .weapon{animation:swing .9s ease-in-out infinite;transform-box:fill-box;transform-origin:30% 90%}
@keyframes swing{0%,100%{transform:rotate(0)}50%{transform:rotate(-8deg)}}
.sweat{opacity:0}.agent.waiting .sweat{opacity:1;animation:floaty 1s ease-in-out infinite}
.agent.giving .sprite{animation:give .5s ease-out 2}
@keyframes give{0%,100%{transform:translateX(0)}50%{transform:translateX(5px) translateY(-3px)}}
.agent.receiving .sprite{animation:recv .4s ease-out 3}
@keyframes recv{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.agent.lv8 .sprite:before{content:"";position:absolute;left:24px;right:24px;bottom:4px;height:16px;background:radial-gradient(ellipse at 50% 100%,rgba(255,140,40,.7),transparent 70%);animation:glowp .6s infinite}
.flyscroll{position:absolute;z-index:20;width:26px;height:16px;pointer-events:none;transition:left 1.3s cubic-bezier(.4,0,.6,1),top 1.3s cubic-bezier(.3,-.6,.7,1.2)}
.flyscroll svg{width:26px;height:16px;filter:drop-shadow(0 0 4px #fff6a0)}
.xpfloat{position:absolute;z-index:21;font-size:11px;font-weight:bold;color:var(--stat);text-shadow:1px 1px 0 var(--ink),-1px -1px 0 var(--ink),1px -1px 0 var(--ink),-1px 1px 0 var(--ink);pointer-events:none;animation:xpup 1.8s ease-out forwards;transform:translateX(-50%)}
@keyframes xpup{0%{opacity:0;margin-top:0}15%{opacity:1}100%{opacity:0;margin-top:-40px}}
.lvburst{position:absolute;z-index:22;width:90px;height:90px;transform:translate(-50%,-50%);pointer-events:none}
.lvburst:before{content:"";position:absolute;inset:0;border-radius:50%;border:4px solid #ffe46b;box-shadow:0 0 18px #ffd84a,inset 0 0 18px #ffd84a;animation:burst 1.6s ease-out forwards}
.lvburst b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:11px;color:#ffe46b;white-space:nowrap;text-shadow:1px 1px 0 var(--ink),-1px -1px 0 var(--ink);animation:lvtxt 2s ease-out forwards}
@keyframes burst{0%{transform:scale(.2);opacity:1}100%{transform:scale(1.6);opacity:0}}
@keyframes lvtxt{0%{opacity:0;margin-top:0}20%{opacity:1}100%{opacity:0;margin-top:-30px}}
/* log */
.log{list-style:none;margin:0;padding:0}
.log li{display:grid;grid-template-columns:40px 1fr auto;gap:6px;align-items:center;padding:5px 2px;border-top:2px dashed #2a3a7a;font-size:9.5px}
.log li:first-child{border-top:0}
.log .tm{color:var(--mute);font-size:8.5px}
.log .ti{min-width:0;overflow:hidden;text-overflow:ellipsis}
.dot{display:inline-block;width:7px;height:7px;border:1px solid var(--ink);border-radius:2px;margin-right:4px}
/* list rows */
.item{display:flex;gap:8px;align-items:center;padding:7px;margin:6px 0;text-decoration:none;color:inherit;background:var(--card);color:var(--ink);border:3px solid var(--ink);border-radius:8px;box-shadow:0 3px 0 #050822}
.item .t{font-size:11px;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.item .s{font-size:9px;color:#5b627c}
.por{width:36px;height:36px;flex:none;border:2px solid var(--ink);border-radius:50%;overflow:hidden;background:#1d2350}
.por svg{width:100%;height:100%}
/* class cards (agents page) */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.ccard{position:relative;border:3px solid var(--ink);border-radius:10px;overflow:hidden;text-decoration:none;color:var(--ink);background:var(--card);box-shadow:0 4px 0 #050822}
.ccard .bg{height:96px;position:relative;background:linear-gradient(180deg,var(--cc),color-mix(in srgb,var(--cc) 55%,#fff))}
.ccard .bg:after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;background:rgba(0,0,0,.12)}
.ccard .bg svg{position:absolute;left:50%;top:6px;transform:translateX(-50%);width:96px;height:88px;overflow:visible}
.ccard .lvpill{position:absolute;top:5px;left:5px;background:var(--ink);color:var(--stat);font-size:8.5px;font-weight:bold;padding:1px 5px;border-radius:8px;z-index:2}
.ccard .cat{position:absolute;top:5px;right:5px;font-size:7.5px;font-weight:bold;background:rgba(255,255,255,.85);border:1px solid var(--ink);padding:0 4px;border-radius:6px;z-index:2}
.ccard .info{padding:5px 7px 7px}
.ccard .nm{font-size:10.5px;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ccard .ttl{font-size:8.5px;color:#5b627c}
.xpbar{height:8px;background:#d7dcef;border:2px solid var(--ink);border-radius:4px;overflow:hidden;margin-top:3px}
.xpbar i{display:block;height:100%;background:repeating-linear-gradient(90deg,var(--green) 0 5px,#7ff0a8 5px 7px)}
/* Stamina (plan AI credits left this month): same pixel bar as XP; blue = st-ok, orange = st-low (80%+ used), red = st-empty */
.stam{margin-top:4px}.stam .stl{display:flex;justify-content:space-between;font-size:8.5px;color:#3d4360}.stam .stl b{color:var(--ink)}
.stam .stm{font-size:8px;color:#3d4360;margin-top:2px;line-height:1.25}
.xpbar.st i{background:repeating-linear-gradient(90deg,#38bdf8 0 5px,#9be3ff 5px 7px)}
.xpbar.st.st-low i{background:repeating-linear-gradient(90deg,#f59e0b 0 5px,#ffd08a 5px 7px)}
.xpbar.st.st-empty{background:#f6c9cf}.stam.st-empty .stl b,.stam.st-empty .stm{color:var(--red);font-weight:bold}  /* st- prefix: plain .ok/.empty are global boxes */
.stats{display:flex;gap:6px;font-size:8.5px;margin-top:3px;color:#3d4360}
.stats b{color:var(--ink)}
/* gear shop */
.filters{display:flex;gap:4px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.filters button{flex:none;font-size:9px;font-weight:bold;border:2px solid var(--ink);border-radius:12px;background:var(--indigo);color:var(--ice);padding:3px 8px}
.filters button.on{background:var(--stat);color:var(--ink)}
.loot{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.lootc{border:3px solid var(--ink);border-radius:10px;background:var(--parch);color:var(--ink);padding:7px 4px 6px;text-align:center;cursor:pointer;box-shadow:0 0 0 2px #fff6dc inset,0 3px 0 #050822;position:relative}
.medal{width:58px;height:58px;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle,#fff8e6 0,#f3dfb2 58%,#d9b97a 60%,#c0622a 64%,rgba(192,98,42,.0) 76%);box-shadow:0 0 12px rgba(232,140,60,.65);border:2px solid var(--ink)}
.medal svg{width:34px;height:34px;image-rendering:pixelated}
.lootc .nm{font-size:8.5px;font-weight:bold;margin-top:4px;line-height:1.15;min-height:20px}
.lootc .sl{font-size:7.5px;color:#6a5a3a;text-transform:uppercase}
.conn{display:inline-block;font-size:7px;font-weight:bold;border:1px solid var(--ink);border-radius:6px;padding:0 4px;margin-top:2px}
.conn.not_connected{background:#e6e1d3;color:#6a6f86}.conn.connected{background:#8ff0b0}.conn.no_connection_needed{background:var(--ice)}
.lootc .eq{position:absolute;top:4px;left:4px;font-size:7px;background:var(--green);border:1px solid var(--ink);border-radius:5px;padding:0 3px}
.sheet{position:fixed;inset:0;z-index:50;background:rgba(5,8,34,.7);display:flex;align-items:flex-end;justify-content:center}
.sheet .box{width:100%;max-width:600px;max-height:88vh;overflow:auto;background:var(--card);color:var(--ink);border:3px solid var(--ink);border-radius:14px 14px 0 0;padding:12px 12px calc(14px + env(safe-area-inset-bottom))}
/* gear slots on agent page */
.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.slot{border:2px solid var(--ink);border-radius:8px;background:var(--parch);color:var(--ink);text-align:center;padding:5px 3px;min-height:86px;cursor:pointer}
.slot .medal{width:44px;height:44px}.slot .medal svg{width:26px;height:26px}
.slot.empty .medal{background:#d8ccae;box-shadow:none;opacity:.6}
.slot .k{font-size:7.5px;text-transform:uppercase;color:#6a5a3a}.slot .v{font-size:8px;font-weight:bold;line-height:1.1;margin-top:2px}
.hero{display:flex;gap:10px;align-items:center}
.hero .stage{width:150px;height:140px;flex:none;border:3px solid var(--ink);border-radius:10px;position:relative;overflow:hidden;
  background:radial-gradient(ellipse at 50% 95%,rgba(0,0,0,.3) 0 22%,transparent 23%),linear-gradient(var(--cc),#16225b)}
.hero .stage svg{position:absolute;left:50%;top:6px;transform:translateX(-50%);width:150px;height:137px;overflow:visible}
.perks{display:flex;gap:4px;flex-wrap:wrap}
.perk{font-size:8px;border:2px solid var(--ink);border-radius:8px;padding:1px 5px;background:#d7dcef;color:#6a6f86}
.perk.on{background:var(--stat);color:var(--ink)}
/* wizard */
.steps{display:flex;gap:4px;margin:6px 0}
.steps span{flex:1;height:6px;border-radius:3px;background:#2a3a7a;border:1px solid var(--ink)}.steps span.on{background:var(--stat)}
.classgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.classcard{border:3px solid var(--ink);border-radius:10px;padding:8px;color:#fff;cursor:pointer;background:linear-gradient(160deg,var(--cc),color-mix(in srgb,var(--cc) 50%,#0a0f30));box-shadow:0 3px 0 #050822;min-height:84px}
.classcard.on{outline:3px solid var(--stat);outline-offset:1px}
.classcard b{font-size:11px;display:block;text-shadow:1px 1px 0 var(--ink)}.classcard span{font-size:8.5px;display:block;margin-top:3px;opacity:.95}
.classcard i{font-style:normal;font-size:20px}
.opts{display:flex;gap:5px;flex-wrap:wrap}
.opt{border:2px solid var(--ink);border-radius:8px;background:#fff;padding:2px;cursor:pointer;width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:8px;color:var(--ink);text-align:center;line-height:1.05}
.opt.on{outline:3px solid var(--stat);background:#fff8d6}
.opt svg{width:42px;height:42px}
.swatches{display:flex;gap:5px;flex-wrap:wrap}
.sw{width:26px;height:26px;border:2px solid var(--ink);border-radius:50%;cursor:pointer}.sw.on{outline:3px solid var(--stat);outline-offset:1px}
.preview{position:sticky;top:52px;z-index:5;display:flex;gap:10px;align-items:center;padding:6px;background:var(--indigo)}
.preview .stage{width:110px;height:100px}.preview .stage svg{width:110px;height:100px}
/* stage stepper */
.stepper{display:flex;gap:3px;margin:6px 0}
.stepper div{flex:1;text-align:center;font-size:7px;font-weight:bold;padding:4px 1px;border:2px solid var(--ink);border-radius:5px;background:#2a3a7a;color:var(--mute);line-height:1.1}
.stepper div.done{background:var(--green);color:var(--ink)}.stepper div.cur{background:var(--stat);color:var(--ink)}
table.lines{width:100%;border-collapse:collapse;font-size:10px}
table.lines td,table.lines th{border-bottom:1px solid #c9c2ad;padding:3px 2px;text-align:left}
table.lines input{padding:3px;font-size:10px}
.gl{padding:8px;margin:6px 0}
.gl b{font-size:11px}.gl .es{color:var(--loot);font-weight:bold;font-size:11px}
.gl p{margin:4px 0 0;font-size:10px;line-height:1.35}
.empty{text-align:center;color:var(--mute);font-size:10px;padding:14px}
@media (prefers-reduced-motion: reduce){*{animation-duration:0s!important;transition:none!important}}

/* ===================== v2: smooth hand-drawn style ===================== */
@font-face{font-family:"Nunito";src:url(/static/fonts/Nunito.ttf) format("truetype");font-weight:200 1000;font-display:swap}
:root{--font:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif}
body{font-weight:600;letter-spacing:.1px}
h1,h2,h3,.btn,.ribbon,.nameplate,.zlabel,.chip{font-weight:800}
.top h1{letter-spacing:1.5px}
.px{border:2.5px solid var(--ink);border-radius:14px;box-shadow:0 0 0 2px rgba(183,205,237,.35) inset,0 6px 14px rgba(3,6,30,.45)}
.btn{border-radius:10px}
.bld svg,.prop svg,.medal svg{image-rendering:auto}
.medal svg{width:46px;height:46px}.slot .medal svg{width:35px;height:35px}.medal.pop svg{width:56px;height:56px}  /* Art Lead: detailed gear art fills ~79% of the medal (was 40/58, 30/44) */
/* world map: painted island */
.map{background:
  radial-gradient(ellipse at 18% 22%,rgba(255,255,255,.18) 0 40px,transparent 70px),
  radial-gradient(ellipse at 80% 60%,rgba(40,90,40,.25) 0 60px,transparent 110px),
  radial-gradient(ellipse at 40% 85%,rgba(255,240,180,.12) 0 50px,transparent 90px),
  linear-gradient(160deg,#7cc56a,#4f9d55 55%,#3f8a4e)}
.map .water{background:radial-gradient(ellipse at 40% 35%,#8fd0ff,#4a90d6 60%,#3a78c0);border:2.5px solid var(--ink);box-shadow:inset 0 0 0 6px rgba(255,255,255,.25)}
.map .water:after{content:"";position:absolute;left:30px;top:26px;width:40px;height:6px;border-radius:6px;background:rgba(255,255,255,.55);animation:shimmer 3s ease-in-out infinite}
@keyframes shimmer{0%,100%{transform:translateX(0);opacity:.6}50%{transform:translateX(12px);opacity:1}}
.map .tree{position:absolute;width:22px;height:26px;pointer-events:none}
.ribbon{border-radius:4px}
.bld svg{filter:drop-shadow(0 4px 3px rgba(0,0,0,.28))}
.bld .smoke{animation:smoke 3s ease-out infinite;transform-box:fill-box;transform-origin:center}
.bld .smoke.d2{animation-delay:1.5s}
@keyframes smoke{0%{transform:translateY(0) scale(.6);opacity:.8}100%{transform:translateY(-14px) scale(1.4);opacity:0}}
.bld .win{animation:winglow 2.6s ease-in-out infinite}
@keyframes winglow{0%,100%{opacity:1}50%{opacity:.65}}
.bld .flagw{animation:flag 1.4s ease-in-out infinite;transform-box:fill-box;transform-origin:0 50%}
@keyframes flag{0%,100%{transform:skewY(0)}50%{transform:skewY(-8deg) scaleX(.92)}}
.walker{position:absolute;width:30px;height:30px;transform:translate(-50%,-100%);transition:left 4s linear,top 4s linear;pointer-events:none;z-index:3}
.walker svg{width:30px;height:29px;overflow:visible}
.walker.walking svg{animation:walkbob .3s steps(2) infinite}
.walker.flip svg .face{transform:scaleX(-1)}
.walker .chat{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:8px;padding:0 4px;font-size:8px;font-weight:800;white-space:nowrap}
/* office: cozy cutaway */
.scene{border-radius:14px}
.wall{background:radial-gradient(ellipse at 50% 120%,rgba(255,255,255,.25),transparent 70%),linear-gradient(#f3d9b4,#e2bd8f)}
.wall:before{height:16px;background:radial-gradient(circle at 8px 0,#d98b96 0 9px,#b8646f 9.5px 11px,transparent 11.5px) 0 0/16px 16px repeat-x,#ce7d88;border-bottom:2.5px solid var(--ink)}
.wall:after{height:10px;background:linear-gradient(#a06a45,#80522f);border-top:2.5px solid var(--ink)}
.floor{background:repeating-linear-gradient(90deg,rgba(60,30,10,.18) 0 1.5px,transparent 1.5px 46px),repeating-linear-gradient(0deg,rgba(60,30,10,.12) 0 1.5px,transparent 1.5px 23px),radial-gradient(ellipse at 50% 0,rgba(255,220,170,.35),transparent 70%),linear-gradient(#c08a5a,#9a6a42)}
.lounge{border-radius:14px;border-width:2.5px;background:radial-gradient(ellipse at 50% 50%,#a48cf0,#7b5cd6);opacity:.3}
.zlabel{border-radius:8px;border-width:2px}
.gate .pil{border-width:2.5px;border-radius:5px;background:linear-gradient(90deg,#e6eefb,#a9bde0)}
.gate .arch{border-width:2.5px}
.gate .banner{border-radius:6px}
/* characters: smaller in office/world (≈78%), bigger on detail pages */
.agent{width:60px}
.agent .shadow{display:none}
.agent .sprite{bottom:13px;height:54px}
.agent .sprite svg{width:57px;height:54px;margin:0 auto}
.agent .face{transform-origin:50px 80px;transform-box:view-box}
.agent .bubble{bottom:64px}
.agent.mini{width:46px;height:58px}
.agent.mini .sprite{bottom:11px;height:42px}.agent.mini .sprite svg{width:44px;height:42px}
.agent.lv8 .sprite:before{left:18px;right:18px}
.agent.walking .legs-a,.agent.walking .legs-b{transform-box:view-box}
.nameplate{border-radius:6px;font-size:7px}
.agent.working .weapon{transform-box:view-box;transform-origin:77px 90px}
.agent .aura{animation:glowp 1.8s ease-in-out infinite}
.drip,.sparkle,.waves,.mist{animation:glowp 1.4s ease-in-out infinite}
.bolts{animation:zap .5s steps(2) infinite}@keyframes zap{0%{opacity:1}50%{opacity:.45}}
.flag,.cape,.scarf,.tails{animation:sway 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:0 0}
@keyframes sway{0%,100%{transform:skewX(0)}50%{transform:skewX(-4deg)}}
.ccard .bg{height:132px}
.ccard .bg svg{width:142px;height:135px;top:0}
.hero .stage{height:170px}
.hero .stage svg{width:190px;height:180px;top:-6px}
.preview .stage{width:120px;height:124px}.preview .stage svg{width:132px;height:125px;margin-left:-6px}
.por{overflow:hidden}
.flyscroll svg{width:28px;height:18px}

.live{display:inline-block;width:8px;height:8px;border-radius:50%;margin-left:7px;vertical-align:2px;border:1.5px solid var(--ink)}
.live.on{background:#3ccf7a;box-shadow:0 0 6px #3ccf7a;animation:glowp 1.6s infinite}.live.off{background:#9fb0dc}

.opt{border-radius:10px}
.opts.wpn .opt{width:64px;height:auto;padding:2px 2px 3px;display:flex;flex-direction:column;align-items:center}
.opts.wpn .opt svg{width:44px;height:62px}
.opt small{display:block;font-size:7px;line-height:1.1;text-align:center;color:var(--ink);font-weight:800}
.opt .optfull svg{width:46px;height:46px}
.opt:has(.optfull){height:auto;width:58px;flex-direction:column;padding:2px}
.hero .stage svg{top:-16px}
/* ---------- crew / outbox ---------- */
.subgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.subc{background:var(--card);color:var(--ink);border:2.5px solid var(--ink);border-radius:12px;padding:7px}
.subc.warn,.crewm.warn{box-shadow:0 0 0 3px #f59e0b inset}
.subc .t{font-weight:800;font-size:12px}.subc .s{font-size:10px;color:#556}
.sstats{display:flex;gap:9px;font-size:11px;font-weight:800;margin:5px 0}
.item.sched .bar{height:6px;background:#2a3570;border-radius:4px;margin-top:4px;overflow:hidden}.item.sched .bar i{display:block;height:100%;background:var(--stat)}
.item.sched.warn{box-shadow:0 0 0 2px #f59e0b inset}
.crewstrip{display:flex;gap:6px;overflow-x:auto;padding:4px 0}
.crewm{flex:0 0 74px;text-align:center;background:var(--card);color:var(--ink);border:2px solid var(--ink);border-radius:12px;padding:4px 2px;text-decoration:none}
.crewm .cs svg{width:56px;height:64px}.crewm .nm{font-size:10px;font-weight:800}
.mail{background:var(--card);color:var(--ink);border:2.5px solid var(--ink);border-radius:12px;padding:7px;margin:7px 0}
.mail.not_sent{border-color:#b45309}.mail .t{font-weight:800;font-size:12px}
.mail textarea,.mail .msub{width:100%;margin-top:5px;font-family:var(--font);font-size:12px}
.mail .msubj{font-weight:700;font-size:12px;margin-top:4px}
.mpre{white-space:pre-wrap;font-family:var(--font);font-size:11.5px;background:#eef1fa;padding:6px;border-radius:8px}
.gearbox{display:flex;gap:8px;align-items:center;background:var(--card);border:2px solid var(--ink);border-radius:12px;padding:6px;margin-top:6px;color:var(--ink)}
.chip.s-draft{background:#fde68a}.chip.s-not_sent{background:#fed7aa}.chip.s-sent{background:#86efac}.chip.s-approved{background:#bfdbfe}

/* ================= v6: living agents, game screens, open world (cute sci-fi x medieval) ================= */
.topbtn{background:none;border:0;font-size:18px;padding:6px;min-width:40px;min-height:40px;cursor:pointer;text-decoration:none;color:inherit}
.topbtn.sound-toggle.on{filter:drop-shadow(0 0 6px #7cf9ff)}
.btn.big{min-height:48px;padding:10px 16px;font-size:15px}
h3{font-size:13px;margin:12px 0 6px}
/* creator */
.missiongrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:8px 0}
.mtile{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 8px;min-height:132px;border:3px solid var(--ink);border-radius:14px;background:#fff;color:var(--ink);cursor:pointer;text-align:center;box-shadow:0 4px 0 #050822;transition:transform .12s}
.mtile small{font-size:11px;opacity:.75;line-height:1.25}.mtile.on{background:color-mix(in srgb,var(--mc) 22%,#fff);border-color:var(--mc);transform:translateY(-2px);box-shadow:0 0 0 3px var(--mc),0 6px 0 #050822}
.mtile .sug{position:absolute;top:-8px;right:-6px;background:#ff4fd8;color:#fff;border-radius:10px;padding:1px 7px;font-size:10px}
.mprop{animation:float 2.6s ease-in-out infinite}
.oq{margin-top:8px}.oans{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.oa{border:2px solid var(--ink);background:#fff;color:var(--ink);border-radius:20px;padding:8px 12px;min-height:44px;cursor:pointer;font-size:13px;text-align:left}
.oa.on{background:#fff27a;box-shadow:0 0 0 2px #ff4fd8}
.slid{display:grid;grid-template-columns:96px 1fr 96px;align-items:center;gap:6px;font-size:12px;margin:6px 0}.slid span:last-child{text-align:right}
.slid input[type=range]{width:100%;accent-color:#ff4fd8;height:28px}
.custom{border-top:2px dashed #b9a77a;margin-top:12px;padding-top:4px}
/* props + pets */
.propsvg{overflow:visible}.pr-satchel .fly{animation:flyletter 2.4s ease-in-out infinite}.pr-satchel .f2{animation-delay:.8s}
.pr-lantern .glow{animation:glowp 1.8s ease-in-out infinite}.pr-lantern .tick{transform-origin:0 0;animation:spin 6s linear infinite}
.twk{animation:twinkle 1.6s ease-in-out infinite}.pr-quill .wr{transform-origin:34px 40px;animation:scribble 1.2s ease-in-out infinite}
.pr-shield .ring{animation:glowp 1.4s ease-in-out infinite}.bub{animation:bubble 1.8s ease-in infinite}.b2{animation-delay:.7s}
.petsvg{overflow:visible}.petsvg .pbody{animation:petbob 2.2s ease-in-out infinite}.pet-happy .pbody{animation:pethop 1s ease-in-out infinite}
.pet-sulky .pbody{animation:none;filter:saturate(.6)}.pet-egg .pbody{animation:eggwob 2.8s ease-in-out infinite}.petsvg .heart{animation:float 1.4s ease-in-out infinite}
.petsvg .wing{animation:glowp .3s ease-in-out infinite}.petsvg .glow{animation:glowp 1.6s ease-in-out infinite}.petsvg .cloud{animation:float 3s ease-in-out infinite}
.hero .stage{position:relative}.heroprop{position:absolute;right:-8px;bottom:6px}.heropet{position:absolute;left:-6px;bottom:0}
.petbig{width:100px}.petstrip{display:flex;gap:6px;overflow-x:auto;padding:6px 0}.pst{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);font-size:10px;min-width:52px}
.idle-bouncy{animation:pethop 1.1s ease-in-out infinite}.idle-sway{animation:sway 3.4s ease-in-out infinite}.idle-breathe{animation:petbob 2.6s ease-in-out infinite}
.bounce{animation:tapbounce .5s cubic-bezier(.3,1.6,.5,1)!important}
.chat{position:absolute;left:50%;top:-8px;transform:translate(-50%,-100%);background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:12px;padding:4px 8px;font-size:11px;white-space:nowrap;z-index:5;animation:pop .25s}
/* ring + chain */
.ringwrap{display:flex;justify-content:center}.ringsvg .tok{cursor:pointer}.ringsvg .tok circle{filter:drop-shadow(0 0 6px rgba(255,255,255,.6))}
.daypick{display:flex;justify-content:center;gap:4px;margin:6px 0}.dayb{min-width:40px;min-height:40px;border-radius:50%;border:2px solid var(--ink);background:#fff;color:var(--ink);font-weight:800;cursor:pointer}
.dayb.on{background:#ffcf5a;box-shadow:0 0 0 2px #ff9f1c}
.chain{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:6px 0}.chain .arrow{color:#ff4fd8;font-weight:900}
.blk{display:flex;align-items:center;gap:6px;background:color-mix(in srgb,var(--bc) 25%,#fff);border:2px solid var(--bc);border-radius:14px;padding:6px 8px;color:var(--ink);min-height:44px;position:relative;cursor:grab}
.blk.drag{opacity:.5;outline:3px dashed #ff4fd8}.blk .bt{display:flex;flex-direction:column;font-size:12px;line-height:1.15}.blk .bt small{opacity:.8}.blk .appr{color:#b91c1c}
.blk .bx{border:0;background:none;font-size:12px;cursor:pointer;min-width:28px;min-height:28px}
.chain.mini .blk{min-height:28px;padding:2px 6px;border-radius:10px}.chain.mini .bt b{font-size:10px}.chain.mini .arrow{font-size:10px}
.bi{font-size:18px;display:inline-block}.anim-ring{animation:ringb 1.6s ease-in-out infinite}.anim-fly{animation:float 1.6s ease-in-out infinite}.anim-spin{animation:spin 3s linear infinite}
.anim-hammer{animation:hammer .9s ease-in-out infinite;transform-origin:70% 80%}.anim-scan{animation:glowp 1.2s ease-in-out infinite}.anim-sleep{animation:petbob 3s ease-in-out infinite}
.anim-collect{animation:pethop 1.4s ease-in-out infinite}.anim-branch{animation:sway 2s ease-in-out infinite}
.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:8px 0}.pb{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:56px;border:2px solid var(--bc);background:color-mix(in srgb,var(--bc) 18%,#fff);color:var(--ink);border-radius:12px;font-size:20px;cursor:pointer}
.pb small{font-size:10px;font-weight:800}
.legend{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0}.lg{background:color-mix(in srgb,var(--bc) 25%,transparent);border:1px solid var(--bc);border-radius:10px;padding:2px 8px;font-size:11px}.lg small{opacity:.75}
/* today */
.todayc .row{gap:8px;align-items:center}.mcbadge{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);font-size:11px}
.nextq{display:block;margin-top:4px;background:#fff27a;border:2px solid var(--ink);border-radius:10px;padding:6px 8px;color:var(--ink);text-decoration:none;font-size:13px;animation:glowq 2s ease-in-out infinite}
.todaygrid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}.tg{display:flex;flex-direction:column;align-items:center;background:#fff;border:2px solid var(--ink);border-radius:12px;padding:6px;text-decoration:none;color:var(--ink);min-height:56px}
.tg b{font-size:20px}.tg small{font-size:10px}.tg.hot{background:#ffe1f1;box-shadow:0 0 0 2px #ff4fd8}
.offer{display:flex;align-items:center;gap:8px;background:#fff8d6;border:2px dashed #ffb020;border-radius:12px;padding:6px 8px;margin:6px 0;text-decoration:none;color:var(--ink)}
.item.hot{box-shadow:0 0 0 2px #ff4fd8 inset}
/* codex / library */
.codex{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:6px;margin:8px 0}
.cx{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--card);color:var(--ink);border:2px solid var(--ink);border-radius:12px;padding:6px 4px;min-height:96px;cursor:pointer;font-size:10px;text-align:center}
.cx.lock .medal,.cx.lock .hs,.sil{filter:brightness(0) opacity(.35)}.cx.lock{background:#d9dcea}.cx.own{box-shadow:0 0 10px rgba(124,249,255,.35)}
.cx.r-legendary.own{box-shadow:0 0 0 2px #ffcf5a,0 0 14px #ffcf5a}.cx.r-mythic.own{box-shadow:0 0 0 2px #ff4fd8,0 0 14px #ff4fd8}.cx.r-immortal.own{box-shadow:0 0 0 2px #7cf9ff,0 0 18px #ff4fd8;animation:glowq 2.4s infinite}
.cx .hs{width:60px;height:70px;display:block}.heroes .cx{min-height:130px}.medal.big{transform:scale(1.4);margin:8px}
.rankbig{margin:10px auto;width:170px;height:96px;border-radius:50% 50% 14px 14px;background:radial-gradient(circle at 50% 30%,#fff,var(--rc));border:3px solid var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink)}
.rankbig b{font-size:22px}.ranks{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}.lprop{margin-left:-14px}
.tree{display:flex;flex-direction:column;gap:6px}.tier{display:flex;flex-wrap:wrap;gap:6px;align-items:stretch}.tier>small{width:100%;opacity:.7}
.sk{flex:1 1 140px;display:flex;flex-direction:column;gap:2px;text-align:left;border:2px solid var(--ink);border-radius:12px;padding:8px;background:#e5e7ef;color:var(--ink);min-height:64px;cursor:default}
.sk small{font-size:11px;opacity:.8}.sk.own{background:#d1fae5;border-color:#10b981}.sk.av{background:#fff27a;cursor:pointer;animation:glowq 2s infinite}.sk.mis{border-style:dashed}.sk.lock{opacity:.6}
/* games */
.plan{position:relative;height:260px;background:#e8f1ff;border:2px solid var(--ink);border-radius:10px;margin:6px 0;background-image:linear-gradient(#c7d7f5 1px,transparent 1px),linear-gradient(90deg,#c7d7f5 1px,transparent 1px);background-size:20px 20px}
.plan span{position:absolute;font-size:20px;transform:translate(-50%,-50%)}
.duel{display:grid;grid-template-columns:1fr 1fr;gap:6px}.duel>div{display:flex;flex-direction:column;gap:6px}
.dq,.da{min-height:44px;border:2px solid var(--ink);border-radius:10px;background:#fff;color:var(--ink);cursor:pointer;padding:6px;font-size:13px}.dq.on{background:#fff27a}.good{background:#d1fae5!important}
#st{display:flex;flex-direction:column;gap:6px}
.scenebox{position:relative;height:260px;border:2px solid var(--ink);border-radius:10px;background:linear-gradient(#bfe3ff,#fef3c7);font-size:120px;display:flex;align-items:center;justify-content:center}
.spot{position:absolute;width:44px;height:44px;border-radius:50%;border:2px dashed transparent;background:transparent;transform:translate(-50%,-50%);cursor:pointer}.spot.found{border-color:#ff4fd8;background:rgba(255,79,216,.2)}
/* chat */
.chatwrap{margin-top:8px}.chans{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px}.chan{white-space:nowrap;background:var(--indigo);border:2px solid var(--peri);border-radius:16px;padding:6px 10px;text-decoration:none;font-size:12px;min-height:36px}
.chan.on{background:#ff4fd8;color:#fff;border-color:#fff}.msgs{max-height:58vh;overflow-y:auto}.msg{display:flex;gap:8px;align-items:flex-start;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.mav{width:34px;height:34px;flex:none;display:inline-block}.mav.u{font-size:22px}.macts{display:flex;gap:2px}.composer{position:sticky;bottom:calc(70px + env(safe-area-inset-bottom));background:var(--night);padding:6px 0}
/* commander */
.mcart{filter:drop-shadow(0 0 12px rgba(124,249,255,.5))}
/* open world */
.worldbar{display:flex;flex-direction:column;gap:6px;margin:8px 0}.worldbar .row,.panel .row{flex-wrap:wrap}.world{position:relative;height:62vh;min-height:360px;border:3px solid var(--ink);border-radius:14px;overflow:hidden;box-shadow:0 0 0 2px #3ef0ff inset,0 0 24px rgba(62,240,255,.25);touch-action:none}
.world svg{width:100%;height:100%;display:block;cursor:grab}.zoom{position:absolute;right:8px;bottom:8px;display:flex;flex-direction:column;gap:6px}.zoom .btn{min-width:44px;min-height:44px}
.tw{cursor:pointer}.tw .pulse{animation:glowp 2.4s ease-in-out infinite}.tw .beam{animation:glowp 1.8s ease-in-out infinite}.tw .rune{animation:glowp 2.8s ease-in-out infinite}
.flow{animation:dash 1.6s linear infinite}.orbit{animation:dash 20s linear infinite}.twinkle{animation:twinkle 2s ease-in-out infinite}
.sharecard svg{width:100%;max-width:340px;height:auto;filter:drop-shadow(0 6px 20px rgba(255,79,216,.35))}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes flyletter{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(4px,-6px) rotate(8deg)}100%{transform:translate(0,0) rotate(0)}}
@keyframes glowp{0%,100%{opacity:.55}50%{opacity:1}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes twinkle{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes scribble{0%,100%{transform:rotate(0)}50%{transform:rotate(-8deg)}}@keyframes bubble{0%{transform:translateY(0);opacity:.8}100%{transform:translateY(-16px);opacity:0}}
@keyframes petbob{0%,100%{transform:translateY(0) scale(var(--s,1))}50%{transform:translateY(-2px)}}@keyframes pethop{0%,100%{transform:translateY(0)}40%{transform:translateY(-6px)}60%{transform:translateY(-6px) scaleY(.96)}}
@keyframes eggwob{0%,90%,100%{transform:rotate(0)}93%{transform:rotate(-8deg)}96%{transform:rotate(8deg)}}@keyframes sway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@keyframes tapbounce{0%{transform:scale(1)}30%{transform:scale(1.12,.88)}60%{transform:scale(.94,1.08)}100%{transform:scale(1)}}@keyframes pop{from{transform:translate(-50%,-80%) scale(.6);opacity:0}}
@keyframes ringb{0%,100%{transform:rotate(0)}20%{transform:rotate(14deg)}40%{transform:rotate(-12deg)}60%{transform:rotate(6deg)}}@keyframes hammer{0%,100%{transform:rotate(0)}50%{transform:rotate(-30deg)}}
@keyframes glowq{0%,100%{box-shadow:0 0 0 2px #ff4fd8}50%{box-shadow:0 0 0 2px #7cf9ff,0 0 12px #7cf9ff}}@keyframes dash{to{stroke-dashoffset:-140}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.contrib{margin-top:2px;color:#5b4b8a}.contrib a{color:#7b2cbf;font-weight:800}
/* v7: commander layers + art review */
.mchero{position:relative;width:140px;height:150px;flex:none}.mchero>svg{width:140px;height:150px;overflow:visible}.mccrest{position:absolute;right:-8px;bottom:-4px;width:46px;height:46px;filter:drop-shadow(0 0 6px rgba(124,249,255,.6))}
.arstage{height:330px;border:3px solid var(--ink);border-radius:14px;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-top:6px}
.arstage svg{width:240px;height:250px;overflow:visible}.arstage.noanim *{animation:none!important}
.sw{display:inline-block;width:14px;height:14px;border-radius:4px;border:1px solid #fff;vertical-align:middle}
.arrow2{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:4px 0;border-bottom:1px dashed rgba(255,255,255,.12)}
.argrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.arcard{background:var(--card);color:var(--ink);border:2px solid var(--ink);border-radius:12px;padding:6px;display:grid;grid-template-columns:1fr 1fr;gap:4px;box-shadow:0 0 0 2px var(--gc) inset}
.arcard .tiny,.arcard .btn{grid-column:1/3}.arl,.arh{border-radius:8px;height:96px;display:flex;align-items:center;justify-content:center;overflow:hidden}.arh svg{width:84px;height:92px;overflow:visible}
.arcard.r-mythic{box-shadow:0 0 0 2px #ff4fd8 inset,0 0 10px #ff4fd8}.arcard.r-epic{box-shadow:0 0 0 2px #a855f7 inset}
.mc-orbit{transform-origin:50px 8px;animation:spin 9s linear infinite}.mc-spin{transform-box:fill-box;transform-origin:center;animation:spin 4s linear infinite}
.mc-spin-slow{animation:glowp 2.6s ease-in-out infinite}.mc-pulse{animation:glowp 1.2s ease-in-out infinite}.mc-plasma{animation:glowp .7s ease-in-out infinite}
.mc-thrust{animation:glowp .45s ease-in-out infinite}.mc-flag{transform-box:fill-box;transform-origin:right center;animation:flagw 2.2s ease-in-out infinite}.mc-ripple{animation:glowp 2s ease-in-out infinite}
.mc-aurora{animation:glowp 3s ease-in-out infinite}.mc-hud{animation:glowp 1.6s steps(2) infinite}
@keyframes flagw{0%,100%{transform:skewY(0)}50%{transform:skewY(-4deg) scaleX(.96)}}
.rx-glint{animation:twinkle 2.2s ease-in-out infinite}.rx-orbit{transform-origin:24px 24px;animation:spin 6s linear infinite}.rx-runes{transform-origin:24px 24px;animation:spin 14s linear infinite}
.vec-icon{overflow:visible}
.mcicon{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;background:#0a0f30;border-radius:10px;margin:0 auto 2px}.slot .mcicon{width:30px;height:30px;vertical-align:middle;margin-right:4px}.cx.lock .mcicon{filter:grayscale(1) brightness(.5)}
.autosend{margin-top:12px;border:3px dashed #9aa3c0;border-radius:12px;padding:8px;background:#f6f5fb;color:var(--ink)}.autosend.on{border:3px solid #ff8a3d;background:#fff4e6;box-shadow:0 0 0 3px rgba(255,138,61,.25)}
.asbadge{background:#ff8a3d!important;color:#fff!important}
.pr-keys .swing{transform-origin:40px 22px;animation:wig 2.4s ease-in-out infinite}.pr-ladle .steam,.petsvg .steam{animation:float 2.2s ease-in-out infinite}
.pr-compass .needle{transform-origin:32px 34px;animation:wig 3s ease-in-out infinite}.pr-horn .toot{transform-origin:20px 30px;animation:wig 1.8s ease-in-out infinite}
.pr-tome .cap{animation:float 2.6s ease-in-out infinite}.heartbeat{transform-box:fill-box;transform-origin:center;animation:hb 1.1s ease-in-out infinite}.petsvg .wave{animation:float 1.6s ease-in-out infinite}.petsvg .stamp{transform-box:fill-box;transform-origin:center;animation:wig 2s ease-in-out infinite}
@keyframes wig{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}@keyframes hb{0%,100%{transform:scale(1)}30%{transform:scale(1.25)}}
/* v8 Quest Atlas */
.crest{flex:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}.item.atl{gap:8px}.item.atl.wide{width:100%;text-align:left;font:inherit;cursor:pointer}.feat{color:#e0a800;font-weight:900}
.featdom{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;border-left:6px solid var(--dc,#ff8a3d)}
.domgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.dom{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:8px 4px;border-radius:12px;background:var(--card);color:var(--ink);border:2px solid var(--ink);text-decoration:none;min-height:110px}
.dom b{font-size:11px;line-height:1.15}.dom small{font-size:10px;opacity:.7}.dom.isfeat{box-shadow:0 0 0 3px #f6c344,0 0 14px rgba(246,195,68,.6)}
.archs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.arch{display:flex;flex-direction:column;gap:2px;padding:8px;border-radius:12px;background:var(--card);color:var(--ink);border:2px solid var(--ink);border-top:6px solid var(--ac);text-decoration:none}
.arch .ai{font-size:24px}.arch small{font-size:10.5px;line-height:1.25}
.atlpick{background:#fff8ec;border:2px dashed #e0a800;border-radius:12px;padding:8px;margin-bottom:6px;color:var(--ink)}.atlpick .ok{color:#15803d;font-weight:800;margin-top:4px}
.picsteps{padding-left:20px;margin:8px 0}.picsteps li{margin:4px 0;font-size:13px}.picsteps li.you{font-weight:800}.picsteps li b{text-transform:capitalize;color:#6b4bd6}
.sug.new{background:#10b981!important}
.minipt{display:inline-flex;width:30px;height:30px;overflow:hidden;border-radius:50%}.minipt>*{width:30px!important;height:30px!important}.minipt svg{width:30px;height:30px}
.parch h3,.sheet .box label{color:var(--ink)}
/* AQ-013: panel headers with long titles + action buttons (e.g. ES Outbox "Aprobar todo en esta obra" + "Cuadrilla") wrap instead of pushing the page sideways at 390px */
.panel h2{flex-wrap:wrap;min-width:0}.panel h2>*{max-width:100%}.panel h2 .btn{white-space:normal;text-align:center}
/* v9: Power + VIP + capability trees */
.pbar{height:9px;border-radius:6px;background:#0002;overflow:hidden;margin:6px 0}.pbar i{display:block;height:100%;background:linear-gradient(90deg,#7b5cd6,#ff4fd8);border-radius:6px;transition:width .5s}
.powercard{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 85% 0%,color-mix(in srgb,var(--tc) 35%,transparent),transparent 60%),#16123a;color:#f8fafc;border:2px solid var(--tc);box-shadow:0 0 18px color-mix(in srgb,var(--tc) 45%,transparent)}
.powercard .small{color:#cbd5e1}.powercard .muted{opacity:.8}.pc-top{display:flex;justify-content:space-between;align-items:center}
.pscore{font-size:38px;font-weight:900;letter-spacing:1px;text-shadow:0 0 12px var(--tc)}
.ptier{display:inline-flex;align-items:center;gap:4px;font-weight:800;color:var(--tc);text-shadow:0 0 6px color-mix(in srgb,var(--tc) 60%,transparent)}.ptier.big{font-size:16px}
.ptier.big svg{animation:ptspin 6s linear infinite}@keyframes ptspin{to{transform:rotate(360deg)}}
.pt-prismatic .pscore{background:linear-gradient(90deg,#ff4fd8,#67e8f9,#facc15,#ff4fd8);-webkit-background-clip:text;color:transparent;background-size:300%;animation:prism 4s linear infinite}@keyframes prism{to{background-position:300%}}
.tierrow{display:flex;gap:6px;margin:6px 0}.tdot{width:14px;height:14px;border-radius:50%;border:2px solid var(--tc);opacity:.45}.tdot.on{background:var(--tc);opacity:1;box-shadow:0 0 6px var(--tc)}
.viprow{display:flex;gap:8px;align-items:center;padding:4px 0;border-bottom:1px dashed #0002;opacity:.6}.viprow.on{opacity:1}.viprow.on b{color:#b45309}
.statbox{display:flex;flex-direction:column;padding:8px 12px;border-radius:12px;background:#0001;min-width:90px}.statbox b{font-size:20px}
.gi{display:flex;gap:10px;align-items:center;padding:8px;margin:6px 0;border-radius:12px;border:2px solid var(--rc);background:linear-gradient(90deg,color-mix(in srgb,var(--rc) 14%,transparent),transparent)}
.gi-ic{width:42px;height:42px;display:grid;place-items:center}.gi-r{display:flex;flex-direction:column;gap:4px;align-items:flex-end}.gpow{font-weight:900}
.mcsw{width:30px;height:30px;border-radius:8px;display:inline-block;box-shadow:inset 0 0 0 3px #fff6}
.subs{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.sub{font-size:11px;padding:3px 7px;border-radius:9px;border:1.5px solid var(--sc);background:#fff;color:#1f2937;min-height:26px}.sub.lk{background:color-mix(in srgb,var(--sc) 25%,#fff)}
.lockbox{background:#1f1b3a;color:#f8fafc;padding:10px;border-radius:12px;border:2px dashed #a78bfa}.lockbox ul{margin:4px 0 0 18px}
.odds{width:100%;border-collapse:collapse}.odds td{padding:4px;border-bottom:1px dashed #0002}.rdot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
.cpath{position:relative;margin:8px 0}.cpath:before{content:"";position:absolute;left:15px;top:10px;bottom:10px;width:3px;background:#7b5cd633;border-radius:2px}
.cnode{display:flex;gap:10px;padding:6px 0;position:relative}.cn-dot{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:900;background:#e5e7eb;color:#475569;flex:none;z-index:1}
.cnode.on .cn-dot{background:linear-gradient(135deg,#34d399,#22d3ee);color:#fff;box-shadow:0 0 10px #34d39988}.cnode.ready .cn-dot{background:#facc15;color:#422006;animation:pulse 1.4s infinite}
.cnode.off{opacity:.8}.creq{font-size:12px}.creq.done{opacity:.7}.okc{color:#059669;font-weight:700}
.powerlink{border:2px solid var(--tc)}
@keyframes pulse{50%{transform:scale(1.12)}}
.powerlink .ptier{background:#1e1b4b;padding:1px 8px;border-radius:9px}
/* v9: guided tour coach card (docked above the nav, never full-screen) */
#coach{position:fixed;left:8px;right:8px;bottom:calc(66px + env(safe-area-inset-bottom));z-index:45;max-width:560px;margin:0 auto;pointer-events:none}
#coach>*{pointer-events:auto}
.coach-card{position:relative;background:linear-gradient(160deg,#2a1f6b,#16123a);color:#f8fafc;border:2px solid #a78bfa;border-radius:16px;padding:10px 12px;box-shadow:0 8px 24px #0008,0 0 16px #a78bfa55;overflow:hidden;animation:ccIn .35s ease-out}
@keyframes ccIn{from{transform:translateY(20px);opacity:0}}
.cc-top{display:flex;align-items:center;gap:8px}.cc-step{font-size:12px;font-weight:800;color:#facc15}.cc-dots{display:flex;gap:4px;flex:1}
.cc-dots i{width:9px;height:9px;border-radius:50%;background:#ffffff33}.cc-dots i.ok{background:#34d399}.cc-dots i.now{background:#facc15;box-shadow:0 0 6px #facc15}
.cc-min{background:none;border:0;color:#cbd5e1;font-size:18px;min-width:36px;min-height:32px}
.cc-h{font-weight:900;font-size:17px;margin:2px 0}.cc-b{font-size:13px;color:#e2e8f0}.cc-hint{font-size:13px;margin-top:6px;color:#fde68a}
.cc-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:8px}.cc-skip{background:none;border:0;color:#94a3b8;font-size:12px;text-decoration:underline;margin-left:auto;min-height:32px}
.cc-packs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.ppick{border-radius:12px;border:2px solid #a78bfa;background:#ffffff14;color:#fff;padding:8px 10px;font-weight:700;min-height:40px}
.ppick.on{background:#a78bfa;color:#1e1b4b}.ppick.soon{opacity:.45;border-style:dashed}.ppick small{font-weight:400}
.cc-task{font-size:13px;margin-top:6px;background:#ffffff12;padding:6px 8px;border-radius:10px}
.coach-pill{float:right;border-radius:20px;border:2px solid #a78bfa;background:#2a1f6b;color:#fff;padding:8px 14px;font-weight:800;box-shadow:0 4px 12px #0007}
.coach-card.done{border-color:#facc15}.confetti{position:absolute;inset:0;pointer-events:none}.confetti i{position:absolute;top:-20px;left:calc(var(--i)*7%);font-style:normal;animation:conf 2.4s ease-in calc(var(--i)*.08s) forwards}
@keyframes conf{to{transform:translateY(220px) rotate(540deg);opacity:0}}
.cc-soon{font-size:12px;color:#cbd5e1;margin-top:6px}.cc-soon span{font-size:16px}
.coach-bar{display:flex;gap:8px;align-items:center;background:#2a1f6b;color:#fde68a;border:2px solid #a78bfa;border-radius:14px;padding:6px 10px;font-size:13px;box-shadow:0 4px 14px #0007}.coach-bar .cc-skip{margin-left:0;color:#cbd5e1}
#coach.top{top:calc(64px + env(safe-area-inset-top));bottom:auto}
/* AQ-011: Member view: owner/checker-only links hidden, locked controls greyed out (server still enforces) */
body[data-role=member] .aq-hide{display:none!important}.aq-locked{opacity:.5;pointer-events:none;filter:grayscale(.4)}
/* v9: Live Ops (sky theme): one big map, one main action (the red "needs your OK" button), 44px tap targets */
.lo-wrap{position:relative;height:calc(100vh - 150px);height:calc(100dvh - 150px);min-height:420px;border-radius:16px;overflow:hidden;background:#c7e8ff;border:2px solid #fff;box-shadow:0 6px 24px #0f172a33}
.lo-wrap canvas{display:block;touch-action:none;cursor:grab}
.lo-top{position:absolute;left:8px;top:8px;right:64px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;pointer-events:none}
.lo-top>*{pointer-events:auto}
.lo-btn{min-height:44px;min-width:44px;display:inline-flex;align-items:center;gap:6px;padding:0 14px;border-radius:22px;background:#fff;color:#0f172a;border:2px solid #0f172a;font-weight:900;font-size:14px;text-decoration:none;box-shadow:0 2px 0 #0f172a}
.lo-btn[hidden]{display:none}.lo-btn.need{background:#dc2626;color:#fff;border-color:#7f1d1d;box-shadow:0 2px 0 #7f1d1d;animation:loPulse 1.6s ease-in-out infinite}
@keyframes loPulse{50%{transform:scale(1.05)}}
.lo-chip{background:#ffffffe6;border:2px solid #0f172a33;border-radius:12px;padding:4px 10px;font-size:12px;font-weight:900;color:#0f172a}.lo-chip.demo{border-color:#b45309;color:#78350f;background:#fef3c7}.lo-chip.live{border-color:#15803d;color:#14532d;background:#dcfce7}
.lo-fps{font-size:11px;color:#334155;background:#ffffffb0;padding:2px 6px;border-radius:8px}
.lo-zoom{position:absolute;right:8px;top:8px;display:flex;flex-direction:column;gap:8px}
.lo-zoom button{width:46px;height:46px;border-radius:14px;background:#fff;border:2px solid #0f172a;color:#0f172a;font-size:20px;font-weight:900;box-shadow:0 2px 0 #0f172a}
.lo-legend{position:absolute;left:8px;top:62px;width:min(300px,calc(100% - 76px));background:#fff;color:#0f172a;border:2px solid #0f172a;border-radius:16px;padding:12px;font-size:13px;box-shadow:0 6px 18px #0f172a33;z-index:3}
.lo-legend b{display:block;font-size:15px;margin-bottom:6px}.lo-legend .lg{display:flex;align-items:center;gap:8px;margin:5px 0}.lo-legend .tiny{margin:6px 0;color:#334155}
.lo-legend .btn{min-height:44px;width:100%}
.lo-legend i.tube{width:22px;height:10px;border-radius:6px;background:#7dd3fc;border:2px solid #fff;outline:1px solid #38bdf8;display:inline-block}
.lo-legend i.route{width:22px;height:0;border-top:3px dashed #2563eb;display:inline-block}
.lo-card{position:absolute;left:8px;right:64px;bottom:8px;max-width:380px;background:#fff;color:#0f172a;border:2px solid #0f172a;border-radius:18px;padding:12px;box-shadow:0 8px 24px #0f172a40;z-index:4}
.lc-top{display:flex;align-items:center;gap:8px;font-size:16px}.lc-dot{width:14px;height:14px;border-radius:50%;border:2px solid #fff;outline:2px solid #0f172a33}.lc-st{font-size:12px;font-weight:900;margin-left:auto}
.lc-x{width:44px;height:44px;border-radius:12px;border:0;background:#f1f5f9;font-size:18px;color:#0f172a}
.lc-row{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid #e2e8f0}.lc-row>span{font-size:18px;width:24px;text-align:center}.lc-row small{color:#475569;font-weight:800}.lc-row.need{color:#991b1b}.lc-row.need>span{color:#dc2626}
.lo-card .btn{min-height:44px;display:flex;align-items:center;justify-content:center;margin-top:6px}
.lo-feed{position:absolute;left:8px;right:8px;bottom:8px;display:flex;flex-direction:column;gap:6px;pointer-events:none}
.lo-ev{pointer-events:auto;display:flex;gap:8px;align-items:center;min-height:44px;text-align:left;background:#ffffffee;color:#0f172a;border:2px solid #0f172a22;border-left:6px solid #7c3aed;border-radius:12px;padding:4px 10px;font-size:13px;width:100%}
.lo-ev.s-need{border-left-color:#dc2626;background:#fff1f2}.lo-ev.s-done{border-left-color:#16a34a}.lo-ev.s-move{border-left-color:#2563eb}
.lo-ev small{color:#475569}.lo-ev i{font-size:11px;color:#475569;font-style:normal}.lo-ev .grow{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.lo-ev .ic{font-size:16px}
.lo-card:not([hidden])~.lo-feed{display:none}
.lo-entry{margin:8px 0;display:inline-block;border:2px solid #0ea5e9;background:#e0f2fe;color:#0c4a6e;min-height:44px}
@media (prefers-reduced-motion: reduce){.lo-btn.need{animation:none}}
@media (min-width:760px){.lo-wrap{--lw:min(1400px,calc(100vw - 24px));width:var(--lw);margin-left:calc((100% - var(--lw))/2);height:calc(100vh - 170px)}
 .lo-feed{left:auto;width:340px;bottom:12px;right:72px}.lo-card{bottom:12px}}
/* App Store: privacy + support links (login footer, Settings) */
.legal{display:flex;flex-wrap:wrap;gap:4px 6px;margin-top:6px;line-height:1.6}.legal a{color:inherit;text-decoration:underline}.legalfoot{text-align:center}
/* v9: construction lore cards (read-only) */
.lorecard{border-left:6px solid var(--lc)}.lorecard .lc-h{font-weight:900;font-size:15px;display:flex;gap:8px;align-items:center}
.lorecard .lc-motto{font-style:italic;font-weight:800;margin:6px 0;color:var(--lc);filter:brightness(.8)}.lorecard details summary{min-height:44px;display:flex;align-items:center;font-weight:800;cursor:pointer;font-size:14px}.lorecard details summary::before{content:"▸ ";margin-right:4px}.lorecard details[open] summary::before{content:"▾ "}
.lorecard .chip.on{background:var(--lc);color:#fff}.lore-motto{opacity:.85;margin-top:2px}
.lorestrip{display:flex;gap:8px;overflow-x:auto;padding:6px 0}.lorechip{flex:0 0 200px;min-height:44px;border-radius:14px;padding:10px;background:#fff;border:2px solid var(--lc);color:#1e293b;text-decoration:none;display:flex;flex-direction:column;gap:4px}
.lorechip span{font-size:12px;font-style:italic}
/* v9: gear reroll sheet (multipliers, before -> after) */
.sub b{font-weight:900;color:#475569}.sub.new{background:#fef9c3}.sub.keep{min-height:44px;cursor:pointer}.sub.keep:disabled{opacity:.45;cursor:not-allowed}
.rrs .btn.big{width:100%;min-height:48px;margin-top:8px}.rrba{display:flex;gap:8px;align-items:center;margin-top:10px;padding:8px;border:2px dashed var(--ink);border-radius:12px}
.rrba>div:not(.rrarrow){flex:1;display:flex;flex-direction:column;gap:4px}.rrarrow{font-size:22px}.rrba .ok{color:#15803d}.rrba .bad{color:#b91c1c}
/* v9: leaderboards per industry pack */
.ptabs{display:flex;gap:6px;overflow-x:auto;padding:4px 0}.ptab{flex:0 0 auto;min-height:44px;padding:0 14px;border-radius:22px;border:2px solid var(--ink);background:#fff;color:#1e293b;font-weight:800}
.ptab.on{background:var(--gold,#facc15);color:#1e1b4b}.seasonbar{margin:6px 0 2px;font-weight:800}
.pbl{list-style:none;padding:0;margin:8px 0}.pbl li{display:flex;gap:10px;align-items:center;padding:8px;border-radius:12px;background:#ffffff10;margin-bottom:6px;min-height:44px}
.pbl li.me{outline:2px solid var(--gold,#facc15)}.pbl .pl{width:34px}.pbl .sc{font-size:16px}

/* IAP paywall + Purchases & plan (static/js/iap.js) */
.pw-tabs{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0}.pw-tabs .btn{flex:1 1 auto;text-align:center}
.pw-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 6px;font-size:11px;margin:4px 0 6px}.pw-foot a,.linkbtn{color:inherit;text-decoration:underline;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.pw-plan{border-top:2px dashed #0002;padding-top:6px;margin-top:6px}.pw-plan ul{margin:2px 0 4px 16px}
.pw-row{display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid #0001;min-width:0}.pw-row .grow{min-width:0}
.pw-price{font-size:16px;font-weight:800}.pw-trial{color:#166534}.pw-link{text-align:center;margin-top:8px}.pw-link a{color:var(--indigo);font-weight:800}
.iap-banner{padding:8px;border-radius:10px;margin:6px 0;background:#fef3c7;color:#713f12;border:2px solid #f59e0b}
/* v9: my day, daily quests, weekly Mythic, collector board */
.qbar{height:8px;border-radius:5px;background:#0002;overflow:hidden;margin:3px 0}.qbar i{display:block;height:100%;border-radius:5px}
.qcard{display:block}.qcard.setup{display:flex;gap:10px;align-items:center;min-height:64px;border:3px solid #facc15}.qcard .qi{font-size:28px}
.qrow{display:flex;gap:8px;align-items:center;padding:4px 0}.qrow.ok .small{text-decoration:line-through;opacity:.7}
.myday .sugs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.sug{min-height:44px;padding:0 12px;border-radius:22px;border:2px solid var(--ink);background:#fff;color:#1e293b;font-weight:700}
.sug.on{background:#bbf7d0}.myday input{flex:1;min-height:44px;padding:0 10px;border-radius:10px;border:2px solid var(--ink)}
.mdl{padding-left:20px}.mdl li{display:flex;gap:8px;align-items:center;margin:6px 0}.mdl select{min-height:40px;margin-top:4px;max-width:100%}
.dayp{display:flex;gap:4px;flex-wrap:wrap;margin:6px 0 10px}.dp{min-width:44px;min-height:44px;border-radius:12px;border:2px solid var(--ink);background:#fff;color:#1e293b;font-weight:800}.dp.on{background:#facc15}
.myday .btn.big,.parch .btn.big{width:100%;min-height:50px;margin-top:8px}
.mcard{display:flex;gap:10px;align-items:center;padding:10px;border-radius:14px;border:3px solid var(--mc);background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--mc) 25%,#fff));color:#1e293b;margin:6px 0;flex:1}
.mcard.big{padding:16px}.mcard .mgem{font-size:26px;width:48px;height:48px;display:grid;place-items:center;border-radius:12px;background:var(--mc);box-shadow:0 0 14px var(--mc)}
.mcard.big .mgem{font-size:36px;width:68px;height:68px}.mcard.owned{opacity:.75}
.odds td{padding:4px 10px}.apbig{font-size:40px;font-weight:900;text-align:center}.apbig b{color:#b45309}
.aptier{display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:1px dashed #0002}.aptier.ok b{color:#15803d}
/* v9: Arena 1v1 (placeholder battle art) */
.ar-pick{display:flex;gap:8px;overflow-x:auto;padding:6px 0}.ar-ag{flex:0 0 108px;min-height:120px;border:3px solid var(--ink);border-radius:14px;background:#fff;color:#1e293b;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px}
.ar-ag.on{background:#fef08a;box-shadow:0 0 0 3px #facc15}.ar-ag .por{width:56px;height:56px}.ar-ag small{font-size:10px}
.ar-slots{display:flex;gap:6px}.ar-slot{flex:1;min-height:44px;border-radius:12px;border:2px solid var(--ink);background:#fff;color:#1e293b;font-weight:800}.ar-slot.on{background:#facc15}
.ar-row{display:flex;gap:8px;align-items:center;min-height:48px;padding:4px 0;border-bottom:1px dashed #ffffff22;color:inherit;text-decoration:none}.ar-row .por{width:36px;height:36px}
.chip.adv{background:#bbf7d0;color:#14532d}.chip.dis{background:#fecaca;color:#7f1d1d}.ar-fair{display:flex;gap:6px;align-items:center;min-height:44px}
#ardef{min-height:44px;margin:6px 0;max-width:100%}
.ar-stage{position:relative;height:340px;border-radius:16px;overflow:hidden;border:3px solid var(--ink);margin:8px 0}
.ar-sky{position:absolute;inset:0;background:linear-gradient(#7dd3fc,#c7d2fe 60%,#fde68a)}.ar-floor{position:absolute;left:0;right:0;bottom:0;height:34%;background:repeating-linear-gradient(90deg,#a16207 0 40px,#b45309 40px 80px);border-top:4px solid #2f354a}
.ar-stage.od .ar-sky{background:linear-gradient(#f87171,#fb923c 60%,#fde68a);transition:background .6s}
.ar-f{position:absolute;bottom:18%;width:44%;display:flex;flex-direction:column;align-items:center}.ar-A{left:3%}.ar-D{right:3%}
.ar-body .por{width:110px;height:110px;border:3px solid #2f354a;border-radius:50%}.ar-D .ar-body{transform:scaleX(-1)}
.ar-hp{width:92%;height:12px;background:#0004;border:2px solid #2f354a;border-radius:7px;overflow:hidden}.ar-hp i{display:block;height:100%;background:linear-gradient(90deg,#22c55e,#a3e635);transition:width .15s}
.ar-meter{width:70%;height:6px;background:#0003;border-radius:4px;overflow:hidden;margin:2px 0}.ar-meter i{display:block;height:100%;background:#a855f7}
.ar-nm{font-weight:900;font-size:12px;color:#1e293b;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ar-cl{font-size:10px;color:#334155}.ar-chips{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;margin-top:3px}
.ar-f.lunge{animation:arL .25s}.ar-A.lunge{--dx:22px}.ar-D.lunge{--dx:-22px}@keyframes arL{50%{transform:translateX(var(--dx))}}
.ar-f.hurt .ar-body{animation:arH .3s}@keyframes arH{30%{filter:brightness(2) saturate(.3)}}
.ar-pop{position:absolute;top:38%;font-weight:900;font-size:18px;color:#fff;text-shadow:0 2px 0 #2f354a,0 0 6px #000;animation:arP .9s forwards;pointer-events:none}.ar-pop.crit{color:#fde047;font-size:22px}.ar-pop.skill{color:#f0abfc;font-size:24px}.ar-pop.miss{color:#e2e8f0}
@keyframes arP{to{transform:translateY(-46px);opacity:0}}
.ar-vs{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%) scale(.4);font:900 44px/1 system-ui;color:#fff;text-shadow:0 3px 0 #2f354a;opacity:0;transition:.3s}.ar-vs.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ar-clock{position:absolute;top:8px;left:50%;transform:translateX(-50%);background:#2f354a;color:#fff;border-radius:10px;padding:2px 10px;font-weight:800}
.ar-banner{position:absolute;top:22%;left:50%;transform:translateX(-50%);padding:6px 14px;border-radius:12px;background:#fff;color:#1e293b;font-weight:900;border:3px solid #2f354a;opacity:0;transition:opacity .2s;white-space:nowrap}.ar-banner.on{opacity:1}.ar-banner.od{background:#f97316;color:#fff}.ar-banner.win{background:#facc15}.ar-banner.lose{background:#cbd5e1}
.ar-ctl .btn{min-height:44px}.ar-result{padding:10px;border-radius:12px;border:3px solid var(--ink);background:#fff;color:#1e293b}.ar-result.win{background:#fef9c3}
.ar-wheel{width:100%;max-width:360px;display:block;margin:8px auto}.ar-wsel{background:#fff;color:#1e293b;border-radius:12px;padding:8px;border:2px solid var(--ink)}
@media (prefers-reduced-motion: reduce){.ar-f.lunge,.ar-f.hurt .ar-body,.ar-pop{animation:none}.ar-vs{transition:none}}
.ar-hp{background:#7f1d1d}.ar-ctl [hidden]{display:none!important}.ar-fair{justify-content:flex-start}.ar-fair input{width:22px;height:22px;flex:0 0 auto}
/* Live Ops feed chips: status palette + shape (matches the map + legend) */
.lo-ev .sti{width:22px;height:22px;flex:0 0 22px}.lo-ev .ic{font-size:13px;opacity:.85}
.lo-ev.s-move{border-left-color:#2563eb;background:#eff6ff}.lo-ev.s-work{border-left-color:#7c3aed;background:#f5f3ff}
.lo-ev.s-need{border-left-color:#dc2626;background:#fff1f2}.lo-ev.s-done{border-left-color:#16a34a;background:#f0fdf4}
/* Live Ops legend: route styles from the art pack (color + dash + end shape, EN/ES labels) */
.lo-legend .lgflows{border-top:1px solid #0f172a1a;margin-top:4px;padding-top:4px}.lo-legend .lgflows .lg{font-size:12px}
/* Arena battle beats: art (or placeholder) + live EN/ES words at the art's text anchor */
.ar-vs{font:inherit;text-shadow:none}.ar-beat{position:relative;display:inline-block}
.ar-beat img{display:block;width:100%;height:100%}.ar-beat .bw{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;font:900 28px/1 Nunito,system-ui;color:#fff;-webkit-text-stroke:1.5px #2f354a;paint-order:stroke fill;text-shadow:0 3px 0 #2f354a}
.ar-beat:not(.has-art) .bw{position:relative;transform:none;display:block;text-align:center;padding:10px 16px}
.ar-beat .ph{position:absolute;inset:0;border-radius:18px;border:4px solid #2f354a}
.ar-beat .bs{display:block;text-align:center;font-weight:900;font-size:13px;color:#1e293b;background:#fff;border:2px solid #2f354a;border-radius:999px;padding:2px 10px;margin-top:4px;white-space:nowrap}
.b-vs{width:110px}.b-vs .ph{border-radius:50%;background:radial-gradient(circle,#fde047,#f59e0b)}.b-vs:not(.has-art) .bw{padding:34px 0;font-size:36px}
.ar-end{position:absolute;inset:0;pointer-events:none}
.b-ko{position:absolute;top:30%;width:130px}.b-ko.at-A{left:8%}.b-ko.at-D{right:8%}.b-ko.at-mid{left:50%;margin-left:-65px}
.b-ko .ph{background:#dc2626;border-radius:12px;transform:rotate(-8deg)}.b-ko .bw{font-size:30px;transform:translate(-50%,-50%) rotate(-8deg)}.b-ko:not(.has-art) .bw{transform:rotate(-8deg)}
.b-crown{position:absolute;left:50%;top:8%;transform:translateX(-50%);width:200px}.b-crown .ph{background:linear-gradient(#fde047,#f59e0b)}.b-crown.lose .ph{background:linear-gradient(#94a3b8,#475569)}.b-crown.draw .ph{background:linear-gradient(#bae6fd,#38bdf8)}
.b-crown .bw{font-size:30px}.b-crown.win:not(.has-art)::before{content:"👑";position:absolute;left:50%;top:-30px;transform:translateX(-50%);font-size:30px}
.b-coin{position:absolute;left:50%;top:62%;transform:translateX(-50%);width:96px;text-align:center}.b-coin .ph{border-radius:50%;background:radial-gradient(circle at 35% 35%,#fef08a,#eab308 70%,#a16207);height:96px;inset:auto 0 auto 0}
.b-coin:not(.has-art) .bw{padding:36px 0;font-size:22px}
@keyframes arStamp{0%{transform:scale(2.4);opacity:0}60%{transform:scale(.92);opacity:1}100%{transform:scale(1)}}
@keyframes arRise{0%{transform:translate(-50%,30px);opacity:0}100%{transform:translate(-50%,0);opacity:1}}
@keyframes arSpin{0%{transform:translateX(-50%) rotateY(90deg);opacity:0}100%{transform:translateX(-50%) rotateY(0);opacity:1}}
@keyframes arPop{0%{transform:scale(.3);opacity:0}70%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
.ar-vs.on .b-vs{animation:arPop .45s ease-out both}.ar-vs.on .b-vs .bw{animation:arPop .35s .15s ease-out both}
.b-ko.stamp{animation:arStamp .4s ease-out both}.b-crown.rise{animation:arRise .45s ease-out both}.b-coin.spin{animation:arSpin .5s ease-out both}
@media (prefers-reduced-motion: reduce){.ar-vs.on .b-vs,.ar-vs.on .b-vs .bw,.b-ko.stamp,.b-crown.rise,.b-coin.spin{animation:none}}
.b-coin .bs{position:absolute;left:50%;top:100%;transform:translateX(-50%)}
/* Arena v10 replay: 4:3 stage (portrait 3:4 on phones), top HUD band, live Margin label top-left, presentation-timeline beats */
.ar-stage{height:auto;aspect-ratio:4/3;max-height:72vh}@media (max-width:600px){.ar-stage{aspect-ratio:3/4}}
.ar-cam{position:absolute;inset:0;transform-origin:50% 70%}
.ar-band{position:absolute;left:0;right:0;top:0;height:64px;background:#0f172a59;z-index:3}
.ar-hud{position:absolute;top:6px;width:46%;z-index:4;color:#fff}.ar-hA{left:2%}.ar-hD{right:2%;text-align:right}
.ar-hn b{display:block;font-size:13px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 0 #0f172a}.ar-hn span{font-size:11px;opacity:.9}
.ar-hud .ar-hp{position:relative;width:100%;height:14px;margin-top:3px;background:#7f1d1d;border:2px solid #0f172a;border-radius:8px;overflow:hidden}
.ar-hud .ar-hp s,.ar-hud .ar-hp i{position:absolute;top:0;bottom:0;left:0;display:block;text-decoration:none}.ar-hD .ar-hp s,.ar-hD .ar-hp i{left:auto;right:0}
.ar-hud .ar-hp s{background:#fff;transition:width .45s ease-out}.ar-hud .ar-hp i{transition:width .08s linear}
.ar-hud .ar-meter{height:4px;margin-top:2px;background:#0005;border-radius:3px;overflow:hidden}.ar-hD .ar-meter i{margin-left:auto}
.ar-margin{position:absolute;left:2%;top:70px;z-index:4;background:#fffffff0;color:#1e293b;border:2px solid #2f354a;border-radius:999px;padding:2px 10px;font:800 12px/1.4 Nunito,system-ui;min-width:70px}
.ar-margin.up b{color:#15803d}.ar-margin.down b{color:#b91c1c}
.ar-clock{top:auto;bottom:8px;z-index:4;font-size:12px}
.ar-f{bottom:16%;width:46%}.ar-A{left:2%}.ar-D{right:2%}
.ar-body .por{width:min(150px,32vw);height:min(150px,32vw)}@media (min-width:601px){.ar-body .por{width:150px;height:150px}}
.ar-ring{position:absolute;bottom:-6px;width:70%;height:16px;border-radius:50%;background:#fde04700;transition:background .15s}.ar-f.atk .ar-ring{background:#fde047aa}.ar-f.atk{z-index:2}
.ar-foot{width:56%;height:5px;margin-top:6px;background:#0005;border-radius:3px;overflow:hidden}.ar-foot i{display:block;height:100%}
.ar-f.ko .ar-chips{visibility:hidden}
.ar-pop{top:30%;font-size:22px;-webkit-text-stroke:3px #2f354a;paint-order:stroke fill;text-shadow:none;transform:translate(var(--sx,0),var(--sy,0))}.ar-pop.crit{font-size:32px;color:#fde047}.ar-pop.skill{font-size:30px;color:#fb923c}.ar-pop.miss{color:#cbd5e1;font-size:20px}
.b-crown{top:24%}.b-ko{top:36%}.b-coin{top:58%}
.ar-banner{top:84px;z-index:5}.ar-vs{z-index:5}.ar-end{z-index:6}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ar-pop{animation:arP2 .9s forwards}@keyframes arP2{from{transform:translate(var(--sx,0),var(--sy,0))}to{transform:translate(var(--sx,0),calc(var(--sy,0px) - 46px));opacity:0}}
.ar-f{bottom:20%}.ar-body .por{width:min(170px,42vw);height:min(170px,42vw)}@media (min-width:601px){.ar-body .por{width:190px;height:190px}}
.b-coin{top:auto;bottom:6%}.b-crown{top:21%}.b-ko{top:30%}
/* Arena replay with the Battle Scene Artist's autobattle kit (parts.json): arena, pose sprites, HP frames, sparks, drawn digits, text zones */
.ar-beat{container-type:inline-size}.ar-beat.has-art .ph{display:none}.ar-beat.has-art .bw{font-size:inherit;-webkit-text-stroke:1px #2f354a;overflow:hidden;text-overflow:ellipsis}
.ar-beat .bw.bn{font-weight:800;color:#fff;text-shadow:0 2px 0 #2f354a}
.ar-stage.kit .b-vs{width:min(96%,560px)}.ar-stage.kit .ar-vs{width:100%;display:flex;justify-content:center}
.ar-stage.kit .b-win,.ar-stage.kit .b-lose{width:min(70%,300px)}.ar-stage.kit .b-ko{width:min(40%,200px)}
.ar-arena{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%}
.ar-stage.kit .ar-f{bottom:6%}
.ar-pose{display:block;width:min(280px,80vw);margin:0 calc(50% - min(140px,40vw));pointer-events:none}
@media (min-width:601px){.ar-pose{width:300px;margin:0 calc(50% - 150px)}}
.ar-stage.kit .ar-body{position:relative}.ar-spark{position:absolute;left:53.6%;top:81.4%;width:30%;transform:translate(-50%,-50%);pointer-events:none}
.ar-stage.kit .ar-hud{aspect-ratio:310/76;height:auto}.ar-hpf{position:absolute;inset:0}.ar-hpf img{width:100%;height:100%;display:block}.ar-hD .ar-hpf img{transform:scaleX(-1)}
.ar-stage.kit .ar-hud .ar-hp{position:absolute;left:19.35%;top:26.3%;width:76.8%;height:31.6%;margin:0;border:0;border-radius:4px;background:#0f172a99}
.ar-stage.kit .ar-hD .ar-hp{left:3.87%}
.ar-stage.kit .ar-hn{position:absolute;left:20%;top:68%;width:48.4%;font-size:0}.ar-stage.kit .ar-hD .ar-hn{left:31.6%;text-align:right}.ar-stage.kit .ar-hn b{font-size:11px}.ar-stage.kit .ar-hn span{display:none}
.ar-stage.kit .ar-hud .ar-meter{position:absolute;left:19.35%;right:3.87%;bottom:-4px}.ar-stage.kit .ar-hD .ar-meter{left:3.87%;right:19.35%}
.ar-stage.kit .ar-margin{top:calc(min(46%,46vw) * 0.245 + 14px)}
.ar-num{display:block;overflow:visible}.ar-pop:has(.ar-num){-webkit-text-stroke:0}
.ar-stage.kit .ar-margin{top:54px}@media (min-width:601px){.ar-stage.kit .ar-margin{top:84px}}
.ar-stage.kit .ar-hn b{color:#fff;-webkit-text-stroke:0;text-shadow:0 1px 0 #0f172a,0 0 3px #0f172a}
.ar-hpp{position:absolute;left:2.58%;top:15.8%;width:12.9%;aspect-ratio:1;border-radius:50%;overflow:hidden}.ar-hD .ar-hpp{left:auto;right:2.58%}
.ar-hpp .por{width:100%!important;height:100%!important;border:0!important;border-radius:50%}
.ar-stage.kit .ar-hn{z-index:2}.ar-stage.kit .ar-hud .ar-hp{z-index:1}
.ptabs.sub{margin-top:6px}.ptabs.sub .ptab{min-height:44px}.pbl li.unranked{opacity:.85;border-style:dashed}
/* Arena kit gaps (artist README): stage-space numbers, class skill FX, crown over the winner, TIME! draw banner, coin art */
.ar-np{position:absolute;z-index:6;top:0;left:0;animation:arNP 1.2s forwards;pointer-events:none;white-space:nowrap}
@keyframes arNP{from{transform:translate(-50%,-50%)}70%{opacity:1}to{transform:translate(-50%,calc(-50% - 22px));opacity:0}}
.ar-fx{position:absolute;z-index:5;transform:translate(-50%,-50%);pointer-events:none}
.ar-beat.b-crownw{position:absolute;top:13%;width:min(34%,150px);transform:none;animation:arPop .45s ease-out both}.b-crownw.at-A{left:6%}.b-crownw.at-D{left:auto;right:6%}
.ar-beat.b-time{position:absolute;left:50%;top:30%;width:min(60%,260px);margin-left:calc(min(60%,260px) / -2)}
.ar-stage.kit .b-coin{width:min(30%,120px)}
@media (prefers-reduced-motion: reduce){.ar-np,.ar-beat.b-crownw{animation:none}.ar-np{transform:translate(-50%,-50%)}}
/* v10 end-screen zones: stamp over the loser, crown + banner centred on top, coin lower centre; fighters' long props stay under HUD/banners */
.ar-end .b-ko.b-st{top:44%;width:min(36%,160px)}.ar-end .b-ko.b-st.at-A{left:8%}.ar-end .b-ko.b-st.at-D{left:auto;right:8%}
.ar-end .ar-beat.b-crownw{left:50%;top:10%;right:auto;width:min(30%,124px);transform:translateX(-50%);animation:arRise .45s ease-out both}
.ar-end .ar-beat.b-res{top:30%}.ar-end .b-coin{top:auto;bottom:18%;width:min(24%,96px)}
.ar-stage.kit .ar-f{z-index:1}.ar-stage.kit .ar-pose{clip-path:inset(30% 0 0 0)}
@media (prefers-reduced-motion: reduce){.ar-end .ar-beat.b-crownw{animation:none}}