/* Kohana. build-07 r15 PROTOTYPE (2026-11-03, local, not published) — loaded after build07m.css. CSS only. Phones (below 600px)
   with JavaScript only (the slider of r14); PC / tablets and the review cards are unchanged.
   The letter cards take the review cards' standard (.vc-card article, measured at 390px):
   - width 84% of the slider, 14px apart, so a little more of the next letter shows (as in REVIEWS)
   - corner radius 18px, 1px border rgba(176,138,62,.28), shadow 0 8px 22px rgba(92,74,64,.07), background #fffdf8,
     sides 22px, bottom 18px (top 40px: the mizuhiki ornament sits on the top edge)
   - closed: the excerpt shows about four and a half lines and fades out, like a long review; 「続きを読む」 shows the whole
     excerpt and the full answers ①〜⑨ (the open/close itself is unchanged). The text is unchanged and stays in the page. */
@media(max-width:37.49em){
 .js #letters .letters{padding:26px var(--pad,20px) 18px}
 .js #letters .letters>.letter{flex:0 0 84%}
 .js #letters .letters::after{flex:0 0 calc(16% + 8px)}   /* room for Letter 02 to settle at the left edge */
 .js #letters .letter.tm .paper{border-radius:18px;border:1px solid rgba(176,138,62,.28);box-shadow:0 8px 22px rgba(92,74,64,.07);
  background:#fffdf8;padding:40px 22px 18px}
 .js #letters .letter.tm .tm-quote{max-height:153px;overflow:hidden;
  -webkit-mask-image:linear-gradient(#000 62%,transparent 100%);mask-image:linear-gradient(#000 62%,transparent 100%)}
 .js #letters .letter.tm .paper:has(.tm-full.open) .tm-quote{max-height:none;-webkit-mask-image:none;mask-image:none}
}