.prm-reviews{position:relative;overflow:hidden;background:radial-gradient(ellipse at 12% 80%,#54214a33,transparent 55%),radial-gradient(ellipse at 90% 20%,#00bed51a,transparent 50%);padding:88px 0 64px}.prm-reviews .prm-heading{align-items:end;gap:32px}.prm-heading h2{font-size:clamp(32px,4.2vw,58px);line-height:1.08;letter-spacing:-.04em}.prm-intro{max-width:350px}.prm-intro p{margin:12px 0;color:#d6dfe5}.prm-status,.prm-category,.prm-toolbar,.prm-id{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.prm-status{font-size:11px;letter-spacing:.12em;color:#8af4ec;border:1px solid #62ded34a;border-radius:30px;padding:8px 12px;display:inline-block}.prm-status:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#8af4ec;margin-right:8px}.prm-intro .prm-disclosure{font-size:12px;line-height:1.6;color:#aab8c4}.prm-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:30px 0 18px;color:#9babb9;font-size:10px;letter-spacing:.1em}.prm-toolbar>span>span{color:#67dcd9}.prm-toggle{font:inherit;color:#e0edf4;background:#10202b;border:1px solid #395363;border-radius:24px;padding:10px 16px;cursor:pointer}.prm-toggle[hidden]{display:none}.prm-toggle:focus-visible,.prm-window:focus-visible{outline:2px solid #7af5e7;outline-offset:4px}.prm-window{overflow-x:auto;padding:6px 0 18px;scrollbar-width:thin;scrollbar-color:#3e6978 #0b141c}.prm-track,.prm-group{display:flex;gap:20px;width:max-content}.prm-group{padding-left:20px}.prm-card{box-sizing:border-box;margin:0;width:360px;min-height:290px;padding:25px;display:flex;flex-direction:column;background:linear-gradient(145deg,#14232ef2,#09131ef2);border:1px solid #3e58666b;border-radius:20px;box-shadow:0 18px 45px #0002;position:relative}.prm-card:before{content:'';position:absolute;left:25px;right:25px;top:0;height:1px;background:linear-gradient(90deg,#6bebed,transparent 85%)}.prm-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.prm-category{color:#89adb9;font-size:9px;letter-spacing:.08em}.prm-sample{font-size:9px;letter-spacing:.12em;color:#c7b7e6;border:1px solid #b69adc40;border-radius:4px;padding:4px 6px}.prm-card blockquote{margin:24px 0 26px;color:#edf3f6;font-size:17px;line-height:1.65;letter-spacing:-.01em}.prm-card figcaption{margin-top:auto;padding-top:18px;border-top:1px solid #b2d7e21a;display:flex;align-items:center;gap:13px}.prm-card img{border-radius:50%;border:2px solid #d9ffff26;flex-shrink:0}.prm-card strong{display:block;font-size:14px;color:#f4f7fb}.prm-city{display:block;margin-top:4px;font-size:12px;color:#9aafbc}.prm-id{margin-left:auto;color:#637a8b;font-size:12px}.prm-footnote{font-size:11px;color:#91a4b2;line-height:1.6;margin:15px 0 0}.prm-reviews.prm-ready .prm-window{overflow:hidden}.prm-ready .prm-track{animation:prm-drift 2000s linear infinite}.prm-window:hover .prm-track,.prm-window:focus-within .prm-track,.prm-paused .prm-track{animation-play-state:paused}.prm-ready .prm-window:focus{overflow-x:auto}.prm-ready .prm-window:focus .prm-track{animation:none}@keyframes prm-drift{to{transform:translateX(-50%)}}@media(min-width:1500px){.prm-card{width:400px}}@media(max-width:700px){.prm-reviews{padding:56px 0 40px}.prm-reviews .prm-heading{display:block}.prm-intro{margin-top:24px;max-width:100%}.prm-card{width:300px;min-height:310px;padding:22px}.prm-card blockquote{font-size:16px}.prm-toolbar{font-size:9px;letter-spacing:.04em}.prm-group,.prm-track{gap:14px}.prm-group{padding-left:14px}}@media(prefers-reduced-motion:reduce){.prm-ready .prm-track{animation:none}.prm-reviews.prm-ready .prm-window{overflow-x:auto}.prm-clone{display:none!important}.prm-toggle{display:none!important}}
.prm-track{gap:0}

.prm-photo{display:block;width:56px;height:56px;flex:0 0 56px;border-radius:50%;border:2px solid #d9ffff26;box-sizing:border-box;background-image:url('review-samples/portrait-atlas.png');background-size:1468.384% 1453.071%;background-repeat:no-repeat;background-color:#182b35}

.prm-photo{background-size:500% 1000%}.prm-disclosure{border-left:2px solid #79dcd3;padding-left:12px}
.prm-sheet-0{background-image:url('review-samples/portraits-0.png')}
.prm-sheet-1{background-image:url('review-samples/portraits-1.png')}
.prm-sheet-2{background-image:url('review-samples/portraits-2.png')}
.prm-sheet-3{background-image:url('review-samples/portraits-3.png')}
.prm-sheet-4{background-image:url('review-samples/portraits-4.png')}

.prm-review-action{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.prm-leave-review{display:inline-flex;align-items:center;gap:12px;padding:12px 20px;border:1px solid #79e8dd;border-radius:999px;background:#79e8dd;color:#07191e;text-decoration:none;font:600 14px system-ui,sans-serif;letter-spacing:0}.prm-leave-review:hover{background:#a1fff3}.prm-leave-review:focus-visible{outline:2px solid #fff;outline-offset:4px}.prm-review-hint{font:12px system-ui,sans-serif;letter-spacing:0;color:#aabac5}.prm-toolbar{align-items:center}.prm-disclosure{font-size:13px!important;color:#c3d5df!important}@media(max-width:600px){.prm-review-action{gap:8px;flex-direction:column;align-items:flex-start}.prm-toolbar{gap:12px}}

.prm-person-context{display:block;font-size:11px;line-height:1.45;color:#c2d5df;margin-top:5px;letter-spacing:0}.prm-card figcaption>span:nth-child(2){min-width:0}.prm-card{min-height:340px}.prm-review-action .prm-leave-review{font:600 14px system-ui,sans-serif;letter-spacing:0;text-transform:none}.prm-review-action .prm-review-hint{font:12px system-ui,sans-serif;letter-spacing:0}


/* ── MOBILE: ONE LONG REVIEW MUST NOT SET THE HEIGHT OF EVERY CARD ───────────
   .prm-group is a flex row, so every card stretches to the tallest one. A
   single 300-character review therefore made EVERY card on the phone that
   tall — the short ones carrying a block of dead space above their footer,
   and the rail itself taller than the viewport.

   Widening alone only delays it: a wider box fits more words per line, but
   nothing stops the next review being twice as long. So both, and the second
   is what actually bounds it — the card is wider AND the quote is capped at a
   fixed number of lines with a tap to open it in place. The rail's height is
   now decided by the cap, not by whoever wrote the most.

   Desktop is untouched: there is room there, and the cards already line up. */
@media(max-width:700px){
  /* 86vw on a 412px phone is ~354, so the cap is what applies on anything
     normal — but a 320px phone still gets a card that fits its screen. */
  .prm-card{width:min(86vw,344px);min-height:0}

  /* THE CAP. 8 lines at 16px/1.65 is ~211px of quote: long enough that most
     reviews are never truncated at all, short enough that the tall ones stop
     before they run off the screen. */
  .prm-card blockquote{
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8;
    overflow:hidden;margin:18px 0 12px}
  .prm-card.is-open blockquote{display:block;-webkit-line-clamp:unset;overflow:visible}

  /* Added by the script only on the cards that are ACTUALLY clipped, so a
     short review never shows a "Read more" that does nothing. */
  .prm-more{align-self:flex-start;margin:0 0 14px;padding:6px 0;
    background:none;border:0;cursor:pointer;
    font:700 11px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
    letter-spacing:.1em;text-transform:uppercase;color:#79e8dd}
  .prm-more:focus-visible{outline:2px solid #7af5e7;outline-offset:3px}
  .prm-more[hidden]{display:none}
}
/* Above 700px there is nothing to clamp and nothing to open. */
@media(min-width:701px){.prm-more{display:none}}