/* The Conversation Table: source-matched artwork with live, accessible question text. */
.ref-body{background:#faf4e8;color:#211a12}
.ref{--ref-gold:#b8893b;--ref-gold-light:#e6c87e;--ref-ink:#0d0b09;--ref-paper:#faf4e8}
.ref .o2-wrap{max-width:1440px;padding-inline:clamp(16px,6vw,88px)}
.ref [hidden]{display:none!important}
.ref :focus-visible{outline:3px solid #a87825;outline-offset:5px}
.ref-eyebrow{margin:0 0 1rem;font:600 .72rem/1.6 var(--o-sans);letter-spacing:.22em;text-transform:uppercase;color:#7d571c}
.ref-hero{background:#0d0b09 url('/assets/img/reflections/quilt-thread-banner.webp') center/cover no-repeat;color:#faf4e8;border-bottom:2px solid #b8893b;padding:1.8rem 0 1.9rem}
.ref-hero__wrap{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:2rem;align-items:center}
.ref-hero__copy{min-width:0}
.ref-hero .ref-eyebrow{color:#e6c87e}
.ref-hero h1{margin:0;font:500 clamp(3.4rem,5.2vw,5rem)/1.04 var(--o-display);letter-spacing:-.035em}
.ref-hero h1 em{color:#e6c87e;font-weight:500;white-space:nowrap}
.ref-hero__lede{max-width:69ch;margin:1rem 0 0;font:400 1rem/1.65 var(--o-sans);color:#f5eddf}
.ref-anniversary{display:flex;flex-direction:column;align-items:center;align-self:start;margin-top:.25rem;color:#e6c87e;text-align:center;padding:0 1rem}
.ref-anniversary strong{font:500 8rem/.95 var(--o-display);letter-spacing:-.07em}
.ref-anniversary>span{font:600 .68rem/1.5 var(--o-sans);letter-spacing:.24em;text-transform:uppercase;margin-top:.5rem}
.ref-anniversary>b{font:500 1.75rem/1.3 var(--o-display);margin-top:.7rem;border-top:1px solid #b8893b;padding-top:.55rem;width:100%}
.ref-write{padding:1.8rem 0 1.4rem;scroll-margin-top:6rem}
.ref-write__wrap{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.2fr);gap:clamp(2rem,4.2vw,4rem);align-items:start}
.ref-deck{position:relative;min-width:0;margin-top:-2.7rem;text-align:center}
.ref-question{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;gap:1.1rem;min-height:410px;padding:2.8rem 3.1rem 2.3rem;background:none;color:#e6c87e;text-align:left;transform:none;filter:drop-shadow(0 12px 10px #2b1c1633)}
.ref-question:before{content:'';position:absolute;inset:1.2rem .7rem .2rem -.8rem;z-index:-2;background:url('/assets/img/reflections/conversation-card.webp') center/100% 100% no-repeat;transform:rotate(-5deg);pointer-events:none}
/* Rotate only the artwork; question text stays level above both card faces. */
.ref-question:after{content:'';position:absolute;inset:0;z-index:-1;background:url('/assets/img/reflections/conversation-card.webp') center/100% 100% no-repeat;transform:rotate(var(--ref-card-angle,0deg));transition:transform .3s ease-out;pointer-events:none}
.ref-question__category{margin:0;font:600 .67rem/1.7 var(--o-sans);letter-spacing:.15em;text-transform:uppercase;max-width:90%}
.ref-question h2{margin:0;max-width:10.5ch;font:500 clamp(2.5rem,3.6vw,3.5rem)/1.1 var(--o-display);letter-spacing:-.025em;color:#f0d58e;overflow-wrap:normal}
.ref-question__number{margin:0;font:500 .78rem/1.5 var(--o-sans);letter-spacing:.12em;text-transform:uppercase}
.ref-draw{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;margin:1.2rem auto 0;min-height:48px;padding:.65rem 1.7rem;border:1.5px solid #9c7028;border-radius:999px;background:transparent;color:#211a12;font:600 .9rem/1.4 var(--o-sans);cursor:pointer}
.ref-draw:hover{background:#efdfbd}
.ref-draw .icon,.ref-back .icon,.ref-privacy .icon{width:18px;height:18px;flex:none}
.ref-deck__note{margin:.65rem auto 0;font:.75rem/1.6 var(--o-sans);color:#665945}
.ref-editor{min-width:0;padding-top:.2rem}
.ref-editor h2,.ref-details legend{margin:0 0 1.65rem;font:500 clamp(2.3rem,3.6vw,3.5rem)/1.12 var(--o-display);letter-spacing:-.035em;color:#211a12}
.ref-write .co-form{display:block}
.ref-write .field__label,.ref-write .co-label{color:#292117;font-size:.9rem}
.ref-write .field__label small{font-size:.8rem;color:#675d4d}
.ref-write .field__input{background:#fffdf8;color:#211a12;border:1px solid #92826b;border-radius:6px;font:400 1rem/1.6 var(--o-sans)}
.ref-write textarea.field__input{min-height:185px;resize:vertical}
.ref-write .field__input::placeholder{color:#766c5c}
.ref-write .field{margin-bottom:1.15rem}
.ref-write .co-hint{color:#655a4b;line-height:1.6;font-size:.8rem;margin-top:.5rem}
.ref-primary{width:100%;min-height:54px;font-size:.95rem!important;cursor:pointer}
.ref-primary:disabled{opacity:.65;cursor:wait}
.ref-privacy{display:flex;align-items:center;justify-content:center;gap:.65rem;color:#655a4b;font:.76rem/1.65 var(--o-sans);margin:1rem .4rem 0}
.ref-privacy .icon{width:16px;height:16px}
.ref-details{padding:0;margin:0;border:0;min-width:0}
.ref-details legend{padding:0;margin-bottom:.5rem}
.ref-back{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem 0;min-height:44px;border:0;background:none;color:#765315;font:600 .85rem/1.5 var(--o-sans);text-decoration:underline;text-underline-offset:.25em;cursor:pointer;margin:0 0 .8rem}
.ref-seg{grid-template-columns:repeat(3,minmax(0,1fr))}
.ref-seg span{text-align:center}
.ref-write .co-seg span{background:#fffdf8;color:#34291b;border-color:#92826b;min-height:50px;font-size:.8rem}
.ref-write .co-seg input:checked+span{background:#ecd5a4;border-color:#86601c;color:#211a12}
.ref-write .contact-two{align-items:start}
.ref [aria-invalid=true]{border:2px solid #a52a24!important}
.ref-field-error{margin:.4rem 0 0;color:#92251e;font:600 .85rem/1.6 var(--o-sans)}
.ref .co-error{background:#fff0ed;color:#8e231c;border-left:3px solid #a52a24;padding:1rem;margin:1rem 0}
.ref-bridge{padding:2rem 0 2.3rem;background:#0d0b09 url('/assets/img/reflections/quilt-thread-banner.webp') center/cover no-repeat;color:#faf4e8;border-block:2px solid #b8893b}
.ref-bridge h2{margin:0 0 1.4rem;max-width:27ch;font:500 clamp(2rem,3.1vw,3rem)/1.15 var(--o-display);letter-spacing:-.025em}
.ref-bridge h2 em{color:#e6c87e}
.ref-bridge .o2-btn--line{color:#f1d58a;border-color:#e6c87e}
.ref-hero__link{display:inline-flex;align-items:center;min-height:46px;color:#f2d894;text-underline-offset:.3em;font-size:.85rem}
.ref-wall{padding-block:3.5rem;background:#f1e8d7}
.ref-wall__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1.5rem}
.ref-wall__head h2{font:500 clamp(2rem,3.4vw,3rem)/1.15 var(--o-display);margin:0;scroll-margin-top:6rem}
.ref-wall__head .ref-eyebrow{margin-bottom:.5rem}
.ref-wall__head>p{font-size:.85rem;color:#665945;margin:0}
.ref-wall__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.ref-empty{grid-column:1/-1;margin:0;padding:1.3rem 0;border-block:1px solid #b8893b;color:#635541;line-height:1.7}
.ref-card{margin:0;padding:1.4rem;background:#fffcf5;border-top:2px solid #b8893b;min-width:0}
.ref-card blockquote{margin:0 0 1rem;font:400 1.35rem/1.6 var(--o-display);color:#211a12;overflow-wrap:anywhere}
.ref-card blockquote p{margin:0 0 .6rem}
.ref-card blockquote p:last-child{margin:0}
.ref-card figcaption{font:600 .75rem/1.5 var(--o-sans);letter-spacing:.08em;text-transform:uppercase;color:#765315}
.ref-card figcaption span{font-weight:400;text-transform:none;letter-spacing:normal}
.ref-wall__links{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin:1.75rem 0 0;font-size:.85rem}
.ref-thanks{padding:2rem 0}
.ref-thanks>p:not(.ref-eyebrow){font-size:1rem;line-height:1.8;max-width:55ch}
.ref-thanks .o2-actions{margin-top:1.5rem}
@keyframes ref-draw{0%{opacity:.35;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
.ref-question.is-drawing{animation:ref-draw .35s ease-out}
@media(min-width:1600px){.ref-hero{padding-block:3rem}.ref-write{padding-block:2.2rem}}
@media(max-width:1099px){.ref-hero__wrap{grid-template-columns:minmax(0,1fr) 180px;gap:1rem}.ref-hero h1{font-size:clamp(2.8rem,5.1vw,4rem)}.ref-anniversary strong{font-size:6.3rem}.ref-anniversary>b{font-size:1.5rem}.ref-write__wrap{gap:2rem;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.ref-question{padding:2.3rem 2.4rem;min-height:400px}.ref-question h2{font-size:2.7rem}.ref-editor h2{font-size:2.65rem}.ref-deck__note{font-size:.7rem}.ref-seg{grid-template-columns:1fr}.ref-seg span{text-align:left}}
@media(max-width:759px){.ref-hero{padding:2rem 0;background-position:30% center}.ref-hero__wrap{grid-template-columns:1fr;gap:1.6rem}.ref-hero h1{font-size:clamp(2.65rem,8vw,4rem);line-height:1.07}.ref-hero h1 em{white-space:normal}.ref-hero__lede{max-width:43ch;font-size:.95rem}.ref-anniversary{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:.8rem;align-items:center;justify-self:start;padding:0;text-align:left;margin:0}.ref-anniversary strong{grid-row:1/3;font-size:4.2rem}.ref-anniversary>span{font-size:.6rem;margin:0;letter-spacing:.15em}.ref-anniversary>b{font-size:1.3rem;margin:.15rem 0 0;padding:.2rem 0 0}.ref-write{padding:1.5rem 0 2rem}.ref-write__wrap{grid-template-columns:1fr;gap:1.8rem}.ref-deck{margin:0 auto;max-width:480px;width:100%;padding-inline:.4rem}.ref-question{min-height:310px;padding:2rem 2.2rem 1.8rem}.ref-question h2{font-size:clamp(2.1rem,7.5vw,3.1rem);max-width:12ch}.ref-question__category{font-size:.62rem}.ref-question__number{font-size:.7rem}.ref-draw{margin-top:1rem}.ref-deck__note{font-size:.75rem}.ref-editor{padding:0}.ref-editor h2,.ref-details legend{font-size:2.3rem;margin-bottom:1.2rem}.ref-write textarea.field__input{min-height:180px}.ref-privacy{justify-content:flex-start;align-items:flex-start;margin-inline:0}.ref-privacy .icon{margin-top:.2rem}.ref-bridge{padding-block:1.8rem;background-position:30% center}.ref-bridge h2{max-width:17ch}.ref-bridge .o2-actions{gap:.6rem 1.2rem}.ref-wall{padding-block:2.5rem}.ref-wall__grid{grid-template-columns:1fr}.ref-wall__links{flex-direction:column;align-items:start}}
@media(prefers-reduced-motion:reduce){.ref *{scroll-behavior:auto!important;animation:none!important;transition:none!important}.ref-question{transform:none}.ref-question:before{transform:none}.ref-question:after{transition:none}}
/* Keep gold anniversary lettering readable over the light stitches in the artwork. */
.ref-hero{background-color:#777;background-blend-mode:multiply}

.ref-quilt-context{scroll-margin-top:calc(var(--o-mast,80px) + 1rem);margin:0 0 1.25rem;padding:1.3rem 1.5rem;border:1px solid #a17b3b;background:#211a12;color:#f4eee3;border-radius:8px}
.ref-quilt-context[hidden],.ref-draft[hidden],.ref-return[hidden]{display:none}
.ref-quilt-context .ref-eyebrow{color:#e4bf73;margin:0 0 .5rem}
.ref-quilt-context h3{font:500 1.75rem/1.2 var(--o-display);color:#f4eee3;margin:0 0 .65rem}
.ref-quilt-context p:not(.ref-eyebrow){font:400 .95rem/1.7 var(--o-sans);margin:0 0 .5rem;color:#e0d3bf}
.ref-quilt-context a,.ref-return a{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;font:500 .85rem/1.4 var(--o-sans);color:#e4bf73;text-underline-offset:4px}
.ref-return a{color:#765315}
.ref-quilt-context .icon,.ref-return .icon{width:1rem;height:1rem}
.ref-draft{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:1rem 0;color:#67553c;font:400 .78rem/1.6 var(--o-sans)}
.ref-draft button{min-height:44px;flex-shrink:0;border:0;background:transparent;color:#6b4b13;text-decoration:underline;text-underline-offset:4px;font:500 .78rem/1.3 var(--o-sans);cursor:pointer;padding:.4rem}
.ref-draft button:focus-visible,.ref-quilt-context a:focus-visible,.ref-return a:focus-visible{outline:3px solid #b5822d;outline-offset:4px}
@media(max-width:40rem){.ref-quilt-context{padding:1.1rem}.ref-draft{align-items:start;gap:.6rem}.ref-draft button{max-width:7rem}}
@media(max-width:45rem){.ref-body .o2-brand{min-width:0;flex:1 1 auto}.ref-body .o2-brand__l2{white-space:normal;line-height:1.4;max-width:210px}.ref-body .o2-mast__menu{margin-right:0}}


/* Recovery stays beside the list and never reloads an unfinished reflection. */
.ref-retry{display:inline-flex;align-items:center;gap:.6rem;margin-top:1rem;min-height:48px;padding:.65rem 1.1rem;border:1.5px solid #9c7028;border-radius:999px;background:transparent;color:#211a12;font:600 .85rem/1.5 var(--o-sans);cursor:pointer;text-align:left}
.ref-retry:hover{background:#efdfbd}
.ref-retry .icon{width:18px;height:18px;flex:none}
.ref-retry:disabled{opacity:.65;cursor:wait}
.ref-draft button:disabled{opacity:.65;cursor:wait}
.ref-deck{scroll-margin-top:calc(var(--o-mast,72px) + 1.25rem)}
.ref-question__number [hidden]{display:none}
@media(max-width:759px){.ref-quilt-context{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.35rem .8rem;padding:.8rem 1rem}.ref-quilt-context .ref-eyebrow,.ref-quilt-context p:not(.ref-eyebrow){display:none}.ref-quilt-context h3{font-size:1.2rem;margin:0}.ref-quilt-context a{font-size:.78rem}}