/* Correspondence: header owl/envelope and the parchment archive. Brand palette only. */
.vf-library .vf-letter {position:absolute;right:0;bottom:2px;display:flex;align-items:center;justify-content:center;width:52px;height:52px;padding:0;border:0;background:transparent;cursor:pointer;border-radius:10px}
.vf-library .vf-letter[hidden],.vf-owl[hidden] {display:none!important}
.vf-library .vf-letter img {width:100%;height:100%;object-fit:contain;object-position:center bottom;display:block;pointer-events:none}
.vf-library .vf-letter:focus-visible,.vf-owl:focus-visible {outline:3px solid #406963;outline-offset:4px}
/* Mouse/touch focus must leave no ring (Copyparty's #ht_brw defaults are ID-scoped). */
#ht_brw .vf-letter:focus:not(:focus-visible),#ht_brw .vf-owl:focus:not(:focus-visible),#ht_brw .vf-wordmark[role="button"]:focus:not(:focus-visible),#ht_brw .vf-letters-pane h3:focus {outline:none;box-shadow:none}
@media(max-width:600px) {.vf-library .vf-letter {width:46px;height:46px;bottom:1px}}

.vf-owl {position:absolute;left:0;top:0;z-index:30;display:block;padding:0;border:0;background:transparent;cursor:pointer;line-height:0;overflow:visible;filter:drop-shadow(0 4px 4px #28302d1c);-webkit-tap-highlight-color:transparent}
.vf-owl .vf-owl-rest {position:absolute;display:block;max-width:none;user-select:none;-webkit-user-drag:none}
.vf-owl .vf-owl-anim {position:absolute;display:block;max-width:none;pointer-events:none;user-select:none}
.vf-owl.vf-owl-animating .vf-owl-rest {visibility:hidden}
.vf-owl::after {content:"";position:absolute;inset:-6px -10px}  /* generous touch target */

body.vf-letters-open {overflow:hidden}
dialog.vf-letters {box-sizing:border-box;width:min(1460px,calc(100vw - 24px));max-width:none;height:min(980px,calc(100dvh - 24px));max-height:none;margin:auto;padding:12px;border:0;background:transparent;overflow:visible}
dialog.vf-letters::backdrop {background:#151b24}
.vf-letters * {box-sizing:border-box}
.vf-letters-sheet {--wood:url('/assets/correspondence/wood-desktop.webp');--tray:url('/assets/correspondence/tray-desktop.webp');--paper:url('/assets/correspondence/paper-desktop.webp');--unread:url('/assets/correspondence/card-unread-desktop.webp');--read:url('/assets/correspondence/card-read-desktop.webp');height:100%;display:flex;flex-direction:column;padding:12px;border:3px double #b78039;border-radius:20px;background:linear-gradient(#30150c88,#30150c88),var(--wood) center/cover;box-shadow:0 16px 40px #000a;isolation:isolate}
.vf-letters-top {position:relative;flex:none;aspect-ratio:1404/147;background:url('/assets/correspondence/masthead.webp') center/contain no-repeat}
.vf-letters-heading {position:absolute;left:18%;top:14%;width:38%;height:70%;display:flex;flex-direction:column;justify-content:center}
.vf-letters-heading h2 {margin:0;color:#f6e4c4;font:italic 400 clamp(22px,3.5vw,52px)/1 'Playfair Display',Georgia,serif;white-space:nowrap}
.vf-letters-count {position:absolute;left:37.8%;top:88.6%;transform:translate(-50%,-50%);margin:0;color:#e2ad58;font:700 clamp(8px,1vw,14px)/1.2 Georgia,serif;letter-spacing:.18em;white-space:nowrap}
.vf-letters-close {position:absolute;right:1%;top:13%;width:5%;height:70%;border:0;border-radius:50%;background:transparent;color:transparent;cursor:pointer}
.vf-letters button:focus-visible,.vf-reader-copy:focus-visible {outline:3px solid #fff4bb;outline-offset:2px}
.vf-letters-body {flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,35fr) minmax(0,65fr);gap:12px;padding-top:12px;align-items:start;justify-items:center;overflow:auto;overscroll-behavior:contain}
.vf-letters-tray {position:relative;width:100%;height:auto;min-height:0;background:var(--tray) center top/contain no-repeat;aspect-ratio:687/914;max-width:100%;filter:drop-shadow(0 8px 6px #130903aa)}
.vf-letters-list {position:absolute;top:21%;bottom:24%;left:5%;right:5%;margin:0;padding:4px 3px 12px;list-style:none;overflow:auto;overscroll-behavior:contain;scrollbar-color:#b98647 #3b1b0e;scrollbar-width:thin}
.vf-letter-row {position:relative;aspect-ratio:967/237;margin-bottom:10px;background:var(--unread) center/contain no-repeat;filter:drop-shadow(0 3px 2px #1b0a0588)}
.vf-letter-row.is-read {background-image:var(--read)}
.vf-letter-row.is-selected::after {content:"";position:absolute;inset:5% 2%;border:2px solid #eabf62;border-radius:10px;box-shadow:0 0 5px #e4a53d;pointer-events:none}
.vf-letter-open {position:absolute;inset:0;width:100%;border:0;padding:0;background:transparent;text-align:left;color:#57300f;cursor:pointer}
.vf-letter-text {position:absolute;inset:0}
.vf-letter-title,.vf-letter-date {position:absolute;left:8%;right:25%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vf-letter-title {top:25%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;font:italic 400 clamp(12px,1.25vw,19px)/1.05 'Playfair Display',Georgia,serif}
.vf-letter-date {top:65%;font:700 clamp(9px,.7vw,11px)/1.2 Georgia,serif;letter-spacing:.12em;text-transform:uppercase}
.vf-letter-dot,.vf-letter-flags {display:none}
.vf-letters-pane {position:relative;width:100%;height:auto;min-height:0;max-width:100%;aspect-ratio:1034/844;background:var(--paper) center top/contain no-repeat;filter:drop-shadow(0 8px 6px #130903aa)}
.vf-reader-copy {position:absolute;left:10%;right:10%;top:28%;bottom:10%;overflow:auto;overscroll-behavior:contain;padding:0 2%;color:#563514;scrollbar-color:#9d713d #ead4a5;scrollbar-width:thin}
.vf-letter-meta {margin:0 0 8px;color:#80512b;font:700 11px/1.3 Georgia,serif;letter-spacing:.17em;text-transform:uppercase}
.vf-letters-pane h3 {margin:0;color:#4b250c;font:italic 400 clamp(24px,2.6vw,40px)/1.12 'Playfair Display',Georgia,serif;overflow-wrap:anywhere}
.vf-letter-rule {position:relative;height:18px;margin:14px 0;text-align:center;background:linear-gradient(#b27b33,#b27b33) left center/calc(50% - 16px) 1px no-repeat,linear-gradient(#b27b33,#b27b33) right center/calc(50% - 16px) 1px no-repeat;color:#b27b33}
.vf-letter-rule::after {content:"✦";position:relative;padding:0 10px;background:transparent;font-size:17px;line-height:18px}
.vf-letter-signature {display:flex;justify-content:flex-end;align-items:center;gap:12px;text-align:center;margin:1.5em 0 1em;padding-right:8%;color:#563514;font:italic clamp(15px,1.3vw,19px)/1.4 Georgia,serif}.vf-letter-signature img {display:block;width:30px;height:auto;flex:none}
.vf-letter-body {white-space:pre-wrap;overflow-wrap:anywhere;font:clamp(15px,1.3vw,19px)/1.6 Georgia,serif;color:#563514}
.vf-letters-empty {position:absolute;inset:28% 12% 10%;display:flex;justify-content:center;align-items:center;text-align:center;color:#6c5137;font:italic 18px/1.5 'Playfair Display',Georgia,serif}
.vf-letters-back {display:none;position:sticky;top:0;z-index:2;margin:0 0 12px;padding:8px 12px;border:1px solid #b98b52;border-radius:7px;background:#f5e2bd;color:#57300f;font:13px system-ui,sans-serif;cursor:pointer}
@media(max-width:1100px) {.vf-letters-sheet {--wood:url('/assets/correspondence/wood-tablet.webp');--tray:url('/assets/correspondence/tray-tablet.webp');--paper:url('/assets/correspondence/paper-tablet.webp');--unread:url('/assets/correspondence/card-unread-tablet.webp');--read:url('/assets/correspondence/card-read-tablet.webp')}.vf-letters-tray {aspect-ratio:446/744;max-width:420px}.vf-letters-pane {aspect-ratio:540/756;max-width:500px}.vf-letter-row {aspect-ratio:572/206}.vf-reader-copy {top:25%}}
@media(max-width:700px) {.vf-letters-sheet {--wood:url('/assets/correspondence/wood-phone.webp');--tray:url('/assets/correspondence/tray-phone.webp');--paper:url('/assets/correspondence/paper-phone.webp');--unread:url('/assets/correspondence/card-unread-phone.webp');--read:url('/assets/correspondence/card-read-phone.webp')}.vf-letters-tray {aspect-ratio:276/655;max-width:300px}.vf-letters-pane {aspect-ratio:347/663;max-width:420px}.vf-letter-row {aspect-ratio:430/177;margin-bottom:7px}.vf-letter-title,.vf-letter-date {left:13%;right:28%}.vf-letter-title {font-size:12px}.vf-letter-date {font-size:10px}.vf-reader-copy {left:12%;right:12%}.vf-letter-signature {padding-right:0}.vf-letters-heading h2 {font-size:clamp(13px,4vw,24px)}.vf-letters-count {font-size:7px;margin-top:3px;letter-spacing:.08em}}
@media(max-width:700px), (max-width:1100px) and (orientation:portrait), (max-width:1100px) and (max-height:500px) {dialog.vf-letters {width:100vw;height:100dvh;padding:calc(7px + env(safe-area-inset-top)) calc(7px + env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) calc(7px + env(safe-area-inset-left))}.vf-letters-sheet {padding:8px}.vf-letters-body {display:block;position:relative}.vf-letters-tray,.vf-letters-pane {margin:auto}dialog.vf-letters[data-view="list"] .vf-letters-pane,dialog.vf-letters[data-view="letter"] .vf-letters-tray {display:none}.vf-letters-back {display:inline-block}}

@media(max-width:700px) {
 .vf-letters-top {aspect-ratio:auto;height:calc(10vw + 48px);background-color:#1c2531;background-size:100% auto;background-position:center top;border-radius:6px}
 .vf-letters-heading {left:0;top:auto;bottom:3px;width:100%;height:45px;align-items:center}
 .vf-letters-heading h2 {font-size:22px}
 .vf-letters-count {position:static;transform:none;font-size:9px;margin:3px 0 0;letter-spacing:.12em}
 .vf-letters-close {top:2px;right:1%;height:calc(10vw - 4px);width:8%}
}

.vf-letters-pane[hidden] {display:none!important}
.vf-letters-tray .vf-letters-empty {inset:21% 10% 24%;color:#f6e4c4}
