/* Guía Customs Wiki — Survival crafting + Invicon sprites */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
.gc-body{
  margin:0;min-height:100vh;overflow-x:clip;color:#f4f4f5;
  font-family:Inter,system-ui,sans-serif;font-size:16px;line-height:1.55;
  background:#070709;
  background-image:
    radial-gradient(ellipse 70% 45% at 50% -15%,rgba(234,179,8,.14),transparent),
    radial-gradient(ellipse 40% 30% at 0% 40%,rgba(212,165,116,.07),transparent),
    radial-gradient(ellipse 45% 35% at 100% 70%,rgba(56,189,248,.06),transparent);
  padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);
}
.gc-body .container{
  width:100%;max-width:1100px;
  padding-left:max(1rem,env(safe-area-inset-left));
  padding-right:max(1rem,env(safe-area-inset-right));
}
.gc-topbar{
  position:sticky;top:0;z-index:100;background:rgba(7,7,9,.94);backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.12);
  padding:.55rem 0;padding-top:max(.55rem,env(safe-area-inset-top));
}
.gc-topbar-inner{display:flex;align-items:center;gap:.5rem;flex-wrap:nowrap;min-width:0;}
.gc-brand{
  font-weight:800;color:#fff!important;text-decoration:none;display:inline-flex;
  align-items:center;gap:.4rem;white-space:nowrap;min-width:0;
}
.gc-brand i{color:#d4a574;}
.gc-brand span{overflow:hidden;text-overflow:ellipsis;max-width:9rem;}
.gc-nav{display:none;gap:.75rem;margin-left:.4rem;flex:1;}
.gc-nav a{color:#a1a1aa;text-decoration:none;font-weight:600;font-size:.84rem;white-space:nowrap;}
.gc-nav a:hover{color:#fff;}
.gc-actions{margin-left:auto;display:flex;gap:.35rem;}
.gc-btn{
  border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#f4f4f5;
  border-radius:10px;padding:.42rem .7rem;font-size:.82rem;font-weight:600;text-decoration:none;
  display:inline-flex;align-items:center;min-height:40px;white-space:nowrap;
}
.gc-btn:hover{background:rgba(255,255,255,.08);color:#fff;}
.gc-btn-primary{
  background:linear-gradient(135deg,#eab308,#ca8a04);border:none;color:#111;
  font-weight:800;border-radius:12px;padding:.7rem 1.1rem;text-decoration:none;
  display:inline-flex;align-items:center;gap:.4rem;min-height:44px;
}
.gc-mobile-nav{
  position:sticky;top:3.2rem;z-index:90;display:block;
  background:rgba(7,7,9,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.08);
}
.gc-mobile-track{
  display:flex;gap:.35rem;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  padding:.5rem max(1rem,env(safe-area-inset-left)) .55rem;
}
.gc-mobile-track::-webkit-scrollbar{display:none;}
.gc-mobile-track a{
  flex:0 0 auto;text-decoration:none;font-size:.76rem;font-weight:700;color:#d4d4d8;
  background:#13131a;border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:.4rem .75rem;
}

.gc-hero{text-align:center;padding:1.75rem 1rem 1rem;max-width:760px;margin:0 auto;}
.gc-kicker{
  display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:#eab308;margin-bottom:.65rem;
}
.gc-hero h1{
  font-size:clamp(1.45rem,6vw,2.35rem);font-weight:800;color:#fff;margin:0 0 .7rem;
  letter-spacing:-.02em;line-height:1.18;
}
.gc-hero p{color:#a1a1aa;margin:0 auto;max-width:560px;font-size:clamp(.9rem,3.5vw,1rem);}

.gc-main{padding:0 0 max(2.5rem,env(safe-area-inset-bottom));}
.gc-section{margin-top:1.75rem;scroll-margin-top:7rem;}
.gc-section-head{margin-bottom:1rem;}
.gc-section-head h2{font-size:clamp(1.15rem,4vw,1.5rem);font-weight:800;color:#fff;margin:.45rem 0 .3rem;}
.gc-section-head p{color:#a1a1aa;margin:0;max-width:640px;}
.gc-badge{
  display:inline-flex;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:.35rem .7rem;border-radius:999px;background:rgba(234,179,8,.12);
  border:1px solid rgba(234,179,8,.3);color:#facc15;
}
.gc-credit{margin:1rem 0 0;font-size:.8rem;color:#71717a;}
.gc-credit a{color:#facc15;}

.gc-rules{display:grid;grid-template-columns:1fr;gap:.75rem;}
.gc-rule{
  background:#13131a;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:1rem 1.1rem;
}
.gc-rule h3{margin:0 0 .35rem;font-size:1rem;color:#fff;}
.gc-rule p{margin:0;color:#a1a1aa;font-size:.92rem;}
.gc-callout{
  display:flex;gap:.7rem;margin-top:1rem;padding:.95rem 1rem;border-radius:14px;
  background:rgba(239,68,68,.08);border:1px solid rgba(248,113,113,.3);
}
.gc-callout i{color:#f87171;margin-top:.15rem;flex-shrink:0;}
.gc-callout strong{color:#fff;}
.gc-callout div{color:#d4d4d8;font-size:.92rem;min-width:0;}

.gc-progress{
  margin:0;padding:1rem 1.1rem 1rem 2rem;background:#13131a;border:1px solid rgba(255,255,255,.12);
  border-radius:14px;color:#d4d4d8;
}
.gc-progress li{margin:.45rem 0;}

.gc-toc{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;}
.gc-toc a{
  text-decoration:none;font-size:.74rem;font-weight:600;color:#fde68a;
  background:rgba(234,179,8,.08);border:1px solid rgba(234,179,8,.25);
  border-radius:999px;padding:.35rem .65rem;
}
.gc-toc a:hover{background:rgba(234,179,8,.16);}

.gc-cards{display:flex;flex-direction:column;gap:1rem;}
.gc-card{
  background:#0f0f14;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:1.05rem 1rem;
  scroll-margin-top:7rem;
}
.gc-card-head h3{margin:.35rem 0 .55rem;font-size:clamp(1.02rem,3.8vw,1.2rem);font-weight:800;color:#fff;}
.gc-step{
  display:inline-flex;font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:#111;background:#eab308;border-radius:8px;padding:.2rem .5rem;
}
.gc-tags{display:flex;flex-wrap:wrap;gap:.35rem;}
.gc-tag{
  font-size:.7rem;font-weight:700;color:#d4d4d8;background:#1a1a24;
  border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:.25rem .55rem;
}
.gc-tag-craft{color:#86efac;border-color:rgba(134,239,172,.3);}
.gc-tag-furnace{color:#fde68a;border-color:rgba(253,230,138,.35);}

.gc-card-body{
  display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:.85rem;
}
.gc-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;
  width:min(100%,288px);background:#3e3e3e;border:3px solid #1b1b1b;
  border-radius:6px;padding:.5rem;
  box-shadow:inset 0 0 0 2px #8b8b8b, 0 8px 24px rgba(0,0,0,.35);
  image-rendering:pixelated;
}
.gc-cell{
  position:relative;
  aspect-ratio:1;min-height:0;border-radius:2px;background:#8b8b8b;
  border:2px solid #373737;border-top-color:#ffffff55;border-left-color:#ffffff40;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:.2rem .15rem .15rem;text-align:center;
  box-shadow:inset 2px 2px 0 #ffffff33, inset -2px -2px 0 #00000044;
}
.gc-cell.is-empty{background:#8b8b8b;opacity:.85;}
.gc-cell.is-custom{outline:2px solid #eab308;outline-offset:-3px;}
.gc-icon{
  width:70%;height:auto;max-width:48px;max-height:48px;
  image-rendering:pixelated;image-rendering:crisp-edges;
  filter:drop-shadow(1px 1px 0 rgba(0,0,0,.35));
}
.gc-icon-lg{width:56px;max-width:56px;max-height:56px;}
.gc-fallback{font-size:.65rem;font-weight:700;color:#111;line-height:1.1;}
.gc-caption{
  display:none;
}
.gc-amt{
  position:absolute;right:3px;bottom:2px;z-index:2;
  font-size:.72rem;font-weight:900;color:#fff;
  text-shadow:1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000;
  line-height:1;
}
.gc-star{
  position:absolute;top:1px;left:2px;z-index:2;
  font-size:.7rem;color:#facc15;text-shadow:0 0 4px rgba(0,0,0,.8);
  line-height:1;
}
.gc-star-inline{color:#facc15;font-weight:800;}

.gc-result{display:flex;align-items:center;gap:.75rem;flex:1 1 160px;}
.gc-result-arrow{color:#a1a1aa;font-size:1.6rem;font-weight:800;}
.gc-result-box{
  display:flex;flex-direction:column;align-items:center;gap:.45rem;
  background:#13131a;border:1px solid rgba(212,165,116,.35);border-radius:12px;
  padding:.75rem .85rem;min-width:120px;max-width:220px;text-align:center;
}
.gc-result-box strong{color:#bef264;font-size:.86rem;line-height:1.25;}

.gc-furnace{
  display:grid;grid-template-columns:1fr;gap:.65rem;margin-top:.85rem;
}
.gc-furnace-slot .gc-label{
  display:block;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:#71717a;margin-bottom:.3rem;
}
.gc-furnace-slot .gc-cell{
  aspect-ratio:auto;min-height:72px;width:100%;
  flex-direction:row;justify-content:flex-start;gap:.55rem;padding:.45rem .6rem;
}
.gc-furnace-slot .gc-caption{
  display:block;font-size:.78rem;font-weight:700;color:#111;text-align:left;line-height:1.2;
  overflow-wrap:anywhere;
}
.gc-furnace-slot .gc-icon{width:40px;max-width:40px;}

.gc-lore{margin:.85rem 0 0;padding-left:1.1rem;color:#a1a1aa;font-size:.88rem;}
.gc-lore li{margin:.2rem 0;}
.gc-note{margin:.7rem 0 0;font-size:.8rem;color:#71717a;}

.gc-faq{display:flex;flex-direction:column;gap:.5rem;}
.gc-faq details{
  background:#13131a;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:.15rem .9rem;
}
.gc-faq summary{
  cursor:pointer;font-weight:700;color:#fff;padding:.75rem 0;list-style:none;
  display:flex;justify-content:space-between;gap:.75rem;min-height:44px;align-items:center;
}
.gc-faq summary::-webkit-details-marker{display:none;}
.gc-faq summary::after{content:"+";color:#facc15;font-weight:800;}
.gc-faq details[open] summary::after{content:"–";}
.gc-faq p{margin:0 0 .85rem;color:#a1a1aa;font-size:.92rem;}

.gc-cta{
  margin-top:2rem;text-align:center;background:#13131a;border:1px solid rgba(255,255,255,.12);
  border-radius:18px;padding:1.4rem 1.1rem;
}
.gc-cta h2{margin:0 0 .35rem;font-size:1.2rem;color:#fff;font-weight:800;}
.gc-cta p{color:#a1a1aa;margin:0 0 1rem;}
.gc-cta-row{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;}
.gc-cta-row > a{flex:1 1 100%;max-width:280px;justify-content:center;}

.gc-footer{
  border-top:1px solid rgba(255,255,255,.08);padding:1.15rem 1rem max(1.75rem,env(safe-area-inset-bottom));
  color:#71717a;font-size:.82rem;text-align:center;
}

@media(min-width:700px){
  .gc-rules{grid-template-columns:1fr 1fr;}
  .gc-furnace{grid-template-columns:1fr 1fr 1fr;}
  .gc-cta-row > a{flex:0 1 auto;max-width:none;}
  .gc-brand span{max-width:none;}
  .gc-grid{width:300px;}
}
@media(min-width:900px){
  .gc-mobile-nav{display:none;}
  .gc-nav{display:flex;}
  .gc-section,.gc-card{scroll-margin-top:5rem;}
  .gc-hero{padding:2.4rem 1rem 1.2rem;}
}
@media(max-width:420px){
  .gc-actions .gc-btn:last-child{display:none;}
  .gc-grid{width:100%;}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
