/* 30DNI start.html - 2026-10-01
   Mobilny katalog: 2 niezalezne poziome rzedy, do 12 kart na stronie, maks. 6 kart w rzedzie.
   Warstwa jest celowo ladowana na koncu, bez zmiany bazowego systemu kart. */

/* Drugi launcher na dole ma ten sam wyglad, ale zachowuje spokojny odstep od katalogu. */
.challenge-finder-launch--bottom{
  margin-top:26px;
  margin-bottom:28px;
}

/* Stopka start.html: oba podpisy maja identyczna typografie. */
.site-mountain-origin-control,
.site-ai-details>summary.site-ai-details__title{
  font-size:10px!important;
  line-height:1.25!important;
}

@media(max-width:820px){
  .site-mountain-origin-control,
  .site-ai-details>summary.site-ai-details__title{
    font-size:9px!important;
    line-height:1.25!important;
  }
}

@media(max-width:720px){
  #featuredGrid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    align-items:stretch!important;
    overflow:visible!important;
  }

  /*
   * Pelny katalog: 2 niezalezne poziome rzedy, po maks. 6 kart.
   * Szerokosc karty pozostaje taka jak w obecnym ukladzie 3-kolumnowym.
   */
  #templateGrid{
    display:block!important;
    width:100%!important;
    overflow:visible!important;
  }
  #templateGrid .catalogue-mobile-row{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    gap:7px!important;
    margin:0!important;
    padding:16px 0 7px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    overscroll-behavior-x:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:none!important;
    touch-action:pan-x pan-y!important;
  }
  #templateGrid .catalogue-mobile-row::-webkit-scrollbar{display:none!important}
  #templateGrid .catalogue-mobile-row + .catalogue-mobile-row{
    margin-top:-8px!important;
  }

  /*
   * Startowe przesuniecie robi JS przez scrollLeft. Nie dodajemy marginesow do kart,
   * dzieki czemu po przesunieciu palcem oba rzedy maja identyczny rytm i szerokosc.
   */

  /* Karty maja dokladnie rytm obecnego 3-kolumnowego katalogu. */
  #templateGrid .catalogue-mobile-row>.template-card{
    flex:0 0 calc((100% - 14px)/3)!important;
    width:calc((100% - 14px)/3)!important;
    min-width:0!important;
    max-width:none!important;
    margin-top:0!important;
    overflow:visible!important;
    scroll-snap-align:none!important;
  }

  /* Wszystkie karty maja ta sama wysokosc. */
  #featuredGrid .template-card,
  #templateGrid .template-card{
    min-width:0!important;
    min-height:232px!important;
    height:100%!important;
    padding:8px 6px 8px!important;
    border-radius:15px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
  }

  /*
   * Hero ma wystawac nad kafelek tak jak w Featured.
   * Dodatkowe 16 px paddingu nad kazdym scrollerem daje mu fizyczne miejsce,
   * dlatego overflow-x nie ucina glowy/postaci.
   */
  #featuredGrid .template-card--hero3d,
  #templateGrid .template-card--hero3d{
    min-height:232px!important;
    overflow:visible!important;
  }
  .template-card--hero3d::before{
    width:80px!important;
    height:80px!important;
    right:2px!important;
    top:3px!important;
  }
  .template-card--hero3d .template-card__hero3d{
    right:2px!important;
    bottom:calc(100% - 92px)!important;
    transform:scale(.15)!important;
    overflow:visible!important;
  }
  .template-card--hero3d:hover .template-card__hero3d{
    transform:translateY(-7px) scale(.158)!important;
  }

  /* Stala przestrzen na maks. 3 linie nazwy = przyciski zawsze rowno. */
  #featuredGrid .template-card h3,
  #templateGrid .template-card h3,
  .template-card--hero3d h3{
    margin-top:85px!important;
    margin-bottom:0!important;
    width:100%!important;
    max-width:100%!important;
    min-height:36px!important;
    height:36px!important;
    max-height:36px!important;
    padding:5px 6px!important;
    border-radius:10px!important;
    font-size:10px!important;
    line-height:1.18!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:3!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
  }

  #featuredGrid .template-card:not(.template-card--hero3d) h3,
  #templateGrid .template-card:not(.template-card--hero3d) h3{
    margin-top:6px!important;
  }

  #featuredGrid .template-card__actions,
  #templateGrid .template-card__actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:5px!important;
    width:100%!important;
    margin-top:auto!important;
    padding-top:6px!important;
    align-items:stretch!important;
  }
  #featuredGrid .template-card__actions [data-template-start],
  #templateGrid .template-card__actions [data-template-start]{
    order:1!important;
  }
  #featuredGrid .template-card__actions a,
  #templateGrid .template-card__actions a{
    order:2!important;
  }
  #featuredGrid .template-card__actions .btn,
  #templateGrid .template-card__actions .btn{
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    height:40px!important;
    padding:5px 4px!important;
    border-radius:9px!important;
    font-size:9px!important;
    line-height:1.08!important;
    white-space:normal!important;
    text-align:center!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  #featuredGrid .template-card>p,
  #templateGrid .template-card>p,
  #featuredGrid .template-card__tag,
  #templateGrid .template-card__tag{
    display:none!important;
  }

  .challenge-finder-launch--top,
  .challenge-finder-launch--bottom{
    margin:18px 0 22px!important;
  }
}

