/* 60 · shelf: one merged founder card, then the deck of prices, in the house rose. No banner field, no foil: the
   founder item is one calm surface with the well under it, its rings round the price (its focal point, set by shelf.js).
   Items lean with the page camera at panel depth, a little more where a hand rests. */

@property --irx{syntax:"<angle>";inherits:false;initial-value:0deg}
@property --iry{syntax:"<angle>";inherits:false;initial-value:0deg}
.rw-shelf__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
/* the Offer type's shape reads its tokens (05-types.css, the Offer block) */
.rw-item{--pk:var(--rose);position:relative;overflow:hidden;min-width:0;display:flex;flex-direction:column;gap:var(--offer-gap,10px);padding:var(--offer-pad,20px);border-radius:var(--offer-radius,16px);
  background:var(--rw-item-bg);border:1px solid color-mix(in srgb,var(--rw-item-edge) 45%,var(--rw-engine-edge));
  transform:perspective(1100px) rotateX(calc(var(--rw-py) * calc(-1 * var(--offer-lean-x,3deg)) + var(--irx))) rotateY(calc(var(--rw-px) * var(--offer-lean-y,4deg) + var(--iry)));
  transition:--irx .25s ease-out,--iry .25s ease-out,box-shadow .3s,border-color .3s}
.rw-item:hover{border-color:var(--rw-item-edge);box-shadow:0 22px 48px -18px color-mix(in srgb,var(--rw-item-edge) 60%,transparent)}
.rw-item>*{position:relative;z-index:1}
.rw-item>.rw-gloss{position:absolute;z-index:3}
/* the ground breathes as one piece (rw-swell, 50-card.css), about its focal point */
.rw-item>.rw-well{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none;
  --swell:1.006;animation:rw-swell calc(var(--rw-beat) * 6) ease-in-out infinite}
.rw-item .rw-well__ring{stroke:color-mix(in oklab,var(--rw-item-edge) 60%,var(--rw-item-bg));stroke-width:1}
.rw-item__tag{align-self:flex-start;font-family:var(--f-data);font-size:11px;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:2px 10px;
  color:var(--rw-item-tag-ink);background:color-mix(in oklab,var(--rw-item-edge) 10%,transparent);border:1px solid color-mix(in oklab,var(--rw-item-edge) 35%,transparent)}
.rw-item__title{font-size:26px;color:var(--rw-item-title)}
.rw-item__price{align-self:flex-start;font-family:var(--f-data);font-size:22px;font-weight:700;color:var(--rw-price-ink)}
.rw-item__price--big{font-size:40px;line-height:1}
.rw-item__pitch{margin-top:14px;font-size:15px;color:var(--rw-item-text);max-width:56ch}
.rw-item__list{margin:0;padding-left:18px;color:var(--rw-item-text);font-size:15px}
.rw-item__list--small{font-size:14px}
.rw-item__cols{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px;align-items:start;margin-top:10px}
.rw-item__col{display:flex;flex-direction:column;gap:10px;min-width:0}
.rw-item__slots{font-family:var(--f-data);font-size:13px;color:var(--rw-slots-ink)}
.rw-item__inner{display:flex;flex-direction:column;gap:8px;border:1px solid var(--rw-inner-edge);border-radius:12px;padding:14px 16px;
  background:color-mix(in srgb,var(--rw-item-edge) 6%,var(--rw-inner-bg))}
.rw-item__sub{font-family:var(--f-display);font-size:20px;color:var(--rw-item-sub)}
.rw-item__note{font-size:14.5px;color:var(--rw-item-text)}

.rw-item .rw-well__lines{fill:none;stroke:color-mix(in oklab,var(--rw-item-edge) 60%,var(--rw-item-bg));stroke-width:1}

/* a button on a card is cut from the card: the Button type's --card variant (06-button.css) */

/* a pack panel wears its pack's hue: edge, tag and price all from --panel-h */
.rw-panel{--rw-item-edge:light-dark(oklch(.5 .15 var(--panel-h)),oklch(.72 .13 var(--panel-h)));
  --rw-price-ink:light-dark(oklch(.42 .14 var(--panel-h)),oklch(.84 .1 var(--panel-h)));--rw-item-tag-ink:var(--rw-price-ink)}

/* the stack: the packs as big cards in one pile, the top one read, the ones beneath showing their lower edges;
   a click on an edge, or the button, brings the next one up */
.rw-stack-wrap{display:flex;flex-direction:column;gap:10px;min-width:0}
.rw-stack{display:grid;min-width:0;padding-bottom:calc((var(--n,1) - 1) * 14px)}
.rw-stack>.rw-panel{grid-area:1 / 1;transform-origin:50% 100%;z-index:calc(20 - var(--depth,0));
  translate:0 calc(var(--depth,0) * 14px);scale:calc(1 - var(--depth,0) * .03);
  transition:translate .45s var(--e),scale .45s var(--e),--irx .25s ease-out,--iry .25s ease-out,box-shadow .3s,border-color .3s}
/* the ones beneath take no height of their own (the pile is as tall as the card on top, no empty space under its
   door) and darken toward the house rose with depth, not grey (the user, 2026-10-13, phone: "fix this"); no filter,
   so the phone does not repaint the whole pile */
.rw-stack>.rw-panel[aria-hidden="true"]{cursor:pointer;contain:size;overflow:hidden;
  box-shadow:inset 0 0 0 100vmax color-mix(in srgb,var(--rose-dark) calc(var(--depth,0) * 16%),transparent)}
.rw-stack__next{display:none}

