.q{ border-bottom:1px solid var(--hairline) }
.q:first-of-type{ border-top:1px solid var(--hairline) }
.q-btn{
  display:flex; align-items:baseline; gap:1rem;
  width:100%; text-align:left; padding:1.15rem 0;
  font-family:var(--serif); font-size:1.5rem; line-height:1.3; color:var(--ink);
  list-style:none;
}
.q-btn::-webkit-details-marker{ display:none }
.q-btn:hover{ color:var(--oxblood) }
.q-btn .mk{
  flex:none; width:1em; font-family:var(--sans); font-size:1rem;
  color:var(--brass); transition:transform .18s ease;
}
.q[open] .q-btn .mk{ transform:rotate(45deg) }
.q-body{ padding:0 0 1.5rem 2rem; max-width:64ch }
.q-body p{
  font-family:var(--serif); font-size:1.3125rem; line-height:1.5;
  color:var(--ink-soft);
}
.q-body p + p{ margin-top:.7rem }
.q-body a{ color:var(--oxblood) }


/* Keep Collection actions on Collection while Help occupies the stage. */
body:has(#helpStage.is-open) #mcUnlockRail,
body:has(#helpStage.is-open) .your-collection.is-docked{ display:none }

/* Approved Help Experience reference: centered stage, three paths and library. */
#helpMain{ width:100%; max-width:1100px; margin-inline:auto }
#helpMain .help-intro{ text-align:center; margin:1.4rem auto 2rem }
#helpMain .help-intro h2{ font-family:var(--serif); font-size:clamp(2.4rem,3.2vw,3.6rem); font-weight:400; line-height:1.1 }
#helpMain .help-intro p{ font-family:var(--serif); font-size:1.375rem; line-height:1.45; margin-top:.4rem }
#helpMain .help-paths{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(12px,1.1vw,20px) }
#helpMain .help-path{ text-align:center; display:flex; flex-direction:column; align-items:center; gap:1rem }
#helpMain .help-path h3{ justify-content:center; font-size:1.8rem }
#helpMain .help-path p{ font-family:var(--serif); font-size:1.25rem; line-height:1.4; flex:1 }
#helpMain .help-icon{ width:48px; height:48px; color:var(--ink) }
#helpMain .help-action{ min-width:10rem; border:1px solid rgba(137,105,67,.28); border-radius:8px; padding:.7em 1.4em; font-family:var(--serif); font-size:1.15rem; cursor:pointer; color:var(--vellum-100); background:var(--oxblood) }
#helpMain .help-action[data-help="learn"]{ background:#4a6b4a }
#helpMain .help-action[data-help="support"]{ background:var(--coffee-700,#332620) }
#helpMain .help-ask{ display:flex; align-items:center; gap:1.4rem; margin-top:1.2rem }
#helpMain .help-ask .help-copy{ flex:1 }
#helpMain .help-ask p{ font-family:var(--serif); font-size:1.15rem; line-height:1.4 }
#helpMain .help-question{ display:flex; gap:.6rem; align-items:center }
#helpMain .help-question input{ min-width:0; padding:.7em 1em; border:1px solid rgba(137,105,67,.28); border-radius:8px; font:inherit; background:rgba(255,255,255,.7) }
#helpMain .help-library{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem }
#helpMain .help-library .ac-card{ padding:1rem }
#helpMain .help-library h3{ font-size:1.25rem; margin-bottom:.8rem }
#helpMain .help-topic{ display:block; width:100%; text-align:left; padding:.6em .3em; border:0; border-bottom:1px solid rgba(137,105,67,.14); background:transparent; font-family:var(--serif); font-size:1.1rem; cursor:pointer }
#helpMain .help-topic[aria-current="true"]{ color:var(--oxblood); background:rgba(125,66,66,.07) }
#helpMain .help-reading{ max-width:64ch; margin:1.4rem auto; font-family:var(--serif); font-size:1.375rem; line-height:1.5 }
#helpMain .help-reading h3{ font-size:1.8rem; margin-bottom:.5rem }
#helpMain .help-support{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem }
#helpMain .help-support button{ color:var(--ink); cursor:pointer; font:inherit; text-align:center }
#helpMain .help-support h3{ justify-content:center }
#helpMain .help-support p{ font-family:var(--serif); font-size:1.15rem; line-height:1.4; margin-top:.5rem }
#helpMain .help-steps{ display:flex; flex-wrap:wrap; gap:1rem; padding:1rem; margin:1.2rem 0; border:1px solid rgba(137,105,67,.22); border-radius:8px; list-style:none }
#helpMain .help-steps li{ font-family:var(--serif); font-size:1.05rem; display:flex; align-items:center; gap:.5rem }
#helpMain .help-step-number{ border-radius:50%; width:1.8em; height:1.8em; display:inline-grid; place-items:center; background:rgba(137,105,67,.1) }
#helpMain [aria-current="step"] .help-step-number{ background:var(--masthead); color:var(--vellum-100) }
#helpMain .help-artwork{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.6rem; margin:1rem 0 }
#helpMain .help-art{ padding:0; border:2px solid transparent; border-radius:8px; background:transparent; overflow:hidden; cursor:pointer }
#helpMain .help-art img{ width:100%; aspect-ratio:1; object-fit:cover; display:block }
#helpMain .help-art[aria-pressed="true"]{ border-color:var(--gold) }
#helpMain .help-selected{ width:120px; border-radius:8px; display:block; margin-bottom:1rem }
#helpMain .help-choice{ display:flex; gap:.7rem; align-items:center; padding:1rem; border:1px solid rgba(137,105,67,.22); border-radius:8px; margin:.6rem 0; font-family:var(--serif); font-size:1.2rem; cursor:pointer }
#helpMain .help-choice:has(input:checked){ border-color:var(--oxblood); background:rgba(125,66,66,.07) }
#helpMain .help-review{ width:100%; border-collapse:collapse; font-family:var(--serif); font-size:1.15rem }
#helpMain .help-review th,#helpMain .help-review td{ padding:.7rem; border-bottom:1px solid rgba(137,105,67,.14); text-align:left; vertical-align:top; overflow-wrap:anywhere }
#helpMain .help-review th{ font-weight:400; width:35% }
#helpMain .help-controls{ display:flex; justify-content:space-between; gap:1rem; margin-top:1.4rem }
#helpMain .ac-second{
  padding:.7em 1.4em; border-radius:8px; cursor:pointer;
  font-family:var(--serif); font-style:italic; font-size:1.15rem;
}
@media(max-width:900px){
 #helpMain .help-paths,#helpMain .help-library{ grid-template-columns:repeat(2,minmax(0,1fr)) }
 #helpMain .help-ask{ flex-wrap:wrap }
 #helpMain .help-support{ grid-template-columns:repeat(2,minmax(0,1fr)) }
 #helpMain .help-artwork{ grid-template-columns:repeat(3,minmax(0,1fr)) }
}
@media(max-width:600px){
 #helpMain .help-paths,#helpMain .help-library{ grid-template-columns:1fr }
 #helpMain .help-question{ width:100% } #helpMain .help-question input{ flex:1 }
 #helpMain .help-artwork{ grid-template-columns:repeat(3,minmax(0,1fr)) }
}

#helpMain .help-subtitle{ font-family:var(--serif); font-size:1.375rem; line-height:1.45; margin-bottom:1rem }
#helpMain .help-details{ display:block; margin-top:1rem; font-family:var(--serif); font-size:1.375rem }
#helpMain .help-details textarea{ display:block; width:100%; min-height:7rem; padding:1rem; margin-top:.5rem; border:1px solid var(--hairline); border-radius:8px; font:inherit; color:var(--ink); background:var(--vellum-100) }
.help-case-scroll{ overflow-x:auto }
.help-case-table{ width:100%; border-collapse:collapse; font-family:var(--serif); font-size:1.25rem }
.help-case-table th,.help-case-table td{ padding:.7rem; border-bottom:1px solid var(--hairline); text-align:left; font-weight:400; vertical-align:top }
#includedUnlockConfirm .m-card{ width:min(calc(680px * 2 / 3),100%) }

/* Visual 1 presentation and Visual 2 steps; scoped PNG exception approved. */
#helpMain .help-icon{flex:none;display:block;margin:0 auto .6rem;color:#593b25}
#helpMain .help-path{padding:1.6rem 1.4rem}
#helpMain .help-path h3,#helpMain .help-path p{margin:0}
#helpMain .help-path .help-icon{width:54px;height:54px}
#helpMain .help-path p{max-width:25ch;font-size:1.375rem}
#helpMain .help-ask>.help-icon{margin:0}
#helpMain .help-ask p,#helpMain .help-support p{font-size:1.25rem}
#helpMain .help-library h3{justify-content:center;font-size:1.4rem}
#helpMain .help-library .help-icon,#helpMain .help-support .help-icon{width:34px;height:34px}
#helpMain .help-support button{padding:1.5rem}
#helpMain .help-question .help-action,#helpMain .help-controls [data-help="continue"]{background:#4a6b4a}
#helpMain .help-selection{display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,2fr);gap:1.5rem;align-items:start}
#helpMain .help-selection .help-selected{width:100%;max-height:360px;object-fit:contain}
#helpMain .help-choice .help-icon{width:28px;height:28px;margin:0}
#helpMain .help-choice{font-size:1.375rem}
#helpMain .help-steps{justify-content:space-between;background:rgba(255,255,255,.35)}
#helpMain .help-steps li{font-size:1.125rem}
#helpMain .help-review{font-size:1.375rem}
#helpMain .help-outcome{max-width:640px;margin-inline:auto}
#helpMain .help-outcome>.help-icon{margin:0 0 1rem}
#includedUnlockConfirm .help-icon{width:38px;height:38px;display:block;margin:0 auto 1rem;color:#593b25}
#includedUnlockConfirm .m-head,#includedUnlockConfirm .m-say{text-align:center}
#includedUnlockConfirm .acts{justify-content:center}
#includedUnlockConfirm [data-included="use"]{background:#4a6b4a;border-color:#4a6b4a}
@media(max-width:600px){#helpMain .help-selection{grid-template-columns:1fr}#helpMain .help-selection .help-selected{max-width:180px}#helpMain .help-ask{gap:.8rem}#helpMain .help-ask .help-copy{min-width:180px}}

/* Approved polish: visible page hierarchy and a bounded Collection selector. */
#helpStage .mc-head{flex:none;display:flex;align-items:center;flex-wrap:wrap;gap:1rem;padding:1rem 0}
#helpStage #helpClose{font:400 1.3rem var(--serif);padding:.6em 1em;min-height:44px;color:var(--oxblood);border:1px solid var(--hairline);border-radius:8px;background:var(--vellum-100)}
#helpStage .mc-title{font:400 1.35rem var(--serif);letter-spacing:.08em;color:var(--ink)}
#helpMain.help-select-artwork{display:flex;flex-direction:column;min-height:0;overflow:hidden;padding-bottom:.5rem}
#helpMain.help-select-artwork>.ac-head{flex:none;margin:.5rem 0}
#helpMain.help-select-artwork>.ac-head h2{margin:0}
#helpMain.help-select-artwork>.help-subtitle{flex:none;margin:0 0 .5rem}
#helpMain.help-select-artwork>.help-steps{flex:none;margin:.3rem 0 .7rem}
#helpMain .help-gallery-card{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
#helpMain .help-gallery-card>h3{margin:0}
#helpMain .help-gallery-card>.help-subtitle{margin:.3rem 0}
#helpMain .help-gallery-card>.help-artwork{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;align-content:start;grid-auto-rows:calc((100% - 1.2rem) / 3);margin:.5rem 0}
#helpMain .help-gallery-card .help-art{min-height:0}
#helpMain .help-gallery-card .help-art img{height:100%;aspect-ratio:auto;object-fit:contain}
#helpMain .help-gallery-card>.help-controls{flex:none;margin-top:.5rem}
#helpMain .help-gallery-card>[data-help="batch"]{align-self:flex-start;flex:none}
#helpMain .help-refund-breakdown{font:400 1.375rem/1.5 var(--serif);margin:1rem 0}
#helpMain .help-refund-breakdown>div{display:flex;justify-content:space-between;gap:1rem}
#helpMain .help-refund-breakdown dd{margin:0}
#helpMain .help-refund-total{border-top:1px solid var(--hairline);padding-top:.5rem;margin-top:.5rem}
@media(min-width:1025px){
 #helpMain .help-intro h2{font-size:clamp(2.7rem,3.6vw,4.05rem)}
 #helpMain .help-path h3,#helpMain .help-reading h3{font-size:2.025rem}
 #helpMain .ac-head h2{font-size:clamp(2.1375rem,2.475vw,2.925rem)}
 #helpMain .help-intro p,#helpMain .help-path p,#helpMain .help-subtitle,#helpMain .help-reading,#helpMain .help-details,#helpMain .help-choice,#helpMain .help-review,#helpMain .help-refund-breakdown{font-size:1.547rem}
 #helpMain .help-ask p,#helpMain .help-support p{font-size:1.406rem}
 #helpMain .help-action,#helpMain .ac-second{font-size:1.294rem}
 #helpMain .help-topic{font-size:1.238rem}
 #helpMain .help-steps li{font-size:1.266rem}
 #helpMain .help-library h3{font-size:1.575rem}
 #helpMain .help-support h3,#helpMain .help-ask h3,#helpMain .help-gallery-card h3,#helpRequest h3,#helpMain .help-outcome h3{font-size:1.631rem}
 #helpMain .help-question input{font-size:1.125rem}
 #helpStage #helpClose{font-size:1.463rem}
 #helpStage .mc-title{font-size:1.519rem}
}
@media(max-width:900px){#helpMain .help-gallery-card>.help-artwork{grid-auto-rows:calc((100% - .6rem) / 2)}}
@media(max-width:600px){#helpStage .mc-head{gap:.4rem;padding:.5rem 0}#helpStage .mc-title{font-size:1.125rem}#helpMain.help-select-artwork .help-steps{gap:.4rem;padding:.5rem}#helpMain.help-select-artwork .help-steps li{font-size:1rem}#helpMain.help-select-artwork .help-subtitle{font-size:1.125rem;line-height:1.2}#helpMain .help-gallery-card{padding:.7rem}}
/* Help landing refinement (owner brief 2026-10-10): intro, three paths, Ask Concierge, then the guidance as
   expandable sections. Layout only; the cards, Concierge and every word of the guidance are unchanged. */
/* Its own clean content area: the stage spans the full width below the masthead, so no strip of the
   Creation rail shows along the left edge. */
#helpStage{left:0 !important;border-left:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
/* The floating ? sat on top of the Concierge panel; it is redundant on Help, and unchanged everywhere else. */
body:has(#helpStage.is-open) .tour-fab,body:has(#helpStage.is-open) #tourFab{display:none !important}
#helpMain .help-intro{margin:.8rem auto 1.5rem}
#helpMain .help-guide{max-width:68ch;margin:2.8rem auto 3.5rem;font-family:var(--serif);color:var(--ink)}
#helpMain .help-guide h3{font-size:1.75rem;line-height:1.2;font-weight:400;margin:0 0 .8rem}
#helpMain .help-guide p{font-size:1.2rem;line-height:1.6;margin:0 0 1rem;color:var(--ink-soft)}
#helpMain .help-guide .help-guide-lead{margin-bottom:1.4rem}
#helpMain .help-guide .help-guide-close{margin:1.6rem 0 0}
/* Expandable questions: the existing FAQ pattern (hairline rules, plus mark that turns to a cross when open),
   under their own class names because host pages already use .q for something else. */
#helpMain .help-faq{border-bottom:1px solid var(--hairline,rgba(137,105,67,.28))}
#helpMain .help-faq:first-of-type{border-top:1px solid var(--hairline,rgba(137,105,67,.28))}
#helpMain .help-faq-q{display:flex;align-items:baseline;gap:1rem;width:100%;padding:.9rem 0;cursor:pointer;font-family:var(--serif);font-size:1.35rem;line-height:1.3;color:var(--ink);list-style:none}
#helpMain .help-faq-q::-webkit-details-marker{display:none}
#helpMain .help-faq-q:hover{color:var(--oxblood)}
#helpMain .help-faq-q:focus-visible{outline:2px solid var(--oxblood);outline-offset:2px}
#helpMain .help-faq-mk{flex:none;width:1em;font-family:var(--sans);font-size:1rem;color:var(--brass,#b68a53);transition:transform .18s ease}
#helpMain .help-faq[open] .help-faq-mk{transform:rotate(45deg)}
#helpMain .help-faq-a{padding:0 0 1.2rem 2rem}
#helpMain .help-faq-a ul{margin:0;padding-left:1.2rem}
#helpMain .help-faq-a li{font-size:1.2rem;line-height:1.55;margin:.35rem 0}
@media(max-width:600px){
 #helpMain .help-guide{margin:2rem auto 2.5rem}
 #helpMain .help-guide h3{font-size:1.5rem}
 #helpMain .help-guide p,#helpMain .help-faq-a li{font-size:1.1rem}
 #helpMain .help-faq-q{font-size:1.2rem}
 #helpMain .help-faq-a{padding-left:1.4rem}
}