@media(max-width:720px) and (prefers-reduced-motion:reduce){
  #templateGrid .catalogue-mobile-row{
    scroll-behavior:auto!important;
  }
}

@media(max-width:420px){
  .site-mountain-origin-control,
  .site-ai-details>summary.site-ai-details__title{
    font-size:8.5px!important;
  }
}

@media(max-width:370px){
  #featuredGrid .template-card,
  #templateGrid .template-card,
  #featuredGrid .template-card--hero3d,
  #templateGrid .template-card--hero3d{
    min-height:226px!important;
  }
  #featuredGrid .template-card h3,
  #templateGrid .template-card h3,
  .template-card--hero3d h3{
    font-size:9.4px!important;
  }
  #featuredGrid .template-card__actions .btn,
  #templateGrid .template-card__actions .btn{
    min-height:38px!important;
    height:38px!important;
    font-size:8.5px!important;
  }
}

/* ETAP 1 - prywatna Strefa Robocza nowych Czelendży. */
.owner-drafts{
  border:1px dashed color-mix(in srgb,var(--orange) 48%,var(--border));
  border-radius:22px;
  padding:18px;
  background:color-mix(in srgb,var(--orange-pale) 28%,var(--surface));
}
.owner-drafts__head{margin-bottom:6px!important}
.owner-drafts__private{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 10px;
  border-radius:999px;
  background:var(--orange);
  color:#fff;
  font-size:9px;
  line-height:1;
  font-weight:800;
  letter-spacing:.08em;
}
.owner-drafts__lead{margin:0 0 14px;color:var(--muted);font-size:12px;line-height:1.5}
.owner-drafts__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.owner-draft-card{cursor:default!important;min-height:240px!important;overflow:hidden}
.owner-draft-card:hover{transform:none!important;box-shadow:none!important}
.owner-draft-card__hero{display:block;width:100%;height:112px;object-fit:contain;margin:0 auto 6px}
.owner-draft-card__placeholder{display:grid;place-items:center;width:82px;height:82px;margin:0 auto 12px;border:2px dashed var(--orange);border-radius:22px;background:var(--orange-pale);color:var(--orange-dark);font-size:11px;font-weight:800;letter-spacing:.08em}
.owner-draft-card h3{margin:6px 0!important;font-size:14px!important;line-height:1.2!important}
.owner-draft-card p{display:block!important;margin:0 0 10px!important;font-size:10px!important;line-height:1.4!important;color:var(--muted)!important}
.owner-draft-card__meta{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto;padding-top:8px}
.owner-draft-card__badge{font-size:8px;font-weight:800;color:var(--orange);letter-spacing:.05em}
.owner-draft-card__version{font-size:8px;font-weight:800;color:var(--muted)}
.owner-draft-card__actions{display:grid;grid-template-columns:1fr 1.25fr;gap:7px;margin-top:8px}.owner-draft-card__actions .btn{min-width:0;width:100%;justify-content:center}
.owner-drafts__empty{padding:13px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--muted);font-size:11px;line-height:1.45}
.owner-drafts__empty code{font-size:10px;color:var(--text)}
@media(max-width:1050px){.owner-drafts__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){
  .owner-drafts{padding:13px 10px;border-radius:18px}
  .owner-drafts__lead{font-size:10px}
  .owner-drafts__grid{display:flex;gap:8px;overflow-x:auto;padding:4px 0 7px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .owner-drafts__grid::-webkit-scrollbar{display:none}
  .owner-draft-card{flex:0 0 42%;min-height:215px!important;padding:9px!important}
  .owner-draft-card__hero{height:90px}
  .owner-draft-card__placeholder{width:68px;height:68px;border-radius:18px}
  .owner-draft-card h3{font-size:11px!important}
  .owner-draft-card p{font-size:9px!important}
  .owner-draft-card__actions{grid-template-columns:1fr}.owner-draft-card__actions .btn{min-height:36px!important;height:auto!important;font-size:8px!important;white-space:normal!important}
}
@media(max-width:390px){.owner-draft-card{flex-basis:48%}}