@layer components{.ribbon{block-size:calc((var(--count) * 87.4 + 182.8) * 1svh);position:relative}.ribbon__pin{isolation:isolate;block-size:100svh;color:var(--foreground);position:sticky;inset-block-start:0;overflow:hidden}.ribbon__canvas{z-index:1;block-size:100%;inline-size:100%;display:block;position:absolute;inset:0}.ribbon__hits{z-index:2;pointer-events:none;position:absolute;inset:0}.ribbon__hit{cursor:pointer;visibility:hidden;pointer-events:none;background:0 0;border:0;padding:0;position:absolute;top:0;left:0}.ribbon__hit.is-on{visibility:visible;pointer-events:auto}.ribbon__count{z-index:3;color:var(--muted-foreground);font-variant-numeric:tabular-nums;opacity:0;transition:opacity .5s var(--ease-out), translate .7s var(--ease-out);align-items:center;gap:.6rem;margin:0;display:flex;position:absolute;inset-block-start:calc(var(--header-h) + 1rem);inset-inline-end:var(--gutter);translate:0 -.4rem}.ribbon__count.is-shown{opacity:1;translate:0}.ribbon__count b{color:var(--foreground);font-weight:600}.ribbon__count-line{background:color-mix(in srgb, var(--foreground) 16%, transparent);block-size:1px;inline-size:4.5rem;display:block;position:relative}.ribbon__count-line i{background:var(--gradient-fire);transition:inline-size .7s var(--ease-out);position:absolute;inset-block:0;inset-inline-start:0}.ribbon__ours{inset-inline:var(--gutter);z-index:3;font-family:var(--font-title);text-transform:uppercase;color:var(--foreground);pointer-events:none;flex-wrap:wrap;justify-content:center;gap:0 .32em;margin:0;font-size:clamp(2rem,.9rem + 3.6vw,4.4rem);font-weight:400;line-height:1;display:flex;position:absolute;inset-block-start:calc(var(--header-h) + 1.1rem)}.ribbon__ours-word{padding-block:.06em;display:inline-block;overflow:hidden}.ribbon__ours-word>span{transition:translate .75s var(--ease-out) calc(var(--i) * 80ms);display:inline-block;translate:0 110%}.ribbon__ours.is-shown .ribbon__ours-word>span{translate:0}.ribbon__plate{--plate-cut:1.1rem;z-index:3;inline-size:min(18.5rem, calc(100vw - 2 * var(--gutter)));pointer-events:none;visibility:hidden;transition:visibility 0s linear .6s;position:absolute;inset-block-end:calc(var(--dock-h,3rem) + var(--dock-gap,1rem) + 1.4rem);inset-inline-start:calc(var(--wire-x) + var(--corridor))}.ribbon__plate.is-shown{visibility:visible;pointer-events:auto;transition-delay:0s}.ribbon__plate-shade{z-index:-1;filter:blur(22px);opacity:0;transition:opacity .6s var(--ease-out);pointer-events:none;position:absolute;inset:.9rem .6rem -.4rem}.ribbon__plate .cut{--_cut:var(--plate-cut)}.ribbon__plate-shade .cut{background:#140c0452;position:absolute;inset:0}.ribbon__plate.is-shown .ribbon__plate-shade{opacity:1}.ribbon__plate-in{background:radial-gradient(120% 90% at 0% 0%, #ffffff8c, transparent 60%), linear-gradient(158deg, #ffffffb8 0%, #ffffff75 45%, #fff6 70%, #fff9 100%), color-mix(in srgb, var(--background) 30%, transparent);-webkit-backdrop-filter:blur(18px)saturate(180%)brightness(1.04);backdrop-filter:blur(18px)saturate(180%)brightness(1.04);color:var(--foreground);opacity:0;transition:opacity .55s var(--ease-out), translate .8s var(--ease-out);gap:.4rem;padding:1.3rem 1.5rem 1.35rem;display:grid;position:relative;translate:0 1.1rem;box-shadow:inset 0 1px #fffffff2,inset 1px 0 #ffffff8c,inset -1px 0 #ffffff4d,inset 0 -1px #00000012}.ribbon__plate.is-shown .ribbon__plate-in{opacity:1;translate:0}.ribbon__plate-in:before{content:"";inset-block-start:0;inset-inline:0 var(--plate-cut);background:var(--gradient-fire);transform-origin:0;block-size:2px;animation:plate-line .9s var(--ease-out) .1s both;position:absolute}[dir=rtl] .ribbon__plate-in:before{transform-origin:100%}.ribbon__plate-in:after{content:"";animation:plate-sheen 1.5s var(--ease-out) .15s both;pointer-events:none;background:linear-gradient(112deg,#0000 30%,#ffffff8c 48%,#ffffff1a 56%,#0000 70%) 120% 0/260% 100%;position:absolute;inset:0}.ribbon__plate-in>*{z-index:1;animation:plate-rise .7s var(--ease-out) both;margin:0;position:relative}.ribbon__plate-in>:nth-child(2){animation-delay:60ms}.ribbon__plate-in>:nth-child(3){animation-delay:.12s}.ribbon__plate-in>:nth-child(4){animation-delay:.18s}.ribbon__kind{color:var(--muted-foreground);padding-inline-end:var(--plate-cut)}.ribbon__name{font-family:var(--font-title);overflow-wrap:break-word;white-space:normal;text-wrap:balance;text-transform:uppercase;font-size:clamp(1.2rem,.9rem + .95vw,1.75rem);font-weight:400;line-height:.95}.ribbon__tag{color:color-mix(in srgb, var(--foreground) 72%, transparent)}.ribbon__actions{flex-wrap:wrap;gap:.5rem;display:flex;margin-block-start:.55rem!important}.ribbon__actions>*{white-space:nowrap}.dark .ribbon__plate-in,:root.dark .ribbon__plate-in{background:linear-gradient(158deg, #ffffff21 0%, #ffffff0a 45%, #ffffff05 62%, #ffffff14 100%), color-mix(in srgb, var(--background) 52%, transparent);box-shadow:inset 0 1px #ffffff38,inset 1px 0 #ffffff1a,inset -1px 0 #ffffff0f,inset 0 -1px #0000004d}.dark .ribbon__plate-in:after,:root.dark .ribbon__plate-in:after{background-image:linear-gradient(112deg,#0000 30%,#ffffff29 48%,#ffffff08 56%,#0000 70%)}.dark .ribbon__plate-shade .cut,:root.dark .ribbon__plate-shade .cut{background:#0000008c}@media (width>=48rem){.ribbon__plate{--plate-cut:.85rem;inline-size:max-content;max-inline-size:min(52rem, calc(100vw - 2 * var(--gutter) - 8rem));left:50%;right:auto;inset-block-end:calc(var(--dock-h,3rem) + var(--dock-gap,1rem) + .9rem);translate:-50%}.ribbon__plate-in{grid-template-columns:minmax(0,auto) auto;grid-template-areas:"kind actions""name actions""tag actions";align-items:center;gap:.15rem 2rem;padding:.85rem 1.1rem .9rem 1.35rem}.ribbon__kind{grid-area:kind}.ribbon__name{grid-area:name;font-size:clamp(1.05rem,.8rem + .7vw,1.45rem)}.ribbon__tag{grid-area:tag;font-size:.85rem}.ribbon__actions{flex-wrap:nowrap;grid-area:actions;margin-block-start:0!important}}@media (width>=48rem) and (width<=63.99rem){.ribbon__plate{max-inline-size:min(30rem, calc(100vw - 2 * var(--gutter) - 8rem))}.ribbon__plate-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"kind""name""tag""actions"}.ribbon__actions{margin-block-start:.5rem!important}}.ribbon__ghost{display:grid}.ribbon__ghost>*{grid-area:1/1}.ribbon__plate--ghost,.ribbon__cap--ghost{visibility:hidden!important;pointer-events:none!important}.ribbon__plate--ghost .ribbon__plate-in{animation:none;translate:none}.ribbon__cap,.ribbon__acts{display:none}@keyframes plate-line{0%{transform:scaleX(0)}}@keyframes plate-sheen{0%{background-position:120% 0}to{background-position:-30% 0}}@keyframes plate-rise{0%{opacity:0;translate:0 .55rem}}.ribbon-room-section{background:var(--background);color:var(--foreground);padding:0}.ribbon-room{position:relative}.ribbon-room.is-moving{block-size:calc((var(--count) * 53.4 + 118.4) * 1svh)}.ribbon-room__pin{gap:var(--space-m);padding-block:calc(var(--header-h) + var(--space-l)) var(--space-xl);display:grid;position:relative}.ribbon-room.is-moving .ribbon-room__pin{block-size:100svh;padding:0;display:block;position:sticky;inset-block-start:0;overflow:clip}.ribbon-room .ribbon__pin.ribbon-room__stage{block-size:auto;position:absolute;inset:0}.ribbon-room__head{z-index:3;position:relative}.ribbon-room.is-moving .ribbon-room__head{position:absolute;inset-block-start:calc(var(--header-h) + var(--space-m));inset-inline:0}.ribbon__pin--room .ribbon__count{inset-block:auto calc(var(--dock-h,3rem) + var(--dock-gap,1rem) + 1.6rem);inset-inline-end:calc(var(--floater-inset,1rem) + var(--floater,3rem) + 1.5rem)}@media (width<=47.99rem){.ribbon-room.is-moving{block-size:calc((var(--count) * 73.1 + 160.2) * 1svh)}.ribbon__plate-in{-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(158deg, #fffffff5, #ffffffe0 58%, #fffffff0), var(--background)}.dark .ribbon__plate-in,:root.dark .ribbon__plate-in{background:linear-gradient(158deg, #ffffff1a, #ffffff08 58%, #ffffff0f), var(--background)}.ribbon__plate-shade{filter:blur(14px)}.ribbon__pin--room .ribbon__count{display:none}.ribbon{block-size:calc((var(--count) * 73.1 + 160.2) * 1svh)}.ribbon__plate{--plate-cut:.9rem;inset-inline:var(--gutter) calc(var(--floater-inset,1rem) + var(--floater,3rem) + .6rem);inline-size:auto}.ribbon__plate-in{padding:1.05rem 1.15rem 1.1rem}.ribbon__plate{display:none}.ribbon__cap{inset-inline:var(--front-side,var(--gutter));z-index:3;pointer-events:none;display:block;position:absolute;inset-block-end:calc(100% - var(--front-top,30svh) - var(--hold-y,0px) + .65rem)}.ribbon__cap-in{opacity:0;transition:opacity .5s var(--ease-out), translate .7s var(--ease-out);gap:.3rem;display:grid;translate:0 .5rem}.ribbon__cap.is-shown .ribbon__cap-in{opacity:1;translate:0}.ribbon__cap.is-shown .ribbon__cap-in>*{animation:plate-rise .6s var(--ease-out) both}.ribbon__cap.is-shown .ribbon__cap-in>:nth-child(2){animation-delay:60ms}.ribbon__cap .ribbon__kind,.ribbon__cap .ribbon__name{margin:0;padding:0}.ribbon__cap .ribbon__kind{letter-spacing:.16em;font-size:.6rem}.ribbon__cap .ribbon__name{font-size:1.2rem}.ribbon__acts{inset-inline:var(--front-side,var(--gutter));z-index:3;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .5s var(--ease-out), translate .7s var(--ease-out), visibility 0s linear .5s;flex-wrap:wrap;gap:.4rem;display:flex;position:absolute;inset-block-start:calc(var(--front-bottom,70svh) + var(--hold-y,0px) + .75rem);translate:0 -.4rem}.ribbon__acts.is-shown{opacity:1;pointer-events:auto;visibility:visible;transition-delay:0s;translate:0}.ribbon__acts .btn{--btn-h:2.1rem;--btn-px:.75rem;letter-spacing:.05em;white-space:nowrap;font-size:.625rem}.ribbon__pin--page .ribbon__count{justify-content:center;inset-block-start:calc(var(--header-h) + 3.6rem);inset-inline:0}.ribbon__ours{font-size:1.85rem;inset-block-start:calc(var(--header-h) + .9rem)}}@media (prefers-reduced-motion:reduce){.ribbon__plate-in,.ribbon__plate-in>*,.ribbon__plate-in:before,.ribbon__plate-in:after{transition:none;animation:none}}.ribbon-tuner{left:1rem;top:calc(var(--header-h) + 4.5rem);z-index:6;color:#111;text-align:left;gap:.5rem;inline-size:min(19rem,100vw - 2rem);font:500 .78rem/1.3 system-ui,sans-serif;display:grid;position:absolute}.ribbon-tuner__toggle,.ribbon-tuner__actions button{color:#111;font:inherit;cursor:pointer;background:#fff;border:1px solid #0003;border-radius:.4rem;padding:.45rem .7rem}.ribbon-tuner__toggle{color:#fff;background:#111;justify-self:start}.ribbon-tuner__body{background:#fffffff0;border-radius:.6rem;gap:.7rem;padding:.9rem;display:grid;box-shadow:0 10px 30px #0000002e}.ribbon-tuner__title{margin:0;font-weight:700}.ribbon-tuner__row{gap:.2rem;display:grid}.ribbon-tuner__row input{accent-color:#900;inline-size:100%}.ribbon-tuner__hint{color:#666;font-size:.7rem}.ribbon-tuner__actions{flex-wrap:wrap;gap:.4rem;display:flex}.ribbon.ribbon--story{block-size:calc((var(--count) * 142.4 + 206.8) * 1svh)}@media (width<=47.99rem){.ribbon.ribbon--story{block-size:calc((var(--count) * 115.7 + 206.8) * 1svh)}}.tale{inset-inline-start:calc(var(--wire-x,2.5rem) + var(--corridor,1.5rem));inset-block:calc(var(--header-h) + 2rem) calc(var(--dock-h,3rem) + var(--dock-gap,1rem) + 2rem);z-index:3;pointer-events:none;align-items:center;inline-size:min(27rem,31vw);display:flex;position:absolute}.tale__in{pointer-events:auto;gap:.9rem;display:grid}.tale__in>*{opacity:0;transition:opacity .35s var(--ease-out), translate .5s var(--ease-out);margin:0;translate:0 .8rem}.tale.is-shown .tale__in>*{opacity:1;transition:opacity .7s var(--ease-out), translate .9s var(--ease-out);translate:0}.tale.is-shown .tale__in>:nth-child(2){transition-delay:60ms}.tale.is-shown .tale__in>:nth-child(3){transition-delay:.14s}.tale.is-shown .tale__in>:nth-child(4){transition-delay:.22s}.tale.is-shown .tale__in>:nth-child(5){transition-delay:.3s}.tale.is-shown .tale__in>:nth-child(6){transition-delay:.38s}.tale.is-shown .tale__in>:nth-child(7){transition-delay:.46s}.tale__kicker{color:var(--muted-foreground)}.tale__kicker b{color:var(--foreground);font-weight:600}.tale__name{font-family:var(--font-title);text-transform:uppercase;text-wrap:balance;font-size:clamp(2rem,1rem + 2.4vw,3.4rem);font-weight:400;line-height:.92}.tale__title{font-family:var(--font-title);text-transform:uppercase;background:var(--gradient-fire);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(1rem,.75rem + .6vw,1.3rem);line-height:1.1}.dark .tale__title,:root.dark .tale__title{background:linear-gradient(120deg, var(--fire-1), var(--fire-2) 70%);-webkit-background-clip:text;background-clip:text}.tale__lead{color:color-mix(in srgb, var(--foreground) 82%, transparent);font-size:.98rem;line-height:1.5}.tale__pain{border-block-start:1px solid color-mix(in srgb, var(--foreground) 14%, transparent);gap:.45rem;padding-block-start:.2rem;display:grid}.tale__pain-title{color:var(--muted-foreground);margin:.55rem 0 0}.tale__pain ul{gap:.3rem;margin:0;padding:0;list-style:none;display:grid}.tale__pain li{color:color-mix(in srgb, var(--foreground) 78%, transparent);padding-inline-start:1.1rem;font-size:.86rem;line-height:1.4;position:relative}.tale__pain li:before{content:"";background:var(--gradient-fire);block-size:1px;inline-size:.55rem;position:absolute;inset-block-start:.62em;inset-inline-start:0}.tale__result{font-family:var(--font-title);text-transform:uppercase;font-size:.95rem;line-height:1.2}.tale__result:before{content:"→ ";color:var(--fire-2)}[dir=rtl] .tale__result:before{content:"← "}.tale__go{justify-self:start}.tale-caps{z-index:3;pointer-events:none;position:absolute;inset:0}.tale-giant{z-index:0;font-family:var(--font-title);letter-spacing:-.01em;white-space:nowrap;text-transform:uppercase;color:color-mix(in srgb, var(--foreground) 4.5%, transparent);-webkit-text-stroke:1.5px color-mix(in srgb, var(--foreground) 17%, transparent);opacity:var(--giant,0);translate:0 calc((1 - var(--giant,0)) * 55%);pointer-events:none;margin:0;font-size:clamp(7rem,27svh,19rem);font-weight:400;line-height:.82;position:absolute;inset-block-end:-.14em;inset-inline-start:calc(var(--wire-x,2.5rem) + var(--corridor,1.5rem) - .05em);-webkit-mask-image:linear-gradient(#000 40%,#00000059);mask-image:linear-gradient(#000 40%,#00000059)}.tale-cap{inline-size:var(--cap-w,14rem);color:#0a0a0b;opacity:0;text-align:start;will-change:transform, opacity;background:#fff;border:1.5px solid #0a0a0b;gap:.15rem;padding:.45rem .6rem .5rem;display:grid;position:absolute;top:0;left:0;box-shadow:0 6px 18px #0a0a0b24}.tale-cap:empty{display:none}.tale-cap b{font-family:var(--font-title);letter-spacing:.1em;text-transform:uppercase;font-size:.72rem;font-weight:400;line-height:1}.tale-cap b:after{content:"";background:var(--gradient-fire);block-size:2px;inline-size:1.6rem;margin-block-start:.3rem;display:block}.tale-cap span{text-wrap:balance;font-size:.8rem;line-height:1.3}.ribbon-section>.paper{display:none}@media (prefers-reduced-motion:reduce){.tale__in>*{transition:none}}@media (width<=47.99rem),(aspect-ratio<=9/10){.tale{inset-inline:var(--gutter) calc(var(--floater-inset,1rem) + var(--floater,3rem) + .6rem);inset-block:auto calc(var(--dock-h,3rem) + var(--dock-gap,1rem) + .9rem);align-items:flex-end;block-size:min(14rem,30svh);inline-size:auto}.tale__in{gap:.4rem}.tale__kicker{font-size:.56rem}.tale__name{font-size:clamp(1.6rem,8.4vw,2.2rem)}.tale__title{font-size:.82rem}.tale__lead{-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.8rem;line-height:1.4;display:-webkit-box;overflow:hidden}.tale__pain{display:none}.tale__result{font-size:.72rem}.tale__go{--btn-h:2.4rem;--btn-px:.95rem;margin-block-start:.25rem;font-size:.78rem}.tale-cap{inline-size:max-content;max-inline-size:42vw;padding:.28rem .45rem}.tale-cap b{letter-spacing:.12em;font-size:.55rem}.tale-cap b:after,.tale-cap span{display:none}@media (height<=740px){.tale__lead{-webkit-line-clamp:2}.tale__result{display:none}}.tale-giant{-webkit-text-stroke-width:1px;font-size:31vw;inset-block-end:-.1em;inset-inline-start:var(--gutter)}}}
