/* The White Pavilion, the camera walk-through (23 Oct 2026; the Tunnel Book pattern): the stage (js/signature-white-pavilion-walk.js)
 * and the Pass skin (--wk-*, css/occasi-pass.css). Light: ivory silk, white roses, crystal, gilt; warm ink.
 *   .pww-art   the 1080 x 1920 picture: covers a phone, fits whole (contained) on a wide screen; --k = its width / 1080
 *   .pww-box   a text area at render px (from walk/text_areas.json), scaled by --k
 *   .pww-lyr   a prop on its own layer (the hero's sign, the drapes' tag): it swings by a pixel or two about its ribbon knot */
@font-face{font-family:'Great Vibes';src:url('../assets/fonts/great-vibes-latin.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Cormorant';src:url('../assets/fonts/cormorant-latin.woff2') format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:'EB Garamond';src:url('../assets/fonts/eb-garamond-latin.woff2') format('woff2');font-weight:400 800;font-display:swap}
@font-face{font-family:'EB Garamond';src:url('../assets/fonts/eb-garamond-italic-latin.woff2') format('woff2');font-style:italic;font-weight:400 800;font-display:swap}

html.pww-on, html.pww-on body { height: 100%; margin: 0; overflow: hidden; overscroll-behavior: none; }
body.pww-page { margin: 0; background: #ece6da; -webkit-text-size-adjust: 100%; }
.pww.wk-root {
  --wk-bg: #f8f4ec; --wk-paper: #fffdf8; --wk-ink: #2f2a23; --wk-soft: #6a5f50; --wk-gold: #a3854a; --wk-rule: rgba(163, 133, 74, .34);
  --wk-display: 'EB Garamond', Georgia, serif; --wk-text: 'EB Garamond', Georgia, serif; --wk-display-style: italic; --wk-r: 6px;
  --wk-btn: #2f2a23; --wk-onbtn: #fffaf0;
  --wk-shadow: 0 12px 30px -16px rgba(60, 50, 30, .4), inset 0 0 0 1px rgba(163, 133, 74, .34);
  --pww-ink: #2f2a23; --pww-gilt: #a3854a;
  position: fixed; inset: 0;
}
.pww.wk-root, .pww.wk-root *, .pww .wk-sheet * { font-variant-numeric: lining-nums !important; }
.pww [data-wk-film] { overflow: hidden; scroll-snap-type: none; }
.pww .wk-scene.pww-scene { padding: 0; display: block; }
.pww .wk-scene-join, .pww .wkd-panel, .pww .wk-progress { display: none !important; }

.pww-stage { position: absolute; inset: 0; overflow: hidden; container-type: size; background: radial-gradient(120% 80% at 50% 40%, #faf6ee, #e6ddcd); touch-action: none; }
.pww-art { position: absolute; left: 50%; top: calc(50% + var(--oy, 0px)); width: max(100cqw, 100cqh * 9 / 16); aspect-ratio: 9 / 16; transform: translate(-50%, -50%); --k: .4; }
/* the opening (owner rules, 24 Oct): edge to edge on every screen; no frame shadow, no place dots until the drapes have opened */
.pww-stage.is-cover .pww-art { box-shadow: none; }
.pww-stage.is-cover .pww-dots { display: none; }
/* v214 narrow phones: the art scales down to keep a stop's content on screen; the bands above and below are the plate's own edge colours */
.pww-band { position: absolute; left: 50%; top: 0; transform: translateX(-50%); z-index: 0; background-repeat: no-repeat; pointer-events: none; }
.pww-band.is-bottom { top: auto; bottom: 0; }
@container (min-aspect-ratio: 3 / 4) { .pww-art { width: min(100cqw, 100cqh * 9 / 16); box-shadow: 0 30px 80px -40px rgba(60, 50, 30, .45); } }
.pww-plate, .pww-plate2, .pww-film, .pww-confetti { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pww-plate { transition: opacity .28s ease; }
.pww-plate.is-x { opacity: .25; }
.pww-plate2 { opacity: 0; transition: opacity .32s ease; }
.pww-plate2.on { opacity: 1; }
.pww-plate2:not(.on) { transition-duration: .2s; }   /* v228: the story cards fade out before the film leaves the screen */
.pww-plate2.is-cut, .pww-plate2.is-cut:not(.on) { transition: none; }   /* 26 Oct: a film that carries the cards hands over to their plate in one frame */
.pww-film { opacity: 0; pointer-events: none; z-index: 5; }
.pww-film.on { opacity: 1; }
.pww-film.is-soft { transition: opacity .32s ease; }
.pww-confetti { pointer-events: none; z-index: 6; }
.pww-art .op-filmcanvas { z-index: 5; }

/* the props on their own layers (the classic page's pictures): they swing slowly about their ribbon knots (about 1 px at the words), never more */
.pww-hero, .pww-closed { position: absolute; inset: 0; z-index: 1; }
.pww-hero[hidden], .pww-closed[hidden] { display: none; }
.pww-lyr { position: absolute; left: calc(var(--k) * var(--lx) * 1px); top: calc(var(--k) * var(--ly) * 1px); width: calc(var(--k) * var(--lw) * 1px); height: calc(var(--k) * var(--lh) * 1px);
  transform-origin: calc(var(--k) * (var(--px) - var(--lx)) * 1px) calc(var(--k) * (var(--py) - var(--ly)) * 1px); animation: pww-swing 3.5s ease-in-out infinite alternate; }
.pww-lyr img { width: 100%; height: 100%; display: block; }
.pww-sign { animation-duration: 3.6s; }
.pww-taglyr { animation-duration: 3.2s; }
@keyframes pww-swing { from { transform: rotate(-.15deg); } to { transform: rotate(.15deg); } }   /* the words on it swing with it (.pww-swingbox) */
.pww-box.pww-swingbox { transform-origin: calc(var(--k) * var(--ox) * 1px) calc(var(--k) * var(--oy) * 1px); animation: pww-swing 3.5s ease-in-out infinite alternate; }   /* owner 2 Nov: the words on the sign / tag swing with it, about the same knot (js swingWords) */
@media (prefers-reduced-motion: reduce) { .pww-box.pww-swingbox { animation: none; } }   /* still, like its layer */
.pww-gls { position: absolute; inset: 0; pointer-events: none; }
.pww-gls i { position: absolute; left: calc(var(--k) * var(--x) * 1px); top: calc(var(--k) * var(--y) * 1px); width: calc(var(--k) * var(--s) * 1px); height: calc(var(--k) * var(--s) * 1px); transform: translate(-50%, -50%); opacity: 0;
  background: radial-gradient(closest-side, #fff 0, rgba(255, 255, 255, .7) 30%, transparent 70%); animation: pww-glint var(--d) ease-in-out var(--dl) infinite; }
.pww-gls i::before, .pww-gls i::after { content: ''; position: absolute; left: 50%; top: 50%; width: 260%; height: 6%; background: linear-gradient(90deg, transparent, #fff, transparent); transform: translate(-50%, -50%); }
.pww-gls i::after { transform: translate(-50%, -50%) rotate(90deg); }
@keyframes pww-glint { 0%, 70%, 100% { opacity: 0; } 82% { opacity: .85; } }
/* ALIVE AT REST (owner rule, 24 Oct): the waiting stop's own flowers and silk on breeze layers (a pixel or two, slow, seamless),
   its glints, the hero's lake shimmer and the drifting petals' canvas. All under the words (z 3); reduced motion = still. */
.pww-idle, .pww-drift { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
.pww-drift { z-index: 2; }
/* the next film is still arriving (a slow connection): a soft gilt pulse low on the stage until it is whole */
.pww-stage.is-wait::after { content: ''; position: absolute; z-index: 7; left: 50%; bottom: calc(28px + env(safe-area-inset-bottom, 0px)); width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: #a3854a; animation: pww-pulse 1.2s ease-in-out infinite; }
.pww-breeze { animation: pww-breeze var(--d, 6s) ease-in-out var(--dl, 0s) infinite alternate; }
@keyframes pww-breeze { from { transform: translate3d(calc(var(--k) * var(--amp, 1.6) * -1px), 0, 0) skewX(-.22deg); } to { transform: translate3d(calc(var(--k) * var(--amp, 1.6) * 1px), calc(var(--k) * .6px), 0) skewX(.22deg); } }
.pww-shim { position: absolute; overflow: hidden; left: calc(var(--k) * var(--lx) * 1px); top: calc(var(--k) * var(--ly) * 1px); width: calc(var(--k) * var(--lw) * 1px); height: calc(var(--k) * var(--lh) * 1px);
  -webkit-mask: var(--m) 0 0 / 100% 100% no-repeat; mask: var(--m) 0 0 / 100% 100% no-repeat; mix-blend-mode: screen; opacity: .55; }
.pww-shim { display: none; }   /* v254b (26 Oct): hidden again. Its mask never loaded before v250, so it was never seen; once it loaded, its stripes read as a grid over the lake. Back when a real water shimmer is made. */
.pww-shim i { position: absolute; top: 0; bottom: 0; left: 0; width: 200%; animation: pww-shim 7s linear infinite;
  background: repeating-linear-gradient(97deg, transparent 0, transparent calc(var(--k) * 22px), rgba(255, 246, 222, .75) calc(var(--k) * 24px), transparent calc(var(--k) * 27px), transparent calc(var(--k) * 54px)); }
@keyframes pww-shim { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(calc(var(--k) * -108px), 0, 0); } }

/* the in-scene open: the bow is the button (no box); a soft hint under it */
.pww-bow { position: absolute; z-index: 7; left: calc(var(--k) * 330px); top: calc(var(--k) * 520px); width: calc(var(--k) * 420px); height: calc(var(--k) * 470px); border: 0; border-radius: 40%; background: transparent; cursor: pointer; }
.pww-bow span { position: absolute; left: 50%; top: calc(100% + 6px); transform: translateX(-50%); white-space: nowrap; padding: 6px 13px; border-radius: 99px; background: rgba(255, 252, 245, .92); color: var(--pww-ink); font: italic 500 15px 'EB Garamond', serif; box-shadow: 0 6px 18px -10px rgba(60, 50, 30, .5); animation: pww-breathe 2.5s ease-in-out infinite; }
.pww-bow::before { content: ''; position: absolute; left: 50%; top: 18%; width: 46%; height: 30%; transform: translateX(-50%); border-radius: 50%; box-shadow: 0 0 calc(var(--k) * 60px) calc(var(--k) * 18px) rgba(255, 248, 225, .55); opacity: 0; animation: pww-pulse 2.5s ease-in-out infinite; pointer-events: none; }
.pww-seatbow { left: calc(var(--k) * 380px); top: calc(var(--k) * 780px); width: calc(var(--k) * 360px); height: calc(var(--k) * 360px); }
.pww-seatbow span { top: auto; bottom: calc(100% + 6px); }   /* the hint above the bow: the tag with the guest's names hangs below it */
.pww-bow[hidden] { display: none; }
/* v264 (fix #1, owner 27 Oct; buyer panels 2 and 3: older guests could not find "Tap the bow", and the reply was ~27 s
   away). The controls are satin ribbons in the drapes' own language: ivory satin, the gilt piping of the band across the
   drapes along both edges, notched ends, dark ink (12:1 or more on the satin). No panel, no glow. Real page text, so it
   follows the phone's text size; sized by the picture (--k) within a floor and a ceiling so it never outgrows the bow. */
.pww-ribbon, .pww-bow:not(.pww-seatbow) span { isolation: isolate; filter: drop-shadow(0 3px 5px rgba(60, 50, 30, .3)); color: #2a2219; }
.pww-ribbon::before, .pww-bow:not(.pww-seatbow) span::before { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, #a3854a 0 1.5px, #fffcf4 1.5px 3px, #f6efe0 3px, #fffdf8 46%, #efe5d1 calc(100% - 3px), #fffcf4 calc(100% - 3px) calc(100% - 1.5px), #a3854a calc(100% - 1.5px)); }
.pww-bow:not(.pww-seatbow) span { top: calc(100% + var(--k) * 24px); padding: 9px 24px 10px; border-radius: 0; background: none; box-shadow: none; animation: none;
  font: italic 600 clamp(16px, calc(var(--k) * 42px), 20px) / 1.05 'EB Garamond', Georgia, serif; letter-spacing: .01em; }
.pww-bow:not(.pww-seatbow) span::before { clip-path: polygon(0 0, 100% 0, calc(100% - 11px) 50%, 100% 100%, 0 100%, 11px 50%); }
/* Skip (top right, while the opening waits or plays) and Reply (top right under the place dots, from the hero on: no stop
   has words there; low on the right the runner's lines reach it at 360 px in a long language): a ribbon pinned to the
   picture's right edge (the screen's on a phone), its free end notched; 44 px tall */
.pww-ribbon { position: absolute; z-index: 8; right: 0; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; box-sizing: border-box; margin: 0;
  padding: 0 calc(16px + env(safe-area-inset-right, 0px)) 1px 24px; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
  font: italic 600 17px / 1 'EB Garamond', Georgia, serif; letter-spacing: .01em; white-space: nowrap; }
.pww-ribbon::before { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 13px 50%); }
.pww-ribbon[hidden] { display: none; }
.pww-ribbon:focus-visible, .pww-bow:focus-visible span { outline: 2px solid #634a1f; outline-offset: 3px; }
.pww-skip { top: calc(14px + env(safe-area-inset-top, 0px)); font-size: 16px; }
.pww-replytag { top: calc(42px + env(safe-area-inset-top, 0px)); right: max(0px, calc(50cqw - 100cqh * 9 / 32)); font-size: 18px; }
.pww-sprig { width: 22px; height: 22px; flex: none; margin-top: -2px; }
/* the cross-dissolve's copy of the picture that was on screen (Skip before the tap, the Reply ribbon's jump) */
.pww-xfade { position: absolute; z-index: 6; overflow: hidden; pointer-events: none; transition: opacity .36s ease; }
.pww-xfade.is-off { opacity: 0; }
@keyframes pww-pulse { 0%, 100% { opacity: 0; } 45% { opacity: 1; } }
@keyframes pww-breathe { 0%, 100% { opacity: .82; } 50% { opacity: 1; } }

/* the words on the plate */
.pww-words { position: absolute; inset: 0; z-index: 3; transition: opacity .18s ease; -webkit-user-select: none; user-select: none; }
.pww-words :is(input, textarea, select, [contenteditable]) { -webkit-user-select: text; user-select: text; }   /* v285 (lead, 2 Nov): a drag never highlights the printed words; the reply's fields stay editable */
.pww-words.is-off { opacity: 0; pointer-events: none; transition-duration: .12s; }
.pww-words.is-cut, .pww-words.is-cut.is-off { transition: none; }   /* v228: the hand-over to and from a film's printed words, in one frame */
.pww-box { position: absolute; display: grid; place-items: center; text-align: center; color: var(--pww-ink); }
.pww-box.is-rot { transform-origin: 0 0; }
.pww-box.pww-hero { right: auto; bottom: auto; }   /* r20 (Urdu): the names box also carries .pww-hero (inset: 0); right-to-left, an over-set box keeps right and drops left */
.pww-in { width: 100%; max-height: 100%; overflow: hidden; }   /* v214: the words fit inside the box; still over at the floor = is-full */
.pww-box.is-full, .pww-box.is-full .pww-in { overflow: visible; max-height: none; }   /* never clipped */
.pww-box p { margin: 0; }
.pww-names { font: 400 max(15px, calc(var(--f, 1) * var(--k) * 58px)) / 1.05 'Great Vibes', cursive; }   /* two script lines a name at the floor (long double-barrelled names) */
.pww-names i { font: italic 500 max(10px, .5em) 'EB Garamond', serif; color: var(--pww-gilt); }   /* v285.1: every glyph 10 px or more, the ampersand too */
/* v285.1 (caps: first names to 15): names the script cannot hold whole at its floor are set in Cormorant (the narrowest of the three faces),
   down to 10 px (js shrink: is-long); a real name stays in the script */
.pww-box.is-long .pww-names, .pww-box.is-long .pww-tname { font-family: 'Cormorant', serif; font-style: normal; font-weight: 600; line-height: 1.12; letter-spacing: 0; }
.pww-date { margin-top: .3em !important; font: 700 max(10px, calc(var(--f, 1) * var(--k) * 22px)) / 1.2 'Cormorant', serif; letter-spacing: .16em; text-transform: uppercase; }
/* B6 (owner 26 Oct): the families lines are printed on the aisle runner in a dark ink: no panel, no glow, no outline. The layer
   is the 1080 x 1920 picture scaled by --k; each line's box (its own px, 10 per cm of runner) is laid on the runner by a
   perspective transform; its mask leaves the ivy over the runner on top of the ink. Sizes from the text-first stacking at the
   floors x 1.16 (walk/text_areas.json hero.runner: the floors are counted on screen through data-scr). */
.pww-runner { position: absolute; left: 0; top: 0; width: 1080px; height: 1920px; transform: scale(var(--k)); transform-origin: 0 0; pointer-events: none; }
.pww-rbox { left: 0; top: 0; transform-origin: 0 0; color: #33291d; -webkit-mask-image: var(--m); mask-image: var(--m); -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.pww-rbox .pww-in { text-wrap: balance; overflow: visible; max-height: none; }   /* never clipped; the fit counts against the box */
.pww-rkick { font: 700 calc(var(--f, 1) * 88.7px) / 1.25 'Cormorant', serif; letter-spacing: .1em; text-transform: uppercase; }
.pww-rline { font: italic 500 calc(var(--f, 1) * 79.7px) / 1.2 'EB Garamond', serif; }
.pww-rvenue { font: 600 calc(var(--f, 1) * 68px) / 1.2 'Cormorant', serif; letter-spacing: .08em; }
.pww-rbox.is-tight .pww-rvenue { line-height: 1; letter-spacing: .02em; }   /* v285.1 (venue to 40): a third line on the runner, closer set, at its floor */
.pww-kick { font: 700 max(10px, calc(var(--f, 1) * var(--k) * 19px)) / 1.25 'Cormorant', serif; letter-spacing: .2em; text-transform: uppercase; color: #634a1f; }   /* small gold: 4.5:1 or more on the shaded cards (23 Oct) */
.pww-tname { font: 400 max(20px, calc(var(--f, 1) * var(--k) * 56px)) / 1.05 'Great Vibes', cursive; margin-top: .1em !important; }
.pww-tfrom { font: italic 500 max(11px, calc(var(--f, 1) * var(--k) * 30px)) / 1.15 'EB Garamond', serif; color: #4f4536; margin-top: .3em !important; }   /* v264: the sender, under the guest's names */
.pww-tsm { font: italic 500 max(11px, calc(var(--f, 1) * var(--k) * 30px)) / 1.1 'EB Garamond', serif; }
.pww-evname { font: italic 500 max(13px, calc(var(--f, 1) * var(--k) * 40px)) / 1.1 'EB Garamond', serif; }
.pww-evline { font: 600 max(10px, calc(var(--f, 1) * var(--k) * 24px)) / 1.3 'Cormorant', serif; letter-spacing: .06em; color: #4f4536; }
.pww-styear { font: 400 max(16px, calc(var(--f, 1) * var(--k) * 44px)) / 1 'Great Vibes', cursive; color: #634a1f; }   /* darker than the gilt: the left panel stands in shade */
.pww-stkick { font: 700 max(10px, calc(var(--f, 1) * var(--k) * 19px)) / 1.2 'Cormorant', serif; letter-spacing: .16em; color: #634a1f; }   /* the year, on its own line over the title */
.pww-sthead { font: 700 max(10.5px, calc(var(--f, 1) * var(--k) * 24px)) / 1.2 'Cormorant', serif; letter-spacing: .02em; color: #5a4529; }   /* sentence case: a real title fits (23 Oct limits) */
.pww-sttext { font: italic 400 max(10px, calc(var(--f, 1) * var(--k) * 26px)) / 1.25 'EB Garamond', serif; margin-top: .25em !important; }
.pww-sttitle { font: 400 max(20px, calc(var(--f, 1) * var(--k) * 60px)) / 1 'Great Vibes', cursive; }

.pww-written .pww-sttext + .pww-sthead { margin-top: .8em !important; }
.pww-photo { position: absolute; object-fit: cover; display: block; z-index: 2; }
.pww-noph .pww-styear { font-size: max(22px, calc(var(--f, 1) * var(--k) * 70px)); }
.pww-pp { container-type: size; }
.pww-ppname { text-wrap: balance; font: italic 500 max(10.5px, calc(var(--f, 1) * max(calc(var(--k) * 30px), min(13cqw, 30cqh)))) / 1.05 'EB Garamond', serif; }
.pww-pprole { font: 700 max(10px, calc(var(--f, 1) * max(calc(var(--k) * 17px), min(7cqw, 15cqh)))) / 1.15 'Cormorant', serif; letter-spacing: .06em; text-wrap: balance; text-transform: uppercase; color: #584834; margin-top: .15em !important; }   /* the medallion narrows below its middle */
.pww-pp.is-high { place-items: start center; }   /* v285.1: long words rise to just under the monogram, where the oval face is widest (js shrink) */
.pww-pp.is-tight .pww-ppname { line-height: 1; }   /* v285.1 (person 30, role 24): a medallion still over at its floors closes its lines up */
.pww-pp.is-tight .pww-pprole { line-height: 1.05; letter-spacing: 0; margin-top: .1em !important; }
.pww-ppwin { position: absolute; z-index: 2; border-radius: 50%; overflow: hidden; }
.pww-ppwin img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pww-ppinit b { display: block; text-align: center; font: 400 max(11px, calc(var(--f, 1) * var(--k) * 36px)) / 1.35 'Great Vibes', cursive; color: var(--pww-gilt); }   /* a monogram on the wax seal */
.pww-ppinit .pww-in { overflow: visible; }   /* the script's swashes may pass the seal's text box by a pixel or two; the seal is wider */
.pww-more button { width: 100%; height: 100%; border: 0; border-radius: 50%; background: transparent; color: var(--pww-ink); font: italic 600 calc(var(--k) * 30px) / 1 'EB Garamond', serif; cursor: pointer; }
.pww-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pww-list li { display: flex; align-items: center; gap: 10px; }
.pww-list img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
/* v283 (sense check #12): a celebration card on the walk opens its event; so does a row of "Every celebration" */
.pww-box[data-pww-event], .pww-box[data-pww-lift] { cursor: pointer; border-radius: calc(var(--k) * 14px); }
.pww-box[data-pww-lift]:focus-visible { outline: 2px solid var(--wk-btn, #6e5b3a); outline-offset: 3px; }
/* v285 (audit S2): a card or medallion whose words end in "…" lifts toward the guest with every word on it (js lift()) */
.pww-lift { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; background: rgba(38, 31, 20, 0); transition: background-color .24s ease; cursor: pointer; outline: none; }
.pww-lift.is-up { background: rgba(38, 31, 20, .42); }
.pww-liftcard { position: relative; background-repeat: no-repeat; border-radius: 10px; box-shadow: 0 18px 40px rgba(20, 14, 6, .35); transition: transform .24s cubic-bezier(.2, .7, .2, 1); }@media (prefers-reduced-motion: reduce) { .pww-lift, .pww-liftcard { transition: none; } }
.pww-liftcard.is-oval { border-radius: 50%; }   /* a medallion lifts as its own oval */
.pww-box[data-pww-event]:focus-visible { outline: 2px solid var(--wk-btn, #6e5b3a); outline-offset: 3px; }
.pww-evhalf { cursor: pointer; border-radius: 4px; }   /* v285: past eight events a pane holds two, each its own tap */
.pww-evhalf + .pww-evhalf { margin-top: .3em; padding-top: .25em; border-top: 1px solid rgba(99, 74, 31, .35); }
.pww-ev2 .pww-evname, .pww-ev2 .pww-evline { line-height: 1.12; }   /* v285 (tester S2): two events share a pane: nothing under the gold rail at 360 */
.pww-ev.is-tight .pww-evname, .pww-ev.is-tight .pww-evline { line-height: 1.12; }   /* v285 (lead 2 Nov): a pane of its own still over at the floors closes its lines up as two events do, so nothing spills */
.pww-ev.is-tight .pww-evline { letter-spacing: 0; }   /* v285.1 (caps): a pane still over at its floors sets the place without tracking */
.pww-ev2 .pww-evline { letter-spacing: .02em; }   /* narrower, so the lowest panes' lines stay clear of the bouquets in front */
.pww-evhalf:focus-visible { outline: 2px solid var(--wk-btn, #6e5b3a); outline-offset: 2px; }
.pww-evrow { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 8px; width: 100%; min-height: 44px; padding: 8px 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.pww-evrow span { margin-left: auto; opacity: .6; }
.pww-chapter img { width: 100%; border-radius: 4px; }
.pww-chapter h3 { margin: .6em 0 .2em; font: italic 500 18px 'EB Garamond', serif; }

/* the reply on the sign: the live form (E3), readable on a phone */
.pww-reply { position: absolute; transform: translate(-50%, -50%); overflow: hidden; overscroll-behavior: contain; z-index: 4; box-sizing: border-box;
  padding: calc(var(--k) * 34px) calc(var(--k) * 30px); text-align: center; display: flex; flex-direction: column; container-type: inline-size; }   /* on the sign's face: no card of its own */
.pww-reply > * { zoom: var(--rz, 1); }
.pww-reply > [data-pww-join], .pww-reply > [data-pww-change]:not([hidden]) { margin-block: auto; }   /* centred on the face; a tall reply grows down, never cut at the top */
.pww-reply .wk-card { background: none; box-shadow: none; padding: 0; max-width: none; border-radius: 0; }   /* the words are printed on the sign itself: no card of the engine's own */
/* v250 (owner 26 Oct): the email box fits the sign's face: "Your name" is said by the box itself (kept for screen readers,
   as the email box), and "Send me my Pass" is printed on the chair cover under the tag (.pww-sendpass), not on the sign */
.pww-reply .wk-namefield .wk-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pww-reply .wk-sendpass { display: none; }
.pww-reply .wk-findform .wk-sendpass:not([hidden]) { display: block; }   /* v252 (B7): after "already replied" in the find box */
.pww-reply .wk-field input { padding-inline: 7px; text-overflow: ellipsis; }   /* the whole placeholder on a 360 px phone; longer languages end in "…" */
.pww-sendpass .wk-sendpass { margin: 0; min-height: 44px; padding: 0 10px; font: italic 500 max(13px, calc(var(--k) * 34px)) / 1.2 'EB Garamond', serif; color: #634a1f; }
.pww-reply.is-s1 .wk-yes { min-height: 46px; margin-top: 8px; }
.pww-reply.is-s1 .wk-jrow.is-compact { min-height: 28px; padding: 1px 2px; }
.pww-reply.is-s1 .wk-h1 { margin-top: 2px; }
.pww-reply.is-s1 .wk-made { margin-top: 2px; }
.pww-reply.is-s2 [data-pww-join] .wk-jlist { display: none; }
.pww-reply.is-full { overflow-y: auto; }   /* only if the floors cannot be kept otherwise (the gate reports it) */
.pww-reply [data-pww-change]:not([hidden]) ~ [data-pww-join] { display: none; }
.pww-back { display: none; margin: 14px auto 0; min-height: 44px; padding: 0 16px; border: 0; background: none; color: var(--pww-ink); font: italic 500 15px 'EB Garamond', serif; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pww-reply [data-pww-change]:not([hidden]) + .pww-back { display: block; }
/* v285.2 (lead 3 Nov): a sheet that brings its own Back (the "can't make it" one) hides the walk's, so there is one Back */
.pww-reply [data-pww-change]:not([hidden]):has([data-wk-close]) + .pww-back { display: none; }
.pww-reply [data-pww-change]:has([data-wk-gprev]) + .pww-back { display: none; }   /* tester u17: one Back at a time (the card's own, past its first side) */
/* v285 (#2, B2/B29): very large text. A sign that has to scroll shows "More below" on its foot until the end is in view, and
   the meal's "Change" goes under its words, so it is never cut off at the sign's edge */
.pww-down { display: none; }
.pww-reply.is-full .pww-down { display: block; position: sticky; bottom: 0; flex: none; align-self: center; margin: 6px auto 0; min-height: 40px; padding: 0 16px; border: 1px solid var(--wk-rule); border-radius: 99px; background: rgba(255, 252, 245, .97); color: var(--pww-ink); font: italic 500 15px 'EB Garamond', serif; cursor: pointer; }
.pww-reply.is-full.is-end .pww-down { visibility: hidden; }
.pww-reply.is-full .wk-meal.is-narrow { grid-template-columns: minmax(0, 1fr); }
.pww-reply.is-full .wk-meal.is-narrow > .wk-link { justify-self: start; }
.pww-reply .wk-join { padding: 0; }
/* v262 (study #3 row 6): the sign reads easily on a phone: small capitals 13 px, links and body 14 px. It stays one shot
   by tightening the spacing (is-s2), not the type; only a long language on a 360 px phone then scales a few per cent,
   never under 12 px (fitReply). "(optional)" is left off the extras link: the pencil and "Add" say it. */
.pww-reply .wk-kicker, .pww-reply.is-s2 .wk-kicker { font-size: 13px; letter-spacing: .16em; }
.pww-reply .wk-h1 { font-size: 28px; margin-top: 2px; }
.pww-reply .wk-sub { margin-top: 4px; line-height: 1.35; }
.pww-reply .wk-btn { font-size: 13px; }
/* tester u17 (S4): every tap on the sign is 44 px at every step; the room comes from the spacing, then (is-s3) from moving
   the meal and dietary lines to the reply card that "We'll be there" opens (data-wk-cardyes), never from the targets */
.pww-reply .wk-joinlinks .wk-link { font-size: 14px; padding-block: 6px; min-height: 44px; }
.pww-reply .wk-extras { font-size: 14px; margin-top: 0; min-height: 44px; padding-block: 4px; }
.pww-reply .wk-extras > i { display: none; }
.pww-reply .wk-privlink, .pww-reply.is-s2 .wk-privlink { font-size: 14px; min-height: 44px; padding-block: 4px; }
.pww-reply .wk-meal .wk-link, .pww-reply .wk-dchip, .pww-reply .wk-dietq { min-height: 44px; }
.pww-reply .wk-made { font-size: 13px; margin-top: 4px; opacity: 1; }
.pww-reply.is-s2 .wk-kicker { letter-spacing: .06em; }
.pww-reply.is-s2 .wk-h1 { font-size: 24px; }
.pww-reply.is-s2 .wk-field input { min-height: 44px; padding-block: 6px; }
.pww-reply.is-s2 .wk-joinlinks { row-gap: 0; flex-wrap: wrap; }
.pww-reply.is-s2 .wk-joinlinks .wk-link, .pww-reply.is-s2 .wk-extras { padding-block: 2px; line-height: 1.1; }
.pww-reply.is-s2 .wk-privlink { padding-block: 2px; }
.pww-reply.is-s2 .wk-made { margin-top: 0; }
.pww-reply.is-s3 :is(.wk-meal, .wk-diet, .wk-guidehint) { display: none; }
.pww-reply.is-s3 .wk-yes { margin-top: 4px; }

/* owner (theme rule, tester u17): off the sign (a household the sign is too small for), the reply card is a second
   White Pavilion sign: ivory card in the sign's brass frame, a brass knob at each corner, the sign's gilt line inside */
.pww .wk-sheet.is-card.pww-signcard .wk-sheetin { left: 16px; right: 16px; border: 7px solid transparent; border-radius: 3px;
  background: linear-gradient(var(--wk-paper), var(--wk-paper)) padding-box, linear-gradient(135deg, #7e602c, #e6cf96 20%, #9f7b3c 42%, #f2e2b2 60%, #8f6d31 80%, #d6b878) border-box;
  box-shadow: 0 24px 46px -20px rgba(47, 42, 35, .6), 0 2px 4px rgba(47, 42, 35, .18); }
.pww .wk-sheet.is-card.pww-signcard .wk-sheetin::before { content: ''; position: absolute; inset: 7px; border: 1px solid rgba(163, 133, 74, .6); pointer-events: none; }
.pww .wk-sheet.is-card.pww-signcard .wk-sheetin::after { content: ''; position: absolute; inset: -16px; pointer-events: none;
  background: var(--pww-knob) left top / 22px 22px no-repeat, var(--pww-knob) right top / 22px 22px no-repeat, var(--pww-knob) left bottom / 22px 22px no-repeat, var(--pww-knob) right bottom / 22px 22px no-repeat;
  --pww-knob: radial-gradient(circle at 38% 34%, #fff6d8 0 1.5px, #e3c682 3.5px, #a8853f 7px, #6e5224 10px, transparent 10.5px); }
.pww .wk-sheet.is-card.pww-signcard .wk-sheetbody { padding: 44px 20px 16px; }
.pww .wk-sheet.is-card.pww-signcard .wk-sheetbar { top: 9px; right: 9px; left: 9px; }
.pww .wk-sheet.is-card.pww-signcard .wk-sheetbar .wk-iconbtn { background: transparent; }
/* v285.2 (owner 3 Nov): page 2 turned IN PLACE. "‹ 1 / 2 ›" is printed on the object where page 2's tag was (the step's
   right, like a page number; the foot of the lower right pane on cel3 and cel4; the little ivory place card on the cake for
   the wedding party), in the object's own ink and type. Each arrow is a native button with a 44 px tap (the glyph smaller);
   the arrow with no page left is dimmed (lighter and fainter, not colour alone) and stays in place */
.pww-pgctl { position: absolute; display: flex; align-items: center; justify-content: center; }
.pww-pgin { display: flex; align-items: center; justify-content: center; color: var(--pww-ink); }
.pww-pglab { min-width: 2.6em; text-align: center; white-space: nowrap; font: italic 500 max(12px, calc(var(--k) * 34px)) / 1 'EB Garamond', serif; font-variant-numeric: lining-nums; }
.pww-pgbtn { all: unset; box-sizing: border-box; display: grid; place-items: center; min-width: 44px; min-height: 44px; cursor: pointer; color: var(--pww-ink); font: 500 max(18px, calc(var(--k) * 52px)) / 1 'EB Garamond', serif; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.pww-pgbtn[aria-disabled="true"] { color: rgba(47, 42, 35, .3); font-weight: 400; cursor: default; }
.pww-pgbtn:focus-visible { outline: 2px solid #4f4536; outline-offset: -6px; border-radius: 10px; }
.pww-pgcard .pww-pgin { height: max(30px, calc(var(--k) * 76px)); padding: 0 4px; border: 1px solid var(--pww-gilt); border-radius: 2px; background: #fbf7ee; box-shadow: 0 1px 2px rgba(47, 42, 35, .25); }
.pww-ev.pww-evpg { box-sizing: border-box; padding-bottom: calc(var(--k) * 66px); }   /* cel3, cel4: the pane's words keep above the control at its foot */
.pww-xfade.pww-turn { transition: opacity .26s cubic-bezier(.4, 0, .2, 1); }   /* the page turning, in place: its words leave first (.16 s, js turnWords), then the page on screen fades over the other */
.pww-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pww-reveal { position: absolute; inset: 0; z-index: 6; pointer-events: none; opacity: 0; }
.pww-reveal.on { opacity: 1; }
.pww-signprev .pww-in { display: grid; gap: .35em; justify-items: center; }
.pww-ckick { font: 700 max(10px, calc(var(--f, 1) * var(--k) * 21px)) / 1.2 'Cormorant', serif; letter-spacing: .22em; text-transform: uppercase; color: #634a1f; }
.pww-ctitle { font: italic 500 max(18px, calc(var(--f, 1) * var(--k) * 56px)) / 1.05 'EB Garamond', serif; }
.pww-cfor { font: italic 400 max(11px, calc(var(--f, 1) * var(--k) * 28px)) / 1.2 'EB Garamond', serif; }
.pww-clist { list-style: none; margin: .3em 0 0; padding: 0; display: grid; gap: .25em; font: 500 max(10px, calc(var(--f, 1) * var(--k) * 25px)) / 1.2 'EB Garamond', serif; }
.pww-clist span { color: #634a1f; font-size: .85em; }
.pww-passcard .pww-in, .pww-thanks .pww-in { display: grid; gap: .45em; justify-items: center; }
.pww-open { margin-top: .4em; min-height: 44px; padding: 4px 16px; max-width: 100%; line-height: 1.15; text-wrap: balance;   /* v285: "Open your wedding guide" wraps evenly on a narrow card */
   border: 0; border-radius: 99px; background: var(--wk-btn); color: var(--wk-onbtn); font: italic 500 16px 'EB Garamond', serif; cursor: pointer; }
.pww-thanks { background: rgba(255, 253, 248, .94); border-radius: 4px; }

/* the way through: the dots, "Next" for a fifth event and more, "More of our story", the first hint */
.pww-dots { position: absolute; z-index: 7; left: 50%; top: calc(6px + env(safe-area-inset-top, 0px)); transform: translateX(-50%); display: flex; gap: 0; padding: 0 2px; border-radius: 99px; background: rgba(255, 252, 245, .55); }
.pww-dots button { width: 44px; height: 44px; margin-block: -10px; border: 0; padding: 0; background: transparent; cursor: pointer; display: grid; place-items: center; }   /* tester u17 (S4): 44 px to tap, the pill as slim as before */
.pww-dots button::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: rgba(47, 42, 35, .28); box-shadow: 0 0 0 1px rgba(255, 255, 255, .7); }
.pww-dots button[aria-current]::before { background: var(--pww-ink); }
.pww-dots button[hidden] { display: none; }
.pww-stage.is-pass .pww-dots { display: none; }
.pww-next { position: absolute; z-index: 7; left: 50%; top: calc(var(--k) * 1660px); transform: translateX(-50%); min-height: 44px; padding: 0 20px; border: 0; border-radius: 99px; background: rgba(255, 252, 245, .94); color: var(--pww-ink); font: italic 500 16px 'EB Garamond', serif; box-shadow: 0 6px 18px -10px rgba(60, 50, 30, .5); cursor: pointer; white-space: nowrap; }
.pww-next[hidden] { display: none; }
.pww-hint { position: absolute; z-index: 7; left: 0; right: 0; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); margin: 0; text-align: center; font: italic 500 15px 'EB Garamond', serif; color: var(--pww-ink); text-shadow: 0 1px 8px #fff; pointer-events: none; }
.pww-hint[hidden] { display: none; }
.pww-error { padding: 2rem; font-family: serif; }
.pww-words.pww-measure { opacity: 0; pointer-events: none; z-index: -1; }
.pww-words.pww-measure button { visibility: hidden; }
.pww-words.pww-measure.is-print .pww-pgctl button { visibility: visible; }   /* v285.2: the page control is printed into the films */
/* save the date */
.pww-std { position: relative; height: 100%; padding: 0; overflow: hidden; }
.pww-stdart { position: absolute; }
.pww-stdband { position: absolute; z-index: 8; left: 0; right: 0; bottom: 0; padding: 18px 16px calc(18px + env(safe-area-inset-bottom, 0px)); text-align: center; background: linear-gradient(transparent, rgba(255, 252, 245, .95) 30%); }
.pww-stdbtns { display: flex; gap: 8px; justify-content: center; margin-top: 10px; }
/* on a computer the engine frames its film beside a side panel; the walk-through takes the whole window instead */
.pww.wk-root .wk-app[data-view="film"] { top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border-radius: 0; box-shadow: none; }
.pww.wk-root .wk-app[data-view="film"] .wk-scene > .pww-stage { max-width: none; }
@media (prefers-reduced-motion: reduce) { .pww-plate, .pww-plate2, .pww-words, .pww-xfade { transition-duration: .01s; } .pww-lyr, .pww-gls i, .pww-shim i, .pww-bow span, .pww-bow::before { animation: none; } .pww-gls, .pww-shim, .pww-drift { display: none; } }
/* v245 (owner, as v242/v244 on the classic page): on the sign, "Yes to everything" / "No to everything" are buttons, 16 px,
   at least 44 px tall, side by side, not small italic links */
.pww-reply .wk-quick { gap: 8px; margin: 8px 0 4px; }
.pww-reply .wk-quick > span[aria-hidden] { display: none; }
.pww-reply .wk-quick .wk-link { display: inline-flex; align-items: center; justify-content: center; flex: 1 1 0; min-height: 44px; padding: 0 12px;
  border: 1px solid var(--wp-gold, #a3854a); border-radius: 999px; background: rgba(255, 253, 248, .92); color: var(--wp-ink, #2b2a33);
  font: 500 16px / 1.15 var(--wk-text); font-style: normal; text-decoration: none; text-align: center; }
.pww-reply .wk-quick .wk-link:focus-visible { outline: 3px solid var(--wp-gold, #a3854a); outline-offset: 2px; }

/* v280 (owner 28 Oct): the guest's reply printed on the tall acrylic sign under the arch, like a wedding welcome sign: the
   names in the script, the celebrations they said yes to in the serif, the meal. Ink on the glass (a touch translucent, so
   the glass shows through), a gilt rule, no card, no glow; it prints in once the guest card has risen and then stays still
   while the confetti and the flowers move. Fitted by steps (fitGlass): one line a celebration, then day and time over the name, smaller, then two columns. */
.pww-glass { color: rgba(47, 38, 26, .94); animation: pww-print .9s ease-out .25s both; }
.pww-glass.is-filmed { animation: none; }   /* v285: T5b printed these words on the glass all the way in */
.pww-glass .pww-in { text-wrap: balance; }
.pww-gnames { font: 400 max(18px, calc(var(--f, 1) * var(--k) * 78px)) / 1.05 'Great Vibes', cursive; }
.pww-gnames::after, .pww-gmealk::before { content: ''; display: block; width: 32%; margin: .45em auto .5em; border-top: 1px solid rgba(163, 133, 74, .8); }   /* a gilt rule printed on the glass */
.pww-gnames::after { width: 26%; margin: .14em auto .2em; }   /* (in the names' em) */
.pww-gitem:not(:last-child) { padding-bottom: .32em; }
.pww-gev { font: 600 max(12px, calc(var(--f, 1) * var(--k) * 35px)) / 1.22 'Cormorant', serif; letter-spacing: .02em; }
.pww-gname { font: italic 500 1.06em / 1.15 'EB Garamond', serif; letter-spacing: 0; }
.pww-gdish, .pww-gmeal { font: italic 500 max(12px, calc(var(--f, 1) * var(--k) * 33px)) / 1.2 'EB Garamond', serif; color: rgba(79, 69, 54, .96); }
.pww-gkick { font: 700 max(12px, calc(var(--f, 1) * var(--k) * 20px)) / 1.25 'Cormorant', serif; letter-spacing: .2em; text-transform: uppercase; color: #634a1f; }
.pww-gmealk { margin-top: .9em !important; }
.pww-gmealk + .pww-gmeal { margin-top: .15em !important; }
.pww-gline { font: italic 500 max(14px, calc(var(--f, 1) * var(--k) * 38px)) / 1.2 'EB Garamond', serif; margin-top: .3em !important; }
.pww-gwhen { white-space: nowrap; }
.pww-gwd { display: none; }
/* when a celebration does not fit one line: its day and time over its name */
.pww-glass.is-stack .pww-gwhen { display: block; }
.pww-glass.is-stack .pww-gsep { display: none; }
/* two columns; a weekend within a week says the weekday alone ("Fri · 7 pm") */
.pww-glass.is-2col .pww-gevs { columns: 2; column-gap: .8em; }   /* flowing columns: down the first, then the second */
.pww-glass.is-2col .pww-gitem { break-inside: avoid; padding-bottom: .3em; }
.pww-glass.is-2col .pww-gev, .pww-glass.is-2col .pww-gdish { line-height: 1.1; }
.pww-glass.is-2col .pww-gname { font: italic 600 1em / 1.1 'Cormorant', serif; }   /* the narrower italic in a column */
.pww-glass.is-2col .pww-gnames { line-height: .98; }
.pww-glass.is-2col .pww-gitem { padding-bottom: .24em; }
.pww-glass.is-2col.is-week .pww-gfull { display: none; }
.pww-glass.is-2col.is-week .pww-gwd { display: inline; }
@keyframes pww-print { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pww-glass { animation: none; } }

/* v280 (retest R2): a long dish name never widens a row past the sign: the columns may shrink, the picker takes the row's width */
.pww-reply .wk-crow > * { min-width: 0; }
.pww-reply .wk-mealpick { min-width: 0; }
.pww-reply .wk-mealpick select { min-width: 0; width: 100%; }

/* v280 (round 2, R2): on a phone the sign is narrow (250 px at 360): the event's name had a sliver beside Yes/No
   ("Mehn/di") and "No to everything" ran off the sign. On a narrow sign each name has its own line, Yes/No below it. */
@container (max-width: 340px) {
  .pww-reply .wk-crow { grid-template-columns: 4px 1fr; }
  .pww-reply .wk-crow > .wk-bar { grid-row: span 3; }
  .pww-reply .wk-crow > .wk-yn, .pww-reply .wk-crow > .wk-diff { grid-column: 2; justify-self: start; }
  .pww-reply .wk-cname { overflow-wrap: normal; }
  .pww-reply .wk-quick { flex-wrap: wrap; }
  .pww-reply .wk-quick .wk-link { flex: 1 1 0; min-width: 0; padding: 4px 8px; white-space: normal; line-height: 1.15; }
}
/* v280 (retest, one-shot): "Change for some events" on a phone's sign shows everything at once, with no scrolling: one
   event per card (the cards turn: arrows, dots, swipe): the name, Yes/No, then the meal on its own row. The heading and
   "Yes / No to everything" stay off the narrow sign: "We'll be there" and "We can't make it" on the reply itself do that. */
@container (max-width: 340px) {
  .pww-reply .wk-sheethead, .pww-reply .wk-quick { display: none; }
  .pww-reply .is-guests .wk-sheethead { display: block; }   /* v282: "Your household" keeps its title (its guest's own name is on the sign) */
  .pww-reply .is-guests .wk-sheethead .wk-sub { display: none; }
  .pww-reply .wk-chips { margin: 0 0 4px; }
  .pww-reply .wk-crow { grid-template-columns: 4px auto minmax(0, 1fr); padding: 2px 0; min-height: 0; gap: 4px 8px; }
  .pww-reply .wk-crow > .wk-bar { grid-row: span 3; }
  .pww-reply .wk-crow > .wk-cname { grid-column: 2 / -1; display: block; }
  .pww-reply .wk-cname small { display: inline; margin-left: 6px; }
  .pww-reply .wk-crow > .wk-yn, .pww-reply .wk-crow > .wk-diff { grid-column: 2; }
  .pww-reply .wk-crow > .wk-mealpick { grid-column: 2 / -1; }   /* its own row: the whole dish name shows */
  .pww-reply .wk-mealpick > span { display: none; }   /* the picker keeps its name for screen readers (aria-label) */
  .pww-reply .wk-pager { margin: 2px 0 0; }
  .pww-reply .wk-check { margin: 2px 0; }
  .pww-reply .wk-btn { min-height: 44px; margin-top: 4px; }
  .pww-reply .pww-back { margin-top: 2px; }
}

/* v282 (item 4B): the dietary pages on the sign ("Dietary needs", one person a card on a phone, and the allergens) fit the
   sign's face at once: the question is the title (no kicker), the chips and boxes a little tighter, the type unchanged */
.pww-reply .is-diet .wk-sheethead, .pww-reply .is-allergens .wk-sheethead { display: block; }
.pww-reply .is-diet .wk-kicker, .pww-reply .is-allergens .wk-kicker { display: none; }
.pww-reply .is-diet .wk-h2, .pww-reply .is-allergens .wk-h2 { margin-top: 0; font-size: 20px; }
.pww-reply .is-allergens .wk-sub { margin-top: 0; }
.pww-reply .is-diet .wk-dietrow { margin-top: 4px; gap: 4px; }
.pww-reply .is-diet .wk-dietin input, .pww-reply .is-diet .wk-dietin textarea { min-height: 40px; padding-block: 6px; }
.pww-reply .is-diet .wk-dchip, .pww-reply .is-allergens .wk-dchip { min-height: 32px; padding: 0 10px; }
.pww-reply .is-allergens .wk-algrid { gap: 4px; margin-top: 6px; }
.pww-reply .is-diet .oc-diet-line, .pww-reply .is-allergens .oc-diet-line { margin: 6px 0 0; line-height: 1.3; }
.pww-reply .is-diet .wk-btn, .pww-reply .is-allergens .wk-btn { margin-top: 6px; min-height: 42px; }
.pww-reply .is-diet .wk-extras { margin-top: 0; min-height: 32px; padding-block: 2px; }
.pww-reply .is-diet .wk-pager { margin: 2px 0 0; }