/* TiKi English V5.7.14AC39 — Creator + Community phone readability hardening
   Isolated stylesheet loaded after legacy styles so mobile creator/community layouts
   cannot inherit desktop grid widths. No application behavior changes. */

@media (max-width: 760px) {
  /* Let the creator/community surfaces use the available phone width. */
  .creator-view,
  .community-practice-view,
  .creator-view .settings-card,
  .community-practice-view .settings-card,
  .creator-drafts,
  .creator-library-list,
  .creator-practice-landing,
  .creator-course-shell,
  .creator-shared-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .creator-view,
  .community-practice-view {
    overflow-x: hidden !important;
  }

  /* MY CONTENT — one full-width readable card. */
  .creator-library-card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding: 16px !important;
    margin: 0 0 14px !important;
    border-radius: 18px !important;
    overflow: visible !important;
  }

  .creator-library-main {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .creator-library-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
  }

  .creator-library-meta span,
  .creator-visibility-badge {
    width: auto !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    line-height: 1.2 !important;
  }

  .creator-library-main h4 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 12px 0 8px !important;
    font-size: 20px !important;
    line-height: 1.28 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: none !important;
  }

  .creator-library-main p {
    display: -webkit-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 12px !important;
    font-size: 15px !important;
    line-height: 1.52 !important;
    color: #5e7068 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important;
    overflow: hidden !important;
  }

  .creator-library-foot {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 9px !important;
    width: 100% !important;
    margin: 12px 0 0 !important;
  }

  .creator-library-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-top: 15px !important;
  }

  .creator-library-actions button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    box-sizing: border-box !important;
    padding: 11px 14px !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    text-align: center !important;
  }

  /* Tabs are horizontally scrollable rather than wrapping into awkward narrow rows. */
  .creator-library-tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 2px 1px 8px !important;
    margin: 4px 0 14px !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .creator-library-tabs::-webkit-scrollbar { display: none; }
  .creator-library-tabs button {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    padding: 9px 13px !important;
    font-size: 14px !important;
  }

  /* COMMUNITY — always a single-column feed on phones. */
  .community-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .community-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
    padding: 16px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
  }

  .community-card-top,
  .community-badges,
  .community-card-foot {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .community-card h3 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 13px 0 8px !important;
    font-size: 20px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }

  .community-card > p {
    display: -webkit-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    font-size: 15px !important;
    line-height: 1.52 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important;
    overflow: hidden !important;
  }

  .community-topic-preview {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    max-height: 110px !important;
    overflow: hidden !important;
  }

  .community-card-foot {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 9px !important;
  }
  .community-card-foot button {
    width: 100% !important;
    min-height: 46px !important;
    font-size: 15px !important;
  }

  .community-toolbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 9px !important;
    padding: 11px !important;
  }
  .community-search { width: 100% !important; min-width: 0 !important; }
  .community-filters {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    gap: 8px !important;
  }
  .community-filters select {
    width: 100% !important;
    min-width: 0 !important;
  }

  /* CREATED COURSE / LESSON PICKER — no skinny two-column lesson cards. */
  .creator-practice-grid,
  .creator-course-shell .creator-practice-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 12px !important;
    padding: 10px 14px 24px !important;
    box-sizing: border-box !important;
  }

  .creator-lesson-card,
  .creator-practice-topic {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .creator-lesson-card {
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) !important;
    gap: 12px !important;
    padding: 15px !important;
    min-height: 0 !important;
  }

  .creator-lesson-copy,
  .creator-lesson-card strong,
  .creator-lesson-card small {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }
  .creator-lesson-card strong { font-size: 16px !important; line-height: 1.38 !important; }

  /* Course intro / shared content. */
  .creator-course-hero {
    padding: 18px 15px !important;
    box-sizing: border-box !important;
  }
  .creator-course-hero h2 {
    font-size: 22px !important;
    line-height: 1.27 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }
  .creator-course-hero > p,
  .creator-course-goal p,
  .creator-shared-card p {
    font-size: 15px !important;
    line-height: 1.52 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
  }
  .creator-course-goal { margin: 13px 14px !important; padding: 14px !important; }

  /* Prevent any legacy desktop min-width from creating horizontal squeeze. */
  .creator-view *,
  .community-practice-view * {
    box-sizing: border-box;
  }
}

