/* Poetry page: self-contained styles. Remove this file and /poetry/ to remove the feature. */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600;700&family=DM+Mono:wght@400;500&family=Noto+Nastaliq+Urdu:wght@400;500;600&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap');

.poetry-page{--poetry-paper:#f4eddf;--poetry-ink:#241b16;--poetry-brown:#76533e;--poetry-line:#cfbfa9;background:var(--poetry-paper);color:var(--poetry-ink);background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 31px,rgba(91,62,42,.055) 32px,transparent 33px)}
.poetry-page .site-header{border-color:rgba(36,27,22,.22);background:rgba(244,237,223,.92);backdrop-filter:blur(12px)}
.poetry-page .brand span{color:var(--poetry-brown)}.poetry-page .theme-toggle{display:none}.poetry-page main{overflow:hidden}
.poetry-intro{min-height:0;padding:clamp(64px,6vw,88px) 8vw clamp(40px,3.7vw,54px);display:flex;flex-direction:column;justify-content:flex-start;position:relative;border:0}
.poetry-intro:before,.poetry-intro:after{content:none}
.handwritten-doodle{position:absolute;width:auto;height:clamp(68px,5.9vw,78px);right:clamp(30px,7vw,96px);top:clamp(20px,2.4vw,32px);opacity:.9;pointer-events:none;user-select:none}
.poetry-kicker{max-width:470px;margin:20px 0 0;font:500 clamp(16px,1.35vw,20px)/1.1 'Caveat',cursive;letter-spacing:0;color:var(--poetry-brown)}
.poetry-intro h1{margin:0;font:700 clamp(68px,8vw,126px)/.88 'Caveat',cursive;letter-spacing:-.07em}.poetry-intro h1 .handwritten{font:inherit}.poetry-intro h1 em{font:inherit}@media(min-width:761px){.poetry-intro h1{position:relative;width:fit-content}.poetry-intro .handwritten-doodle{height:clamp(54px,4.4vw,68px);left:calc(100% + clamp(4px,.6vw,10px));right:auto;top:clamp(-18px,-1.3vw,-8px)}}
.poetry-collection{max-width:1180px;margin:0 auto;padding:clamp(20px,2.8vw,38px) 7vw 12vw;display:block}.poetry-column{display:block}
.poem{position:relative;padding:clamp(23px,3vw,42px) clamp(23px,3.5vw,48px);background:repeating-linear-gradient(to bottom,transparent 0,transparent 29px,rgba(118,83,62,.05) 30px,transparent 31px),linear-gradient(135deg,#fffdf8 0%,#f8efdf 100%);border:1px solid rgba(70,51,37,.17);box-shadow:4px 5px 0 rgba(213,196,170,.55),0 13px 24px rgba(58,38,24,.07),inset 0 1px 0 rgba(255,255,255,.9);isolation:isolate;transition:box-shadow .35s ease,transform .35s ease}.poem:before,.poem:after{display:none}@media(hover:hover){.poem:hover{transform:translateY(-1px);box-shadow:4px 6px 0 rgba(213,196,170,.6),0 15px 28px rgba(58,38,24,.085),inset 0 1px 0 rgba(255,255,255,.92)}}
.poem.long,.poem.urdu-letter,.poem.compact{margin:0}.poem.is-open{box-shadow:5px 6px 0 rgba(213,196,170,.62),0 18px 30px rgba(58,38,24,.09),inset 0 1px 0 rgba(255,255,255,.92)}.poem{scroll-margin-top:22px}
.poem h2{margin:0;font:600 clamp(28px,3.2vw,47px)/.96 'Playfair Display',Georgia,serif;letter-spacing:-.06em;color:var(--poetry-ink);font-style:normal}.poem.urdu-letter h2{direction:ltr}.poem.urdu-letter .poem-trigger{direction:ltr;text-align:left}
.poem-trigger{all:unset;display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;cursor:pointer;background:transparent;border:0;color:inherit;font:inherit;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none}.poem-trigger:focus{outline:none}.poem-trigger:focus-visible{outline:1px solid rgba(118,83,62,.7);outline-offset:6px}.poem-trigger:active{background:transparent;color:inherit;opacity:1;transform:none}.poem-trigger:after{content:'';flex:none;width:7px;height:7px;border-right:1.25px solid var(--poetry-ink);border-bottom:1.25px solid var(--poetry-ink);transform:rotate(45deg);transition:transform .28s ease}.poem.is-open .poem-trigger:after{transform:rotate(-135deg)}
.poem-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .62s cubic-bezier(.16,1,.3,1)}.poem.is-open .poem-body{grid-template-rows:1fr}.poem-copy{min-height:0;overflow:hidden;opacity:0;transform:translateY(-10px);transition:opacity .28s ease,transform .5s cubic-bezier(.16,1,.3,1);padding-top:0}.poem.is-open .poem-copy{opacity:1;transform:none;padding-top:32px;transition-delay:.12s}
.poem .verse{margin:0;white-space:pre-wrap;font:500 clamp(20px,1.7vw,27px)/1.14 'Caveat',cursive;letter-spacing:.004em}.poem .verse+.verse{margin-top:24px}.poem .verse.roman{font-size:clamp(19px,1.55vw,25px)}.poem .verse.urdu{font:500 clamp(17px,1.42vw,24px)/1.8 'Noto Nastaliq Urdu',serif;letter-spacing:0}.poem.urdu-letter .poem-copy{padding-right:clamp(1.2rem,3vw,2rem);padding-left:.6rem}.poem.urdu-letter .verse{padding-right:.55em;padding-left:.2em;direction:rtl;text-align:right;unicode-bidi:plaintext;font:500 clamp(17px,1.42vw,24px)/1.95 'Noto Nastaliq Urdu',serif}.poem.urdu-letter .verse.roman{font:500 clamp(19px,1.55vw,25px)/1.18 'Caveat',cursive;direction:ltr}
/* Desktop reading: one type scale and one paper margin for every language. */
@media (min-width: 761px) {
  .poetry-collection {
    width: min(calc(100% - 12.6vw), 900px);
    max-width: none;
    padding: clamp(20px, 2.8vw, 38px) 0 12vw;
  }
  .poetry-collection > .poem + .poem { margin-top: 24px; }
  .poem { padding: 32px; direction: ltr; }
  .poem h2, .poem.urdu-letter h2 {
    font: 600 30px/1.12 'Playfair Display', Georgia, serif;
    letter-spacing: -.025em;
    direction: ltr;
    text-align: left;
  }
  .poem-trigger, .poem.urdu-letter .poem-trigger {
    direction: ltr;
    flex-direction: row;
    text-align: left;
  }
  .poem-trigger:after { margin-left: auto; }
  .poem .poem-copy, .poem.urdu-letter .poem-copy {
    padding-right: 0;
    padding-left: 0;
  }
  .poem .verse, .poem .verse.roman, .poem.urdu-letter .verse.roman {
    font: 500 22px/1.35 'Caveat', cursive;
    letter-spacing: 0;
    padding: .25em;
    direction: ltr;
    text-align: left;
  }
  .poem .verse[lang="ur"] {
    font: 500 22px/2.05 'Noto Nastaliq Urdu', serif;
    direction: rtl;
    text-align: right;
    unicode-bidi: plaintext;
    /* Nastaliq strokes extend beyond their text box; reserve one safe inset. */
    padding: .35em 1.1em .65em .35em;
  }
}
@media (min-width: 1200px) {
  .poetry-collection {
    width: min(calc(100% - 12.6vw), 1600px);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: start;
  }
  .poetry-column {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
  }
  .poetry-column .poem { width: 100%; margin: 0; }
}
.poetry-page footer{border-color:rgba(36,27,22,.2);padding:3vw 4.3vw;background:#e6dac6}.poetry-page footer p{color:var(--poetry-brown)}
@media(max-width:760px){.poetry-page .site-header{background:var(--poetry-paper)}.poetry-intro{min-height:0;padding:20vw 8vw 10vw}.handwritten-doodle{width:auto;height:62px;right:8vw;top:8vw}.poetry-intro h1{position:static;width:auto;font-size:clamp(66px,18vw,105px)}.poetry-kicker{font-size:18px;margin:16px 0 0}.poetry-collection{display:block;padding:8vw 9vw 14vw}.poem,.poem.long,.poem.urdu-letter,.poem.compact{margin:0 0 23px;padding:27px 25px}.poem.is-open{margin-bottom:33px}.poem h2,.poem.urdu-letter h2{font-size:34px}.poem-trigger:after{width:6px;height:6px}.poem .verse{font-size:23px;line-height:1.17}.poem .verse.urdu,.poem.urdu-letter .verse{font-size:18px;line-height:1.95}.poetry-page nav{background:var(--poetry-paper)}.poetry-page footer{padding:9vw 8vw}}
@media(prefers-reduced-motion:reduce){.poem,.poem-body,.poem-copy,.poem-trigger:after{transition:none}}