/* Mi Granja v8: mismo mundo violeta que la portada, pasos claros y controles "de juego". Solo presentación. */
body.mg-page{--bg:#1f1233;--surface:#302047;--surface-2:#3b2857;--linea:#d9c3ff2e;--apagado:#cec1df;--mg-gold:#ffd583;--mg-gold-d:#c98f2e;--mg-edge:#e6ccff38;background:radial-gradient(ellipse at 85% 0,#99449655,transparent 45%),radial-gradient(ellipse at 0 35%,#744ac244,transparent 45%),radial-gradient(ellipse at 90% 90%,#286e7744,transparent 45%),linear-gradient(160deg,#301b54,#24163b 55%,#2c1a40);background-attachment:fixed}
.mg-page .cv790-nav-shell,.mg-page .nav-outer{background:rgba(35,21,57,.92)}
.mg-page input[type=text],.mg-page .herr-inv select{background:#1a0f2c;border-color:#d9c3ff33}
.mg-page .panel{border:2px solid var(--mg-edge);border-radius:20px;box-shadow:inset 0 1px 0 #ffffff14}

/* Cabecera */
.mg-hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:2rem;align-items:center;padding:clamp(1.6rem,4vw,2.6rem) 0 1rem}
.mg-hero .eyebrow{color:var(--mg-gold)!important}
.mg-hero h1{font-family:'Unbounded',sans-serif;font-weight:700;font-size:clamp(2.2rem,5vw,3.4rem);letter-spacing:-.04em;line-height:1.05;margin:.3rem 0 .7rem}
.mg-lead{color:#e4d8ef;font-size:1.08rem;max-width:40ch}
.mg-steps{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem;list-style:none}
.mg-steps li{display:flex;align-items:center;gap:.5rem;padding:.45rem .8rem .45rem .45rem;border-radius:12px;background:#ffffff0d;border:1px solid #e6ccff2e;font-size:.86rem;font-weight:600}
.mg-steps b{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:#ffd58330;color:var(--mg-gold);font:700 .75rem/1 'Unbounded',sans-serif}
.mg-hero-art{position:relative;height:190px}
.mg-hero-art img{position:absolute;width:104px;height:auto;filter:drop-shadow(0 14px 16px #13082070);transition:transform .25s}
.mg-hero-art .c1{left:8px;top:34px;transform:rotate(-12deg)}
.mg-hero-art .c2{left:98px;top:0;z-index:1;transform:rotate(-1deg)}
.mg-hero-art .c3{left:188px;top:34px;transform:rotate(11deg)}
.mg-hero-art:hover .c1{transform:rotate(-16deg) translateX(-6px)}.mg-hero-art:hover .c3{transform:rotate(15deg) translateX(6px)}

/* Marcadores con icono */
.mg-stats{padding:.8rem 0 1.2rem}
.mg-stats .marcador{display:flex;align-items:center;gap:.9rem;text-align:left;background:#302047;border:2px solid var(--mg-edge);border-radius:18px;padding:.9rem 1.1rem;box-shadow:inset 0 1px 0 #ffffff14,0 4px 0 #1a0d2c55}
.mg-ico{display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;border-radius:14px;background:#ffffff10;font-size:1.45rem}
.mg-stats .marcador .v{line-height:1.1}
.mg-stats .marcador .k{letter-spacing:.06em;font-size:.6rem;margin-top:.3rem}

/* Atajos: ir al plan, compartir la granja y la guía, con iconos del juego */
.mg-acts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;margin:0 0 .9rem}
.mg-act{display:flex;align-items:center;gap:.6rem;min-width:0;padding:.7rem .85rem;border-radius:16px;border:2px solid var(--mg-edge);background:#ffffff0d;color:#fff;font:700 .8rem/1.2 'Instrument Sans',sans-serif;text-align:left;text-decoration:none;cursor:pointer;touch-action:manipulation;transition:transform .12s,background .12s}
.mg-act img{flex:0 0 auto;width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 3px 4px #13082088)}
.mg-act:first-child{border-color:#ffd58399;background:#ffd5831f}
.mg-act:hover{transform:translateY(-2px);background:#ffffff17}
.mg-act:focus-visible{outline:3px solid #fff;outline-offset:2px}
@media(max-width:560px){.mg-acts{gap:.45rem}.mg-act{flex-direction:column;justify-content:center;gap:.3rem;padding:.6rem .35rem;text-align:center;font-size:.7rem}.mg-act img{width:30px;height:30px}}
/* Cartera sin servicio: una línea plegable con el aviso */
.mg-chain{margin:0 0 .9rem;padding:.6rem .9rem;border-radius:14px;border:1px solid #ffb4a055;background:#ff8a6a10;font-size:.84rem;color:#f3ecfb}
.mg-chain>summary{cursor:pointer;font-weight:600}
.mg-chain .cdx-chain-off{margin:.6rem 0 .1rem}
.mg-start{display:grid;gap:.9rem;margin-bottom:.9rem}
.mg-start>[hidden]{display:none!important}
.mg-start:not(:has(>:not([hidden]))){display:none}
.mg-start .panel{margin:0}
.mg-card{position:relative;display:flex;flex-direction:column;gap:.2rem;padding:1.25rem!important}
.mg-card h3{margin:0 0 .15rem!important;font-weight:700!important}
.mg-card .wallet-intro{font-size:.88rem;color:#d9c8e8;margin-bottom:.8rem}
.mg-card-tag{align-self:flex-start;margin-bottom:.55rem;padding:.28rem .55rem;border-radius:999px;background:#ffffff12;color:#e6d3ff;font:700 .58rem/1 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase}
.mg-card .wallet-form{margin-top:auto}
.mg-card .wallet-trust{margin-top:.7rem}
.mg-share{margin-top:.7rem;background:none;border:0;color:#e6d3ff;font:600 .84rem 'Instrument Sans',sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.mg-share:hover{color:var(--mg-gold)}

/* Botón con volumen, como en el juego */
.mg-page .mg-btn{background:var(--mg-gold)!important;color:#2d1743!important;font:700 .86rem/1 'Unbounded',sans-serif;padding:.85rem 1.15rem!important;border-radius:13px!important;border:2px solid #fff0c8!important;box-shadow:0 5px 0 var(--mg-gold-d),0 12px 24px #13082050;transition:transform .12s,box-shadow .12s}
.mg-page .mg-btn:hover{filter:none;transform:translateY(-2px);box-shadow:0 7px 0 var(--mg-gold-d),0 16px 28px #13082060}
.mg-page .mg-btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--mg-gold-d)}

/* Aviso discreto */
.mg-note{margin:0 0 1.4rem!important;padding:.6rem .9rem!important;font-size:.82rem!important;background:#ffc24d10!important;border-color:#ffc24d40!important}
.mg-note summary{cursor:pointer}
.mg-note p{margin-top:.5rem;color:var(--apagado)}

/* Pestañas grandes, tipo menú de juego */
.mg-page .tabbar{position:sticky;top:var(--cv-head-h,64px);z-index:20;gap:.45rem;padding:.55rem;margin:0 0 1.1rem;border:2px solid var(--mg-edge);border-radius:18px;background:#24163bf0;backdrop-filter:blur(10px);scroll-margin-top:80px}
.mg-page .tabbtn{flex:1 1 auto;font:600 .88rem 'Instrument Sans',sans-serif;letter-spacing:0;text-transform:none;padding:.7rem .9rem;border-radius:12px;border:1px solid transparent;background:transparent;color:#d9c8e8}
.mg-page .tabbtn:hover{background:#ffffff0d;color:#fff}
.mg-page .tabbtn.on{background:#ffffff16;border-color:#e6ccff55;color:#fff;box-shadow:inset 0 -3px 0 #c9a2ff}
.mg-page .tabbtn[data-z="plan"]{color:var(--mg-gold)}
.mg-page .tabbtn[data-z="plan"].on{background:var(--mg-gold);color:#2d1743;border-color:#fff0c8;box-shadow:0 4px 0 var(--mg-gold-d)}

/* Barajas recogidas: sin nombres ni contadores montados unos sobre otros */
.seed-picker-section:not(.abierta) .seed-picker-deck .pick>:is(h6,.bpu,.pick-counter){display:none}

/* Pestañas con los iconos del juego */
.mg-page .tabbtn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem}
.mg-page .tabbtn img{width:24px;height:24px;object-fit:contain;flex:0 0 auto;filter:drop-shadow(0 2px 2px #13082077)}
.mg-page .tabbtn .ts{display:none}
/* Marcadores en una fila también en el móvil */
@media(max-width:800px){
  .mg-stats.marcadores{grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem;padding:.3rem 0 .9rem}
  .mg-stats .marcador{flex-direction:column;align-items:flex-start;gap:.35rem;padding:.6rem .6rem .7rem;border-radius:14px}
  .mg-stats .mg-ico{width:34px;height:34px;border-radius:10px}
  .mg-stats .mg-ico img{width:28px;height:28px}
  .mg-stats .marcador .v{font-size:1.05rem}
  .mg-stats .marcador .k{font-size:.52rem;letter-spacing:.03em;line-height:1.3}
}
@media(max-width:720px){
  /* Cabecera compacta: título y cartas a la derecha; los pasos se ocultan (los atajos de debajo hacen lo mismo) */
  .mg-hero{grid-template-columns:minmax(0,1fr) 92px;grid-template-areas:"eyebrow art" "title art" "lead lead";gap:0 .8rem;padding-top:.7rem;align-items:start}
  .mg-hero-copy{display:contents}
  .mg-hero .eyebrow{grid-area:eyebrow;align-self:end}
  .mg-hero h1{grid-area:title;margin:.2rem 0 .4rem}
  .mg-hero .mg-lead{grid-area:lead;margin:0}
  .mg-hero-art{grid-area:art;height:96px;width:92px;margin:0;transform:none}
  .mg-hero-art img{width:48px}
  .mg-hero-art .c1{left:0;top:20px}.mg-hero-art .c2{left:22px;top:0}.mg-hero-art .c3{left:44px;top:20px}
  .mg-steps{display:none}
  /* Las seis pestañas a la vista, con su icono encima */
  .mg-page .tabbar{display:grid;grid-template-columns:repeat(6,minmax(min-content,1fr));gap:.2rem;padding:.3rem;overflow:visible;border-radius:16px}
  .mg-page .tabbtn{flex-direction:column;gap:.15rem;min-width:0;padding:.42rem .05rem .38rem;font-size:.6rem;line-height:1.1;border-radius:11px}
  .mg-page .tabbtn img{width:26px;height:26px}
  .mg-page .tabbtn span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mg-page .tabbtn .tl{display:none}.mg-page .tabbtn .ts{display:inline}
}
@media(max-width:360px){.mg-page .tabbtn{font-size:.54rem}.mg-page .tabbtn img{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){.mg-hero-art img{transition:none}}
.mg-hero.wrap,.mg-stats.wrap{padding-left:clamp(1.2rem,4vw,2.5rem);padding-right:clamp(1.2rem,4vw,2.5rem)}
.mg-card h3{display:flex;align-items:center;gap:.45rem}
/* Granja en la nube */
.mg-cloud{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin:0 0 1rem;padding:.75rem 1rem;border-radius:16px;border:2px solid #6fe0ef55;background:linear-gradient(135deg,#2a8fa322,#a98aff18);color:#e8f8fb;font-size:.88rem}
.mg-cloud:empty{display:none}
.mg-cloud>span{font-size:1.4rem}.mg-cloud p{flex:1 1 16rem;margin:0}
.mg-cloud.ok{border-color:#8ef0a866}.mg-cloud.warn{border-color:#ffd58388}.mg-cloud.wait{opacity:.85}
.mg-cloud .btn{padding:.5rem 1rem}
@media(max-width:560px){.mg-cloud{gap:.55rem;padding:.6rem .75rem;font-size:.8rem;line-height:1.4}.mg-cloud>span{font-size:1.15rem}.mg-cloud p{flex:1 1 11rem}.mg-cloud .btn{padding:.45rem .8rem!important;font-size:.74rem}}
/* En el móvil las pestañas bajan con la página: la cabecera y la barra inferior ya ocupan bastante pantalla. */
@media(max-width:560px){.mg-page .tabbar{position:static}}
