body.onlineApp{display:block;min-height:100vh;background:#0b141c url('../cinematic/table.jpg') center/cover fixed;color:#e8e3d7}.onlineHeader{position:relative;z-index:6;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 4vw;background:#07111dec;border-bottom:1px solid #ba9b5140;font-size:12px;flex-wrap:wrap}.onlineHeader a{color:#e4c77f;text-decoration:none;font:bold 24px Georgia}.onlineHeader a span{font:10px Arial;letter-spacing:2px;margin-left:10px}.onlineHeader label{display:flex;align-items:center;gap:8px}.onlineHeader input{width:auto}.onlineMain{padding:20px 4vw;max-width:1600px;margin:auto}.onlineLobby{max-width:900px;margin:4vh auto}.onlineLobby h1{font:clamp(42px,6vw,72px)/1.05 Georgia;margin:18px 0}.onlineLobby em{color:#e2c383}.onlineLobby>p{max-width:720px;color:#bacad5;line-height:1.6}.entryPanel{padding:26px;border:1px solid #ba9b5150;border-radius:26px;background:#091724eb;box-shadow:0 20px 70px #0006;max-width:900px;margin:24px auto}.entryPanel label{display:block;margin:12px 0;color:#d3c89f}.entryPanel input,.entryPanel select{display:block;width:100%;margin-top:7px;padding:12px;background:#122b3b;color:#fff;border:1px solid #82969a66;border-radius:10px}.entryActions{display:flex;gap:16px;align-items:end;flex-wrap:wrap}.entryActions label{flex:1;margin:0;min-width:160px}.entryActions button{min-height:45px}.onlineRules{font-size:13px}#roomCode{font:38px Georgia;letter-spacing:8px;color:#efd18f}#notice{color:#ffd19b;min-height:24px}#connection{color:#abd8ca}.onlineApp.duelMode{overflow:auto}.onlineApp.duelMode .onlineMain{padding:12px 22px;max-width:none}.onlineApp #arena{position:relative;isolation:isolate}.onlineApp .mapsBoard{height:auto;min-height:0;position:relative}.onlineApp .scenicBackdrop{inset:-120px -22px -210px;pointer-events:none}.onlineApp .duelDock{grid-template-columns:minmax(400px,1fr) 160px 180px;position:relative;z-index:2;margin-top:4px}.onlineApp .duelHud{min-height:70px}.onlineApp .gameMeta{position:relative;z-index:3}.onlineApp .handCard{position:relative}.onlineApp .handDetail{z-index:5}.onlineApp .handCard[aria-pressed="true"]{outline:2px solid #8fe5ff}.onlineApp .playerSide{cursor:pointer}.onlineApp .playerSide:focus-visible{outline:2px solid #8fe5ff;border-radius:20px}.onlineApp .miniUnit{position:relative}.onlineApp .onlineRune{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;font-size:12px}.onlineRune span,.onlineRune small{font-size:9px;letter-spacing:1px}.onlineRune img{width:65px;height:65px;border-radius:50%}.onlineApp .handCard img{pointer-events:none}.onlineApp .handCard{touch-action:none;user-select:none}.onlineApp .dropHover{background:#5dcceb33;border-radius:35%}.onlineApp .miniUnit .unitOverlay{pointer-events:none}.onlineApp #result{text-align:center;margin-top:12vh}.onlineApp #result button{margin:10px}.onlineApp #resultScores{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;line-height:1.8}.onlineApp #resultScores article{padding:18px;border:1px solid #ddd3;border-radius:18px}.onlineApp dialog{background:#0e2333;color:#eee;border:1px solid #dab974;border-radius:20px;padding:25px;max-width:600px;width:90%}.onlineApp dialog::backdrop{background:#000b}#cardInfo img{height:200px;float:left;margin:15px}#cardInfo p{line-height:1.6}#roundCountdown{white-space:nowrap;color:#e8cb90}#roundStatus{flex:1}.onlineApp .hidden{display:none!important}
@media(min-width:900px) and (max-height:850px){.onlineApp .mapsBoard{height:auto;min-height:0;}.onlineApp.duelMode .onlineMain{padding-top:5px}.onlineApp .duelHud{min-height:55px}.onlineApp .duelDock{padding-top:5px}.onlineApp .handCard img{height:82px}}
@media(max-width:800px){.onlineHeader{gap:10px;padding:10px;font-size:10px}.onlineHeader a span{display:none}.onlineApp.duelMode .onlineMain{padding:10px}.onlineApp .mapsBoard{height:auto;min-height:0;gap:5px}.onlineApp .duelDock{grid-template-columns:1fr;gap:15px}.onlineApp .onlineRune{flex-direction:row}.onlineRune img{width:32px;height:32px}.onlineApp .onlineRune small{display:none}.onlineApp .actionDock{display:flex;justify-content:center;align-items:center;gap:20px}.onlineApp #resultScores{grid-template-columns:1fr}.onlineApp .scenicBackdrop{inset:-110px -10px -350px}.onlineApp .hand{justify-content:center}.entryPanel{padding:18px}.onlineApp .duelist{gap:5px}.onlineApp .duelist span{font-size:8px}.onlineApp .duelCrest strong{font-size:20px}.onlineApp .gameMeta{flex-wrap:wrap}.onlineApp .handPanel{min-width:0}}
.characterEntrance{position:fixed;z-index:81;pointer-events:none;left:50%;top:49%;width:min(255px,42vw);height:min(385px,55vh);transform:translate(-50%,-50%);overflow:hidden;border:2px solid #c2eaff;border-radius:46% 46% 18px 18px / 30% 30% 18px 18px;background:radial-gradient(ellipse at 50% 70%,#7fdcfc95,#112c4bea 52%,#030b19 82%);box-shadow:0 0 0 5px #121a26dc,0 0 0 7px #e5ca8a9c,0 0 65px #93dfffad;animation:entranceRise 1.65s cubic-bezier(.17,.67,.3,1) forwards}.characterEntrance::before{content:'ᛟ   ᚦ   ᚱ   ᛉ   ᛞ';position:absolute;z-index:2;inset:13px 4px auto;text-align:center;color:#f4e1ab;font:15px Georgia;letter-spacing:5px;text-shadow:0 0 12px #72d9ff}.characterEntrance::after{content:'';position:absolute;left:50%;bottom:10%;width:83%;aspect-ratio:1;transform:translateX(-50%);border:2px solid #c4f4ff;border-radius:50%;outline:5px solid #91dff344;box-shadow:0 0 35px #a9efff,inset 0 0 30px #88dfff;animation:sealSpin 5s linear infinite;background:repeating-conic-gradient(from 0deg,#d6fbffcc 0deg 1deg,transparent 1deg 18deg)}.characterEntrance img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:.91;mask-image:linear-gradient(#000 40%,#000d 69%,transparent 95%)}.entranceCopy{position:absolute;z-index:3;left:0;right:0;bottom:0;display:grid;gap:3px;text-align:center;padding:44px 12px 15px;background:linear-gradient(transparent,#07111df2 48%);text-shadow:0 2px 8px #000}.entranceCopy span{color:#d9d1b0;font-size:9px;letter-spacing:2px}.entranceCopy strong{font:25px Georgia;color:#fff2ce;letter-spacing:1px}.entranceCopy small{font-size:10px;color:#c6eaff;letter-spacing:1px}.unitSummon{animation:unitArrive .75s ease-out both}@keyframes entranceRise{0%{opacity:0;filter:blur(7px);transform:translate(-50%,-43%) scale(.8,.65)}18%{opacity:1;filter:blur(0);transform:translate(-50%,-50%) scale(1.04)}32%{transform:translate(-50%,-50%) scale(1)}80%{opacity:1;filter:blur(0)}100%{opacity:0;filter:blur(5px);transform:translate(-50%,-56%) scale(.96,1.03)}}@keyframes sealSpin{to{rotate:360deg}}@keyframes unitArrive{0%{opacity:0;transform:translateY(26px) scale(.65);filter:brightness(2.5) blur(4px)}58%{opacity:1;transform:translateY(-5px) scale(1.08);filter:brightness(1.5)}100%{opacity:1;transform:translateY(0) scale(1);filter:none}}@media(prefers-reduced-motion:reduce){.characterEntrance,.unitSummon{animation:none!important}.characterEntrance{display:none}}
.modeBanner{position:relative;z-index:3;padding:8px 18px;margin:5px 0;border-radius:15px;background:#101c2eea;color:#f2d797;font-size:12px;text-align:center}.relicMap .mapHero{box-shadow:0 0 0 2px #f4d878,0 0 25px #efba5266!important}.relicBadge{display:block;color:#ffe6a4;font-size:11px;letter-spacing:2px;text-shadow:0 0 8px #ffb700}.onlineApp #hand[data-count="5"] .handCard{flex-basis:88px;width:88px}#modeHelp,#challengeHelp{color:#c7d7dd;line-height:1.6}#waitingMode{padding:12px;border-radius:12px;background:#d6af5c15;color:#efdaa5}.onlineApp #retryChallenge{margin:10px}@media(max-width:540px){.onlineApp #hand[data-count="5"] .handCard{flex-basis:62px;width:62px}.onlineApp #hand[data-count="5"] .handCard img{height:75px}.modeBanner{font-size:10px;padding:8px}.relicBadge{font-size:7px;letter-spacing:0}}
#accountPanel{margin-bottom:18px}#accountPanel summary{cursor:pointer;color:#e5c888;font-weight:700;padding:8px}#accountForm{display:grid;gap:12px}#accountHistory{max-height:280px;overflow:auto}#accountHistory p{padding:10px;border-bottom:1px solid #ffffff20}#accountError{color:#edbf83}
.socialHub{margin:35px auto;background:linear-gradient(145deg,#0b2036ed,#121b2af2);border:1px solid #c6a76266;border-radius:32px;padding:25px;box-shadow:0 25px 80px #0006}.hubHeading,.tournamentHeading{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}.hubHeading h2{font:30px Georgia;color:#f0ddaf;margin:10px 0}.hubTabs{display:flex;gap:8px;padding:20px 0;flex-wrap:wrap}.hubTabs button{border:1px solid #738ca255;border-radius:25px;background:#183147;color:#cdd8e2;padding:12px 20px;cursor:pointer}.hubTabs button.active{background:#d8b66c;color:#101b2a;box-shadow:0 0 25px #d8b66c22}.hubGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:15px}.hubCard{padding:20px;margin:12px 0;border:1px solid #91a9b533;background:linear-gradient(150deg,#21395388,#0a182b);border-radius:24px;min-width:0}.hubCard h3{font:24px Georgia;color:#efd39c;margin:10px 0}.hubCard h2{font:29px Georgia;color:#efd39c}.hubCard p,.emptyHub{color:#b6c8d9;line-height:1.6}.hubCard button{margin:6px 4px 0 0;max-width:100%}.recovery{border-color:#68d5bf88;background:linear-gradient(120deg,#164c4488,#0a2033)}.hubForm{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:20px 0;padding:18px;background:#08132399;border-radius:20px}.hubForm label{flex:1;min-width:140px}.hubPane input,.hubPane select{display:block;width:100%;margin-top:8px;background:#132a3e;border:1px solid #85989d66;border-radius:12px;color:#fff;padding:11px}.hubPane label{color:#d3c89f;font-size:12px}.clanSigil{display:inline-grid;place-items:center;min-width:65px;height:65px;padding:8px;background:linear-gradient(135deg,#d9bb7b,#6f552f);color:#132335;border-radius:50% 50% 20% 20%;font:bold 20px Georgia;box-shadow:0 0 24px #e3bf5833}.memberRow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 0;border-bottom:1px solid #d1e4f220}.memberRow strong{flex:1}.memberRow button{font-size:9px;padding:8px}.entryNames{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}.entryNames span{padding:8px 12px;border-radius:15px;background:#547a9c33;font-size:12px}.tournamentActions{display:flex;gap:10px;align-items:end;flex-wrap:wrap}.bracket{display:flex;gap:16px;overflow-x:auto;padding:10px 0}.bracketRound{flex:1;min-width:190px}.bracketRound h3{font:13px Arial;letter-spacing:2px}.bracketMatch{display:grid;gap:8px;background:#102338;padding:17px;border:1px solid #bba36144;border-radius:18px;margin-bottom:14px}.bracketMatch>span{color:#b59c60;font-size:10px}.bracketMatch>small{color:#aac4d6}.champion{display:grid;text-align:center;gap:6px;color:#f7d07d;font:35px Georgia}.champion strong{font-size:22px}.champion small{font:9px Arial;letter-spacing:2px}#hubNotice{color:#e7c490}.rosterMember{padding:12px;border-radius:15px;background:#264c6844}.rosterMember span{color:#f5d08b;font-size:10px;letter-spacing:1px;margin-right:8px}.onlineApp .miniUnit.allyUnit{outline:1px solid #74dac6}.miniUnit .unitOverlay small{font-size:7px;color:#90e2c9}.onlineApp .duelist>div{max-width:260px}.onlineApp .duelist span{overflow-wrap:anywhere}.onlineApp .mapsBoard:has(.allyUnit){height:auto;min-height:0;}@media(max-width:540px){.socialHub{padding:15px;border-radius:23px}.hubHeading h2{font-size:25px}.hubGrid{grid-template-columns:1fr}.hubTabs button{padding:10px 14px;font-size:11px}.hubForm{padding:12px}.hubForm label{min-width:100%;}.bracket{flex-direction:column;overflow:visible}.bracketRound{min-width:0}.onlineApp .duelist>div{max-width:110px}.onlineApp .mapsBoard:has(.allyUnit){height:auto;min-height:0;}.tournamentHeading h2{overflow-wrap:anywhere}}
.onlineApp .miniUnit.allyUnit::before{content:'ALIADO';position:absolute;z-index:4;left:2px;top:2px;background:#0e443edf;color:#b0fae1;padding:1px 3px;border-radius:4px;font-size:5px;letter-spacing:.4px;pointer-events:none}.onlineApp .duelist>b.largeScore{font-size:18px}@media(max-width:540px){.onlineApp .duelist>b.largeScore{font-size:11px}}

/* Progression, owned runes and persistent battle casualties */
.upgradeCell small{display:block;font-size:11px;line-height:1.5;color:#b8adcc}.upgradeActions,.inventoryFilters{display:flex;gap:10px;margin:10px 0;flex-wrap:wrap}.runeLoadout label{display:block;margin:8px 0}.runeLoadout select{max-width:100%;width:100%}.inventoryGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:12px}.runePanel img{width:140px;height:110px;object-fit:contain}.miniUnit.defeated{filter:grayscale(1);opacity:.48}.miniUnit.defeated .unitRound{color:#ffafb5}.unitRound{max-width:100%;font-size:9px}.progressCard{min-width:0}.heroManageBody{min-width:0}.upgradeCell strong{display:block}#accountHeroes{display:grid;gap:12px}#accountInventory{margin:16px 0}#accountArsenal{max-width:100%;overflow:hidden}
@media(max-width:600px){.upgradeGrid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.heroManageCard{display:block!important}.heroManageCard>img{max-height:150px;object-fit:contain}.heroManageBody{padding:10px}.runePanel{flex-wrap:wrap}}

#progressCards{display:flex;flex-direction:column;gap:16px}#progressCards>.heroManageCard{width:100%;grid-template-columns:140px minmax(0,1fr)}#progressCards>.heroManageCard>img{width:140px}.upgradeCell small{white-space:nowrap}#runeCatalog{display:block}.inventoryFilters{grid-column:1/-1}.inventoryGrid{width:100%}

/* Etapa 4: ayudas de despliegue online y zonas de arrastre accesibles. */
.onlineApp .handCard.assigned{opacity:1;border:2px solid #79c7aa;background:#16313b}
.onlineApp .handCard.assigned .assignment{color:#b4f5ce;font-weight:700}
.onlineApp .playerSide.dropHover{background:#1d545e88;outline:3px solid #a5f0f9;outline-offset:-3px}
.onlineApp .handPanel #deploymentHint{display:block;flex-basis:100%;color:#c7e3e8;font-size:11px;line-height:1.35;letter-spacing:0}
@media(max-width:540px){.onlineApp .handPanel .hand{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.onlineApp .handPanel .handCard{width:100%;max-width:none;min-width:0;flex-basis:auto}.onlineApp .handPanel .handCard img{height:125px}.onlineApp .handPanel .handStats{top:102px}}