/* Website illustration of Magazine app UI, not a native capture or live Hunt.
 * Scoped to .hunt-preview; load after world-hunt-story.css. Each static panel
 * owns one device. Example/pricing captions remain outside that device. */
#world-hunt-story.hunt-preview { width:100%; margin:0; padding:0; border:0; color:#11100E; }
.world-walkthrough { width:min(1384px,calc(100% - 96px)); margin:0 auto; padding:88px 0 96px; border-top:1px solid #D6C1CC; }
.world-walkthrough #world-hunt-story { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); column-gap:clamp(40px,6vw,96px); align-items:start; }
.hunt-walkthrough-copy { min-width:0; padding-top:24px; }
.world-walkthrough .hunt-story-heading { margin:0 0 32px; }
.world-walkthrough .hunt-story-heading > p { max-width:500px; }
.world-walkthrough .hunt-story-steps { grid-column:1; margin:0 0 20px; max-width:500px; width:100%; }
.world-walkthrough #hunt-story-stage { grid-column:2; }
.world-walkthrough .hunt-story-controls { grid-column:2; width:100%; max-width:330px; margin:18px auto 0; }
.world-walkthrough .hunt-story-proof { grid-column:1; max-width:500px; margin-top:16px; }
.world-walkthrough .hunt-story-proof summary { margin:0; }
.hunt-preview #hunt-story-stage { padding:0; border:0; border-radius:0; background:none; container:world-preview / inline-size; }
.hunt-preview #hunt-story-stage .hunt-preview-panel { display:block; min-width:0; }
.hunt-preview .hunt-story-steps { margin:0 auto 18px; max-width:400px; }
.hunt-preview .hunt-story-steps button { display:block; min-height:56px; padding:8px; font-size:11px; text-align:center; }
.hunt-preview .hunt-story-steps button > span:first-child { display:block; margin-bottom:2px; }
.hunt-preview .hunt-story-controls { max-width:400px; margin:18px auto 0; gap:10px; }
.hunt-preview .hunt-story-proof { max-width:400px; margin:4px auto 0; font-size:11px; }
.hunt-preview .hunt-story-proof summary { margin:0 auto; }
.hunt-preview .hunt-story-controls button { font-size:11px; padding:10px 14px; }
.hunt-preview .hunt-story-progress { flex:1 1 30px; max-width:80px; }
.hunt-preview-visual { min-width:0; margin:0; }
.hunt-preview-device { width:100%; max-width:330px; height:650px; margin:0 auto; padding:0; border:6px solid #302525; border-radius:34px; overflow:hidden; background:#FAF8F5; }
.hunt-preview-screen { display:flex; flex-direction:column; height:100%; min-width:0; overflow:hidden; border-radius:28px; background:#FAF8F5; color:#11100E; font:400 14px/1.5 'Plus Jakarta Sans',sans-serif; }
.hunt-preview-screen p { margin:0; }
.hunt-preview-screen h4 { margin:0; font:700 34px/1.1 'Plus Jakarta Sans',sans-serif; letter-spacing:-.035em; }
.hunt-preview-screen b, .hunt-preview-screen strong { font-weight:700; }
.hunt-preview-visual > figcaption { max-width:350px; margin:12px auto 0; color:#6B5B63; font:400 10px/1.5 'Plus Jakarta Sans',sans-serif; text-align:center; overflow-wrap:anywhere; }
.hunt-preview-visual > figcaption strong { font-weight:700; color:#71304F; }
.hunt-preview-dialogue { min-width:0; }
.hunt-preview-beat { display:block; margin-bottom:12px; color:#8B3A62; font:700 10px/1.5 'Plus Jakarta Sans',sans-serif; letter-spacing:.07em; text-transform:uppercase; }
.hunt-preview-dialogue h3 { margin:0 0 16px; color:#5D2440; font:700 clamp(26px,2.5vw,36px)/1.1 'Playfair Display',Georgia,serif; letter-spacing:-.035em; overflow-wrap:normal; }
.hunt-preview-dialogue > p { margin:0 0 18px; color:#6B5B63; font:400 13px/1.6 'Plus Jakarta Sans',sans-serif; }
.hunt-preview-comment { margin:12px 0 0; padding:12px 0; border-top:1px solid #D6C1CC; }
.hunt-preview-comment b { display:block; margin-bottom:4px; color:#71304F; font:700 11px/1.5 'Plus Jakarta Sans',sans-serif; }
.hunt-preview-comment.carrie b { color:#8B4935; }
.hunt-preview-comment p { margin:0; color:#302525; font:400 14px/1.6 'Plus Jakarta Sans',sans-serif; }
.hunt-preview .hunt-story-steps { margin:0 0 14px; }
.hunt-preview .hunt-story-steps button { min-height:48px; padding:9px 8px; gap:6px; font-size:11px; }
.hunt-preview .hunt-story-controls { margin-top:14px; gap:8px; }
.hunt-preview .hunt-story-controls button { padding:10px 14px; font-size:11px; }

/* Piece: the two besties and a real public product photograph. */
.hunt-preview-chat { background:#F2EEE8; }
.hunt-preview-chat-head { display:flex; align-items:center; gap:10px; padding:17px 18px 13px; border-bottom:1px solid #E5E1DA; background:#FAF8F5; }
.hunt-preview-chat-head > img { flex:0 0 auto; width:40px; height:40px; border-radius:50%; object-fit:cover; }
.hunt-preview-chat-head strong { display:block; color:#2B1220; font-size:14px; line-height:1.4; }
.hunt-preview-chat-head span { display:block; color:#666; font-size:10px; }
.hunt-preview-chat-body { display:flex; flex:1; flex-direction:column; align-items:flex-start; gap:9px; padding:16px; }
.hunt-preview-chat-day { align-self:center; color:#666; font-size:9px; line-height:1.5; letter-spacing:.03em; }
.hunt-preview-photo { width:100%; margin:3px 0; background:#FAF8F5; border-radius:12px; overflow:hidden; }
.hunt-preview-photo img { display:block; width:100%; height:180px; max-width:100%; object-fit:cover; object-position:center 78%; background:#FFF; }
.hunt-preview-photo > span { display:block; padding:9px 12px; border-top:1px solid #E5E1DA; color:#4A4A47; font-size:11px; line-height:1.5; }
.hunt-preview-brief { padding:26px 20px; gap:16px; }
.hunt-preview-brief .hunt-preview-eyebrow { color:#71304F; }
.hunt-preview-brief h4 { color:#5D2440; }
.hunt-preview-brief .hunt-preview-photo { margin:0; }
.hunt-preview-brief .hunt-preview-photo img { height:270px; object-fit:contain; object-position:center; }
.hunt-preview-brief .hunt-preview-brief-wish { padding:14px; border-radius:12px; background:#E9D7E2; color:#2B1220; font-size:15px; font-weight:700; line-height:1.6; }
.hunt-preview-brief .hunt-preview-brief-note { color:#6B5B63; font-size:12px; line-height:1.7; }
.hunt-preview-bubble { max-width:94%; padding:9px 11px; border-radius:3px 12px 12px; background:#FFF; color:#11100E; font-size:12px; line-height:1.5; }
.hunt-preview-bubble b { display:block; margin-bottom:3px; color:#5D2440; font-size:10px; }
.hunt-preview-bubble.hunt-preview-carrie { background:#F4E6EC; }
.hunt-preview-carrie b { color:#8B4935; }
.hunt-preview-typing { display:flex; align-items:center; gap:8px; min-height:32px; padding:7px 11px; border-radius:3px 12px 12px; background:#FFF; color:#5D2440; font-size:10px; }
.hunt-preview-typing[data-hunt-speaker='carrie'] { background:#F4E6EC; color:#8B4935; }
.hunt-preview-typing-dots { display:flex; align-items:center; gap:3px; }
.hunt-preview-typing-dots i { width:4px; height:4px; border-radius:50%; background:currentColor; }
@media (prefers-reduced-motion:no-preference) {
  .hunt-preview-typing-dots i { animation:hunt-preview-type .9s ease-in-out infinite; }
  .hunt-preview-typing-dots i:nth-child(2) { animation-delay:.15s; }
  .hunt-preview-typing-dots i:nth-child(3) { animation-delay:.3s; }
  .hunt-preview[data-hunt-playing='true'] [data-hunt-chat-sam]:not([hidden]), .hunt-preview[data-hunt-playing='true'] [data-hunt-chat-carrie]:not([hidden]) { animation:hunt-preview-reply .18s ease-out both; }
}
@keyframes hunt-preview-type { 0%,60%,100% { opacity:.45; transform:translateY(0); } 30% { opacity:1; transform:translateY(-2px); } }
@keyframes hunt-preview-reply { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:translateY(0); } }
.hunt-preview-bubble.hunt-preview-you { align-self:flex-end; background:#E9D7E2; border-radius:12px 3px 12px 12px; }
.hunt-preview-chat-composer { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:14px 16px 18px; background:#FAF8F5; border-top:1px solid #E5E1DA; color:#5D2440; font-size:11px; text-decoration:none; font-weight:700; }
.hunt-preview-chat-composer > span:first-child { flex:1; padding:9px 12px; border:1px solid #D6C1CC; border-radius:20px; }
.hunt-preview-chat-composer > span:last-child { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:#5D2440; color:#FFF; font-size:18px; }

/* Say When: identity, size, condition, finish line, exact-item promise. */
.hunt-preview-terms { padding:14px 22px 20px; }
.hunt-preview-sheet-handle { flex:0 0 auto; width:40px; height:4px; margin:0 auto 20px; border-radius:2px; background:#D6D1CA; }
.hunt-preview-terms h4 { margin-bottom:20px; color:#5D2440; font-size:27px; line-height:1.15; }
.hunt-preview-item { display:flex; align-items:center; gap:12px; margin-bottom:17px; }
.hunt-preview-item img { flex:0 0 auto; width:54px; height:72px; object-fit:contain; border-radius:12px; background:#F2EEE8; }
.hunt-preview-item > div { min-width:0; }
.hunt-preview-item b { display:block; font-size:13px; line-height:1.4; }
.hunt-preview-item span, .hunt-preview-item small { display:block; margin-top:3px; color:#4A4A47; font-size:10px; line-height:1.5; }
.hunt-preview-field { margin:0 0 17px; }
.hunt-preview-field > b { display:block; margin-bottom:8px; color:#4A4A47; font-size:10px; line-height:1.5; letter-spacing:.03em; }
.hunt-preview-chips { display:flex; flex-wrap:wrap; gap:6px; }
.hunt-preview-chips > span { display:flex; align-items:center; justify-content:center; min-height:42px; padding:9px 12px; border:1.5px solid #E5E1DA; border-radius:14px; background:#FFF; color:#4A4A47; font-size:11px; font-weight:700; }
.hunt-preview-chips > .is-selected { border:2px solid #8B3A62; background:#F4E6EC; color:#5D2440; }
.hunt-preview-field > p { margin-top:7px; color:#666; font-size:10px; line-height:1.5; }
.hunt-preview-price-input { display:flex; align-items:center; gap:14px; min-height:48px; padding:10px 14px; border:1px solid #C7A9BA; border-radius:12px; }
.hunt-preview-price-input > span { color:#5D2440; font-size:11px; font-weight:700; }
.hunt-preview-price-input strong { font-size:18px; line-height:1.5; }
.hunt-preview-terms-footer { margin-top:auto; padding-top:8px; }
.hunt-preview-cta { display:flex; align-items:center; justify-content:center; min-height:48px; width:100%; padding:11px 12px; border-radius:14px; background:#5D2440; color:#FFF; text-align:center; font-size:13px; font-weight:600; line-height:1.5; }
.hunt-preview-terms-footer > p { margin-top:10px; color:#666; text-align:center; font-size:10px; line-height:1.5; }

/* Started: the implemented plum surface, mint search mark and three-step rail. */
.hunt-preview-started { padding:28px 24px 22px; background:#2B1220; color:#FFF; }
.hunt-preview-search-mark { display:flex; flex:0 0 auto; align-items:center; justify-content:center; width:54px; height:54px; margin-bottom:16px; border-radius:50%; background:#6EE7A829; color:#6EE7A8; }
.hunt-preview-search-mark svg { display:block; width:29px; height:29px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.hunt-preview-started h4 { margin-bottom:12px; color:#FFF; font-size:34px; line-height:1.1; }
.hunt-preview-started-sub { color:#FFFFFFD1; font-size:13px; line-height:1.7; }
.hunt-preview-rail { margin:28px 0 0; padding:0; list-style:none; }
.hunt-preview-rail li { position:relative; padding:0 0 23px 26px; }
.hunt-preview-rail li::before { content:''; position:absolute; top:4px; left:0; width:11px; height:11px; border:2px solid #F7C9DD; border-radius:50%; }
.hunt-preview-rail li:first-child::before { border-color:#6EE7A8; background:#6EE7A8; }
.hunt-preview-rail li:not(:last-child)::after { content:''; position:absolute; top:15px; bottom:-4px; left:4.5px; width:2px; background:#FFFFFF2E; }
.hunt-preview-rail b { display:block; color:#FFF; font-size:12px; line-height:1.5; }
.hunt-preview-rail p { margin-top:4px; color:#FFFFFFC7; font-size:12px; line-height:1.65; }
.hunt-preview-started-footer { margin-top:auto; padding-top:18px; }
.hunt-preview-cta.on-plum { background:#FFF; color:#5D2440; }
.hunt-preview-quiet { display:block; padding:14px 0 0; color:#FFFFFFD1; font-size:12px; font-weight:600; text-align:center; }

/* Found: real merchant photo and dated own-listing markdown, not a simulated
 * retailer result or certification. The source link stays available to inspect. */
.hunt-preview-found { background:#2B1220; color:#FFF; }
.hunt-preview-found-photo { position:relative; flex:0 0 37%; min-height:0; background:#FFF; }
.hunt-preview-found-photo img { display:block; width:100%; height:100%; max-width:100%; padding:0; object-fit:cover; object-position:center 72%; }
.hunt-preview-found-photo::after { content:''; position:absolute; inset:56% 0 0; background:linear-gradient(0deg,#2B1220 0%,#2B122000 100%); }
.hunt-preview-found-photo > span { position:absolute; right:22px; bottom:15px; left:22px; z-index:1; color:#FFFFFFEB; font-size:10px; line-height:1.5; }
.hunt-preview-found-band { display:flex; flex-direction:column; gap:5px; padding:8px 22px 0; }
.hunt-preview-eyebrow { display:block; color:#F7C9DD; font-size:10px; font-weight:600; line-height:1.5; letter-spacing:.04em; }
.hunt-preview-found-band h4 { color:#FFF; font-size:44px; line-height:1.05; letter-spacing:-.035em; }
.hunt-preview-found-band > p { color:#FFFFFFD1; font-size:13px; line-height:1.6; }
.hunt-preview-found-band > .hunt-preview-payoff { margin-top:5px; color:#F7C9DD; font-size:11px; line-height:1.5; }
.hunt-preview-found-price { display:block; margin-top:6px; color:#FFF; font-size:29px; font-weight:600!important; line-height:1.2; font-variant-numeric:tabular-nums; }
.hunt-preview-found-reference { display:block; color:#FFFFFFB8; font-size:11px; line-height:1.5; }
.hunt-preview-found-facts { margin:8px 0 0; padding:0; list-style:none; color:#FFFFFFEB; font-size:11px; line-height:1.6; }
.hunt-preview-found-facts li + li { margin-top:4px; }
.hunt-preview-found-footer { margin-top:auto; padding:10px 22px 14px; }
.hunt-preview-found-footer > span:first-child { display:block; margin-bottom:10px; color:#FFFFFFB8; font-size:9px; line-height:1.5; }
.hunt-preview-found-footer .hunt-preview-cta { font-size:12px; }
@container world-preview (max-width:500px) {
  .hunt-preview #hunt-story-stage .hunt-preview-panel { grid-template-columns:1fr; gap:18px; }
  .hunt-preview-dialogue { max-width:330px; margin:0 auto; width:100%; }
  .hunt-preview-dialogue h3 { font-size:30px; }
  .hunt-preview-comment { display:inline-block; width:calc(50% - 8px); vertical-align:top; }
  .hunt-preview-comment.carrie { margin-left:12px; }
}
@media (max-width:900px) {
  .world-walkthrough { width:calc(100% - 40px); padding:56px 0 64px; }
  .world-walkthrough #world-hunt-story { display:block; }
  .hunt-walkthrough-copy { padding-top:0; margin-bottom:28px; }
  .world-walkthrough .hunt-story-heading { margin:0 0 28px; }
  .world-walkthrough .hunt-story-steps, .world-walkthrough .hunt-story-controls, .world-walkthrough .hunt-story-proof { margin-left:auto; margin-right:auto; max-width:400px; }
  .world-walkthrough .hunt-story-controls { margin-top:18px; }
}
@media (max-width:760px) {
  .hunt-preview #hunt-story-stage .hunt-preview-panel { grid-template-columns:1fr; gap:20px; }
  .hunt-preview-dialogue { max-width:330px; width:100%; margin:0 auto; }
  .hunt-preview-dialogue h3 { font-size:32px; }
  .hunt-preview .hunt-story-steps { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .hunt-preview .hunt-story-steps button { display:block; text-align:center; font-size:10px; overflow-wrap:normal; }
  .hunt-preview .hunt-story-steps button > span:first-child { display:block; margin-bottom:3px; }
}
@media (max-width:360px) {
  .hunt-preview-device { height:650px; border-width:5px; border-radius:30px; }
  .hunt-preview-screen { border-radius:25px; }
  .hunt-preview-chat-head { padding:14px; }
  .hunt-preview-chat-body { padding:13px; gap:8px; }
  .hunt-preview-photo img { height:150px; }
  .hunt-preview-terms { padding:12px 17px 18px; }
  .hunt-preview-terms h4 { font-size:25px; margin-bottom:16px; }
  .hunt-preview-field { margin-bottom:14px; }
  .hunt-preview-chips > span { padding:9px 10px; font-size:10px; }
  .hunt-preview-started { padding:24px 20px 20px; }
  .hunt-preview-started h4 { font-size:32px; }
  .hunt-preview-started-sub { font-size:12px; }
  .hunt-preview-rail { margin-top:23px; }
  .hunt-preview-rail li { padding-bottom:19px; }
  .hunt-preview-rail p { font-size:11px; }
  .hunt-preview-found-band { padding-right:18px; padding-left:18px; gap:6px; }
  .hunt-preview-found-band h4 { font-size:40px; }
  .hunt-preview-found-band > p { font-size:12px; }
  .hunt-preview-found-reference, .hunt-preview-found-facts { font-size:10px; }
  .hunt-preview-found-footer { padding:12px 18px 18px; }
  .hunt-preview-found-footer > span:first-child { font-size:8px; }
}