/* the dispenser (module.shelf): the pile is the machine, the edges under its top card are its mouth; a click deals
   again. The tray below holds the tickets across, then down, as many to a row as the window fits; a slot opens only
   as its ticket lands, so the page below is pushed down by each landing */
.rw-stack--machine{cursor:pointer}
.rw-stack--machine::after{content:"";grid-area:1 / 1;align-self:end;justify-self:center;z-index:30;width:62%;height:6px;margin-bottom:-3px;border-radius:999px;
  translate:0 calc((var(--n,1) - 1) * 14px);background:radial-gradient(closest-side,color-mix(in srgb,var(--rose-dark) 70%,#000),transparent);pointer-events:none}
.rw-dispense{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:12px;align-items:start;margin-top:4px}
.rw-dispense:empty{display:none}
.rw-dispense__slot{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--e,ease)}
.rw-dispense__slot.is-in{grid-template-rows:1fr}
.rw-dispense__slot > *{min-height:0;overflow:visible}
.rw-dispense__slot:not(.is-flying):not(.is-in) > *{visibility:hidden}
.rw-dispense__slot.is-flying > *{position:relative;z-index:40}

/* the ticket: a stub torn along a perforation, its pack's hue, its name, its price and its door */
.rw-ticket{--tk:light-dark(oklch(.5 .15 var(--panel-h)),oklch(.72 .13 var(--panel-h)));position:relative;display:flex;flex-direction:column;gap:6px;padding:12px 14px 12px 22px;
  border-radius:10px;background:color-mix(in oklab,var(--tk) 9%,var(--rw-item-bg));border:1px solid color-mix(in oklab,var(--tk) 45%,transparent);
  box-shadow:0 10px 22px -16px color-mix(in oklab,var(--tk) 70%,#000);will-change:transform}
.rw-ticket__stub{position:absolute;left:10px;top:8px;bottom:8px;border-left:2px dotted color-mix(in oklab,var(--tk) 55%,transparent)}
.rw-ticket::before,.rw-ticket::after{content:"";position:absolute;left:4px;width:12px;height:12px;border-radius:50%;background:var(--rw-ground-end)}
.rw-ticket::before{top:-6px}.rw-ticket::after{bottom:-6px}
.rw-ticket__name{font-family:var(--f-display);font-size:18px;line-height:1.15;color:var(--rw-item-title)}
.rw-ticket__price{font-family:var(--f-data);font-size:13px;letter-spacing:.06em;color:var(--tk)}

/* the ticket door, "Click me!": stamped, not glowing; a dashed edge like a perforation that turns solid under the hand,
   the pack's hue as its ink. Kit Button variant ticket (core/types.js) */
.rw-btn.rw-btn--ticket{--btn-ground-a:transparent;--btn-ground-b:transparent;--btn-bloom:transparent;--btn-aura:transparent;--btn-glow:transparent;--btn-shadow:none;--btn-shadow-hover:none;
  --tk:var(--rw-item-edge,var(--rose));--btn-edge:color-mix(in oklab,var(--tk) 70%,transparent);--btn-ink:var(--tk);--btn-hover-ink:var(--rw-item-bg,#fff);--btn-radius:6px;--btn-pad-y:8px;--btn-pad-x:14px;
  align-self:flex-start;border-style:dashed;font-family:var(--f-data);font-weight:700;letter-spacing:.12em;text-transform:uppercase;transition:background .2s,border-style .2s,rotate .2s}
.rw-ticket .rw-btn--ticket{--tk:light-dark(oklch(.5 .15 var(--panel-h)),oklch(.72 .13 var(--panel-h)))}
.rw-btn.rw-btn--ticket:hover,.rw-btn.rw-btn--ticket:focus-visible{background:var(--tk);border-style:solid;rotate:-2deg}
@media (prefers-reduced-motion:reduce){.rw-dispense__slot{transition:none}.rw-btn.rw-btn--ticket{transition:none}}

/* the deck of prices: one card per pack, fanned from the middle; the card under a hand straightens and rises.
   Narrow screens lay the deck in a row that scrolls inside itself */
.rw-offers{display:flex;flex-direction:column;gap:10px;min-width:0}
.rw-offers__fan{display:flex;justify-content:center;align-items:flex-start;padding:24px 14px 20px;min-width:0}
.rw-offers__slot{position:relative;z-index:0;flex:none;width:min(210px,calc((100% + 112px) / 5));margin-inline:-14px;
  rotate:calc(var(--fan) * 4deg);translate:0 calc(var(--fan) * var(--fan) * 5px);transition:rotate .25s var(--e),translate .25s var(--e)}
.rw-offers__slot:hover,.rw-offers__slot:focus-within{z-index:2;rotate:0deg;translate:0 -10px}
@media (max-width:640px){
  .rw-offers__fan{justify-content:flex-start;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:12px 4px}
  .rw-offers__slot{width:58vw;margin-inline:0;rotate:0deg;translate:none;scroll-snap-align:center}
}
@media (prefers-reduced-motion:reduce){.rw-offers__slot{transition:none}}

.rw-manifesto__and{color:var(--rw-and-ink);font-weight:700;letter-spacing:.18em;text-shadow:0 0 10px var(--rw-and-glow)}
.rw-footer{border-top:1px solid var(--rw-footer-rule);padding-top:16px;font-size:13px;color:var(--rw-footer-ink);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

@media (max-width:700px){.rw-item__cols{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.rw-item{transform:none;transition:none}.rw-item>.rw-well{animation:none}}