/* Visual match to the supplied LIFF screens. Artwork is framed from originals. */
:root{--rr-canvas:#effbf8;--rr-mint-soft:#dff7ef;--rr-text:#123943;--rr-muted:#68878a;--rr-brand:#177a70;--rr-brand-strong:#105e59;--rr-deal:#e95663;--rr-border:#dbefea;--rr-surface:#fff;--shadow:0 7px 22px #206d5810}
body{background:#e5f5ef}
.garden-shell{background:radial-gradient(ellipse at 100% 20%,#d6f4e980,transparent 42%),radial-gradient(ellipse at 0 4%,#dcf8ef,transparent 38%),#effbf8}
.app-header{padding-top:12px;padding-bottom:5px;background:transparent}
.mode-strip{color:#537b74;background:#dff6edb0;font-size:11px!important;padding:5px 12px;margin:0 16px;border-radius:10px}
.hero{min-height:225px;padding:24px 20px 12px;isolation:isolate;background:transparent;overflow:hidden}
.hero-copy{max-width:57%;position:relative;z-index:3}
.hero-copy h1{font-weight:800;font-size:27px;line-height:1.26;letter-spacing:-.7px;color:#123943}
.hero-copy>p{color:#437c79;font-size:15px;line-height:1.5;margin-top:9px}
.hero .eyebrow{margin-bottom:6px;color:var(--teal)}
.hero-compact{min-height:190px;padding-top:24px}
[data-screen=tracking] .hero,[data-screen=watch] .hero,[data-screen=search] .hero{min-height:125px}
[data-screen=tracking] .hero-copy,[data-screen=watch] .hero-copy,[data-screen=search] .hero-copy{max-width:100%}
[data-screen=tracking] .hero-visual,[data-screen=watch] .hero-visual,[data-screen=search] .hero-visual{display:none}
.hero-kind-sale .handnote,.hero-kind-deals .handnote,.hero-kind-goal .handnote{display:none}
.hero-compact .hero-visual{width:46%;right:-2px;bottom:0;height:180px}
.hero-visual .sun-disc{background:radial-gradient(circle,#c7f2e299,#e4f8ee55 68%,transparent 70%);opacity:.7}
.hero-visual .handnote{top:5px;right:12px;font-size:11px;color:#72a398;line-height:1.4}
.hero-visual .mascot-button{inset:0;display:flex;align-items:flex-end;justify-content:center}
.hero .mascot-button .reference-rop{width:100%;height:auto;max-height:185px;animation:reference-breathe 5s ease-in-out infinite}
.reference-rop{display:block;overflow:hidden;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(transparent,#000 4%,#000 96%,transparent);mask-composite:intersect}
.hero .hero-spark{color:#ffc64c;font-size:25px}
.hero .spark-one{left:0;top:55px}.hero .spark-two{right:3px;bottom:18px}
.foliage{opacity:.72;z-index:-1;width:90px;height:150px;bottom:-15px}
.foliage i{background:linear-gradient(45deg,#8dc6ac90,#bde7d399);width:32px;height:64px}
.cloud{opacity:.9;z-index:0}.cloud-one{top:15px;left:48%}.cloud-two{bottom:20px}
.hero-centered{display:block;padding:21px 0 0;text-align:center;min-height:0}
.hero-centered .hero-copy{max-width:100%;padding:0 20px}
.hero-centered .hero-copy h1{font-size:26px}
.hero-centered .hero-copy>p{font-size:15px;margin-top:6px}
.hero-centered .hero-visual{position:relative;inset:auto;width:100%;height:auto;margin:0}
.hero-centered .mascot-button{position:relative;inset:auto;min-height:0!important;width:100%;height:auto;display:block}
.hero-centered .mascot-button .reference-rop{width:100%;height:auto;max-height:none;animation:none;mask-image:linear-gradient(transparent,#000 3%,#000 97%,transparent)}
.hero-centered .handnote,.hero-centered .sun-disc,.hero-centered .hero-spark{display:none}
.home-hero{min-height:260px}.home-hero .hero-visual{width:47%;right:0;bottom:0}
.home-hero .hero-copy h1{font-size:31px}.home-hero .hero-small{font-size:14px}
.page-body,.flow-body{padding:8px 16px 24px}
.button.primary,.search-box button{background:linear-gradient(115deg,#258f80,#11655f);color:#fff;border:0;box-shadow:0 6px 13px #207b6c0b}
.button.primary{font-size:17px!important;font-weight:700;min-height:52px!important;border-radius:20px}
.button.outline{border:1px solid #328e82;background:#ffffff90;color:#216e68;border-radius:20px}
.button:active{transform:scale(.98)}
.preset-grid button{transition:background .18s,transform .18s,box-shadow .18s}
.preset-grid button:active{transform:scale(.96)}
.product-card{animation:card-arrive .38s both}.product-card:nth-child(2){animation-delay:.06s}.product-card:nth-child(3){animation-delay:.12s}
.success-scene.reference-scene>.reference-rop{animation:celebrate-arrive .65s cubic-bezier(.2,.8,.2,1) both}
.flow-card,.target-card,.detail-product,.chart-card,.settings-card,.product-card,.notification-item{border:1px solid #ffffffc9;border-radius:20px;box-shadow:0 5px 20px #45897606}
.flow-card{padding:16px;margin-bottom:12px}
.flow-card h2,.section-heading h2{font-size:19px;line-height:1.4}
.flow-card .section-heading{flex-wrap:nowrap;gap:8px}.flow-card .section-heading h2{font-size:17px}
.flow-card .section-heading .text-button{font-size:12px!important;white-space:nowrap;padding:4px 0}
.flow-field{background:#fcfefd;border-color:#d9e4e2;border-radius:14px;min-height:48px;padding:12px;font-size:14px!important}
.flow-card .full{margin-top:10px}.flow-card .fine-print{margin-top:8px}
.intake-card .section-heading{margin-bottom:0}.intake-card h2{font-size:17px;margin-bottom:2px}
.input-divider{display:flex;align-items:center;gap:10px;font-size:12px;color:#77908b;margin:10px 0}
.input-divider:before,.input-divider:after{content:'';height:1px;flex:1;background:#dce8e5}
.inline-search{display:flex;align-items:center;border:1px solid #d9e4e2;border-radius:14px;background:#fcfefd;margin-top:8px}
.inline-search .flow-field{border:0;background:none;margin:0}.inline-search .icon-button{flex-shrink:0;color:#247d70}
.intake-source-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0}
.source-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;background:#f3faf7;border:1px solid #e6eeeb;border-radius:14px;padding:5px 10px}
.source-pill .source-badge{width:20px;height:24px;font-size:16px;border-radius:5px}
.source-note{background:#dff7ef;border-radius:18px;padding:16px;display:flex;gap:12px;margin-top:14px;color:#246c63}
.source-note strong{font-size:16px}.source-note p{font-size:12px;line-height:1.6}.source-note>.icon{flex-shrink:0}
.flow-steps{margin:2px 0 12px;gap:4px}
.flow-steps li{font-size:10px;gap:4px;flex-direction:row;justify-content:center}
.flow-steps li>span{width:21px;height:21px;flex-shrink:0;font-size:10px}.flow-steps li:before{display:none}
.flow-scope{font-size:11px;margin:0 0 10px;color:#537b74}
.supported-source{padding:10px 0 0;margin-top:10px;gap:8px}.source-badge{width:30px;height:34px;border-radius:8px;font-size:20px}
.supported-source small{font-size:11px}.supported-source strong{font-size:13px}
[data-screen=add] .flow-body{margin-top:-9px;position:relative;z-index:3}
[data-screen=add] .flow-steps{padding:8px 0;background:#effbf8bb;border-radius:10px}
[data-screen=add] .flow-card .button.soft{display:inline-flex;width:auto;padding:5px 12px;font-size:12px!important;background:#e5f8f1;border-radius:12px;margin:0 0 0 auto}
[data-screen=add-confirm] .hero{min-height:185px}
.confirm-tip,.mascot-banner,.target-tip{background:linear-gradient(115deg,#ddf8ed,#e8faf5);border:0;border-radius:20px;overflow:hidden}
.confirm-tip{padding:12px 12px 0 0;gap:8px;margin:14px 0}
.confirm-tip .reference-rop{width:40%;height:auto;min-width:100px;max-width:155px}
.confirm-tip h2{font-size:18px}.confirm-tip p{font-size:13px;line-height:1.6}
.mascot-banner{min-height:114px;padding:10px 12px 0 0;gap:6px;margin-top:15px}
.banner-art{width:110px;min-width:95px;max-width:120px;align-self:flex-end}
.banner-art .reference-rop{width:100%;height:auto;max-height:110px;transform:none}
.mascot-banner strong{font-size:16px;line-height:1.4}.mascot-banner small{font-size:13px;line-height:1.55}
.flow-actions{margin-top:14px}.flow-actions .button{font-size:16px!important}
.flow-body .compact-product,.compact-product{grid-template-columns:100px minmax(0,1fr);gap:12px;padding:14px}
.compact-product .detail-image{height:120px;background:#f6f8f7;border-radius:13px}
.compact-product .detail-copy h2{font-size:17px!important;line-height:1.4}.compact-product .detail-copy p{font-size:13px}
.compact-product .price-line strong{font-size:29px;color:#e95663}
.compact-product .detail-copy small{font-size:11px;line-height:1.4}
.summary-saving{font-size:13px!important;color:#237b70}
.discount{background:#e0f7ef;color:#23766b;border-radius:8px;padding:4px 7px;font-weight:700}
.journey-target{padding:16px;margin-top:12px}
.target-heading h2{font-size:20px}.target-heading p{font-size:13px!important}
.journey-target .target-scene{position:relative;padding:0;min-height:110px}
.journey-target .target-rop{display:block;position:absolute;width:34%;height:105px;right:-5px;bottom:5px}
.journey-target .target-rop .reference-rop{width:100%;height:auto;max-height:110px;transform:none}
.journey-target .target-number{margin:12px 0 5px;position:relative;width:70%;gap:5px;min-height:100px}
.journey-target .target-value{min-width:0;flex:1;background:#fff;border:1px solid #d3e5df;border-radius:15px;padding:9px 3px;font-size:28px}
.journey-target .target-value input{width:100%;min-width:0;font-size:30px!important}
.journey-target .target-value>span{font-size:24px}
.round-button{background:linear-gradient(130deg,#309a8a,#197c70);color:#fff;box-shadow:0 0 0 4px #e3f7f0;width:44px;height:44px;flex-shrink:0}
.preset-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.preset-grid button{border-radius:12px;padding:8px 3px;background:#effaf6;border:1px solid #e1ede9}
.preset-grid button[aria-pressed=true]{background:linear-gradient(110deg,#268c7e,#176a63);color:white}
.preset-grid button strong{font-size:15px}.preset-grid button span{font-size:12px}
.preset-note{font-size:11px!important}.target-delivery{border-top:10px solid var(--page);margin:16px -16px 0;padding:14px 16px 0}
.target-delivery .setting-row{padding:10px 0;gap:10px}.target-delivery strong{font-size:14px}.target-delivery small{font-size:12px}
.alert-summary{background:linear-gradient(115deg,#dff7ef,#eafaf5);border-radius:16px;padding:15px;margin:12px 0}
.alert-summary strong{font-size:15px}.alert-summary p{color:#1a6d65;font-size:17px!important}
.delivery-note{background:#f1faf6;color:#5f8078;border-color:#e0eee8;margin:10px 0;font-size:11px!important}
.reference-scene{height:auto;display:block;position:relative}
.reference-scene>.reference-rop{width:100%;height:auto;animation:none}
.resolver-scene.reference-scene{margin:0 -12px}.resolver-orbit{inset:9% 20% 7%;border-color:#66c7b166;pointer-events:none}
.resolving-screen h1{font-size:27px}.resolving-link{margin:14px 0 0;border-radius:18px;padding:13px;font-size:13px}
.resolving-status{margin-top:10px;background:white;padding:20px 16px}
.track-success{padding-top:8px}.track-success .flow-steps{margin:0}
.success-scene.reference-scene{margin:0 -12px 7px}
.track-success>h1{font-size:34px;line-height:1.25;font-weight:800;color:#123943}
.track-success>p{font-size:15px;margin:8px 0}.track-success .flow-scope{font-size:11px}
.receipt-card{padding:15px}.receipt-card>.compact-product{grid-template-columns:90px 1fr;margin-bottom:12px;padding:0}
.receipt-card .detail-image{height:90px}.receipt-card .detail-copy small{font-size:11px}
.receipt-card>.detail-product .price-line,.receipt-card>.detail-product .summary-saving,.receipt-card>.detail-product .detail-copy>small,.receipt-card>.detail-product .detail-copy>del{display:none}
.receipt-grid{grid-template-columns:repeat(3,minmax(0,1fr));padding-top:12px;gap:4px}.receipt-grid strong{font-size:24px;letter-spacing:-.6px}.receipt-grid span{font-size:11px}
.receipt-channel-stat b{display:block;color:#208675;font-size:15px;margin:6px 0}.receipt-channel-stat small{font-size:10px;color:var(--muted)}
.receipt-provenance{margin-top:10px;font-size:11px;color:var(--muted)}.receipt-provenance summary{cursor:pointer;padding:8px 0;min-height:44px}.receipt-provenance p{font-size:12px;line-height:1.5}
.receipt-status{font-size:11px;color:#627f77;margin-top:4px}
.receipt-channel{padding-top:12px;margin-top:8px}.receipt-channel p{font-size:12px}
.notification-preview{background:#d8f5e9;padding:16px;border-radius:20px}
.notification-preview h2{font-size:17px}.notification-preview article{padding:12px;border:0;box-shadow:0 5px 18px #2e806813}
.notification-preview article .reference-rop{width:45px;height:45px;object-fit:contain}
.search-empty-scene .reference-rop{width:280px;max-width:100%;height:155px;margin:auto}.question-bubble{display:none}
.product-image{background:#f5f7f6;height:125px}.product-copy{padding:10px}.product-copy h3{font-size:14px;line-height:1.4;min-height:40px}
.product-card .price-line strong{font-size:25px;color:var(--coral)}.product-card del{font-size:13px;color:#92a0a6}
.product-copy .card-source,.product-copy .reference-period{font-size:10px!important;line-height:1.4}
.product-card .card-source{clear:both;padding-top:5px}.product-card .card-shop{display:none}
.product-row .card-shop{display:inline}.product-row .card-source{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
[data-screen=home] .product-card:not(.product-row) .price-line,[data-screen=deals] .product-card .price-line{display:contents}
[data-screen=home] .product-card:not(.product-row) .price-line strong,[data-screen=deals] .product-card .price-line strong{display:block;margin:3px 0}
[data-screen=home] .product-card:not(.product-row) .discount,[data-screen=deals] .product-card .discount{float:right;font-size:10px!important;padding:2px 4px}
[data-screen=home] .product-card:not(.product-row) del,[data-screen=deals] .product-card del{font-size:11px;line-height:22px}
[data-screen=home] .product-copy>small:not(.card-source),[data-screen=deals] .product-copy>small:not(.card-source){display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;font-size:10px}
.card-status{font-size:12px!important;color:#288577}.sale-sticker{background:#fa6a70;box-shadow:0 3px 9px #ed697528;color:white;transform:rotate(-8deg);border-radius:7px}
.product-row .product-open{grid-template-columns:76px minmax(0,1fr) 70px;gap:8px;padding:10px}
.product-row .product-image{height:96px}.product-row .product-copy{padding:0}.product-row .product-copy h3{font-size:14px;padding:0 8px 0 0}
.product-row .price-line strong{font-size:24px}.product-row .card-graph{display:block;align-self:center;width:70px;padding-top:26px}
.product-row .card-graph .pill{display:none}.product-row .sparkline{width:100%;height:45px;color:#20917c}
.product-row .favorite-button{right:6px;top:3px}
.filter-chips button[aria-pressed=true],.filter-chips button.active{background:linear-gradient(110deg,#238f80,#176a63);color:#fff}
.bottom-nav{border-radius:22px 22px 0 0;background:#ffffffed;border:0;box-shadow:0 -6px 18px #549d8610}
.bottom-nav button[aria-current=page]{color:#147668}.bottom-nav button[aria-current=page] .icon{stroke-width:2.4}
.price-chart{color:#279682}.chart-card{padding:16px}.chart-card h2{font-size:19px}
[data-theme=dark] .garden-shell{background:var(--page)}
[data-theme=dark] .hero-copy h1,[data-theme=dark] .track-success>h1{color:var(--ink)}
[data-theme=dark] .hero-copy>p{color:var(--muted)}
[data-theme=dark] .reference-rop{border-radius:18px;mask-image:none;background:#effbf8}
[data-theme=dark] .flow-card,[data-theme=dark] .target-card,[data-theme=dark] .detail-product,[data-theme=dark] .chart-card,[data-theme=dark] .settings-card,[data-theme=dark] .product-card{border-color:var(--border)}
[data-theme=dark] .target-value,[data-theme=dark] .resolving-status,[data-theme=dark] .flow-field{background:var(--card)}
[data-theme=dark] .mascot-banner,[data-theme=dark] .confirm-tip,[data-theme=dark] .alert-summary,[data-theme=dark] .notification-preview{background:var(--mint)}
[data-theme=dark] .bottom-nav{background:var(--card)}
@keyframes reference-breathe{50%{transform:translateY(-2px)}}
@keyframes card-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes celebrate-arrive{0%{opacity:0;transform:translateY(14px) scale(.94)}65%{opacity:1;transform:translateY(-3px) scale(1.01)}100%{opacity:1;transform:none}}
@media(min-width:390px){[data-screen=home] .product-grid,[data-screen=deals] .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}[data-screen=home] .product-copy,[data-screen=deals] .product-copy{padding:8px}[data-screen=home] .product-image,[data-screen=deals] .product-image{height:103px}[data-screen=home] .product-copy h3,[data-screen=deals] .product-copy h3{font-size:13px}[data-screen=home] .product-card .price-line strong,[data-screen=deals] .product-card .price-line strong{font-size:23px}}
@media(max-width:359px){.hero-copy h1{font-size:24px}.hero-copy>p{font-size:14px}.hero-centered .hero-copy h1{font-size:23px}.hero-compact .hero-visual{width:43%}.hero-compact{min-height:185px}.compact-product,.flow-body .compact-product{grid-template-columns:78px 1fr;gap:9px}.compact-product .detail-copy h2{font-size:15px!important}.compact-product .price-line strong{font-size:25px}.journey-target .target-number{width:100%;padding-right:0}.journey-target .target-rop{display:none}.flow-steps li{font-size:9px}.flow-card .section-heading .text-button{font-size:10px!important}.product-row .product-open{grid-template-columns:68px minmax(0,1fr) 56px}.product-row .card-graph{width:56px}.product-row .price-line strong{font-size:22px}.product-row .discount{font-size:10px!important}}
@media(prefers-reduced-motion:reduce){.hero .mascot-button .reference-rop{animation:none}}
.page-hidden .reference-rop,.offscreen .reference-rop,.dialog-open .reference-rop{animation-play-state:paused!important}
/* Additional references: onboarding, favorites, alerts and real product photos. */
.product-image,.compact-product .detail-image,.detail-image{background:#fff}
.product-image img,.detail-image img{object-fit:contain;width:100%;height:100%;padding:6px;filter:none}
.product-row .product-image img{padding:2px}
.hero-kind-onboarding .hero-visual{width:51%;right:0;bottom:0;height:205px}
.hero-kind-onboarding .reference-rop{max-height:205px!important}
.hero-kind-onboarding .handnote,.hero-kind-favorites .handnote,.hero-kind-notification .handnote{display:none}
.hero-kind-favorites{min-height:220px}.hero-kind-favorites .hero-copy{max-width:53%}.hero-kind-favorites .hero-visual{width:51%;height:200px}
.hero-kind-notification .hero-copy{max-width:60%}.hero-kind-notification .hero-visual{width:43%;height:185px}
.onboarding-body .step-card{display:grid;grid-template-columns:40px minmax(0,1fr) 105px;gap:8px;padding:15px 10px;border:0;border-radius:20px;min-height:155px;overflow:hidden;background:#fff}
.onboarding-body .step-number{width:38px;height:38px;background:#e1f7f0;color:#1b786e;font-size:24px}
.onboarding-body .step-card h2{font-size:19px;line-height:1.35;margin-bottom:7px}
.onboarding-body .step-card p{font-size:12px;line-height:1.65}
.onboarding-body .step-card>.reference-rop{width:105px;height:130px;align-self:end}
.notification-card{border-radius:20px;padding:13px 10px;grid-template-columns:78px minmax(0,1fr) 18px;gap:10px;background:#fff;border:0}
.notification-image{width:78px;height:84px;background:#f7fcfa;border-radius:12px;overflow:hidden}
.notification-image img{width:100%;height:100%;object-fit:contain;padding:4px}
.notification-image .reference-rop{width:100%;height:100%}
.notification-copy strong{font-size:16px}.notification-copy>span{font-size:13px;line-height:1.5}
.success-art{width:100%;height:auto!important;max-width:none;margin:10px auto 8px}
.success-art>.reference-rop{width:100%;height:auto;max-height:260px;transform:none}
.success-product>img{width:110px;height:130px;object-fit:contain;border-radius:14px;background:#fff}
[data-screen=favorites] .product-image{height:132px}
[data-screen=favorites] .product-card .price-line strong{font-size:25px}
[data-screen=favorites] .product-copy .price-line{display:flex;flex-wrap:wrap;gap:5px}
@media(max-width:359px){.onboarding-body .step-card{grid-template-columns:30px minmax(0,1fr) 83px;gap:6px;padding:12px 8px}.onboarding-body .step-number{width:30px;height:30px;font-size:20px}.onboarding-body .step-card>.reference-rop{width:83px;height:115px}.onboarding-body .step-card h2{font-size:16px}.hero-kind-favorites .hero-copy h1{font-size:22px}.notification-card{grid-template-columns:64px minmax(0,1fr) 16px}.notification-image{width:64px;height:75px}.notification-copy strong{font-size:14px}}
[data-theme=dark] .product-image,[data-theme=dark] .detail-image{background:#fff}
[data-theme=dark] .onboarding-body .step-card,[data-theme=dark] .notification-card{background:var(--card)}
.onboarding-body .step-card>.reference-rop{position:static;transform:none;opacity:1}
.scene-onboarding{clip-path:polygon(10% 0,78% 0,78% 25%,100% 25%,100% 100%,0 100%,0 44%,10% 44%)}
.scene-onboard-alert{clip-path:polygon(20% 0,100% 0,100% 100%,0 100%,0 30%,20% 30%)}
.notification-card{display:grid}.notification-image{min-width:0}
@media(min-width:360px){.product-row .product-open{grid-template-columns:88px minmax(0,1fr) 66px}.product-row .card-graph{width:66px}.product-row .product-image{height:106px}}
.scene-onboard-alert{clip-path:polygon(20% 0,100% 0,100% 100%,0 100%,0 40%,20% 40%)}
.scene-favorites{clip-path:polygon(18% 0,100% 0,100% 100%,0 100%,0 55%,18% 55%)}
.scene-notification{clip-path:polygon(20% 0,95% 0,95% 30%,100% 30%,100% 100%,0 100%,0 50%,20% 50%)}
.hero-kind-favorites .hero-copy{max-width:60%}.hero-kind-favorites .hero-copy h1{font-size:25px}.hero-kind-favorites .hero-copy h1 .coral{font-size:22px}

/* Transparent art needs no screenshot feathering or text-avoidance cutouts. */
.garden-shell .retina-rop{mask-image:none;clip-path:none;filter:none;background:transparent;border-radius:0;image-rendering:auto}
.garden-shell .retina-small{max-width:180px}
.hero-centered .mascot-button .retina-rop{width:min(70%,280px);margin:8px auto 0;max-height:280px}
.hero-centered .mascot-button .retina-small{width:180px;max-height:180px}
.success-art>.retina-small,.success-scene>.retina-small{width:180px;max-height:180px;margin:auto}

.hero-compact .hero-visual .handnote{display:none}