@media (max-width: 390px) {
  .creator-library-card,
  .community-card { padding: 14px !important; }
  .creator-library-main h4,
  .community-card h3 { font-size: 19px !important; }
  .creator-practice-grid,
  .creator-course-shell .creator-practice-grid { padding-left: 10px !important; padding-right: 10px !important; }
}
/* V5.7.14AC40 — Creator Credit checkout */
.creator-credit-modal{position:fixed;inset:0;z-index:10050;display:flex;align-items:center;justify-content:center;padding:20px}.creator-credit-modal.hidden{display:none!important}.creator-credit-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(3px)}.creator-credit-sheet{position:relative;width:min(480px,100%);background:#fff;border-radius:24px;padding:28px;box-shadow:0 24px 70px rgba(15,23,42,.28);max-height:90vh;overflow:auto}.creator-credit-x{position:absolute;right:16px;top:12px;border:0;background:transparent;font-size:30px;line-height:1;cursor:pointer}.creator-credit-icon{font-size:38px}.creator-credit-sheet h2{margin:8px 0 8px;font-size:24px}.creator-credit-sheet>p{margin:0 0 18px;line-height:1.55}.creator-credit-value{padding:16px;border-radius:18px;background:#f5f7ff;display:flex;gap:12px;align-items:center;margin:14px 0}.creator-credit-value strong{font-size:25px;white-space:nowrap}.creator-credit-value span{font-size:14px;line-height:1.4}.creator-credit-sheet ul{padding-left:22px;line-height:1.8;margin:14px 0 20px}.creator-credit-buy,.creator-credit-later{width:100%;min-height:48px;margin-top:8px}.creator-credit-sheet>small{display:block;text-align:center;margin-top:14px;line-height:1.4;color:#64748b}@media(max-width:600px){.creator-credit-modal{padding:0;align-items:flex-end}.creator-credit-sheet{width:100%;border-radius:24px 24px 0 0;padding:24px 18px calc(22px + env(safe-area-inset-bottom));max-height:88vh}.creator-credit-sheet h2{font-size:21px}.creator-credit-value{align-items:flex-start;flex-direction:column;gap:4px}}
/* V5.7.14AC41 — multi-pack Creator Credit wallet */
.creator-credit-balance{border:1px solid #dce9e2;background:#f4fbf7;border-radius:14px;padding:11px 14px;margin:12px 0;font-size:14px}.creator-credit-packs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 18px}.creator-credit-pack{position:relative;text-align:left;border:1px solid #d7e2dc;background:#fff;border-radius:17px;padding:14px;min-height:112px;cursor:pointer;transition:.15s ease}.creator-credit-pack:hover{border-color:#059669;transform:translateY(-1px);box-shadow:0 8px 20px rgba(5,150,105,.10)}.creator-credit-pack.popular{border:2px solid #059669;background:#f4fbf7}.creator-credit-pack.loading{opacity:.6;pointer-events:none}.creator-pack-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.creator-pack-top strong{font-size:15px}.creator-pack-top em{font-style:normal;font-size:10px;background:#059669;color:#fff;border-radius:999px;padding:4px 7px}.creator-pack-price{display:block;font-weight:800;font-size:24px;margin:8px 0 2px;color:#0f172a}.creator-credit-pack small{color:#64748b}.creator-credit-pack.loading:after{content:'…';position:absolute;right:14px;bottom:12px;font-weight:800}@media(max-width:600px){.creator-credit-packs{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.creator-credit-pack{padding:12px;min-height:104px}.creator-pack-price{font-size:22px}}