/* =====================================================
   RUNLAA STORY PAGE
   page-specific only
===================================================== */

.story-page-local{}

/* ===== moved from app.css: story detail ===== */
    .story-content{font-size:1.06rem;line-height:1.95;color:var(--text)}
    .comment-image{width:100%;max-width:420px;aspect-ratio:4/3;object-fit:cover;border-radius:16px;margin-top:12px}
    .comment-inline-form{
      margin-top:8px;
    }
    .comment-inline-row{
      display:flex;
      align-items:center;
      gap:10px;
      background:var(--panel);
      
      border-radius:18px;
      padding:10px;
      box-shadow:var(--shadow-soft);
    }
    .comment-inline-input{
      flex:1 1 auto;
      min-width:0;
    }
    .comment-inline-textarea{
      min-height:46px;
      max-height:140px;
      resize:vertical;
      border-radius:14px;
      border:0;
      box-shadow:none !important;
      background:transparent;
      padding:.7rem .85rem;
    }
    .comment-inline-upload{
      display:inline-flex;
      align-items:center;
      gap:6px;
      flex:0 0 auto;
      min-height:42px;
      padding:0 12px;
      border-radius:14px;
      background:var(--panel2);
      
      color:var(--text);
      font-weight:700;
      cursor:pointer;
      white-space:nowrap;
    }
    .comment-inline-upload i{
      font-size:1rem;
    }
    .comment-inline-submit{
      width:44px;
      height:44px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border-radius:14px;
      padding:0;
      flex:0 0 44px;
    }
    .comment-inline-preview{
      margin-top:12px;
      padding-left:6px;
    }
    @media (max-width: 575.98px){
      .comment-inline-row{
        gap:8px;
        padding:8px;
      }
      .comment-inline-upload{
        min-height:40px;
        padding:0 10px;
        font-size:.86rem;
      }
      .comment-inline-upload span{
        display:none;
      }
      .comment-inline-submit{
        width:40px;
        height:40px;
        flex-basis:40px;
      }
      .comment-inline-textarea{

/* ===== RUNLAA story page horizontal scroll fix ===== */
html,
body{
  overflow-x:hidden !important;
}

.story-page-local,
.story-page-local .container,
.story-page-local .row,
.story-page-local [class*="col-"]{
  max-width:100% !important;
  overflow-x:clip !important;
}

.story-page-local img,
.story-page-local video,
.story-page-local iframe,
.story-page-local canvas,
.story-page-local svg{
  max-width:100% !important;
}

.story-page-local .cover-thumb,
.story-page-local .story-content,
.story-page-local .gallery-grid,
.story-page-local .gallery-grid img{
  max-width:100% !important;
}

.story-page-local .story-content,
.story-page-local .gallery-grid{
  overflow-x:clip !important;
  word-break:break-word;
}

.story-page-local pre,
.story-page-local code{
  white-space:pre-wrap;
  word-break:break-word;
}


/* ===== RUNLAA story page hard overflow fix ===== */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
}

.story-page-local{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
}

.story-page-local *{
  box-sizing:border-box;
  min-width:0;
}

.story-page-local .container,
.story-page-local .container-fluid,
.story-page-local .row,
.story-page-local [class*="col-"],
.story-page-local .glass-card,
.story-page-local .story-content,
.story-page-local .gallery-grid,
.story-page-local .gallery-grid > *{
  max-width:100% !important;
  min-width:0 !important;
}

.story-page-local .row{
  margin-left:0 !important;
  margin-right:0 !important;
}

.story-page-local [class*="col-"]{
  padding-left:12px;
  padding-right:12px;
}

.story-page-local img,
.story-page-local video,
.story-page-local iframe,
.story-page-local canvas,
.story-page-local svg{
  display:block;
  max-width:100% !important;
  height:auto;
}

.story-page-local .cover-thumb,
.story-page-local .gallery-grid img{
  width:100% !important;
  max-width:100% !important;
}

.story-page-local .story-content,
.story-page-local .gallery-grid,
.story-page-local .glass-card{
  overflow-x:hidden !important;
}

.story-page-local pre,
.story-page-local code,
.story-page-local a,
.story-page-local p,
.story-page-local h1,
.story-page-local h2,
.story-page-local h3,
.story-page-local h4,
.story-page-local h5,
.story-page-local h6,
.story-page-local li,
.story-page-local span{
  overflow-wrap:anywhere;
  word-break:break-word;
}

.story-page-local [style*="100vw"],
.story-page-local [style*="width: 100vw"],
.story-page-local [style*="width:100vw"]{
  width:100% !important;
  max-width:100% !important;
}

@media (max-width: 767.98px){
  .story-page-local [class*="col-"]{
    padding-left:10px;
    padding-right:10px;
  }
}