/* Native geometry is measured at 440pt for Nell and 402pt for Fioma.
   Layout units scale uniformly with the phone; text is painted by the browser. */
.screen,.static-native{--native-unit:.227272727cqi}
body[data-app=fioma] .screen,.static-native:has(.fioma){--native-unit:.248756219cqi}
/* Browser-rendered typography; no scale transforms or screenshot text. */
.phone,.screen{container-type:inline-size}.screen{--native-bg:#f3f0e6;--native-fg:#242821;--native-muted:#696f61;--native-line:#d5d4c9;--native-accent:#bd450c;--native-card:#fbfaf6;color:var(--native-fg);font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',sans-serif;font-size:calc(14 * var(--native-unit));line-height:1.45;background:var(--native-bg);text-rendering:optimizeLegibility}body[data-app=fioma] .screen{--native-bg:#f3f3f9;--native-fg:#151719;--native-muted:#626974;--native-line:#d8dde1;--native-accent:#00765c;--native-card:#fff}.screen:before{display:none!important}.fixed-top{height:calc(76 * var(--native-unit));background:var(--native-bg);pointer-events:none}.fixed-bottom{height:calc(65 * var(--native-unit));background:var(--native-bg);border-top:1px solid var(--native-line)}.content-window{top:calc(76 * var(--native-unit));bottom:calc(65 * var(--native-unit))}.view-page{width:100%;background:var(--native-bg);min-height:var(--view-h,calc(400 * var(--native-unit)));padding:calc(18 * var(--native-unit)) calc(14 * var(--native-unit)) calc(26 * var(--native-unit));overflow-wrap:break-word}.native-view svg,.fixed-top svg,.fixed-bottom svg{width:calc(20 * var(--native-unit));height:calc(20 * var(--native-unit));display:inline-block;flex:none;vertical-align:middle}.native-status{height:calc(38 * var(--native-unit));display:flex;align-items:center;justify-content:space-between;padding:calc(4 * var(--native-unit)) calc(20 * var(--native-unit)) 0;font-size:calc(11 * var(--native-unit));font-weight:600;position:relative}.native-island{height:calc(19 * var(--native-unit));width:30%;position:absolute;left:35%;top:calc(7 * var(--native-unit));border-radius:calc(30 * var(--native-unit));background:#050607}.native-signal{display:flex;align-items:center;gap:calc(5 * var(--native-unit));font-size:calc(10 * var(--native-unit))}.battery{display:inline-block;width:calc(17 * var(--native-unit));height:calc(8 * var(--native-unit));border:1px solid currentColor;border-radius:calc(2 * var(--native-unit));position:relative}.battery:before{content:'';position:absolute;inset:1px;background:currentColor}.battery:after{content:'';position:absolute;right:calc(-3 * var(--native-unit));top:calc(2 * var(--native-unit));width:1px;height:calc(3 * var(--native-unit));background:currentColor}.native-navbar{height:calc(38 * var(--native-unit));display:flex;justify-content:space-between;align-items:center;gap:calc(4 * var(--native-unit));padding:0 calc(12 * var(--native-unit))}.native-navbar strong{font-size:calc(14 * var(--native-unit));letter-spacing:-.025em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.native-navbar>span{width:calc(22 * var(--native-unit));color:var(--native-accent)}.native-dock{height:calc(50 * var(--native-unit));display:flex;justify-content:space-around;gap:calc(3 * var(--native-unit));padding:calc(7 * var(--native-unit)) calc(5 * var(--native-unit)) 0}.native-dock>div{display:flex;flex-direction:column;align-items:center;gap:calc(3 * var(--native-unit));min-width:0;color:#74796e}.native-dock>div.selected{color:var(--native-accent)}.native-dock svg{height:calc(19 * var(--native-unit));width:calc(19 * var(--native-unit));stroke-width:1.8}.native-dock span{font-size:calc(9 * var(--native-unit));font-weight:500;letter-spacing:-.02em;white-space:nowrap}.native-home{height:calc(3 * var(--native-unit));width:33%;border-radius:calc(5 * var(--native-unit));background:var(--native-fg);position:absolute;bottom:calc(5 * var(--native-unit));left:33.5%}.native-section{display:flex;align-items:flex-start;gap:calc(10 * var(--native-unit));margin-bottom:calc(20 * var(--native-unit))}.native-tile{width:calc(32 * var(--native-unit));height:calc(34 * var(--native-unit));border-radius:calc(11 * var(--native-unit));display:grid;place-items:center;flex:none;color:var(--native-accent);background:#f9e6d7;margin-top:calc(4 * var(--native-unit))}.native-tile svg{width:calc(20 * var(--native-unit));height:calc(20 * var(--native-unit))}.native-kicker{font:500 calc(10 * var(--native-unit))/1.5 ui-monospace,SFMono-Regular,monospace;letter-spacing:.055em;text-transform:uppercase;color:var(--native-muted);margin-bottom:calc(4 * var(--native-unit))}.native-section h3{font-size:calc(23 * var(--native-unit));line-height:1.15;letter-spacing:-.045em;margin:0 0 calc(7 * var(--native-unit));font-weight:650}.native-section p{font-size:calc(13 * var(--native-unit));line-height:1.5;color:var(--native-muted);margin:0}.native-card{background:var(--native-card);border:1px solid var(--native-line);border-radius:calc(16 * var(--native-unit))}.native-summary{display:flex;align-items:center;gap:calc(10 * var(--native-unit));padding:calc(13 * var(--native-unit)) calc(12 * var(--native-unit));margin-bottom:calc(15 * var(--native-unit))}.native-summary>img{width:calc(44 * var(--native-unit));height:calc(44 * var(--native-unit));object-fit:contain;flex:none}.native-summary p{font-size:calc(14 * var(--native-unit));line-height:1.45;margin:0}.native-summary b{font-weight:550}.native-metrics{display:grid;grid-template-columns:1fr 1fr;gap:calc(10 * var(--native-unit))}.native-metric{background:var(--native-card);border:1px solid var(--native-line);border-radius:calc(15 * var(--native-unit));padding:calc(13 * var(--native-unit)) calc(12 * var(--native-unit));min-width:0}.native-metric>span{font-size:calc(12 * var(--native-unit));line-height:1.4;color:var(--native-muted);display:flex;align-items:center;gap:calc(5 * var(--native-unit))}.native-metric>span svg{width:calc(14 * var(--native-unit));height:calc(14 * var(--native-unit));flex:none}.native-metric strong{display:block;font-size:calc(30 * var(--native-unit));font-weight:600;line-height:1.2;letter-spacing:-.05em;margin:calc(7 * var(--native-unit)) 0 calc(4 * var(--native-unit))}.native-metric small{display:block;font-size:calc(12 * var(--native-unit));line-height:1.45;color:var(--native-muted)}.native-label{font:500 calc(10 * var(--native-unit))/1.5 ui-monospace,SFMono-Regular,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--native-muted);margin:calc(24 * var(--native-unit)) 0 calc(10 * var(--native-unit))}.native-action{display:flex;align-items:center;justify-content:center;gap:calc(8 * var(--native-unit));min-height:calc(43 * var(--native-unit));padding:calc(11 * var(--native-unit)) calc(12 * var(--native-unit));border-radius:calc(13 * var(--native-unit));margin-bottom:calc(10 * var(--native-unit));font-size:calc(14 * var(--native-unit));font-weight:600;text-align:center;line-height:1.4}.native-action svg{width:calc(19 * var(--native-unit));height:calc(19 * var(--native-unit))}.native-action.primary{background:var(--native-accent);color:#fff}.native-action.secondary{background:var(--native-card);border:1px solid var(--native-line);color:var(--native-fg)}.native-ok{background:#e5ecda;color:#426b31;font-size:calc(12 * var(--native-unit));display:flex;gap:calc(7 * var(--native-unit));align-items:flex-start;border-radius:calc(11 * var(--native-unit));padding:calc(11 * var(--native-unit))}.native-ok svg{width:calc(16 * var(--native-unit));height:calc(16 * var(--native-unit));flex:none;margin-top:1px}.split-label{display:flex;justify-content:space-between;align-items:center;gap:calc(6 * var(--native-unit))}.split-label>span{color:var(--native-accent);letter-spacing:0;text-transform:none;font:500 calc(12 * var(--native-unit))/1.4 -apple-system,BlinkMacSystemFont,sans-serif}.native-draft{display:flex;gap:calc(9 * var(--native-unit));align-items:center;padding:calc(13 * var(--native-unit))}.native-draft>svg{color:var(--native-accent)}.native-draft strong{font-size:calc(14 * var(--native-unit));font-weight:600}.native-draft small{display:block;color:var(--native-muted);font-size:calc(11 * var(--native-unit));margin-top:calc(3 * var(--native-unit))}.native-segment{background:#e3e2da;display:flex;border-radius:calc(9 * var(--native-unit));padding:calc(3 * var(--native-unit));gap:calc(3 * var(--native-unit));font-size:calc(12 * var(--native-unit));text-align:center;margin:calc(20 * var(--native-unit)) 0}.native-segment span{padding:calc(7 * var(--native-unit)) calc(5 * var(--native-unit));flex:1;line-height:1.3}.native-segment .chosen{border-radius:calc(7 * var(--native-unit));background:#fff;box-shadow:0 1px calc(4 * var(--native-unit)) #0001;font-weight:600}.native-count{font:calc(11 * var(--native-unit))/1.7 ui-monospace,SFMono-Regular,monospace;color:var(--native-muted);margin:calc(18 * var(--native-unit)) 0}.person-row{display:flex;align-items:center;justify-content:space-between;gap:calc(9 * var(--native-unit));padding:calc(15 * var(--native-unit)) calc(12 * var(--native-unit));margin-bottom:calc(11 * var(--native-unit))}.person-row strong{font-size:calc(15 * var(--native-unit));font-weight:600;line-height:1.3}.person-row small{display:block;color:var(--native-muted);font-size:calc(12 * var(--native-unit));margin-top:calc(3 * var(--native-unit))}.native-assignee{display:flex;gap:calc(5 * var(--native-unit));align-items:center;justify-content:center;font-size:calc(12 * var(--native-unit));border:1px solid var(--native-line);border-radius:calc(24 * var(--native-unit));padding:calc(7 * var(--native-unit));white-space:nowrap}.native-assignee>svg{height:calc(13 * var(--native-unit));width:calc(13 * var(--native-unit))}.native-avatar{height:calc(23 * var(--native-unit));width:calc(23 * var(--native-unit));border-radius:50%;background:#377b7d;color:white;font-size:calc(10 * var(--native-unit));display:grid;place-items:center}.native-tags{display:flex;gap:calc(7 * var(--native-unit));flex-wrap:wrap;margin-bottom:calc(17 * var(--native-unit))}.native-tags>span{display:flex;align-items:center;gap:calc(5 * var(--native-unit));border-radius:calc(16 * var(--native-unit));background:#e5e3d8;padding:calc(5 * var(--native-unit)) calc(9 * var(--native-unit));font-size:calc(11 * var(--native-unit));color:var(--native-muted)}.native-tags svg{height:calc(13 * var(--native-unit));width:calc(13 * var(--native-unit))}.native-tags .draft-tag{background:#eee0ca;color:#8b5608}.native-category{display:inline-block;border-radius:calc(13 * var(--native-unit));background:#dee8e9;color:#236588;padding:calc(5 * var(--native-unit)) calc(9 * var(--native-unit));font-size:calc(11 * var(--native-unit));margin-bottom:calc(18 * var(--native-unit))}.quality-card{padding:calc(13 * var(--native-unit)) calc(11 * var(--native-unit))}.quality-card>.native-label{margin:0 0 calc(18 * var(--native-unit));font-size:calc(9 * var(--native-unit))}.quality-total{color:#446f31!important;font-size:calc(11 * var(--native-unit))!important;background:#e8eee1;padding:calc(4 * var(--native-unit)) calc(6 * var(--native-unit));border-radius:calc(12 * var(--native-unit));white-space:nowrap}.native-check{display:flex;align-items:flex-start;gap:calc(7 * var(--native-unit));margin-bottom:calc(21 * var(--native-unit))}.native-check:last-child{margin-bottom:0}.check-circle{width:calc(16 * var(--native-unit));height:calc(16 * var(--native-unit));background:#4c7c36;color:white;display:grid;place-items:center;border-radius:50%;flex:none;margin-top:calc(3 * var(--native-unit))}.check-circle svg{width:calc(12 * var(--native-unit));height:calc(12 * var(--native-unit));stroke-width:2}.native-check>div{min-width:0;flex:1}.native-check strong{font-size:calc(14 * var(--native-unit));line-height:1.4;font-weight:600;display:block;letter-spacing:-.02em}.native-check p{font-size:calc(13 * var(--native-unit));line-height:1.65;color:var(--native-muted);margin:calc(6 * var(--native-unit)) 0 0}.check-state{color:#4c7c36;font-size:calc(11 * var(--native-unit));margin-top:calc(3 * var(--native-unit))}.shop-heading h3{font-size:calc(27 * var(--native-unit));line-height:1.2;font-weight:700;letter-spacing:-.035em;margin:0 0 calc(9 * var(--native-unit))}.shop-heading p{font-size:calc(12 * var(--native-unit));line-height:1.55;color:var(--native-muted);margin:0 0 calc(15 * var(--native-unit))}.native-search{display:flex;align-items:center;gap:calc(7 * var(--native-unit));padding:calc(10 * var(--native-unit)) calc(9 * var(--native-unit));background:#f8f5ee;border-radius:calc(8 * var(--native-unit));color:#65605b;font-size:calc(11 * var(--native-unit));margin:0 0 calc(21 * var(--native-unit))}.native-search svg{width:calc(14 * var(--native-unit));height:calc(14 * var(--native-unit))}.featured-heading{font-size:calc(17 * var(--native-unit));font-weight:600;margin:calc(19 * var(--native-unit)) 0 calc(12 * var(--native-unit));letter-spacing:-.025em}.native-products{display:grid;grid-template-columns:1fr 1fr;gap:calc(16 * var(--native-unit)) calc(11 * var(--native-unit))}.native-product{min-width:0}.product-photo{position:relative;aspect-ratio:1.1;overflow:hidden;border-radius:calc(11 * var(--native-unit));background:#e4e5df}.product-photo>img{display:block;width:100%;height:100%;object-fit:cover}.product-photo>span{position:absolute;top:calc(5 * var(--native-unit));left:calc(5 * var(--native-unit));font-size:calc(9 * var(--native-unit));font-weight:600;background:#fff;color:#3c403c;padding:calc(3 * var(--native-unit)) calc(5 * var(--native-unit));border-radius:calc(10 * var(--native-unit))}.native-product>strong{font-size:calc(12 * var(--native-unit));line-height:1.4;display:block;margin-top:calc(7 * var(--native-unit));font-weight:600}.native-product>span{font-size:calc(12 * var(--native-unit));display:block;margin-top:calc(3 * var(--native-unit))}.category-list{padding:0 calc(12 * var(--native-unit))}.category-list>div{padding:calc(13 * var(--native-unit)) 0;display:flex;justify-content:space-between;gap:calc(6 * var(--native-unit));border-bottom:1px solid var(--native-line);font-size:calc(13 * var(--native-unit))}.category-list>div:last-child{border:0}.category-list span{color:var(--native-muted);font-size:calc(11 * var(--native-unit))}.product-detail-photo{margin:calc(-18 * var(--native-unit)) calc(-14 * var(--native-unit)) calc(17 * var(--native-unit));aspect-ratio:1.13;overflow:hidden}.product-detail-photo img{width:100%;height:100%;display:block;object-fit:cover}.product-detail h3{font-size:calc(20 * var(--native-unit));letter-spacing:-.03em;font-weight:600;margin:0 0 calc(6 * var(--native-unit))}.native-category-name{font-size:calc(12 * var(--native-unit));color:var(--native-muted)}.native-price{display:block;font-size:calc(20 * var(--native-unit));letter-spacing:-.03em;font-weight:500;margin:calc(11 * var(--native-unit)) 0 calc(7 * var(--native-unit))}.native-stock{display:flex;align-items:center;gap:calc(5 * var(--native-unit));font-size:calc(12 * var(--native-unit));color:var(--native-accent)}.native-stock svg{width:calc(14 * var(--native-unit));height:calc(14 * var(--native-unit))}.product-detail>p{font-size:calc(13 * var(--native-unit));line-height:1.6;color:var(--native-muted);margin:calc(13 * var(--native-unit)) 0}.product-detail h4{font-size:calc(14 * var(--native-unit));font-weight:600;margin:calc(19 * var(--native-unit)) 0 calc(10 * var(--native-unit))}.native-quantity{display:flex;justify-content:space-between;align-items:center;margin:calc(11 * var(--native-unit)) 0 calc(7 * var(--native-unit))}.native-quantity>span{display:grid;place-items:center;width:calc(36 * var(--native-unit));height:calc(34 * var(--native-unit));border-radius:calc(9 * var(--native-unit));background:#dfebe5;color:var(--native-accent);font-size:calc(19 * var(--native-unit))}.native-quantity strong{font-size:calc(14 * var(--native-unit));font-weight:400}.product-detail>small{font-size:calc(11 * var(--native-unit));color:var(--native-muted);display:block;margin-bottom:calc(20 * var(--native-unit))}.static-native{max-width:calc(360 * var(--native-unit));background:var(--native-bg,#f3f0e6);color:#242821;border-radius:calc(24 * var(--native-unit));padding:calc(22 * var(--native-unit)) calc(16 * var(--native-unit));font-family:-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif}.static-grid .native-view{--native-bg:#f3f0e6;--native-fg:#242821;--native-muted:#696f61;--native-line:#d5d4c9;--native-accent:#bd450c;--native-card:#fbfaf6}.static-grid .fioma{--native-bg:#f3f3f9;--native-fg:#151719;--native-muted:#626974;--native-line:#d8dde1;--native-accent:#00765c;--native-card:#fff}.static-native img{border-radius:0;max-width:none}.static-native .native-summary>img{width:calc(44 * var(--native-unit));max-width:calc(44 * var(--native-unit))}.track{will-change:auto}.phone,.screen,.track,.view-page{backface-visibility:visible}

/* Native iOS type and safe-area proportions. */
.fixed-top{height:calc(88 * var(--native-unit))}
.fixed-bottom{height:calc(83 * var(--native-unit))}
.content-window{top:calc(88 * var(--native-unit));bottom:calc(83 * var(--native-unit))}
.native-status{height:calc(44 * var(--native-unit));font-size:calc(17 * var(--native-unit));padding-top:0}
.native-island{height:calc(25 * var(--native-unit));top:calc(6 * var(--native-unit))}
.native-signal{font-size:calc(12 * var(--native-unit))}
.native-navbar{height:calc(44 * var(--native-unit))}
.native-navbar strong{font-size:calc(17 * var(--native-unit))}
.native-navbar svg{width:calc(23 * var(--native-unit));height:calc(23 * var(--native-unit))}
.native-dock{height:calc(60 * var(--native-unit));padding-top:calc(10 * var(--native-unit))}
.native-dock svg{width:calc(26 * var(--native-unit));height:calc(26 * var(--native-unit))}
.native-dock span{font-size:calc(11 * var(--native-unit))}
.native-dock .compact-label{display:none}
.native-home{height:calc(4 * var(--native-unit));bottom:calc(8 * var(--native-unit))}
.view-page{padding:calc(22 * var(--native-unit)) calc(20 * var(--native-unit)) calc(30 * var(--native-unit))}
.native-section{gap:calc(12 * var(--native-unit))}
.native-section h3{font-size:calc(22 * var(--native-unit));font-weight:700;letter-spacing:-.025em}
.native-section p{font-size:calc(13 * var(--native-unit));line-height:1.55}
.native-kicker{font-size:calc(11 * var(--native-unit))}
.native-tile{width:calc(38 * var(--native-unit));height:calc(40 * var(--native-unit))}
.native-summary p{font-size:calc(17 * var(--native-unit))}
.native-summary>img{width:calc(50 * var(--native-unit));height:calc(58 * var(--native-unit))}
.native-summary{padding:calc(16 * var(--native-unit));gap:calc(12 * var(--native-unit));margin-bottom:calc(24 * var(--native-unit))}
.native-metrics{gap:calc(12 * var(--native-unit))}
.native-metric{padding:calc(16 * var(--native-unit));min-height:calc(112 * var(--native-unit))}
.native-metric>span,.native-metric small{font-size:calc(13 * var(--native-unit))}
.native-metric strong{font-size:calc(30 * var(--native-unit))}
.native-action{min-height:calc(44 * var(--native-unit));font-size:calc(17 * var(--native-unit))}
.native-label{font-size:calc(11 * var(--native-unit))}
.native-count{font-size:calc(13 * var(--native-unit))}
.native-assignee,.person-row small{font-size:calc(13 * var(--native-unit))}
.person-row strong,.native-check strong{font-size:calc(17 * var(--native-unit))}
.person-row{padding:calc(16 * var(--native-unit));margin-bottom:calc(12 * var(--native-unit))}
.native-check p{font-size:calc(13 * var(--native-unit))}
.native-navbar>span{width:calc(24 * var(--native-unit))}
.shop-heading h3{font-size:calc(34 * var(--native-unit))}
.shop-heading p,.native-product>span{font-size:calc(13 * var(--native-unit))}
.native-product>strong{font-size:calc(15 * var(--native-unit))}
.product-detail h3{font-size:calc(22 * var(--native-unit))}
.native-price{font-size:calc(22 * var(--native-unit))}
.product-detail>p{font-size:calc(15 * var(--native-unit))}
.product-detail-photo{margin:calc(-22 * var(--native-unit)) calc(-20 * var(--native-unit)) calc(20 * var(--native-unit))}
.static-native{container-type:inline-size;width:100%;max-width:440px;padding:20px}
/* One proportional layout for the entire preview, not per-element enlargement. */
.screen,.static-native{--native-unit:.294117647cqi}
body[data-app=fioma] .screen,.static-native:has(.fioma){--native-unit:.3125cqi}
.intro .motion-control{margin-top:18px}
@media(max-width:760px){
 .phone,html.motion-preview .phone{height:calc(100svh - 150px)}
 .phone-wrap{transform:translateY(10px)}
 .left{justify-self:stretch;left:20px;right:20px;width:calc(100% - 40px);top:78px}
 .source{bottom:-15px;font-size:8px;max-width:90vw}
 .bottom #current-screen{display:none}
 .progress{bottom:4px}
}
/* Local native-view interactions. */
.fixed-top,.fixed-bottom{pointer-events:auto;z-index:6}
.native-navbar button{border:0;background:transparent;padding:0;color:var(--native-accent);position:relative;display:grid;place-items:center}
.native-dock>button{border:0;background:transparent;padding:0;display:flex;flex-direction:column;align-items:center;gap:calc(3 * var(--native-unit));color:#74796e;min-width:0;font:inherit}
.native-dock>button.selected{color:var(--native-accent)}
button.native-metric{text-align:left;color:var(--native-fg);font:inherit;width:100%}
button.native-action{width:100%;font-family:inherit}
button.native-draft{width:100%;text-align:left;color:var(--native-fg);font-family:inherit}
.split-label>button{border:0;background:transparent;padding:0;color:var(--native-accent);font:inherit;letter-spacing:0;text-transform:none}
button.native-assignee{background:transparent;color:var(--native-fg);font-family:inherit}
.native-segment>button{border:0;background:transparent;flex:1;padding:calc(7 * var(--native-unit));font:inherit;color:var(--native-fg)}
.native-segment>button.chosen{background:#fff;border-radius:calc(7 * var(--native-unit));box-shadow:0 1px 4px #0001}
button.native-product{border:0;background:transparent;padding:0;color:var(--native-fg);font:inherit;display:block;text-align:left;width:100%}
.native-product[hidden]{display:none}
.native-quantity>button{display:grid;place-items:center;width:calc(40 * var(--native-unit));height:calc(38 * var(--native-unit));border:0;border-radius:calc(9 * var(--native-unit));background:#dfebe5;color:var(--native-accent);font:inherit;font-size:calc(22 * var(--native-unit))}
.native-search input{border:0;outline:0;background:transparent;min-width:0;width:100%;font:inherit;color:inherit}
.category-list>button{display:flex;justify-content:space-between;width:100%;border:0;border-bottom:1px solid var(--native-line);background:transparent;padding:calc(13 * var(--native-unit)) 0;text-align:left;font:inherit;color:var(--native-fg)}
.interactive-panel{position:absolute;z-index:5;inset:calc(88 * var(--native-unit)) 0 calc(83 * var(--native-unit));overflow-y:auto;overscroll-behavior:auto;background:var(--native-bg);padding:calc(20 * var(--native-unit));font-size:calc(16 * var(--native-unit));scrollbar-width:thin}
.interactive-panel[hidden]{display:none}
.interactive-panel h3{font-size:calc(25 * var(--native-unit));letter-spacing:-.035em;margin:0 0 calc(18 * var(--native-unit));line-height:1.2}
.demo-note{font-size:calc(14 * var(--native-unit));line-height:1.6;color:var(--native-muted);margin:calc(15 * var(--native-unit)) 0}
.student-button{padding:calc(15 * var(--native-unit));margin-bottom:calc(12 * var(--native-unit));width:100%;text-align:left;display:flex;flex-direction:column;gap:calc(4 * var(--native-unit));color:inherit;font:inherit;position:relative}
.student-button small{color:var(--native-muted)}.student-button svg{position:absolute;right:calc(14 * var(--native-unit));top:40%}
.demo-form label,.demo-label{display:block;font-size:calc(14 * var(--native-unit));font-weight:500;margin:calc(18 * var(--native-unit)) 0}
.demo-form input,.demo-form select,.demo-label textarea,.demo-label select{display:block;width:100%;font:inherit;background:var(--native-card);color:var(--native-fg);padding:calc(12 * var(--native-unit));border:1px solid #92988c;border-radius:calc(9 * var(--native-unit));margin-top:calc(7 * var(--native-unit))}
.demo-label textarea{resize:vertical;font-weight:400;line-height:1.6}
.settings-row{display:flex;align-items:center;justify-content:space-between;padding:calc(16 * var(--native-unit));gap:calc(10 * var(--native-unit));margin-bottom:calc(12 * var(--native-unit));font-size:calc(13 * var(--native-unit))}
.settings-row strong{font-weight:500}.settings-row input{accent-color:var(--native-accent)}
.cart-count{position:absolute;right:calc(-7 * var(--native-unit));top:calc(-6 * var(--native-unit));min-width:calc(16 * var(--native-unit));height:calc(16 * var(--native-unit));border-radius:50%;background:var(--native-accent);color:white;display:grid;place-items:center;font-size:calc(9 * var(--native-unit))}
.cart-row{display:flex;gap:calc(12 * var(--native-unit));padding:calc(12 * var(--native-unit));margin-bottom:calc(12 * var(--native-unit))}.cart-row>img{width:calc(65 * var(--native-unit));height:calc(65 * var(--native-unit));object-fit:cover;border-radius:calc(8 * var(--native-unit))}.cart-row strong,.cart-row span{display:block;font-size:calc(13 * var(--native-unit))}.cart-row span{color:var(--native-muted);margin-top:calc(5 * var(--native-unit))}.cart-row button{border:0;background:transparent;padding:calc(7 * var(--native-unit)) 0;color:var(--native-accent);font:inherit;font-size:calc(12 * var(--native-unit))}.cart-total{display:flex;justify-content:space-between;margin:calc(23 * var(--native-unit)) 0}
.app-toast{position:absolute;left:calc(16 * var(--native-unit));right:calc(16 * var(--native-unit));bottom:calc(95 * var(--native-unit));padding:calc(12 * var(--native-unit));border-radius:calc(10 * var(--native-unit));background:#263b2a;color:white;z-index:9;font-size:calc(13 * var(--native-unit));text-align:center;box-shadow:0 4px 14px #0002}.app-toast[hidden]{display:none}
.screen button:focus-visible,.screen input:focus-visible,.screen select:focus-visible,.screen textarea:focus-visible{outline:2px solid var(--native-accent);outline-offset:2px}
/* The second phone enters horizontally after the first app's scroll completes. */
body{overflow-x:clip}
body[data-app=fioma]{--bg:#101b25;--fg:#f4f0e6;--muted:#b0bcc4;--line:#3c4b56;--accent:#d5b58c;background:var(--bg);color:var(--fg)}
.story,html.motion-preview .story{height:650svh}
.stage{overflow:clip}
.phone-wrap{width:max-content}
.device{position:relative;display:flex;justify-content:center;align-items:center;will-change:transform}
.device--fioma{position:absolute;inset:0;transform:translate3d(150vw,0,0)}
.device .source{pointer-events:none}
.device[data-app=nell] .screen{--native-unit:.294117647cqi;--native-bg:#f3f0e6;--native-fg:#242821;--native-muted:#696f61;--native-line:#d5d4c9;--native-accent:#bd450c;--native-card:#fbfaf6}
.device[data-app=fioma] .screen{--native-unit:.3125cqi;--native-bg:#f3f3f9;--native-fg:#151719;--native-muted:#626974;--native-line:#d8dde1;--native-accent:#00765c;--native-card:#fff}
@media(prefers-reduced-motion:reduce){html:not(.motion-preview) .story{height:auto}html:not(.motion-preview) .device{will-change:auto}}
.screen.is-interacting .content-window{visibility:hidden}
