.ribbon{position:sticky;top:env(safe-area-inset-top,0px);z-index:var(--z-ribbon);margin:calc(var(--tear) * -1) 0 0;height:var(--ribbon-h);color:var(--ink);background-color:var(--paper-light);background-image:linear-gradient(180deg,transparent 60%,rgba(120,88,56,.12)),var(--tex-grain);background-size:auto,220px 220px;box-shadow:0 10px 18px -12px #000c}.ribbon:before{content:"";position:absolute;left:0;right:0;top:-9px;height:10px;background-color:var(--paper-light);background-image:var(--tex-grain);background-size:220px 220px;-webkit-mask:var(--tex-tear) 0 0 / 420px 100% repeat-x;mask:var(--tex-tear) 0 0 / 420px 100% repeat-x;pointer-events:none}.ribbon:after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:10px;background-color:var(--paper-light);background-image:var(--tex-grain);background-size:220px 220px;transform:scaleY(-1);-webkit-mask:var(--tex-tear) 91px 0 / 420px 100% repeat-x;mask:var(--tex-tear) 91px 0 / 420px 100% repeat-x;pointer-events:none}.ribbon__inner{display:flex;align-items:center;gap:18px;height:100%;max-width:calc(var(--sheet-max) + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter)}.ribbon__mark{display:none;flex:none;place-items:center;width:34px;height:34px;border:1.25px solid var(--ink);border-radius:50%}.ribbon__mark svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:translate .35s var(--ease-out)}@media(hover:hover){.ribbon__mark:hover svg{translate:0 -2px}}.ribbon__list{flex:1;display:flex;align-items:center;gap:4px;height:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 22px),transparent)}.ribbon__list::-webkit-scrollbar{display:none}.ribbon__list li{flex:none;scroll-snap-align:start}.ribbon__list li:first-child{padding-left:6px}.ribbon__list li:last-child{padding-right:22px}.ribbon__link{position:relative;display:inline-flex;align-items:baseline;gap:6px;padding:10px 12px;font-family:var(--font-text);font-size:1.0625rem;font-weight:600;white-space:nowrap;color:var(--text-2);transition:color .35s var(--ease-out)}.ribbon__link[aria-current=true]{color:var(--ink)}@media(hover:hover){.ribbon__link:hover{color:var(--ink)}}.ribbon__ink{position:absolute;left:8px;right:8px;bottom:3px;width:calc(100% - 16px);height:8px;overflow:visible;pointer-events:none}.ribbon__ink path{fill:none;stroke:var(--ink);stroke-width:1.8;stroke-linecap:round;stroke-dasharray:140 160;stroke-dashoffset:145;transition:stroke-dashoffset .7s var(--ease-out)}.ribbon__link[aria-current=true] .ribbon__ink path{stroke-dashoffset:0}@media(min-width:768px){.ribbon__mark{display:grid}}@media(min-width:1024px){.ribbon__list{-webkit-mask-image:none;mask-image:none}.ribbon__list li:first-child{margin-left:auto}.ribbon__list li:last-child{margin-right:auto}.ribbon__list li+li{position:relative}.ribbon__list li+li:before{content:"";position:absolute;left:-3px;top:50%;width:1px;height:14px;transform:translateY(-50%);background:var(--rule-faint)}.ribbon__list li:first-child,.ribbon__list li:last-child{padding:0}.ribbon__link{padding:10px 16px;font-size:1.125rem}.ribbon__inner:after{content:"";flex:none;width:34px}}