/* Tactile, thumb-friendly selection. Motion supports feedback, never progress. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.journey-progress{display:flex;gap:20px;list-style:none;padding:0;margin:0;font-size:12px}
.journey-progress li{display:flex;gap:7px;align-items:center;color:#746c77}
.journey-progress li>span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#f1eef3}
.journey-progress [aria-current=step]{color:#352638;font-weight:700}
.journey-progress [aria-current=step]>span{background:#f8b7cf;box-shadow:0 0 0 4px #fff0f6}
.journey-progress .complete>span{background:#d5f0ed;color:#23594f}
.picker-prompt{max-width:720px;text-wrap:balance;line-height:1.08}
.picker-instruction{font-size:14px;color:#625869;margin:-10px 0 24px}
.theme-tabs{gap:10px;padding:8px 4px 18px;scrollbar-width:thin;scroll-padding:4px}
.chip{border-color:#ded9e1;box-shadow:0 3px 0 #eee9ef;transition:transform .16s,box-shadow .16s,background-color .16s}
.chip[aria-pressed=true]{background:#d5f0ed;border-color:#4a9286;box-shadow:0 3px 0 #a8d5cc}
.photo-pick{border:2px solid #eee8ef;border-radius:14px;padding:7px;background:white;box-shadow:0 5px 0 #eee8ef;transition:transform .16s,box-shadow .16s,border-color .16s;touch-action:manipulation}
.photo-pick .photo{position:relative;height:auto;aspect-ratio:1.12;border-radius:8px;overflow:hidden}
.photo-pick .caption{font-size:17px;font-weight:600;padding:14px 8px 10px;line-height:1.3}
.photo-pick .caption small{display:block;font-size:12px;font-weight:400;color:#625869;margin-top:7px}
.photo-pick[aria-pressed=true]{background:#effaf7;border-color:#398478;box-shadow:0 5px 0 #b6ded4}
.theme-card{border-radius:14px;transition:transform .16s,box-shadow .16s}
.theme-card[aria-pressed=true]{box-shadow:0 4px 0 #b6ded4}
.photo-pick:active,.theme-card:active,.chip:active,.style-choice:active,.palette-button:active{transform:translateY(3px) scale(.985);box-shadow:none}
.photo-pick:focus-visible,.theme-card:focus-visible,.chip:focus-visible,.mini-pick:focus-visible,.button:focus-visible{outline:3px solid #352638;outline-offset:4px}
.tray{background:#edf8f6;border:0;border-radius:16px;padding:20px;margin:30px 0}
.collection-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px}
.collection-heading h3{font-size:17px;margin:0}.collection-heading h3 span{font-size:13px;font-weight:400;margin-left:8px}
.tray-items{flex-wrap:nowrap;overflow:auto;padding:4px 3px 10px;min-height:80px}
.mini-pick{flex:0 0 68px;width:68px;height:72px;border:3px solid white;border-radius:6px;box-shadow:0 3px 5px #35263815;touch-action:manipulation}
.mini-pick span{width:23px;height:23px;font-size:18px;line-height:23px}
.action-bar{padding-bottom:max(14px,env(safe-area-inset-bottom));box-shadow:0 -6px 24px #35263806}
.action-bar .button{min-height:50px;box-shadow:0 4px 0 #d48ba9;transition:transform .16s,box-shadow .16s}.action-bar .button:active{transform:translateY(3px);box-shadow:0 1px 0 #d48ba9}
.app-shell[data-step="2"] .cloud-status{font-size:12px;border-bottom:1px solid #eee8ef;margin-bottom:22px}
.app-shell[data-step="2"] .account-actions{margin:8px 0;gap:12px}.app-shell[data-step="2"] .account-actions .button{font-size:12px;padding:8px 12px;min-height:44px}
@media(hover:hover){.photo-pick:hover,.theme-card:hover{transform:translateY(-3px)}.chip:hover{transform:translateY(-1px)}}
@media(max-width:760px){
 .app-top{align-items:flex-start;flex-direction:column;gap:16px}.journey-progress{width:100%;justify-content:space-between;gap:8px;font-size:11px}.journey-progress li{gap:5px}
 .pick-grid{grid-template-columns:1fr;gap:20px}.photo-pick .photo{aspect-ratio:1.3}.photo-pick .caption{font-size:18px}
 .collection-heading{align-items:flex-start;flex-direction:column;gap:4px}.tray{padding:16px}.picker-prompt{font-size:38px}
 .action-bar{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 16px;padding-left:18px;padding-right:18px}
 .action-bar .hint{grid-column:2;grid-row:1;max-width:none;text-align:right}.action-bar .button{grid-column:2;grid-row:2;width:100%;font-size:14px}
 .action-bar .link-button{grid-column:1;grid-row:2;min-width:54px;min-height:48px}.app-shell{padding-bottom:150px}
 .action-bar>span.hint:first-child{grid-column:1;grid-row:1 / 3;text-align:left;max-width:90px}
}
@media(prefers-reduced-motion:reduce){.photo-pick,.theme-card,.chip,.action-bar .button{transition:none;animation:none}.photo-pick:hover,.theme-card:hover,.chip:hover,.photo-pick:active,.theme-card:active,.chip:active,.style-choice:active,.palette-button:active,.action-bar .button:active{transform:none}}

/* A touch-lit rim. The image stays clear; illumination lives outside its border. */
@property --halo-angle{syntax:'<angle>';initial-value:0deg;inherits:true}
.photo-pick{--halo-angle:0deg;isolation:isolate;overflow:visible;touch-action:pan-y pinch-zoom;transition:transform .16s,box-shadow .22s,border-color .22s,background-color .22s}
.photo-pick::before,.photo-pick::after{content:'';position:absolute;inset:-3px;border-radius:17px;pointer-events:none;opacity:0;transition:opacity .22s}
.photo-pick::before{inset:-7px;z-index:-1;background:conic-gradient(from var(--halo-angle),#f6aad500,#efa3d6a6,#d3c4fc90,#87ded7a6,#f6aad500);filter:blur(12px)}
.photo-pick::after{padding:2px;background:conic-gradient(from var(--halo-angle),#f8b7cf25,#f7bee5,#ffffff,#a9f0e6,#f8b7cf25);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude}
.photo-pick[aria-pressed=true]{border-color:#75bfb2;box-shadow:0 3px 0 #c9e9e1,0 0 15px #a4ded533}
.photo-pick[aria-pressed=true]::before{opacity:.28}.photo-pick[aria-pressed=true]::after{opacity:.55}
.photo-pick.is-touching{transform:translateY(2px) scale(.985);border-color:#efb7d2;box-shadow:0 1px 0 #dcc8d7,0 0 22px #e6b6db44}
.photo-pick.is-touching::before,.photo-pick.is-touching::after{opacity:1}
.photo-pick.is-confirming::before{animation:halo-bloom .7s ease-out}.photo-pick.is-confirming::after{opacity:1;animation:halo-travel .7s ease-out}
@keyframes halo-bloom{0%{opacity:.85}35%{opacity:1}100%{opacity:.28}}
@keyframes halo-travel{from{--halo-angle:0deg;opacity:1}to{--halo-angle:360deg;opacity:.55}}
@media(prefers-reduced-motion:reduce){
 .photo-pick,.photo-pick::before,.photo-pick::after{transition:none;animation:none!important}
 .photo-pick.is-touching{transform:none}.photo-pick::before{display:none}
 .photo-pick.is-touching::after,.photo-pick[aria-pressed=true]::after{opacity:.8;background:#9cded2}
}

/* The theme rail and collection dock stay mounted while the pictures change. */
.theme-tabs{position:relative}.theme-tabs .chip{position:relative;z-index:1}
.theme-active-light{position:absolute;left:0;top:56px;height:3px;background:linear-gradient(90deg,#f0b8d4,#9cded2);border-radius:8px;pointer-events:none;transition:transform .28s cubic-bezier(.2,.7,.3,1),width .28s;box-shadow:0 0 9px #c3d9df80}
.collection-dock{grid-column:1 / -1;display:flex;align-items:center;gap:12px;border:0;border-radius:12px;padding:8px 12px;background:#f0f9f7;color:var(--ink);text-align:left;min-height:54px;font:inherit;cursor:pointer;width:100%}
.collection-dock strong{display:block;font-size:13px}.collection-dock small{display:block;font-size:11px;color:#625869;margin-top:2px}.dock-arrow{margin-left:auto;font-size:20px}
.dock-photos{display:flex;gap:3px;align-items:center;flex-shrink:0}.dock-photo{position:relative;display:block;width:32px;height:36px;border:2px solid white;border-radius:5px;box-shadow:0 2px 4px #35263818}.dock-photo small{position:absolute;bottom:0;left:0;background:#352638b8;color:white;font-size:7px;padding:0 2px}.dock-empty{display:grid;place-items:center;width:32px;height:36px;border:1px dashed #91bcb4;border-radius:5px;color:#3d756b}
.collection-dock:active{background:#dff1ec}.collection-dock:focus-visible{outline:3px solid #352638;outline-offset:2px}
.action-bar:has(.collection-dock){display:grid;grid-template-columns:auto 1fr auto;gap:9px 20px}.action-bar:has(.collection-dock)>.hint{text-align:right}.app-shell[data-step="2"]{padding-bottom:210px}.collection-flight{position:fixed;z-index:40;transform-origin:top left;border-radius:9px;overflow:hidden;pointer-events:none;box-shadow:0 5px 24px #35263826;will-change:transform,opacity}.collection-flight .check{display:none}
@media(max-width:760px){
 .action-bar:has(.collection-dock){grid-template-columns:auto minmax(0,1fr);gap:6px 16px}
 .action-bar:has(.collection-dock) .collection-dock{grid-row:1;padding:7px 10px;gap:9px}
 .action-bar:has(.collection-dock)>.hint{grid-row:2;font-size:10px}
 .action-bar:has(.collection-dock)>.button,.action-bar:has(.collection-dock)>.link-button{grid-row:3}
 .dock-photo{width:28px;height:32px}.collection-dock strong{font-size:12px}.collection-dock small{font-size:10px}.dock-photo small{font-size:7px}
 .app-shell[data-step="2"]{padding-bottom:240px}
}
@media(prefers-reduced-motion:reduce){.theme-active-light{transition:none}.collection-flight{display:none}}

/* Selection reads like a kept photograph, without a corner control or badge. */
.photo-pick{border:1px solid #eee8ef;padding:8px;background:#fff;border-radius:10px;box-shadow:0 3px 14px #3526380a,0 1px 2px #35263809}
.photo-pick .photo{border-radius:5px}
.photo-pick::after{border-radius:13px}
.photo-pick[aria-pressed=true]{background:#fff;border-color:#ded3df;box-shadow:0 8px 22px #70567512,0 2px 5px #3526380c}
.photo-pick .caption small{position:relative;width:fit-content;min-height:29px;line-height:29px;margin-top:4px;font-size:12px}
.photo-pick[aria-pressed=true] .caption small{font:400 23px/29px 'Yellowtail',cursive;color:#49364d}
.photo-pick[aria-pressed=true] .caption small::after{content:'';position:absolute;left:-2px;right:-8px;bottom:1px;height:5px;border-bottom:2px solid #d6a4bd;border-radius:0 0 60% 40%;transform:rotate(-2deg);opacity:.7}
.theme-card .theme-note{display:block;font-size:11px;line-height:24px;min-height:24px;font-weight:400;margin-top:6px;letter-spacing:.01em}
.theme-card[aria-pressed=true]{border-color:#edc9da;box-shadow:0 0 0 2px #d5f0ed,0 6px 18px #a781a322}
.theme-card[aria-pressed=true] .theme-note{font:400 21px/24px 'Yellowtail',cursive;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:#f8b7cf}

/* Editorial theme navigation: type and a moving rule, not a row of pills. */
.theme-tabs{gap:27px;padding:2px 0 12px;border-bottom:1px solid #e3e7e5;scrollbar-width:thin;scroll-padding:0}
.theme-tabs .chip{border:0;border-radius:0;box-shadow:none;background:transparent;color:#707573;padding:12px 0;font-size:13px;letter-spacing:.005em;min-height:47px;transition:color .18s}
.theme-tabs .chip[aria-pressed=true]{background:transparent;border:0;box-shadow:none;color:#283c37;font-weight:600}
.theme-tabs .chip:hover,.theme-tabs .chip:active{transform:none;box-shadow:none;color:#283c37}
.theme-tabs .theme-active-light{top:50px;height:2px;border-radius:0;background:linear-gradient(90deg,#ae7a93,#629c92);box-shadow:none}
@media(max-width:760px){.theme-tabs{gap:24px}.theme-tabs .chip{font-size:12px}}
