:root{--bg:#07121e;--panel:#102433;--ink:#f2eee4;--gold:#f1bd64;--line:#395668;--muted:#a8bfc9;--green:#84e1b5;--red:#ee8179}*{box-sizing:border-box}body{margin:0;background:#081521;color:var(--ink);font:14px system-ui,Segoe UI,Arial,sans-serif}button{font:inherit;color:var(--ink);cursor:pointer;background:#183646;border:1px solid #658090;border-radius:8px;padding:9px 12px;font-weight:700}button:hover:not(:disabled){background:#2d566a}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:linear-gradient(180deg,#af7d3c,#825929);border-color:#e4c589;color:#fff}button.gold{background:#785929;color:#fff0c3;border-color:#d7ad62}button:focus-visible,.node:focus-visible{outline:3px solid #fcdd92}input,select{width:100%;padding:9px 11px;background:#0b1d2b;border:1px solid #6b8797;color:var(--ink);border-radius:6px;font:inherit}label{display:block;font-size:12px;color:#c2d0d2}label input,label select{margin-top:5px}h1,h2,h3,p{margin-top:0}h2{color:var(--gold);font:700 25px Georgia,serif}h3{font-size:14px;letter-spacing:1px;color:#e8c789}small,.hint{color:var(--muted);font-size:12px}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:end}
#gameTop{height:76px;padding:10px 18px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#091825;border-bottom:1px solid #3c6376} .brand b{display:block;color:#f3c376;font:700 27px Georgia,serif;letter-spacing:1.5px}.brand em{font-size:17px;color:#fff}.brand small{font-size:9px;letter-spacing:1.7px}.turnNow{text-align:center;display:grid;gap:4px}.turnNow #turnBanner{font-weight:900;color:#f1bf76;letter-spacing:1.1px;font-size:15px}#phaseBadge{color:#8cdecb;font-size:12px}.topActions{display:flex;align-items:center;gap:10px}.clock{font:900 28px Consolas,monospace;color:#88e4bb;border:1px solid #386d72;background:#0a2b2e;padding:5px 12px;border-radius:8px;min-width:110px;text-align:center}.clock.urgent{color:#ff8e83;background:#3b1d25;border-color:#dd7368}
#arena{padding:0 10px 8px;max-width:1800px;margin:auto}.mapTop{height:29px;display:flex;justify-content:space-between;align-items:center;gap:10px;color:#a4bbc1;font-size:11px;padding:0 8px}.mapViewport{overflow:hidden}.world{width:100%;max-height:calc(100dvh - 186px);aspect-ratio:17/7.8;position:relative;overflow:hidden;border:1px solid #4b7584;background:#0c2032;user-select:none;touch-action:manipulation}.world>img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}.world svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#edges line{stroke:#91aabb;stroke-width:.33;opacity:.3;vector-effect:non-scaling-stroke;stroke-dasharray:3 2}#aimLine{stroke:#ffcb73;stroke-width:4;filter:drop-shadow(0 0 5px #f5b451);marker-end:url(#arrowhead)}#aimLine.moveLine{stroke:#8de5bd;marker-end:url(#arrowgreen)}
.node{position:absolute;transform:translate(-50%,-50%);z-index:2;width:clamp(17px,1.55vw,24px);height:clamp(17px,1.55vw,24px);border-radius:50%;border:2px solid #f2ebd8;box-shadow:0 0 0 2px #091e2b,0 0 5px #000b;padding:0;touch-action:manipulation}.node.selected{outline:4px solid #fff0a2;z-index:5}.node.possible{box-shadow:0 0 0 3px #e7ae43,0 0 17px #e7ae43;animation:pulse 1.4s infinite}.node.ownDestination{box-shadow:0 0 0 2px #8de5bd}.node .count{position:absolute;pointer-events:none;top:-15px;left:50%;transform:translateX(-50%);color:#fff;font-size:10px;text-shadow:0 1px 4px #071019;background:#091724bc;border-radius:3px;padding:0 2px}@keyframes pulse{50%{filter:brightness(1.5)}}
.phasePanel{position:absolute;bottom:12px;right:12px;z-index:7;width:clamp(190px,22vw,290px);padding:12px 14px;border:1px solid #d1ae67;border-radius:11px;background:#0a1c29ef;box-shadow:0 8px 28px #0007}.phasePanel #phaseTitle{font-weight:900;color:var(--gold);font-size:16px;margin-bottom:5px}.phasePanel #phaseHelp{line-height:1.35;color:#d2e2e1;font-size:12px}.phasePanel #reserveStatus{padding:6px 0;font-size:12px;color:#8ce2b5}.phasePanel button{width:100%;margin-top:8px}
.turnAnnouncement{position:absolute;z-index:17;top:16%;left:50%;transform:translateX(-50%);background:#071d2aee;border:2px solid #e9be76;padding:30px 48px;border-radius:15px;box-shadow:0 16px 100px #000e;text-align:center;pointer-events:none;animation:announce .35s ease}.turnAnnouncement strong{display:block;color:#ffd38c;font:700 clamp(29px,4vw,53px) Georgia,serif;white-space:nowrap}.turnAnnouncement span{font-size:19px;color:#bce8e2}@keyframes announce{from{opacity:0;transform:translate(-50%,-14px)}to{opacity:1;transform:translate(-50%,0)}}
.mapPicker,.attackPicker{position:absolute;z-index:9;background:#0b2637f5;border:1px solid #f0c477;border-radius:12px;padding:12px;box-shadow:0 10px 36px #000b;width:245px;max-width:80vw}.pickerTitle{font-weight:900;color:var(--gold);font-size:17px}.pickerInfo{color:#cce1e4;font-size:12px;margin:4px 0 10px}.pickerTypes{display:flex;gap:5px;flex-wrap:wrap}.pickerTypes button{font-size:11px;padding:6px 8px;margin:0}.pickerTypes button.active{background:#8c6837;border-color:#f1c47c}.dragWheel{touch-action:none;margin:11px 0 7px;border:1px solid #cba96f;border-radius:9px;text-align:center;padding:13px 4px 10px;background:linear-gradient(90deg,#143748,#285063,#143748);cursor:ns-resize;user-select:none}.dragWheel b{font:900 36px Consolas,monospace;color:#ffe2a4;display:block;margin:2px 0}.wheelUp,#wheelRange{display:block;font-size:11px;color:#c6dcde}.mapPicker .primary{width:100%;margin-top:4px}.mapPicker #pickerCancel{width:100%;margin-top:4px;font-size:11px;padding:5px}.attackPicker{width:260px}.attackPicker #attackDescription{color:#f5d4a0;font-weight:800;margin-bottom:10px}.attackPicker small{display:block;padding-top:9px}
.empireBar{display:flex;gap:6px;align-items:stretch;overflow-x:auto;padding:7px 0}.empire{min-width:155px;padding:7px 10px;background:#102838;border-top:3px solid #bd9a66;border-radius:4px;font-size:11px}.empire strong{display:block;font-size:13px;white-space:nowrap}.empire small{display:block;color:#d2dfe2;margin-top:3px}.lowerRow{display:grid;grid-template-columns:1fr minmax(260px,360px);gap:8px;align-items:start}.summary{padding:9px 12px;border:1px solid #335466;border-radius:6px;background:#112739;color:#cce0e2;line-height:1.55}.events{background:#102839;border:1px solid #335466;border-radius:6px}.events summary{cursor:pointer;padding:9px}#log{max-height:120px;overflow:auto;padding:4px 12px;font-size:11px}#log>div{border-top:1px solid #294250;padding:4px 0}
.overlay{position:fixed;inset:0;z-index:24;background:#030b13e9;display:grid;place-items:center;padding:15px}.overlay[hidden],[hidden]{display:none!important}.joinbox,.battleBox,.rewardBox{width:min(520px,98vw);max-height:95dvh;overflow:auto;padding:25px;background:linear-gradient(145deg,#173748,#0c2231);border:1px solid #d6b373;border-radius:16px;box-shadow:0 16px 75px #000c}.joinbox button{margin-top:12px}.joinbox .primary{width:100%}.joinbox input{margin:12px 0}.battleOverlay{z-index:30}.battleBox{width:min(630px,97vw);text-align:center}.battleBox p{color:#bcd2da}.battleClock{font:800 25px Consolas,monospace;color:#f8c36e;margin:13px 0}.battleClock.go{color:#8ff0ba}.duelColumns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.duelColumns>div{border:1px solid #405b71;border-radius:9px;background:#081c2a;padding:12px}.teamLabel{color:#e8c081;font-weight:800;margin-bottom:9px}.dice{display:inline-grid;place-items:center;min-width:42px;height:42px;border-radius:8px;background:#f3f0e5;color:#162731;margin:3px;font:800 22px Consolas,monospace}.dice.off{background:#183749;border:1px dashed #6f8798;color:#92a4b3}.rollBtn{background:linear-gradient(180deg,#e1a349,#9c6626);border:2px solid #e3c385;font-size:23px;width:100%;padding:16px;margin:15px 0}.battleBox #battleTip{font-size:12px}.battleBox #closeBattle{width:100%;margin-top:10px}#battleResult{color:#f2ddad;line-height:1.6}
.cardsOverlay{z-index:35}.cardsWindow{width:min(1260px,98vw);height:min(820px,95dvh);overflow:hidden;background:#091d2b;border:1px solid #d6b87b;border-radius:14px;display:flex;flex-direction:column;box-shadow:0 15px 100px #000e}.cardsHeader{display:flex;justify-content:space-between;padding:13px 17px;border-bottom:1px solid #4e6b7a;background:#132d3e;gap:12px}.cardsHeader h2{font-size:20px;margin:0 0 4px}.cardsWorkspace{flex:1;display:grid;min-height:0;grid-template-columns:230px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 190px}.commandRail{border-right:1px solid #385c6c;padding:12px;overflow:auto;grid-column:1;grid-row:1/3}.commandRail>p{font-size:11px;color:#adc5ce}.commandHand{display:grid;gap:8px}.cardCenter{padding:16px;overflow:auto;grid-column:2;grid-row:1}.cardCenter>h3{text-align:center}.cardResultGrid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(250px,.85fr);gap:12px;align-items:center;margin:16px 0}.cardSlots{display:flex;justify-content:center;gap:10px;min-height:125px}.emptySlot{border:2px dashed #557285;border-radius:10px;background:#0c2839;min-width:100px;max-width:140px;flex:1;text-align:center;padding:40px 0;color:#5d8290}.miniCard{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px;min-width:105px;min-height:112px;padding:10px;border-radius:10px;border:2px solid #bd9d65;box-shadow:0 3px 12px #0006;background:linear-gradient(150deg,#42381f,#1c2d36);cursor:pointer;font-weight:800;font-size:13px}.miniCard .icon{font-size:31px}.miniCard.command{background:linear-gradient(150deg,#3b284f,#182a3b);border-color:#a998d1}.miniCard.wild{background:linear-gradient(150deg,#654537,#3d1b35);border-color:#f7a7a0}.miniCard.selected{outline:3px solid #a5ffe6}.miniCard small{font-size:10px;color:#e1caa6}.cardOutcome{text-align:center;margin-top:0;min-height:118px;display:flex;flex-direction:column;justify-content:center;border:1px solid #466777;padding:11px;background:#0c2837;border-radius:7px}.cardOutcome strong{color:#f7d18b;font-size:19px}.cardOutcome p{margin:4px 0;font-size:12px;color:#dae5e2}.cardOptions{display:flex;justify-content:center;gap:10px;align-items:start;flex-wrap:wrap;margin:9px 0}.cardOptions label{min-width:120px;max-width:280px}.cardOptions .techGrid{width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:4px;max-height:140px;overflow:auto;padding:5px}.techGrid label{font-size:11px;display:flex;align-items:center;gap:5px;padding:5px;background:#103245}.techGrid input{width:auto}.cardCenter #applyCards{display:block;margin:10px auto 0;min-width:210px}.cardBottom{padding:10px 14px;background:#102838;border-top:1px solid #385d6e;grid-column:2;grid-row:2}.cardHandHeader{display:flex;justify-content:space-between;gap:8px;align-items:center}.cardHandHeader h3{margin:3px}.cardHand{display:flex;gap:9px;overflow-x:auto;overflow-y:hidden;padding:7px 3px;height:137px}.cardHand .miniCard{flex:0 0 110px;min-height:118px}.rewardOverlay{z-index:40}.rewardBox{text-align:center;width:min(760px,97vw)}.rewardSpark{color:#f5cd7c;font-size:26px;letter-spacing:12px;animation:pulse 1.1s infinite}.rewardCards{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:20px 0}.rewardBox .primary{min-width:220px}#toast{position:fixed;z-index:65;bottom:15px;left:50%;transform:translateX(-50%);display:none;border:1px solid #ff998b;color:#fff;background:#832c2b;padding:12px 21px;max-width:92vw;border-radius:9px;box-shadow:0 5px 35px #0008}
@media(max-width:1000px){.brand small{display:none}.turnNow{font-size:12px}#gameTop{gap:8px;padding:8px;height:63px}.brand b{font-size:19px}.topActions button{padding:7px;font-size:12px}.clock{font-size:21px;min-width:72px}.world{max-height:none}.phasePanel{width:200px;padding:9px}.lowerRow{grid-template-columns:1fr}.cardsWorkspace{grid-template-columns:160px 1fr}.commandRail{padding:7px}.miniCard{min-width:85px;font-size:11px}.cardSlots .miniCard{min-width:80px}.emptySlot{min-width:70px}.cardCenter{padding:9px}}
@media(max-width:640px){.mapViewport{overflow-x:auto;overflow-y:hidden;touch-action:pan-x}.world{width:1050px;height:482px;aspect-ratio:auto;max-height:none;overflow:hidden}.turnNow{display:none}.brand b{font-size:16px}.topActions{gap:4px}.topActions button{font-size:11px}.mapTop{font-size:9px}.node{width:14px;height:14px;border-width:1px}.node .count{font-size:8px;top:-11px}.phasePanel{position:fixed;bottom:5px;right:7px;z-index:11;width:min(300px,calc(100vw - 14px));border-radius:0;display:flex;gap:7px;align-items:center;padding:7px}.phasePanel #phaseTitle{font-size:12px;max-width:80px}.phasePanel #phaseHelp{display:none}.phasePanel button{width:auto;flex:1;margin:0}.world{overflow:visible;aspect-ratio:17/7.8}.world img{position:absolute;inset:0}.world #nodes,.world svg{position:absolute;inset:0}.mapPicker,.attackPicker{width:210px}.cardsWorkspace{grid-template-columns:1fr;grid-template-rows:108px minmax(0,1fr) 152px}.commandRail{grid-column:1;grid-row:1;display:flex;gap:8px;overflow-x:auto;border-right:0;border-bottom:1px solid #426478}.commandRail h3,.commandRail>p{display:none}.commandHand{display:flex;gap:6px}.commandHand .miniCard{min-width:95px;min-height:80px;padding:4px}.cardCenter{grid-column:1;grid-row:2}.cardBottom{grid-column:1;grid-row:3}.cardHand{height:113px}.cardHand .miniCard{min-height:95px}.cardResultGrid{grid-template-columns:1fr;gap:7px}.cardSlots{min-height:95px}.cardOutcome{min-height:0;padding:8px}.emptySlot{padding:28px 0}.cardSlots .miniCard{min-height:88px}.cardsHeader h2{font-size:15px}.cardsHeader{padding:8px}}

@keyframes deal{from{opacity:0;transform:translateY(50px) rotate(-8deg) scale(.8)}to{opacity:1;transform:translateY(0) rotate(0) scale(1)}}.rewardCards .miniCard{animation:deal .55s both}.rewardCards .miniCard:nth-child(2){animation-delay:.12s}.rewardCards .miniCard:nth-child(3){animation-delay:.24s}.rewardCards .miniCard:nth-child(n+4){animation-delay:.3s}

/* AGE OF RISK v0.9 — visores independientes y selección de origen→destino */
.mapTopLeft{display:flex;align-items:center;gap:12px}
.regionToggle{font-size:11px;padding:4px 11px;border-color:#6d9faa;color:#c4eae8;background:#123448}
.regionToggle.active{background:#306254;color:#fff0bd;border-color:#edc473}
.node.regionMode{border-color:var(--region-color,#fff);box-shadow:0 0 0 3px var(--region-color,#fff),0 0 12px #000}
.node.regionMode.selected{outline:3px solid #fff0a2;box-shadow:0 0 0 4px var(--region-color,#fff),0 0 12px #000}
/* Docks emergentes: se abren DESPUÉS de haber elegido ambos territorios. */
.mapPicker{position:fixed;left:20px!important;top:auto!important;bottom:18px!important;z-index:18;width:265px;max-height:min(72dvh,520px);overflow:auto}
.pickerDiceRow{margin-top:8px;padding:8px;background:#0f3040;border:1px solid #395d6b;border-radius:7px}
.pickerDiceRow label{font-weight:700;color:#f1ca89}
.pickerTypes{color:#bed9de;font-size:11px;line-height:1.4}
.mapFloatPanel{position:fixed;z-index:15;width:min(330px,calc(100vw - 20px));max-height:min(50dvh,490px);overflow:auto;padding:0 11px 11px;border-radius:11px;border:1px solid #b8a279;background:linear-gradient(160deg,#0e2d3cef,#0b1e2af9);box-shadow:0 16px 52px #000c;backdrop-filter:blur(9px)}
.regionsPanel{left:16px;top:130px}
.bonusesPanel{right:16px;top:130px}
.panelDragHandle{touch-action:none;cursor:grab;display:flex;justify-content:space-between;align-items:center;gap:5px;margin:0 -11px 10px;padding:11px 11px 9px;background:#193d4b;border-radius:11px 11px 0 0;border-bottom:1px solid #567a83}
.panelDragHandle:active{cursor:grabbing}
.panelDragHandle strong{font:700 14px Georgia,serif;color:#ffcf80;letter-spacing:.6px}
.panelDragHandle button{padding:3px 9px;font-size:11px;background:#203844}
.floatHint{font-size:11px;line-height:1.45;color:#c3d7da;margin:7px 0 9px}
.regionList,.bonusList{display:grid;gap:5px;overflow:auto;max-height:calc(min(50dvh,490px) - 159px)}
.regionItem{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:8px;border:1px solid #355466;border-radius:7px;padding:7px 8px;background:#0d2737;min-width:0}
.regionItem.conquered{border-color:#88daad;background:#18473c}
.regionDot{display:block;width:12px;height:12px;border-radius:3px;background:var(--reg,#fff);box-shadow:0 0 8px var(--reg,#fff);flex-shrink:0}
.regionItem div{min-width:0}
.regionItem b{display:block;font-size:11px;color:#f5e6c4}
.regionItem small{display:block;font-size:10px;color:#b9d2d9;margin-top:3px}
.regionItem>span{font-size:9px;color:#e3d2a0;text-align:right;max-width:104px;overflow:hidden;text-overflow:ellipsis}
.bonusToggle{width:100%;margin-top:10px;background:#75582a;border-color:#e2b86d;color:#fff0c2;font-size:12px;padding:9px}
.bonusSummary{border:1px solid #b39159;background:#243e3c;border-radius:8px;padding:10px;line-height:1.5;color:#dff0e4;margin-bottom:9px;font-size:11px}
.bonusSummary strong{display:block;color:#ffe0a0;font-size:14px}
.bonusSummary b{color:#ffca7a}
.bonusSummary small{display:block;color:#b0cfc8;font-size:10px}
.bonusItem{display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:7px;border-left:3px solid var(--reg,#fff);background:#0b2634;padding:8px;border-radius:6px;border-top:1px solid #365768}
.bonusItem.active{background:#185043;border-top-color:#74d3a5}
.bonusItem>span{font-size:11px;color:#f2e0be}
.bonusItem small{display:block;color:#b6d1d6;font-size:10px;margin-top:2px}
.bonusItem>b{font:700 11px Consolas,monospace;white-space:nowrap;color:#ffde9a}
.bonusItem>em{grid-column:2/4;text-align:right;font-size:9px;font-style:normal;color:#819daa}
.bonusItem.active>em{color:#91ebbc}
@media(max-width:640px){
  .mapTopLeft{gap:5px}.regionToggle{font-size:9px;padding:4px 5px}
  .mapFloatPanel{width:min(92vw,315px);max-height:37dvh;left:7px;right:auto;padding-bottom:7px}
  .regionsPanel{top:70px}.bonusesPanel{top:calc(70px + 37dvh + 8px);right:auto}
  .regionList,.bonusList{max-height:calc(37dvh - 128px)}
  .mapPicker{left:7px!important;bottom:67px!important;width:min(235px,87vw);max-height:65dvh}
  .panelDragHandle{padding:7px 11px;margin-bottom:5px}
  .regionItem{padding:4px 6px}.floatHint{margin:3px 0 6px}
}

/* AGE OF RISK v1.0 — El tablero se curva sobre un planeta auténtico */
.mapViewport{overflow:hidden!important;touch-action:auto!important}
.world{width:100%!important;height:clamp(480px,calc(100dvh - 148px),900px)!important;max-height:none!important;aspect-ratio:auto!important;overflow:hidden!important;background:radial-gradient(ellipse at 55% 50%,#15324b 0%,#071525 42%,#030710 85%)!important;isolation:isolate}
.world.globeReady>img,.world.globeReady>#edges,.world.globeReady>#aimLayer,.world.globeReady>#nodes{display:none!important}
.globeCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;touch-action:none;cursor:grab}
.globeCanvas.rotating{cursor:grabbing}
.globeRoutes{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.globePips{position:absolute;inset:0;z-index:3;pointer-events:none}
.globePip{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;border:1.5px solid #e8d18c;border-radius:7px;min-width:27px;height:25px;padding:1px 4px;background:#071626b9;color:#fff5d3;font:900 12px Consolas,monospace;text-shadow:0 1px 3px #000;box-shadow:0 0 0 2px #04101da0,0 3px 10px #0008;pointer-events:none}
.globePip[hidden]{display:none}.globePip.chosen{background:#996c20e6;color:#fff;box-shadow:0 0 0 3px #ffca7da9,0 0 20px #ffc562}.globePip.target{background:#aa382bd9;box-shadow:0 0 0 3px #ff807aaa,0 0 20px #fc7760}.globePip.valid:not(.chosen){border-color:#78ffe5;box-shadow:0 0 10px #67ffe5}
.globeLoading{position:absolute;z-index:4;left:50%;top:48%;transform:translate(-50%,-50%);pointer-events:none;font:800 15px Georgia,serif;letter-spacing:1.2px;color:#ecd098;text-shadow:0 2px 18px #000}
.globeHover{position:absolute;z-index:5;pointer-events:none;background:#091824ed;border:1px solid #b7a16a;border-radius:6px;padding:6px 10px;color:#ffe4a4;font-size:11px;white-space:nowrap}
.globeControls{position:absolute;right:12px;top:12px;z-index:8;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:5px;max-width:min(460px,65%);pointer-events:none}
.globeControls[hidden]{display:none}.globeControls button{pointer-events:auto;background:#0b2b3ce8;border:1px solid #6d95a1;color:#ffe2aa;padding:7px 11px;font-size:12px}.globeControls button.active{background:#57693e;border-color:#f6d18a}.globeControls small{width:100%;text-align:right;color:#b9d6e0;text-shadow:0 2px 4px #000;font-size:10px;letter-spacing:1px;pointer-events:none}
.mapTop{height:36px;padding:2px 10px}.mapTopLeft>span{color:#f3d49a;letter-spacing:.65px}
.regionItem[data-region]{cursor:pointer}.regionItem[data-region]:hover{background:#24506a;filter:brightness(1.25)}
#world .phasePanel{z-index:11;pointer-events:auto}
@media (max-width:640px){
 .world{width:100vw!important;max-width:100%!important;height:calc(100dvh - 140px)!important;min-height:390px!important;max-height:none!important;overflow:hidden!important}
 .mapViewport{overflow:visible!important}.globeControls{top:8px;right:6px;max-width:71%;gap:3px}.globeControls button{font-size:11px;padding:5px 7px}.globeControls small{font-size:8px}.globePip{min-width:20px;height:19px;font-size:10px;border-radius:5px;padding:0 2px}
 .mapTopLeft>span{font-size:8px}.mapTop{height:38px}.mapTopLeft{flex-wrap:wrap;gap:3px}.mapTop #selectedLabel{font-size:9px;white-space:nowrap;max-width:38%;overflow:hidden;text-overflow:ellipsis}
 .mapFloatPanel{z-index:20}
}

/* AGE OF RISK v1.1 — Centro de vigilancia: 1–4 globos de cámara fija. */
.watchToggle{border-color:#c69b54!important;background:#18384b;color:#ffe0a5!important;white-space:nowrap}
.watchToggle.active{background:#3c4e40;color:#fff4c4!important}
.watchDock{position:absolute;z-index:7;right:10px;top:84px;width:min(262px,31vw);max-height:calc(100% - 175px);overflow:auto;border:1px solid #bda56f;border-radius:12px;background:linear-gradient(150deg,#0b2032f5,#07131ff9);color:#f4e8ca;box-shadow:0 16px 45px #000c;backdrop-filter:blur(9px);pointer-events:auto}
.watchDock[hidden]{display:none!important}
.watchDock[data-count="2"],.watchDock[data-count="3"],.watchDock[data-count="4"]{width:min(490px,43vw)}
.watchDockHead{display:flex;justify-content:space-between;align-items:center;gap:7px;position:sticky;top:0;z-index:2;background:#0c2434f5;border-bottom:1px solid #647c7b;padding:7px 9px}
.watchDockHead strong{font-size:11px;color:#f1c77e;letter-spacing:.7px;white-space:nowrap}
.watchDockHead>div{display:flex;gap:4px}
.watchDock button{padding:4px 6px;font-size:11px;background:#122e40;border:1px solid #62868c;color:#ffe7b5;border-radius:5px;cursor:pointer}
.watchDock button:hover:not(:disabled){border-color:#ffcd83;background:#234760}
.watchDock button:disabled{opacity:.4;cursor:not-allowed}
.watchGrid{display:grid;grid-template-columns:1fr;gap:6px;padding:7px}
.watchDock[data-count="2"] .watchGrid,.watchDock[data-count="3"] .watchGrid,.watchDock[data-count="4"] .watchGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.watchPane{min-width:0;border:1px solid #456b75;background:#071726;border-radius:8px;overflow:hidden;box-shadow:0 3px 14px #0009}
.watchHead{display:flex;align-items:center;gap:4px;padding:5px 6px;background:#122a3c;white-space:nowrap}
.watchHead>b{font-size:10px;color:#fbd693}
.watchPlace{font-size:9px;color:#9bbdcb;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.watchHeadActions{display:flex;gap:2px}
.watchHeadActions button{padding:2px 4px;font-size:12px;line-height:1.2}
.watchPicture{position:relative;aspect-ratio:1.42;background:#081927;overflow:hidden}
.watchCanvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}
.watchCanvas.editing{cursor:grab;outline:1px solid #ebb96b;outline-offset:-2px}
.watchCanvas.editing:active{cursor:grabbing}
.watchPips{position:absolute;inset:0;pointer-events:none}
.watchPip{position:absolute;transform:translate(-50%,-50%);min-width:13px;height:13px;border-radius:5px;border:1px solid #d5ad72;background:#09192ace;display:grid;place-items:center;color:#fff4d1;font:900 9px Consolas,monospace;text-shadow:0 1px 2px #000}
.watchPip.selected{background:#a97b17;border-color:#ffeb9b}.watchPip.target{background:#a43431;border-color:#ff998c}
.watchFoot{padding:3px 6px;display:flex;justify-content:space-between;gap:2px;color:#a7c6d2;font:9px Consolas,monospace}
.watchStatus{color:#9bdfa8;white-space:nowrap}.watchCoords{white-space:nowrap}
.watchDockNote{display:block;padding:2px 10px 8px;color:#9cb3bd;font-size:9px;line-height:1.35}
.watchConfig{padding:5px;border-top:1px solid #50656f;display:flex;flex-direction:column;gap:5px}
.watchConfig[hidden]{display:none!important}
.watchConfig label{display:flex;flex-direction:column;gap:2px;font-size:10px;color:#cddde0}
.watchConfig select{width:100%;background:#0c2533;color:#ffde9e;font-size:10px;padding:4px}
.watchTools{display:flex;flex-wrap:wrap;gap:3px;justify-content:center}
.watchTools button{flex:1;min-width:22px}
.watchAdjust{font-size:10px!important}.watchAdjust.active{background:#62602e!important;border-color:#e0be71!important}
.watchEditHelp{font-size:9px;color:#9fb8c4;line-height:1.25}
#world .watchDock{isolation:isolate}
@media(max-width:1000px){
 .watchDock{width:min(234px,34vw)}
 .watchDock[data-count="2"],.watchDock[data-count="3"],.watchDock[data-count="4"]{width:min(420px,47vw)}
 .watchHeadActions button{font-size:11px;padding:1px 3px}
}
@media(max-width:640px){
 .mapTopLeft{flex-wrap:wrap}.watchToggle{font-size:9px;padding:4px 5px}
 .watchDock,.watchDock[data-count="1"],.watchDock[data-count="2"],.watchDock[data-count="3"],.watchDock[data-count="4"]{
   position:absolute;left:6px;right:6px;bottom:92px;top:auto;width:calc(100% - 12px)!important;max-height:238px;overflow:hidden;
 }
 .watchDockHead{padding:4px 8px}
 .watchGrid,.watchDock[data-count="2"] .watchGrid,.watchDock[data-count="3"] .watchGrid,.watchDock[data-count="4"] .watchGrid{
    display:flex;overflow-x:auto;overscroll-behavior-x:contain;gap:6px;padding:5px;max-width:100%;
 }
 .watchPane{flex:0 0 205px;min-width:205px}
 .watchPicture{aspect-ratio:1.65}
 .watchConfig{max-height:115px;overflow:auto}
 .watchDockNote{font-size:8px;padding:2px 8px 4px}
}
@media(min-width:641px){
 .watchDock{top:75px}
 .watchDock[data-count="3"] .watchPicture,.watchDock[data-count="4"] .watchPicture{aspect-ratio:1.5}
}

/* AGE OF RISK v1.2 — Panel de fuerzas a la izquierda */
#armyEdgeSensor,.armyTab,.armyDrawer{display:none}
body.inGame #armyEdgeSensor{display:block;position:fixed;z-index:35;top:15%;bottom:7%;left:0;width:17px;background:transparent;cursor:e-resize}
body.inGame .armyTab{display:flex;align-items:center;gap:5px;position:fixed;z-index:36;left:0;top:44%;writing-mode:vertical-rl;transform:rotate(180deg);padding:15px 6px;border-radius:0 9px 9px 0;background:linear-gradient(180deg,#1e4860,#092332);border:1px solid #c6a364;border-left:none;color:#ffe1a5;letter-spacing:1.1px;font:800 11px Georgia,serif;cursor:pointer;box-shadow:0 0 18px #000c}
body.inGame .armyDrawer{display:flex;flex-direction:column;position:fixed;z-index:50;left:0;top:59px;bottom:7px;width:min(465px,93vw);border:1px solid #d5af6e;border-left:0;border-radius:0 13px 13px 0;background:linear-gradient(165deg,#102d3beF,#071724F9);box-shadow:0 14px 44px #000d;color:#edebe1;transform:translateX(-104%);visibility:hidden;transition:transform .2s ease,visibility .2s;pointer-events:none}
body.inGame .armyDrawer.open{transform:translateX(0);visibility:visible;pointer-events:auto}
.armyDrawerHead{padding:9px 13px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(90deg,#26475a,#132c3c);border-bottom:1px solid #a58654;color:#ffd78d;font:900 17px Georgia,serif;letter-spacing:1px}
.armyDrawerHead>div{display:flex;gap:6px}.armyDrawerHead button{padding:4px 8px;color:#ffe4af;border-color:#70868c;background:#1a3c4b}
.armyDrawerHead button.active{background:#a07e41;color:#08212c}
.armyDrawerMain{overflow-y:auto;overscroll-behavior:contain;padding:10px 14px 24px;scrollbar-color:#b6925e #102533;scrollbar-width:thin}
.armyIntelIntro{display:flex;flex-direction:column;gap:3px;padding:9px 10px;background:#1c3646;border-left:4px solid #e5ba73;border-radius:5px;margin-bottom:9px}
.armyIntelIntro b{color:#ffda93;font:800 17px Georgia,serif}.armyIntelIntro small{color:#a8c8d4;font-size:11px}
.armyPlayerLabel{font-size:11px;color:#b6dce4;display:grid;gap:5px}.armyPlayerLabel select{background:#092336;border:1px solid #728c98;border-radius:7px;color:#f5d19a;padding:8px;font-size:13px}
.armyTotals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:10px 0 16px}.armyTotals>div{border:1px solid #537183;border-radius:7px;background:#0d2837;padding:9px}
.armyTotals strong{font:900 17px Consolas,monospace;color:#ffe1a0;display:block}.armyTotals small{font:700 9px Arial,sans-serif;color:#9fbbc6;letter-spacing:.5px}
.armyDrawer h3{font-size:12px;color:#f6ce87;letter-spacing:1px;margin:15px 0 6px;border-bottom:1px solid #496170;padding-bottom:6px}
.armyMicro,.armyDisclosure{font-size:10px;color:#bad1d8;line-height:1.4}.armyDisclosure{display:block;margin-top:10px}
.armyTableScroll{width:100%;max-width:100%;overflow-x:auto;border-radius:7px;border:1px solid #557387}
.armyTable{border-collapse:collapse;width:100%;min-width:417px;font:11px Consolas,monospace}
.armyTable th{position:sticky;top:0;background:#35516a;color:#ffe0ab;text-align:right;padding:8px 6px;border-right:1px solid #56758a;font-size:10px}
.armyTable th:first-child,.armyTable td:first-child{text-align:left}
.armyTable td{background:#102b3a;border-bottom:1px solid #294d60;text-align:right;padding:5px 6px;vertical-align:middle}
.armyTable tbody tr{cursor:pointer}.armyTable tbody tr:hover td{background:#1e4657}.armyTable tr.selected td{background:#385b55;color:#ffe7ae}.armyTable small{display:block;color:#a9bfc7;font-size:9px}.armyTable tfoot th{background:#2b4b44}
.armyType{display:flex;align-items:center;gap:5px;min-width:124px}.armyType b{font:700 10px Arial,sans-serif;display:block;line-height:1.2}.armyIcon{width:29px;height:29px;object-fit:contain;flex-shrink:0;border-radius:5px;filter:drop-shadow(0 2px 3px #0007)}
.armyEmpty{text-align:center!important;padding:15px!important;color:#a3b8c2}
.armyBreakdown{margin:8px 0;padding:8px;border:1px solid #647a71;background:#183737;border-radius:7px;font-size:10px;line-height:1.4}
.armyBreakdown>b{display:flex;align-items:center;gap:6px;color:#f5ce92;font-size:11px}
.armyBreakGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:7px 0}.armyBreakGrid span{padding:6px 4px;background:#082635;border-radius:4px}.armyBreakGrid strong{display:block;font-size:10px;color:#f3e0ab}.armyBreakGrid small{display:block;color:#a4c2ce;font-size:9px}
.armyInfoGrid{display:grid;gap:5px}.armyInfo{padding:8px 9px;border-left:3px solid #ba965b;background:#112d3e;border-radius:4px}.armyInfo b{font-size:11px;color:#f4d89f;display:flex;align-items:center;gap:5px}.armyInfo b small{color:#abc8d3;font-size:9px}.armyInfo span{display:block;color:#c2d7de;margin-top:3px;font-size:10px;line-height:1.4}.armyInfo .armyIcon{width:25px;height:25px}
.armyWarn{border-color:#f0a45e;background:#513720}.armyGood{border-color:#74dba1;background:#173b35}
/* Contadores del ejército: figuras visibles + masa justo debajo. */
.globePip{height:auto!important;min-height:32px!important;min-width:32px!important;max-width:76px;display:flex!important;flex-direction:column;gap:0!important;padding:2px 3px!important;border-radius:8px!important}
.globePip[hidden]{display:none!important}
.armyTokenIcons{display:flex;justify-content:center;align-items:center;min-height:20px;gap:0;max-width:69px;overflow:hidden}
.armyTokenIcons img{width:22px;height:22px;object-fit:contain;flex-shrink:0;margin-left:-3px;filter:drop-shadow(0 1px 2px #000)}
.armyTokenIcons img:first-child{margin-left:0}.armyTokenCount{font:900 12px Consolas,monospace;color:#ffe3a6;line-height:1.1;text-shadow:0 2px 2px #000}
.armyTokenMore{font:800 9px Consolas,monospace;color:#efd595;margin-left:1px}
.watchPip{width:auto!important;min-width:24px!important;height:auto!important;min-height:20px!important;display:flex!important;flex-direction:column;gap:0;padding:1px 2px!important;max-width:55px;border-radius:5px!important}
.watchArmyIcons{display:flex;align-items:center;justify-content:center;gap:0}.watchArmyIcons img{width:13px;height:13px;flex-shrink:0;margin-left:-2px}.watchArmyIcons img:first-child{margin-left:0}
.watchPip b{font:900 9px Consolas,monospace;color:#fff0ca;line-height:1.05}
/* Giro configurable y sonido */
.axisSettings,.soundPanel{position:fixed;z-index:45;right:12px;top:119px;width:min(330px,92vw);padding:12px;background:#102c3ef4;border:1px solid #d1aa71;border-radius:12px;color:#ffe3af;box-shadow:0 12px 35px #000b;font-size:12px}
.axisSettings[hidden],.soundPanel[hidden]{display:none!important}
.axisSettingsTitle{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}.axisSettingsTitle strong{font:900 15px Georgia,serif}
.axisSettings label,.soundPanel label{display:grid;gap:4px;margin:10px 0}.axisSettings select{padding:6px;background:#09212e;color:#fff2d1;border:1px solid #66869c;border-radius:5px}
.axisSettings .axisCheck{display:flex;align-items:center;gap:8px;cursor:pointer}.axisCheck input{width:16px;height:16px}
.axisSettings input[type=range],.soundPanel input[type=range]{width:100%;accent-color:#ddb06b}
.axisSettings button,.soundPanel button{border:1px solid #7c856b;color:#ffdc99;background:#163a49;padding:5px;border-radius:6px}
.axisSettings>small,.soundPanel>small{display:block;color:#9ac1ce;font-size:10px;line-height:1.4;margin-top:9px}
.soundPanel{top:69px;right:140px}
.watchMode{border:1px solid #dbb06e!important;color:#eacb9d!important;min-width:19px;font-size:12px!important}
.watchMode.following{background:#547348!important;color:white!important;border-color:#94ecb5!important}
.watchFoot .watchStatus.following{color:#d3f6ac}
@media(max-width:640px){
 body.inGame .armyDrawer{top:52px;bottom:0;width:calc(100vw - 14px);max-width:460px;border-radius:0 12px 0 0}
 body.inGame .armyTab{top:37%;font-size:9px;padding:9px 3px}
 .armyBreakGrid{grid-template-columns:1fr 1fr 1fr}
 .armyTotals strong{font-size:14px}
 .globePip{min-width:25px!important;min-height:23px!important;padding:1px!important}
 .armyTokenIcons{min-height:15px}.armyTokenIcons img{width:15px;height:15px}.armyTokenCount{font-size:10px}
 .watchPip{min-width:22px!important}
 .axisSettings{right:5px;top:105px}.soundPanel{top:60px;right:5px}
}

.armyCatalog{margin-top:10px;border:1px solid #547887;padding:6px;border-radius:6px;background:#102c3a}
.armyCatalog summary{color:#f5d393;font:800 11px Arial,sans-serif;cursor:pointer;padding:5px;letter-spacing:.4px}
.armyCatalog .armyInfo{padding:5px}.armyCatalogEra{border-bottom:1px solid #b29361;margin:9px 0 4px;padding:5px 3px;color:#efc77e;font:800 11px Georgia,serif}

/* AGE OF RISK V1.3 · configuración inicial y despliegue de masa mixta */
#entry.overlay{overflow-y:auto;display:flex;align-items:flex-start;padding:clamp(14px,3vh,40px) 12px;}
#entry .joinbox{max-width:940px;width:min(95vw,940px);margin:auto;max-height:none;}
.welcomeGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0 18px;text-align:left}
.welcomePanel{padding:13px;background:linear-gradient(140deg,#102839,#07131d);border:1px solid #31506b;border-radius:12px}
.welcomePanel h3{font-size:14px;letter-spacing:.06em;color:#efcc84;margin:0 0 12px}
.welcomePanel small{display:block;font-size:11px;line-height:1.5;color:#b3ccd6}
.welcomePanel label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#c4d5da;margin-bottom:7px}
.welcomePanel select,.welcomePanel input{max-width:100%;}
.welcomeWeights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px;margin:7px 0}
.welcomeWeights.locked,.configWeights.locked{opacity:.35;pointer-events:none}
.welcomeWeights input[type=range]{width:100%;}
.configWeights{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:7px 0}
.configWeights label{display:grid;gap:3px;grid-template-columns:1fr auto;align-items:center}
.configWeights input{grid-column:1/-1}
.settingsFine{font-size:11px;color:#a7c3ce;padding:6px 0}
#settingsPopup .joinbox{max-height:90vh;overflow-y:auto;max-width:600px}
.deployPool{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center}
.deployPool>b{flex-basis:100%;color:#f5d08c}
.poolUnit{border:1px solid #4e6981;border-radius:10px;padding:6px 9px;background:#112d43;font-size:12px}
.deployPool small{flex-basis:100%;font-size:11px;color:#b5cfda}
.deployPool button{font-size:12px;padding:6px 12px}
@media(max-width:700px){.welcomeGrid{grid-template-columns:1fr}.welcomePanel{padding:9px}.configWeights{grid-template-columns:1fr}}
