/* ILTA Web — shared extras for the bot-to-web pages (v1).
   Extends ilta.css + si-theme.css. All class names are prefixed to avoid
   collision with the legacy stylesheet. */

/* generic */
.wizard { margin-top:16px; }
.act-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:12px; }
.act-card { text-align:center; display:flex; flex-direction:column; gap:4px; padding:14px 12px; }
.act-name { font-family:Beaufort,serif; letter-spacing:.06em; text-transform:uppercase; font-size:13px; color:var(--gold-bright); }
.act-meta { display:flex; gap:6px; justify-content:center; align-items:center; font-size:12px; }
.wizard-in select, .wizard-in input { width:100%; background:var(--bg-2); color:var(--text); border:1px solid var(--panel-edge-soft); border-radius:8px; padding:8px 10px; }
.wizard-in button.btn-gold:disabled { opacity:.45; cursor:default; }
.act-result { color:var(--muted); font-size:13px; line-height:1.5; }
.act-result b { color:var(--gold-bright); }

.farm-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.cal-slot { background:rgba(8,20,16,.55); border:1px solid var(--panel-edge-soft); border-radius:10px; padding:10px 6px; text-align:center; transition:.15s; }
.cal-slot.claimed { border-color:var(--panel-edge); background:rgba(94,234,176,.10); }
.cal-slot.next { border-color:var(--emerald); box-shadow:0 0 12px rgba(52,211,153,.18); }
.cal-slot.bonus .cal-mark { filter:drop-shadow(0 0 8px rgba(255,200,50,.6)); }
.cal-n { display:block; font-family:Beaufort,serif; font-weight:700; color:var(--gold-bright); }
.cal-label { display:block; font-size:11px; margin-top:2px; }
.relic-card.active { border-color:var(--emerald); box-shadow:0 0 14px rgba(52,211,153,.20); }
.challenge-done { opacity:.75; border-color:rgba(255,215,0,.35); }
.si-mist { position:absolute; inset:0; background:radial-gradient(520px 260px at 20% 0%, rgba(94,234,176,.08), transparent 70%); pointer-events:none; }
.trade-row + .trade-row { margin-top:10px; }
.event-card { transition:transform .15s; }
.event-card:hover { transform:translateY(-2px); }

/* landing extras (SI cards showcase) */
.l-showcase { display:flex; gap:14px; overflow-x:auto; padding:8px 2px 14px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
.l-showcase::-webkit-scrollbar { height:6px; }
.l-showcase::-webkit-scrollbar-thumb { background:rgba(94,234,176,.25); border-radius:3px; }
.sc-card { flex:0 0 160px; scroll-snap-align:start; background:rgba(8,20,16,.55); border:1px solid var(--panel-edge-soft); border-radius:12px; overflow:hidden; transition:transform .2s, box-shadow .2s; }
.sc-card:hover { transform:translateY(-4px) scale(1.02); box-shadow:0 10px 28px rgba(0,0,0,.35), 0 0 18px rgba(94,234,176,.14); }
.sc-art { height:210px; background-size:cover; background-position:center; }
.sc-body { padding:8px 10px; }
.sc-name { font-family:Beaufort,serif; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-bright); }
.sc-rarity { font-size:11px; color:var(--muted); }
.l-hero-si { position:absolute; inset:0; background-size:cover; background-position:center 28%; opacity:0; transition:opacity 1.2s ease, transform 10s linear; will-change:opacity,transform; }
.l-hero-si.on { opacity:.18; }
.lightning { position:absolute; inset:0; background:radial-gradient(700px 400px at 55% 12%, rgba(255,255,255,.22), transparent 55%); opacity:0; pointer-events:none; }
.lightning.flash { animation: l-flash .22s ease 2 alternate; }
@keyframes l-flash { from{opacity:0} to{opacity:1} }

/* topnav compact + dropdown visibility fix */
.topnav{ overflow:visible !important; }
.nav-links{ overflow:visible !important; flex:1; justify-content:flex-start; gap:2px; flex-wrap:nowrap; min-width:0; }
.nav-links > a, .nav-more summary{ padding:6px 9px !important; font-size:12px !important; letter-spacing:.07em !important; white-space:nowrap; }
.nav-more{ flex-shrink:0; }
.nav-menu{ min-width:260px; z-index:80; }
.nav-more .nav-menu{ min-width: 320px; display:grid; grid-template-columns: 1fr 1fr; gap:2px; padding:8px; }
.nav-more .nav-menu a{ font-size:11px; padding:7px 8px; white-space:normal; line-height:1.2; }
.nav-wallet{ flex-shrink:0; }
.nav-right{ flex-shrink:0; gap:8px; }
@media(max-width: 1280px){
  .nav-links > a, .nav-more summary{ padding:6px 7px !important; font-size:11px !important; }
}
/* topnav burger + responsive */
.topnav-burger{ display:none; background:none; border:1px solid var(--panel-edge-soft); color:var(--gold-bright); border-radius:8px; padding:6px 10px; font-size:18px; cursor:pointer; flex-shrink:0; }
@media(max-width: 960px){
  .topnav{ flex-wrap:wrap; }
  .topnav-burger{ display:block; }
  .nav-links{ display:none; position:absolute; top:100%; left:0; right:0; background:rgba(6,8,13,.96); backdrop-filter:blur(12px); border-top:1px solid var(--panel-edge-soft); flex-direction:column; gap:0; padding:10px 12px 14px; max-height:70vh; overflow:auto; }
  .nav-links.open{ display:flex; }
  .nav-links a{ padding:8px 10px; }
  .nav-more{ width:100%; }
  .nav-more .nav-menu{ position:static; box-shadow:none; border:1px solid var(--panel-edge-soft); margin-top:6px; }
}
/* landing mega-menu */
.l-nav-more{ position:relative; }
.l-nav-more summary{ list-style:none; cursor:pointer; color:var(--muted); font-size:13px; padding:6px 8px; }
.l-nav-more summary::-webkit-details-marker{ display:none; }
.l-nav-more[open] summary{ color:var(--gold-bright); }
.l-nav-menu{ position:absolute; top:100%; left:0; min-width:520px; max-width:560px; background:rgba(6,8,13,.98); border:1px solid var(--panel-edge); border-radius:10px; padding:8px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:2px; z-index:20; box-shadow:0 14px 32px rgba(0,0,0,.55); }
.l-nav-menu a{ color:var(--text); text-decoration:none; font-size:11px; padding:6px 8px; border-radius:6px; white-space:normal; line-height:1.2; }
.l-nav-menu a:hover{ background:rgba(94,234,176,.10); color:var(--gold-bright); }
@media(max-width: 860px){
  .l-nav{ display:none; position:absolute; top:100%; left:0; right:0; background:rgba(6,8,13,.96); border-top:1px solid var(--panel-edge-soft); flex-direction:column; padding:10px 12px; }
  .l-nav.open{ display:flex; }
  .l-nav-menu{ position:static; }
}
/* play hub on profile */
.play-hub{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px; margin-top:14px; }
.play-hub a{ display:flex; align-items:center; gap:10px; background:rgba(8,20,16,.55); border:1px solid var(--panel-edge-soft); border-radius:10px; padding:10px 12px; color:var(--text); text-decoration:none; transition:.15s; }
.play-hub a:hover{ border-color:var(--emerald); transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,.25); }
.play-hub a b{ font-family:Beaufort,serif; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--gold-bright); }