/* The sticker's own character, in the existing Sunset Classic palette. */
.qr-scene { position: relative; display: grid; grid-template-columns: 92px minmax(0,1fr); gap: 12px; margin: 12px auto 28px; padding: 24px 16px 18px; max-width: 760px; border: 2px solid var(--color-coral, #E4573D); border-radius: 8px; background: var(--color-paper, #FFF9EE); color: var(--color-ink, #1F1F1F); font-family: var(--font-sans, Inter, sans-serif); box-sizing: border-box; }
.qr-scene [hidden] { display: none !important; }
.qr-scene { overflow-wrap: anywhere; }
.qr-scene__copy { min-width: 0; }
.qr-scene__buttons > * { max-width: 100%; }
/* The visiting coconut takes the place of the calendar's empty-state illustration. */
.qr-scene ~ .results .empty > .coconut { display: none; }
.qr-scene__close { position: absolute; top: 0; right: 0; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: inherit; font: 26px/1 sans-serif; cursor: pointer; }
.qr-scene__drawing { align-self: start; margin-top: 12px; overflow: hidden; }
.qr-scene__drawing svg { width: 100%; height: auto; display: block; }
.qr-scene p { margin: 0; }
.qr-scene__placement { font-size: 12px; line-height: 1.4; padding-right: 22px; color: var(--color-ocean, #256C99); overflow-wrap: anywhere; }
.qr-scene .qr-scene__line { font-family: var(--font-display, Oswald, sans-serif); font-size: 25px; line-height: 1.2; margin: 8px 0; overflow-wrap: anywhere; }
.qr-scene .qr-scene__landmark { font-size: 13px; line-height: 1.4; margin: 0 0 10px; }
.qr-scene__buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.qr-scene__buttons button, .qr-scene__buttons a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; box-sizing: border-box; padding: 8px 12px; font: inherit; font-size: 14px; border: 1px solid currentColor; border-radius: 5px; background: transparent; color: inherit; cursor: pointer; text-decoration: none; }
.qr-scene__buttons button { background: var(--color-ink, #1F1F1F); color: var(--color-paper, #FFF9EE); }
.qr-scene__suggestions { grid-column: 1 / -1; border-top: 1px solid var(--color-coral, #E4573D); padding-top: 12px; }
.qr-scene__scope { font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.qr-scene .qr-scene__weather { font-size: 13px; line-height: 1.5; }
.qr-scene [data-qr-weather-link] { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-ocean); }
.qr-scene ul { list-style: none; padding: 0; margin: 4px 0 0; }
.qr-scene li + li { border-top: 1px solid var(--color-line, #D8C7B2); }
.qr-scene li a { display: block; padding: 10px 0; min-height: 44px; text-decoration: none; color: inherit; }
.qr-scene li strong { display: block; font-weight: 600; font-size: 15px; }
.qr-scene li span { display: block; margin-top: 3px; font-size: 12px; line-height: 1.4; }
.qr-scene [data-qr-empty] { margin: 8px 0; font-size: 14px; line-height: 1.5; }
.qr-scene [data-qr-all] { display: inline-flex; align-items: center; min-height: 44px; color: var(--color-ocean, #256C99); }
.qr-scene :focus-visible { outline: 3px solid var(--color-ocean, #256C99); outline-offset: 3px; }
@media (max-width: 340px) { .qr-scene { grid-template-columns: 64px minmax(0, 1fr); gap: 8px; padding: 24px 12px 16px; } .qr-scene .qr-scene__line { font-size: 22px; } }
@media (min-width: 640px) { .qr-scene { grid-template-columns: 150px minmax(0, 1fr); padding: 24px; } .qr-scene .qr-scene__line { font-size: 32px; } }
@media (prefers-reduced-motion: reduce) { .qr-scene *, .qr-scene *::before { transition: none !important; animation: none !important; } }
/* Print-specific props stay flat; only the existing shell is photographic. */
.qr-prop { display: none; }
.qr-scene[data-actor="glasses"] .qr-prop--glasses,
.qr-scene[data-actor="toast"] .qr-prop--toast,
.qr-scene[data-actor="hide"] .qr-prop--paper,
.qr-scene[data-actor="press"] .qr-prop--cover,
.qr-scene[data-actor="lineup"] .qr-prop--cover,
.qr-scene[data-actor="lineup"] .qr-prop--lineup,
.qr-scene[data-actor="camera"] .qr-prop--camera,
.qr-scene[data-actor="photo"] .qr-prop--camera,
.qr-scene[data-actor="kisses"] .qr-prop--kisses,
.qr-scene[data-actor="kisses"] .qr-prop--napkin,
.qr-scene[data-actor="label"] .qr-prop--kisses,
.qr-scene[data-actor="drink"] .qr-prop--drink,
.qr-scene[data-actor="inside"] .qr-prop--inside,
.qr-scene[data-actor="box"] .qr-prop--box,
.qr-scene[data-actor="hug"] .qr-prop--hug,
.qr-scene[data-actor="hug"] .qr-prop--mat,
.qr-scene[data-actor="mat"] .qr-prop--mat { display: block; }
.qr-scene[data-actor="press"] .qr-scene__eyes,
.qr-scene[data-actor="lineup"] .qr-scene__eyes,
.qr-scene[data-actor="press"] .qr-scene__arms-open,
.qr-scene[data-actor="lineup"] .qr-scene__arms-open,
.qr-scene[data-actor="hug"] .qr-scene__arms-open { display: none; }
.qr-scene[data-actor] .qr-scene__edge, .qr-scene[data-actor] .qr-scene__microphone { display: none; }
.qr-scene[data-utility="true"] { display: block; border-color: var(--color-line); }
.qr-scene[data-utility="true"] .qr-scene__line { font-size: 21px; padding-right: 16px; }
.qr-scene__replies { margin: 12px 0; }
.qr-scene__replies [aria-pressed="true"] { background: var(--color-ocean); }
.qr-scene__replies button:disabled { opacity: .65; cursor: default; }
.qr-scene .qr-scene__context { font-size: 13px; line-height: 1.45; margin-top: 8px; }
.qr-scene .qr-scene__callback { font-size: 14px; line-height: 1.5; border-left: 3px solid var(--color-ocean); padding-left: 10px; margin-top: 14px; }
.qr-scene[data-actor="box"] .qr-scene__actor { transform: rotate(180deg); }
.qr-scene[data-actor="box"][data-turned="true"] .qr-scene__actor { transform: rotate(0deg); }
.qr-scene[data-actor="drink"] .qr-straw { transform-origin: 39px 172px; transition: transform .4s; }
.qr-scene[data-actor="drink"][data-reaction="nod"] .qr-straw { transform: rotate(-28deg); }
.qr-depth { transform-origin: 120px 112px; transform: scale(calc(1 + var(--qr-depth, 0) * .12)); transition: transform .45s; }
.qr-scene[data-reaction="nod"] .qr-scene__drawing { animation: qr-nod .4s ease-out; }
.qr-scene[data-reaction="tilt"] .qr-scene__drawing { animation: qr-tilt .45s ease-out; }
@keyframes qr-nod { 50% { transform: translateY(5px); } }
@keyframes qr-tilt { 50% { transform: rotate(-5deg); } }
.qr-scene[data-actor="box"] .qr-prop--smile { display: block; }
.qr-scene[data-actor="box"] .qr-scene__mouth { display: none; }
/* Replies and useful exits use the full phone width, so the page stays within reach. */
.qr-scene[data-actor] { display: flow-root; }
.qr-scene[data-actor] .qr-scene__drawing { float: left; width: 82px; margin: 8px 14px 8px 0; }
.qr-scene[data-actor] .qr-scene__replies { clear: both; }
.qr-scene[data-actor] .qr-scene__suggestions { clear: both; margin-top: 14px; }
.qr-scene[data-actor] .qr-scene__line { padding-right: 10px; }
.qr-scene[data-actor] .qr-scene__edge { display: none !important; }
@media (min-width: 640px) { .qr-scene[data-actor] .qr-scene__drawing { width: 130px; } }