@font-face{font-family:'Noto Emoji';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/noto-emoji-sparkle-400.ttf') format('truetype')}
@font-face{font-family:Geist;font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/geist-400.ttf') format('truetype')}
@font-face{font-family:Geist;font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/geist-500.ttf') format('truetype')}
@font-face{font-family:Geist;font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/geist-600.ttf') format('truetype')}
:root{--layout-desktop:1440px;--layout-sidebar:336px;--layout-sidebar-folded:56px;--layout-reader:1104px;--layout-home-intro:156px;--layout-search:580px;--size-control-toggle:36px;--size-search:56px;--size-search-sidebar:40px;--home-question-color:#242421;--home-lead-color:#8a8a84}
*{box-sizing:border-box;border-width:0;border-style:solid}html,body{margin:0;background:var(--background-page-default);color:var(--text-neutral-primary);font-family:var(--font-family-sans),sans-serif;font-size:var(--font-size-body);line-height:var(--font-line-body)}p,h1,h2,h3{margin:0;font-size:inherit;font-weight:inherit}button,input,a{font:inherit;color:inherit}button{cursor:pointer;background:none;padding:0}a{text-decoration:none}img{display:block}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:var(--stroke-focus-ring) solid var(--icon-neutral-primary);outline-offset:4px}[hidden]{display:none!important}.sr-only{position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip-link{position:fixed;left:var(--padding-comfortable);top:-100px;z-index:50;background:var(--background-surface-default);padding:var(--padding-control)}.skip-link:focus{top:var(--padding-comfortable)}
.home-page{max-width:var(--layout-desktop);margin-inline:auto;padding:var(--page-top) var(--page-sides) 0;display:flex;flex-direction:column;gap:var(--gap-sections-compact)}.home-page header{width:100%}.home-page footer>div{width:100%}.intro{display:flex;flex-direction:column;align-items:center;gap:var(--gap-blocks-compact);padding-block:var(--layout-home-intro)}.continuation .intro{padding-block:var(--padding-intro)}.question{display:flex;align-items:center;justify-content:center;gap:var(--gap-controls);white-space:nowrap}.question span{font-size:var(--font-size-lead);line-height:var(--font-line-lead);letter-spacing:var(--font-tracking-lead);color:var(--home-lead-color)}.question h1{font-size:var(--font-size-hero);line-height:var(--font-line-hero);font-weight:var(--font-weight-semibold);letter-spacing:var(--font-tracking-hero);color:var(--home-question-color)}.search-group{width:var(--layout-search);display:flex;flex-direction:column;align-items:center;gap:var(--gap-related-compact);position:relative}.search-form{display:flex;align-items:center;justify-content:space-between;width:100%;height:var(--size-search);border:var(--stroke-component-input) solid var(--border-neutral-default);border-radius:var(--radius-semantic-full);padding:var(--padding-compact) var(--padding-compact) var(--padding-compact) var(--padding-field);background:var(--background-surface-default)}.search-form input{width:100%;min-width:0;outline:none;border:0;background:none;font-size:var(--font-size-control);line-height:var(--font-line-support)}input::placeholder{color:var(--text-neutral-muted);opacity:1}.submit{display:grid;place-items:center;flex-shrink:0;width:var(--size-control-toggle);height:var(--size-control-toggle);border-radius:var(--radius-semantic-full);background:var(--background-action-default)}.submit img{width:var(--size-icon-large);height:var(--size-icon-large)}.submit:disabled{opacity:.5;cursor:wait}.filters{display:flex;align-items:center;justify-content:center;gap:var(--gap-controls)}.filter{height:32px;display:flex;align-items:center;justify-content:center;gap:var(--gap-icon-label-compact);border:var(--stroke-component-pill) solid var(--border-neutral-default);border-radius:var(--radius-semantic-full);padding-inline:var(--padding-control);font-size:var(--font-size-meta);line-height:var(--font-line-compact);font-weight:var(--font-weight-medium);white-space:nowrap;color:var(--text-neutral-secondary)}.filter[aria-pressed=true]{background:var(--background-brand-subtle);border-color:var(--border-brand-default);color:var(--text-neutral-primary)}.filter img{width:var(--size-icon-small);height:var(--size-icon-small)}.search-status{position:absolute;top:calc(100% + var(--gap-related-compact));font-size:var(--font-size-support);line-height:var(--font-line-support);color:var(--text-neutral-secondary);text-align:center}.collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-items-compact)}.piece-card{width:100%;aspect-ratio:1;display:flex;align-items:flex-end;justify-content:flex-start;text-align:left;background:var(--background-surface-strong);border-radius:var(--radius-semantic-widget);padding:var(--padding-container-compact);font-weight:var(--font-weight-medium);font-size:var(--font-size-control);line-height:var(--font-line-label)}.collection .piece-card[data-id=about]{align-items:center;justify-content:center}.piece-card:disabled{cursor:default}.reader-shell{position:relative;display:flex;height:100dvh;overflow:hidden}.sidebar{position:relative;flex:0 0 var(--layout-sidebar);width:var(--layout-sidebar);height:100%;display:flex;flex-direction:column;justify-content:space-between;gap:var(--gap-items-compact);padding:var(--padding-container-compact);border:var(--stroke-divider-default) solid var(--border-neutral-default);border-left:0;border-radius:0 var(--radius-semantic-widget) var(--radius-semantic-widget) 0;background:var(--background-surface-default)}.recommendations{display:flex;flex-direction:column;gap:var(--gap-items-compact);overflow:auto;scrollbar-width:thin;margin-right:-1px}.recommendations .piece-card{flex-shrink:0;justify-content:flex-end;text-align:right}.sidebar-toggle{position:absolute;top:7px;right:15px;z-index:2;display:grid;place-items:center;width:var(--size-control-toggle);height:var(--size-control-toggle);border:var(--stroke-divider-default) solid var(--border-neutral-subtle);border-radius:var(--radius-semantic-full);background:color-mix(in srgb,var(--background-surface-default) 80%,transparent)}.sidebar-toggle img{width:var(--size-icon-medium);height:var(--size-icon-medium)}.applied-query{background:var(--background-surface-default);height:var(--size-search-sidebar);flex-shrink:0;display:flex;align-items:center;gap:var(--gap-controls);padding:var(--padding-compact) var(--padding-compact) var(--padding-compact) var(--padding-field);border:var(--stroke-component-input) solid var(--border-neutral-default);border-radius:var(--radius-semantic-full);font-size:var(--font-size-control);line-height:var(--font-line-support)}.applied-query span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.clear-search{display:grid;place-items:center;width:var(--size-icon-large);height:var(--size-icon-large);flex-shrink:0;border-radius:var(--radius-semantic-full)}.clear-search img{width:var(--size-icon-small);height:var(--size-icon-small)}.reading-viewport{flex:1;min-width:0;height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-width:none}.reading-viewport::-webkit-scrollbar{display:none}.reading-page{width:var(--layout-reader);max-width:100%;margin-inline:auto;padding:var(--page-top) var(--page-sides) 0;display:flex;flex-direction:column;gap:var(--gap-sections-compact)}.reading-page>header,.reading-page>main,.reading-page>footer{width:100%}.folded .sidebar{position:absolute;z-index:2;top:0;left:0;width:var(--layout-sidebar-folded);height:var(--layout-sidebar-folded);padding:0;border:0;border-radius:0;background:transparent;display:block}.folded .sidebar-toggle{top:var(--padding-compact);left:calc((var(--layout-sidebar-folded) - var(--size-control-toggle))/2);right:auto}.folded .recommendations,.folded .applied-query{display:none}.home-link{display:flex;align-items:center;gap:var(--gap-related-compact)}
/* Functional scrolling replaces the negative left offset of Figma's timeline viewport. */
[data-node-id="3390:2742"]{width:var(--layout-reader)}
[data-node-id="3390:2743"]{width:100%;scrollbar-width:none;scroll-behavior:smooth}
[data-node-id="3390:2744"]{position:relative;left:0}
[data-node-id="3390:2740"],[data-node-id="3390:2741"]{cursor:pointer}
[data-node-id="3390:2794"] input{background:transparent;border:0;outline:0;min-width:0;flex:1;font-size:var(--font-size-control);line-height:var(--font-line-support)}
.tool-match{outline:var(--stroke-focus-ring) solid var(--icon-neutral-primary);outline-offset:4px}
.tool-dim{opacity:.15}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
/* Mobile art direction remains deferred; this only prevents inaccessible overflow. */
@media(max-width:1000px){.question{white-space:normal;flex-wrap:wrap}.search-group{max-width:100%}.reader-shell{min-width:900px}.home-page{min-width:760px}}
/* Figma SPACE_BETWEEN ignores itemSpacing. An inside stroke is paint, not padding. */
[data-node-id="3390:2471"]{gap:0}
[data-node-id="3390:2467"],[data-node-id="3390:2488"],[data-node-id="3390:2493"]{border-width:0;box-shadow:inset 0 0 0 var(--stroke-component-card) var(--border-neutral-default)}

/* Shared Figma icon and footer-indicator bindings, corrected 6 October 2026. */
.filter-icon,.filter-icon svg{display:block;width:var(--size-icon-small);height:var(--size-icon-small);flex-shrink:0}
.filter-icon [stroke]{stroke:var(--icon-neutral-secondary);stroke-width:var(--stroke-icon-small)}
.location-indicator svg,.availability-indicator svg{display:block;width:100%;height:100%}
.location-indicator [fill]{fill:var(--background-location-default)}
.availability-indicator [fill]{fill:var(--background-status-available)}

/* Carrefour's original 1320px composition, fluid inside the shared reader shell. */
.reading-page[data-piece="carrefour"]{width:var(--layout-desktop)}
.reading-page[data-piece="carrefour"] main{container-type:inline-size}
.reading-page[data-piece="spotify"]{width:var(--layout-desktop)}
.reading-page[data-piece="spotify"] main{container-type:inline-size}
[data-node-id="2552:721"] [data-node-id]{max-width:100%}
[data-node-id="2701:981"]{gap:0}
[data-node-id="2701:977"],[data-node-id="2857:1065"],[data-node-id="2805:1104"]{border-width:0;box-shadow:inset 0 0 0 var(--stroke-component-card) var(--border-neutral-default)}
[data-node-id="2709:1003"],[data-node-id="2709:1036"]{flex:1;min-width:0}
[data-node-id="2805:1072"]>div,[data-node-id="2805:1083"]>div{flex:1;min-width:0;border-width:0;box-shadow:inset 0 0 0 var(--stroke-component-card) var(--border-neutral-default)}
[data-node-id="2857:1065"]>div:has(>div){display:grid;grid-template-columns:minmax(0,287fr) 1px minmax(0,575fr) 1px minmax(0,456fr)}
[data-node-id="2857:1065"]>div>div{width:100%;min-width:0}
[data-node-id="2805:1104"]>div:has(>div){display:grid;grid-template-columns:minmax(0,240fr) minmax(0,820fr);width:100%}
[data-node-id="2805:1104"]>div>div{width:100%;min-width:0}
[data-node-id="I2805:1098;2797:196"]{flex-wrap:wrap}
[data-node-id="I2805:1098;2797:196"] button{border-width:0;box-shadow:inset 0 0 0 var(--stroke-component-card) var(--border-neutral-subtle)}
[data-node-id="I2805:1098;2797:196"] button[aria-pressed="true"]{box-shadow:none}
[data-node-id="I2805:1098;2797:207"]>div{max-width:calc((100% - var(--gap-items-default))/2)}
@container(max-width:1200px){
 [data-node-id="2701:976"]{flex-direction:column}
 [data-node-id="2701:977"]{width:100%}
 [data-node-id="2701:981"]{flex:none;gap:var(--gap-items-compact)}
 [data-node-id="2701:997"]{width:100%;flex-direction:row;align-items:stretch}
 [data-node-id="2701:997"]>div{flex:1}
 [data-node-id="I2701:974;2495:710"]{flex-wrap:wrap}
 [data-node-id="I2701:974;2495:711"]{flex:auto}
 [data-node-id="2728:1007"]>div{flex-wrap:wrap;justify-content:center}
}
[data-node-id="2528:649"] [data-node-id]{max-width:100%}
[data-node-id="2529:649"]{width:100%}
[data-node-id="2572:778"]{gap:0}
[data-node-id="2572:776"],[data-node-id="2529:666"],[data-node-id="2529:671"]{border-width:0;box-shadow:inset 0 0 0 var(--stroke-component-card) var(--border-neutral-default)}
[data-node-id="2595:864"],[data-node-id="2628:938"],[data-node-id="2607:883"]{height:auto}
[data-node-id="2595:864"]>p,[data-node-id="2628:938"]>p,[data-node-id="2607:883"]>p{flex:none}
@container(max-width:1200px){
 [data-node-id="2529:659"]{flex-direction:column}
 [data-node-id="2572:776"]{width:100%;flex:auto}
 [data-node-id="2572:778"]{flex:none;gap:var(--gap-items-compact)}
 [data-node-id="2529:665"]{width:100%;flex-direction:row;align-items:stretch}
 [data-node-id="2529:665"]>div{flex:1}
 [data-node-id="2574:817"]{width:50%}
 [data-node-id="2585:910"]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 [data-node-id="I2529:652;2495:710"]{flex-wrap:wrap}
}

.collection .piece-card.has-media{aspect-ratio:auto;align-self:start;display:flex;flex-direction:column;align-items:stretch;gap:var(--gap-related-compact);background:var(--background-surface-default);padding:0}.inno-mock{position:relative;display:block;width:100%}.inno-mock-frame{position:relative;display:block;width:100%;aspect-ratio:1440/1059;overflow:hidden;border-radius:var(--radius-semantic-widget);border:var(--stroke-divider-default) solid var(--border-neutral-subtle);background:#fafcfc;box-shadow:0 1px 2px rgba(0,0,0,.04),0 16px 32px -16px rgba(0,0,0,.14)}.inno-mock-stage{position:absolute;left:0;top:0;display:block;width:1440px;height:1059px;transform-origin:0 0}.inno-mock-layer{position:absolute;inset:0;display:block;background-size:1440px auto;background-repeat:no-repeat}.inno-mock-press{position:absolute;display:block;border-radius:6px;background:#000}.inno-mock-pointer{position:absolute;left:0;top:0;z-index:2;display:block;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:rgba(16,36,43,.24);box-shadow:0 0 0 2px rgba(255,255,255,.95),0 2px 6px rgba(16,36,43,.22);pointer-events:none;opacity:0}.inno-mock-ripple{position:absolute;left:-14px;top:-14px;z-index:1;display:block;width:28px;height:28px;border-radius:50%;background:rgba(16,36,43,.16);border:1.5px solid rgba(16,36,43,.3);pointer-events:none;opacity:0}.inno-mock-confetti{position:absolute;left:-60px;top:-60px;z-index:1;display:block;pointer-events:none}
.inno-mock-ring{position:absolute;display:block;border:6px solid rgba(30,127,140,.45);box-shadow:0 0 24px rgba(30,127,140,.25)}

/* Home collection without cards: free pieces at different heights, no visible titles.
   The piece name shows on hover or keyboard focus. Shapes are outlined placeholders. */
.collection{align-items:start}
/* Same rhythm as the first test prototype: 72px between columns and pieces, columns start at different heights (0 / 64 / 24). */
.collection{column-gap:72px}
.collection-column{display:flex;flex-direction:column;gap:0;min-width:0}
.collection-column>*{margin-bottom:72px}
.collection-column:nth-child(2){margin-top:64px}
.collection-column:nth-child(3){margin-top:24px}
.collection .piece-card{position:relative;display:block;aspect-ratio:auto;background:transparent;padding:0;text-align:left;border-radius:0;transition:transform .24s cubic-bezier(.2,.7,.2,1)}
.collection .piece-card:hover,.collection .piece-card:focus-visible{transform:translateY(-6px)}
.collection .piece-shape{display:block;width:100%;border:var(--stroke-component-card) solid var(--border-neutral-default)}
.collection .piece-card[data-shape=tall] .piece-shape{aspect-ratio:4/5;border-radius:var(--radius-semantic-widget)}
.collection .piece-card[data-shape=circle] .piece-shape{aspect-ratio:1;border-radius:var(--radius-semantic-full)}
.collection .piece-card[data-shape=pill] .piece-shape{aspect-ratio:3/5;border-radius:var(--radius-semantic-full)}
.collection .piece-card[data-shape=wide] .piece-shape{aspect-ratio:5/4;border-radius:var(--radius-semantic-widget)}
.collection .piece-card[data-shape=arch] .piece-shape{aspect-ratio:4/5;border-radius:999px 999px var(--radius-semantic-widget) var(--radius-semantic-widget)}
.collection .piece-card[data-shape=soft] .piece-shape{aspect-ratio:1;border-radius:42% 58% 53% 47%/48% 44% 56% 52%}
/* Caption: small muted text below the piece, shown on hover (as in the test prototype) */
.collection .piece-label{position:static;display:block;margin-top:10px;padding:0;border:0;background:none;color:var(--text-neutral-muted);font-size:12px;line-height:18px;font-weight:400;white-space:normal;opacity:0;transform:translateY(-4px);transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.collection .piece-card:hover .piece-label,.collection .piece-card:focus-visible .piece-label{opacity:1;transform:none}
/* Innoscribe: about 1.25 columns (about 40% of the wall) and never narrower than 440px. Column 2 starts under it. */
.collection.has-feature .piece-card.has-media{width:max(440px,calc(125% + 30px));max-width:none}
/* Percent margins resolve against column width c; feature height = 1059/1440 of (1.5c+36px), plus the 72px gap. */
.collection.has-feature .collection-column:nth-child(2){margin-top:max(395.6px,calc(91.93% + 94.1px))}
/* TEMPORARY reference images (see temp-refs.mjs) */
.collection .piece-ref{display:block;width:100%;height:auto;border-radius:var(--radius-semantic-widget);transition:box-shadow .35s}
.collection .piece-card:hover .piece-ref,.collection .piece-card:focus-visible .piece-ref{box-shadow:0 18px 40px rgba(0,0,0,.1)}
.spot-mock,.collection .has-phone .piece-label{width:72%}
.spot-mock{position:relative;display:block}
.collection .has-phone .piece-label{text-align:left}
.spot-mock::after{content:"";position:absolute;left:10%;right:10%;bottom:-3%;height:5%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.28),rgba(0,0,0,0));filter:blur(6px);z-index:-1}
.spot-phone{position:relative;display:block;padding:1.9%;border-radius:15.8%/7.3%;background:radial-gradient(70% 22% at 18% 0%,rgba(255,255,255,.3),rgba(255,255,255,0) 70%),radial-gradient(60% 18% at 85% 100%,rgba(255,255,255,.18),rgba(255,255,255,0) 70%),linear-gradient(145deg,#b9b9bf 0%,#6f6f76 6%,#3a3a3f 13%,#1d1d20 28%,#141416 55%,#28282c 78%,#7c7c83 93%,#c4c4ca 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),inset 0 1px 2px rgba(255,255,255,.45),inset 0 -3px 4px rgba(0,0,0,.55),0 1px 2px rgba(0,0,0,.18),0 14px 24px -8px rgba(0,0,0,.35),0 48px 70px -26px rgba(0,0,0,.45)}
.spot-phone::before,.spot-phone::after{content:"";position:absolute;width:1.6%;background:linear-gradient(90deg,#333338,#a6a6ac 42%,#626268 70%,#28282c);box-shadow:0 0 0 .5px rgba(0,0,0,.45),0 2px 3px rgba(0,0,0,.25)}
.spot-phone::before{right:-1.1%;top:25%;height:11%;border-radius:0 3px 3px 0}
.spot-phone::after{left:-1.1%;top:19%;height:15%;border-radius:3px 0 0 3px}
.spot-bezel{position:relative;display:block;padding:2.4%;border-radius:14.6%/6.8%;background:linear-gradient(160deg,#16161a,#020203 40%,#0a0a0c);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1),inset 0 1px 1px rgba(255,255,255,.18)}
.spot-mock-frame{position:relative;display:block;width:100%;aspect-ratio:384/832;overflow:hidden;border-radius:12%/5.6%;background:#1a4fd6}
.spot-mock-stage{position:absolute;left:0;top:0;display:block;width:384px;height:832px;transform-origin:0 0}
.spot-mock-layer{position:absolute;left:0;top:0;display:block;width:384px;height:832px;background-size:384px auto;background-repeat:no-repeat}
.spot-black{position:absolute;inset:0;z-index:5;display:block;background:#000;opacity:0;pointer-events:none}
.spot-island{position:absolute;left:50%;top:1.3%;z-index:6;display:block;width:28%;height:3.3%;border-radius:999px;background:#000;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);transform:translateX(-50%)}
.spot-glare{position:absolute;inset:0;z-index:9;display:block;border-radius:inherit;pointer-events:none;background:linear-gradient(116deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,.09) 17%,rgba(255,255,255,0) 33%,rgba(255,255,255,0) 64%,rgba(255,255,255,.045) 74%,rgba(255,255,255,0) 86%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.55),inset 0 0 18px rgba(0,0,0,.25)}
.spot-key{position:absolute;display:none;z-index:4;border-radius:5px;background:rgba(255,255,255,.38);pointer-events:none}
.spot-mock .inno-mock-pointer{z-index:8;width:var(--pt,22px);height:var(--pt,22px);margin:calc(var(--pt,22px)/-2) 0 0 calc(var(--pt,22px)/-2)}
.spot-mock .inno-mock-ripple{z-index:7;left:0;top:0;width:calc(var(--pt,22px)*1.3);height:calc(var(--pt,22px)*1.3);margin:calc(var(--pt,22px)*-.65) 0 0 calc(var(--pt,22px)*-.65)}
.spot-avatar{position:absolute;display:none;z-index:3;width:32px;height:32px;border-radius:50%;background-size:100% 100%;pointer-events:none}
/* Knitted border around the Innoscribe screen: the wrap reserves the band's width so nothing overlaps the label or the neighbours */
.knit-wrap{display:block;padding:1.95%}.knit-border{position:absolute;display:block;pointer-events:none}
/* Carrefour phone mockup on the Home: same phone as Spotify, Carrefour screens scrolled inside it */
.carr-mock,.carr-mock+.piece-label{margin-inline:auto}
.carr-mock .spot-mock-frame{background:#f9fafc}
.carr-stage{position:absolute;left:0;top:0;display:block;width:375px;height:812.5px;transform-origin:0 0}
.carr-screen{position:absolute;left:0;top:0;display:block;width:375px;height:812.5px;overflow:hidden;background:#f9fafc}
.carr-page{position:absolute;left:0;top:0;display:block;width:375px;background-size:375px auto;background-repeat:no-repeat}
.carr-dock{position:absolute;left:0;bottom:0;display:block;width:375px;background-size:375px auto;background-repeat:no-repeat;-webkit-mask-image:linear-gradient(rgba(0,0,0,0),#000 12px);mask-image:linear-gradient(rgba(0,0,0,0),#000 12px)}
.carr-band{position:absolute;left:0;top:0;display:block;width:375px;height:64px;background:linear-gradient(#fefefe 86%,rgba(254,254,254,0));opacity:0}
.carr-pick{position:absolute;display:flex;align-items:center;justify-content:center;border-radius:999px;background:#0054a6;opacity:0}
.carr-pick svg{display:block;width:26px;height:26px}.carr-pick path{stroke-dasharray:1;stroke-dashoffset:1}
.carr-chip-off,.carr-chip-on{position:absolute;display:block;border-radius:50%;box-sizing:border-box;opacity:0;pointer-events:none}
.carr-chip-off{border:2.6px solid #f9fafb;margin:-.6px 0 0 -.6px;padding:.6px;box-sizing:content-box}
.carr-chip-on{border:2.4px solid #0054a6;box-shadow:0 2px 8px rgba(16,36,60,.12)}

/* A.2 article flowers preserve the free collection layout and existing mockups. */
.collection .home-flower{--flower-scale:.77;--flower-width:192px;display:block;width:calc(min(100%,var(--flower-width))*var(--flower-scale));margin-inline:auto}
.collection .home-flower[data-flower="2"]{--flower-width:224px}
.collection .home-flower[data-flower="3"]{--flower-scale:.805;--flower-width:176px}
.collection .home-flower[data-flower="4"]{--flower-width:208px}
.home-flower .flower-svg{display:block;width:100%;height:auto;aspect-ratio:2/3;overflow:visible;shape-rendering:crispEdges;pointer-events:none}
.collection .has-flower .piece-label{text-align:center}
.collection .has-flower .piece-label.has-article-icon{display:flex;align-items:center;justify-content:center;gap:var(--gap-icon-label-default)}
.collection .piece-card.has-flower:hover,.collection .piece-card.has-flower:focus-visible{transform:none}

/* Medium article titles use the existing hover label; touch screens keep them readable. */
@media (hover:none){.collection .has-flower .piece-label{opacity:1;transform:none}}
/* Innoscribe · Understanding the user: dark pill speech bubbles (action colours of the design system) instead of grey cards. */
[data-node-id="3390:2503"]{--bubble-ink:var(--background-action-default);--bubble-fill:var(--background-action-default);--bubble-stroke:var(--stroke-component-pill);--bubble-tail-w:16px;--bubble-tail-h:16px;padding-bottom:var(--bubble-tail-h)}
[data-node-id="3390:2503"] .f-2d13fba{background:var(--bubble-fill);border:var(--bubble-stroke) solid var(--bubble-ink);border-radius:var(--radius-semantic-full);padding:var(--padding-compact) var(--padding-container-compact)}
[data-node-id="3390:2503"] .f-b48a673{font-size:var(--font-size-control);line-height:var(--font-line-label);color:var(--text-action-default)}
[data-node-id="3390:2503"] .f-2d13fba::before,[data-node-id="3390:2503"] .f-2d13fba::after{content:"";position:absolute;top:calc(100% - var(--bubble-stroke));right:var(--padding-container-compact);width:var(--bubble-tail-w);height:var(--bubble-tail-h);-webkit-mask:var(--m) no-repeat 0 0/100% 100%;mask:var(--m) no-repeat 0 0/100% 100%}
[data-node-id="3390:2503"] .f-2d13fba::before{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5C6 1.5 12.5 6 15.5 15.5V0H2Z'/%3E%3C/svg%3E");background:var(--bubble-fill)}
[data-node-id="3390:2503"] .f-2d13fba::after{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M0 1.5C6 1.5 12.5 6 15.5 15.5V1' fill='none' stroke='%23000' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E");background:var(--bubble-ink)}