body {
        font-family: 'Georgia', serif;
        background: #fdf6f0;
        color: #333;
        line-height: 1.8;
        padding: 40px;
        max-width: 800px;
        margin: auto;
        -webkit-user-select: none; /* Chrome/Safari */
        -moz-user-select: none;    /* Firefox */
        -ms-user-select: none;     /* IE10+ */
        user-select: none;         /* Standard */
        -webkit-touch-callout: none; /* Disable iOS popup menu */
    }
    
    .no-reader {
        all: unset;
        display: block;
        position: relative;
        z-index: 1;
        user-select: none;
}    
    h1, h2 {
        text-align: center;
        color: #5d3a00;
    }
    .part {
        margin-bottom: 50px;
    }
    .dialogue {
        margin: 20px 0;
        padding: 10px 20px;
        /*background: #fffaf2;*/
        background-color: rgba(255, 250, 242, 0.4); /* 85% opaque */
        border-left: 4px solid #e7a73e;
        font-style: italic;
    }
    .inner-thought {
        font-style: italic;
        color: #7a4c14;
    }
    .divider {
        text-align: center;
        margin: 30px 0;
        color: #bbb;
    }
    .dedication-frame {
        max-width: 700px;
        margin: 60px auto;
        padding: 30px;
        /*background: #fffaf4;*/
        
        background-color: rgba(255, 250, 244, 0.4); /* 85% opacity */
        
        
        border: 8px double #a78a7f;
        border-radius: 25px;
        box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
        position: relative;
        animation: fadeIn 2s ease;
    }
    .dedication-text {
        font-family: 'Georgia', serif;
        font-size: 1.15rem;
        color: #3b2f2f;
        text-align: center;
        line-height: 1.8;
    }
    .dedication-text p {
        margin: 12px 0;
    }
    @keyframes fadeIn {
        from { opacity: 0; transform: translateY(20px); }
        to { opacity: 1; transform: translateY(0); }
    }
    .quote-wrapper {
        text-align: center;
        margin: 40px auto;
        padding: 20px;
        max-width: 600px;
        border-left: 4px solid black;
        border-right: 1px solid black;
        border-top: 1px solid black;
        border-bottom: 1px solid black;
        background: rgba(55, 25, 50, 0.05);
        font-style: italic;
        
        color : #4c4c00; /*#808000; /* #bfbf00;*/
        box-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
        border-radius: 12px;
    }
    .quote-wrapper blockquote {
        margin: 0;
        padding: 0;
        font-size: 1.2rem;
        font-family: 'Georgia', serif;
        /*color : #999900;*/
    }
    .the-end {
        text-align: center;
        font-size: 1.6rem;
        font-style: italic;
        
        color: #8d6e40; /*color: #e0cda9;*/
        margin: 40px 0 20px;
        letter-spacing: 2px;
        font-family: 'Georgia', serif;
        opacity: 0.8;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
    }
    #startOverlay {
      position: fixed;
      inset: 0;
      background: black;
      color: white;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 24px;
      z-index: 1000;
      cursor: pointer;
      height: 100vh;
    }
    .scroll-text {
        transition: color 0.4s ease;
        
        color: #6b6b6b; /* #777; /* #999;*/
    }
    .scroll-text.active {
        color: #4a3e6c; /* #5a4e7c;*/
        transition: color 0.6s ease, font-weight 0.6s ease, transform 0.3s ease;
        transform: scale(1.01);
    }
    .closing-words {
        margin-top: -2.7em;
        font-size: 1.1rem;
        color: #444;
        font-family: 'Georgia', serif;
        text-align: center;
        line-height: 1.6;
    }
    .story-meta {
        font-size: 0.9rem;
        color: #555;
        margin-bottom: 20px;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        display: flex;
        gap: 8px;
        align-items: center;
        flex-wrap: wrap;
    }
    .story-meta .author {
        font-weight: 500;
    }
    .story-meta .date {
        color: #777;
    }
    .story-meta .separator {
        color: #aaa;
    }
    
    .text-muted {
        color: #495057; /* #6c757d;*/
    }
    .small {
        font-size: 0.875rem;
    }

.authorERT {
    font-weight: 500;
    font-size: 0.85rem;
    color: #555;
    display: block;
}
    caps {
  position: absolute;
  overflow: hidden;
  font-size: 1px;
  color: rgba(0, 0, 0, 0);
  opacity :0;
}


span.date {
    color: #495057 !important;
}
.clock {
  text-decoration:none !important;
  display: inline-block;
  font-weight: 250;
  color: #555;
  font-style: italic;
  margin: 5px 0 15px 0;
  text-decoration-color: rgb(108, 117, 125);
}
.ert {
  font-family: Georgia, sans-serif;
  font-size: 0.5rem;
  font-weight: 50;
  color: #555;
  font-style: italic;
  margin: 5px 0 15px 0;
  text-decoration: underline;
  text-decoration-color: rgb(108, 117, 125);
}
.ert-time {
  font-weight: bold;
  font-style: normal;
  font-family: Arial, sans-serif;
}