
@font-face{font-family:Albert;src:url(/_f/albert-sans.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:Fragment;src:url(/_f/fragment-mono.woff2) format("woff2");font-display:swap}
@font-face{font-family:AlbertFB;src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:103%;ascent-override:92%;descent-override:24%;line-gap-override:0%}
@font-face{font-family:FragmentFB;src:local("Courier New"),local("Liberation Mono");size-adjust:103%;ascent-override:92%;descent-override:24%;line-gap-override:0%}

:root{
  --accent:#d0311d;
  color-scheme:light dark;
  --paper:light-dark(#fff,#0d0d0c);
  --ink:light-dark(#0b0b0b,#edece8);
  --ink-2:light-dark(#5d5d5b,#a4a39f);
  --wall:light-dark(#efeeeb,#1c1c1a);
  --ghost:color-mix(in oklch,var(--wall),var(--paper) 60%);
  
  --accent-ui:light-dark(var(--accent),oklch(from var(--accent) max(l,.66) c h));
  
  --lum:clamp(0,(.1791 - .2126*r - .7152*g - .0722*b)*1e4,1);
  --on-accent:color(from var(--accent-ui) srgb-linear var(--lum) var(--lum) var(--lum));
  --dot-edge:light-dark(oklch(from var(--accent) min(l - .18,.6) c h),var(--accent-ui));
  
  --accent-line:light-dark(oklch(from var(--accent) min(l,.6) c h),var(--accent-ui));
  
  --rail-edge:light-dark(oklch(from var(--accent) min(l - .18,.6) c h / clamp(0,(l - .8)*20,1)),#0000);
  --sans:Albert,AlbertFB,system-ui,sans-serif;
  --mono:Fragment,FragmentFB,ui-monospace,monospace;
  --m:clamp(16px,2.4vw,36px);
  --g:clamp(12px,1.4vw,20px);
  --nail:clamp(40px,9vh,90px);
  --wire:clamp(140px,22vw,300px);
  --x:50%;
  --ease:cubic-bezier(.2,.7,.1,1);
}
*,::before,::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;font-synthesis-weight:none;scrollbar-color:var(--ink) var(--paper);accent-color:var(--ink);caret-color:var(--accent-ui)}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 var(--sans);font-kerning:normal;-webkit-font-smoothing:antialiased;min-height:100svh;display:flex;flex-direction:column}
main{flex:1;padding-inline:var(--m)}
::selection{background:var(--accent-ui);color:var(--on-accent)}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.28em}
h1,h2,h3,p,ul,ol,figure,blockquote{margin:0}
h1,h2,h3{font-weight:inherit;font-size:inherit;text-wrap:balance}
p,li{text-wrap:pretty}
:focus-visible{outline:2px solid var(--accent-line);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:var(--m);top:-99px;z-index:9;padding:10px 14px;background:var(--ink);color:var(--paper)}
.skip:focus{top:10px}


.skip,.nav,.cart-link,.search input,.intro-title,.card-price,.badge,.pager,.results-count,.product-price,.stock,.buy-qty-label,.ship-to label,button,.line-unit,.line-total,.subtotal span,.summary-note,.price-note,.continue,.colophon,.notice,.prose :is(h2,h3,th),.thanks-items,.thanks-total :is(span,small),.card-link::before{font:11px/1.45 var(--mono);letter-spacing:.04em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.card-price,.product-price,.line-total,.thanks-items{text-transform:none;font-size:12px}



.masthead{display:grid;grid-template-columns:1fr auto;gap:14px var(--g);align-items:baseline;padding:18px var(--m) 0;border-top:5px solid var(--accent-ui);box-shadow:inset 0 1px var(--rail-edge)}
.brand{font:500 18px/1 var(--sans);letter-spacing:-.02em;text-decoration:none}
.nav{grid-row:2;grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px 20px}
.nav:not(:has(a)){display:none}
.nav a,.cart-link,.colophon a,.continue{text-decoration:none;background:linear-gradient(currentColor 0 0) 0 100%/0 1px no-repeat}
:is(.nav a,.cart-link,.colophon a,.continue):hover{background-size:100% 1px}
.cart-link{grid-row:1;grid-column:2}
.search{grid-column:1/-1}
.search input{width:100%;border:0;border-bottom:1px solid var(--ink);border-radius:0;background:none;color:inherit;padding:6px 0;text-transform:none;appearance:none}
.search input::placeholder{color:var(--ink-2);text-transform:uppercase;opacity:1}
.search input:focus{outline:0;border-bottom:2px solid var(--accent-line);margin-bottom:-1px}
::-webkit-search-cancel-button{appearance:none;width:9px;height:9px;cursor:pointer;background:linear-gradient(45deg,#0000 45%,var(--ink) 45% 55%,#0000 55%),linear-gradient(-45deg,#0000 45%,var(--ink) 45% 55%,#0000 55%)}


.intro{display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);align-content:start;padding-block:40px 56px}
.intro>*{grid-column:1/-1}
.intro-tagline{font:300 clamp(24px,2vw,28px)/1.18 var(--sans);letter-spacing:-.02em;max-width:30ch}


.grid{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:var(--g);container-type:inline-size}

.card:is(:nth-child(3n+1),:nth-child(3n+2))::after{content:"";position:absolute;grid-row:2;top:0;left:0;width:100cqw;height:1px;background:var(--ink)}
.card:nth-child(3n+1)::after{left:calc(var(--m)*-1);width:calc(100cqw + var(--m)*2)}
.card{counter-increment:list-item;position:relative;display:grid;grid-row:span 3;grid-template-rows:subgrid;margin-bottom:clamp(40px,8vw,128px)}
.card:nth-child(3n+1){grid-column:1/-1}

.card-link{grid-row:span 3;display:grid;grid-template-rows:subgrid;grid-template-columns:30px 1fr auto;align-items:baseline;text-decoration:none;pointer-events:none}
.card-link>*,.card-link::before{pointer-events:auto}
.card-link::before{content:counter(list-item,decimal-leading-zero);grid-row:2;padding-top:12px}
.card-media{grid-column:1/-1;align-self:end;aspect-ratio:3/4;overflow:hidden;background:var(--wall)}
.card:nth-child(3n+1) .card-media{margin-inline:calc(var(--m)*-1)}
.card-media img{width:100%;height:100%;object-fit:cover;clip-path:inset(0)}
.card-title{grid-row:2;grid-column:2/-1;padding-top:12px;font-size:15px;line-height:1.3;letter-spacing:-.005em}
.card-price{grid-row:3;grid-column:2;padding-top:3px}
.badge{grid-row:3;grid-column:3;display:flex;align-items:center;gap:7px}
.badge::before,.stock::before,.notice::before,.thanks-items li::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--accent-ui);box-shadow:inset 0 0 0 1px var(--dot-edge);flex:none}
.is-sold-out .card-price{color:var(--ink-2)}

.product-info:not(:has(:disabled)) .stock::before{background:linear-gradient(90deg,var(--accent-ui) 50%,#0000 0);box-shadow:inset 0 0 0 1px var(--dot-edge)}
.card-link:focus-visible{outline:0}
.card-link:focus-visible .card-media{outline:2px solid var(--accent-line);outline-offset:4px}
.card-link:hover img{clip-path:inset(clamp(8px,1.2vw,16px))}
.card-link:is(:hover,:focus-visible) .card-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em}


.is-empty{display:grid;container-type:inline-size;background:var(--wall);overflow:hidden}
.card-initial{align-self:end;font:100 min(118cqi,330px)/.72 var(--sans);letter-spacing:-.06em;margin:0 0 -.02em -.03em;color:var(--ink)}


.pager{display:grid;grid-template-columns:1fr 1fr;gap:18px var(--g);align-items:baseline}
.pager-status{grid-area:1/1/2/-1}
.pager-next{grid-column:2;justify-self:end}
.pager a{grid-row:2;display:flex;align-items:baseline;gap:.4em;font:300 clamp(22px,2vw,28px)/1.1 var(--sans);letter-spacing:-.02em;text-transform:none;text-decoration:none}
.pager-prev::before,.pager-next::after{content:"";align-self:center;width:1.2em;height:1px;background:currentColor}
.pager a:hover::before,.pager a:hover::after{width:2.4em}


.page-title{font:300 clamp(36px,5.6vw,84px)/.98 var(--sans);letter-spacing:-.04em}
.results,.cart,.page,.thanks,.missing{padding-top:clamp(48px,11vh,120px)}
.results-count{margin:16px 0 clamp(40px,8vh,96px)}


.empty,.missing{position:relative;isolation:isolate;margin-top:clamp(32px,6vh,64px);min-height:min(56vh,600px);display:flex;flex-direction:column;justify-content:flex-end;gap:14px;padding:clamp(20px,3vw,40px);background:var(--wall);font:300 clamp(22px,2.4vw,34px)/1.15 var(--sans);letter-spacing:-.02em;text-wrap:balance}
.empty::before,.missing::before{content:"";position:absolute;top:var(--nail);left:var(--x);translate:-50% -4px;width:var(--wire);aspect-ratio:3;background:radial-gradient(circle at 50% 4px,var(--ink) 3px,#0000 3.6px),linear-gradient(to bottom right,#0000 calc(50% - .6px),var(--ink) 50%,#0000 calc(50% + .6px)) 0 0/50% 100% no-repeat,linear-gradient(to bottom left,#0000 calc(50% - .6px),var(--ink) 50%,#0000 calc(50% + .6px)) 100% 0/50% 100% no-repeat}
.empty::after,.missing::after{content:"";position:absolute;z-index:-1;top:calc(var(--nail) + var(--wire)*.22);left:var(--x);translate:-50%;width:calc(var(--wire)*1.1);aspect-ratio:4/3;background:var(--ghost)}
.missing p{max-width:26ch}
.missing .continue{margin-top:10px}


.product{display:grid;gap:28px;padding-top:20px}
.product-media{display:grid;gap:14px;counter-reset:plate}
.product-hero{margin-inline:calc(var(--m)*-1)}
.product-hero img,.product-more img{width:100%;aspect-ratio:3/4;object-fit:cover;background:var(--wall)}
.product-hero.is-empty{aspect-ratio:3/4}
.product-hero.is-empty,.card:nth-child(3n+1) .is-empty{padding-inline-start:var(--m)}
.product-hero,.product-more li{counter-increment:plate}
.product-hero::after,.product-more li::after{content:counter(plate,decimal-leading-zero);display:block;padding-top:6px;font:11px var(--mono)}
.product-hero::after{padding-inline:var(--m)}
.product-hero.is-empty::after{content:none}
.product-more{display:grid;grid-auto-flow:column;grid-auto-columns:40%;gap:6px;list-style:none;padding:0 var(--m);margin-inline:calc(var(--m)*-1);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.product-more:not(:has(li:nth-child(3))){grid-auto-columns:calc(50% - 3px)}
.product-more li{scroll-snap-align:start;scroll-margin-inline:var(--m)}
.product-more:not(:has(li)){display:none}
.product-title{font:300 clamp(30px,2.9vw,44px)/1 var(--sans);letter-spacing:-.035em;hyphens:auto}
.product-price{font-size:15px;margin-top:16px}
.stock{display:flex;align-items:center;gap:8px;margin-top:6px}
.buy{display:grid;grid-template-columns:72px 1fr;margin-top:28px}
.buy-qty-label{grid-column:1/-1;margin-bottom:6px}
input[type=number]{appearance:textfield;-moz-appearance:textfield;border:1px solid var(--ink);border-radius:0;background:var(--paper);color:inherit;font:14px var(--mono);text-align:center;font-variant-numeric:tabular-nums;min-width:0}
input[type=number]::-webkit-inner-spin-button{appearance:none;margin:0}
input:user-invalid{border-color:var(--accent-ui);outline:1px solid var(--accent-ui);outline-offset:-3px}
.buy-qty{height:52px;border-right:0}
button{appearance:none;border:1px solid var(--ink);border-radius:0;background:var(--ink);color:var(--paper);padding:0 18px;cursor:pointer;letter-spacing:.1em}

button:not(:disabled):hover{background:var(--accent-ui);color:var(--on-accent);box-shadow:inset 0 0 0 3px var(--paper)}
button:active{translate:0 1px}
.buy-button{height:52px}

button:disabled{background:none;border-color:var(--wall);color:var(--ink-2);cursor:not-allowed}
.buy:has(:disabled) :is(.buy-qty,.buy-qty-label),.product-info:has(:disabled) .product-price{border-color:var(--wall);color:var(--ink-2);pointer-events:none}


.prose{margin-top:48px;display:grid;row-gap:1em;font-size:16px;line-height:1.55;hanging-punctuation:first allow-end}
.prose h2,.prose h3{border-top:1px solid var(--ink);padding-top:8px;margin-top:1.6em}
.prose ul,.prose ol{padding:0;list-style:none;display:grid;gap:.3em}
.prose li{padding-left:2em;position:relative}
.prose li::before{position:absolute;left:0;font:11px/2.2 var(--mono);content:"—"}
.prose ol{counter-reset:n}
.prose ol li{counter-increment:n}
.prose ol li::before{content:counter(n,decimal-leading-zero)}

.prose strong{font-weight:600;display:inline-block}
.prose a strong{display:inline}
.prose em{font-style:normal;font-weight:300;letter-spacing:.01em}
.prose code{font:.85em var(--mono)}
.prose blockquote{font:300 clamp(24px,2.6vw,36px)/1.12 var(--sans);letter-spacing:-.025em;margin-block:.8em}
@supports not (hanging-punctuation:first){.prose blockquote p{text-indent:-.4em}}
.prose hr{border:0;border-top:1px solid var(--ink);width:100%}
.prose table{border-collapse:collapse;font:13px var(--mono);font-variant-numeric:tabular-nums}
.prose td,.prose th{border-top:1px solid var(--ink);padding:6px 16px 6px 0;text-align:left;vertical-align:baseline}
.prose th{color:var(--ink-2)}
.prose img{width:100%}


.cart{display:grid;gap:40px}
.lines{list-style:none;padding:0;border-bottom:1px solid var(--ink)}
.line{display:grid;grid-template-columns:76px 1fr auto;gap:6px 16px;align-items:start;border-top:1px solid var(--ink);padding-block:14px}
.line-img{grid-row:span 2;width:76px;aspect-ratio:3/4;object-fit:cover;background:var(--wall)}
.line-img.is-empty{font:100 96px/.72 var(--sans);letter-spacing:-.06em;padding:0;align-content:end}
.line-info{display:grid;gap:2px}
.line-title{font-size:17px;line-height:1.25;letter-spacing:-.01em;text-decoration:none}
.line-title:hover{text-decoration:underline}
.line-unit{color:var(--ink-2)}
.line-total{grid-column:3;grid-row:1;text-align:right}
.line-qty{grid-column:2;grid-row:2;display:flex;align-self:end}
.line-qty input{width:48px;height:36px;border-right:0}
.line-qty button,.ship-to button{height:36px;background:var(--paper);color:var(--ink)}
.ship-to{display:grid;grid-template-columns:1fr auto}
.ship-to label{grid-column:1/-1;margin-bottom:6px}
.ship-to select{min-width:0;height:36px;padding:0 8px;border:1px solid var(--ink);border-right:0;border-radius:0;background:var(--paper);color:inherit;font:14px var(--mono)}
.line-remove{grid-column:3;grid-row:2;align-self:end;justify-self:end}
.line-remove button,.line-remove button:hover{border:0;padding:0;height:36px;background:none;box-shadow:none;color:var(--ink-2);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
.line-remove button:hover{color:var(--ink)}
.subtotal,.thanks-total{display:flex;justify-content:space-between;align-items:baseline;border-top:3px double var(--ink);padding-top:12px}
.subtotal strong,.thanks-total strong{font:400 clamp(28px,3vw,40px)/1 var(--mono);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.summary{display:grid;gap:14px}
.summary-note,.price-note,.thanks-total small{text-transform:none;color:var(--ink-2)}
.price-note{margin-top:6px}
.checkout-button{width:100%;height:58px;font-size:12px}
.continue{justify-self:start}
.notice{display:flex;gap:8px;align-items:center}


.thanks{display:grid;gap:28px;max-width:720px}
.thanks-lead{font-size:clamp(18px,1.6vw,22px);line-height:1.35;max-width:36ch}
.thanks-items{list-style:none;padding:0}
.thanks-items li{display:grid;grid-template-columns:9px 1fr auto;gap:12px;align-items:center;border-top:1px solid var(--ink);padding-block:10px}
.thanks-items li.is-charge::before{visibility:hidden}
.thanks-total{flex-wrap:wrap}
.thanks-total small{flex-basis:100%;margin-top:8px}


.colophon{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 28px;margin:clamp(80px,14vh,160px) var(--m) 0;border-top:1px solid var(--ink);padding-block:12px 32px}
.colophon-nav{display:flex;flex-wrap:wrap;gap:4px 20px}
.colophon-made{color:var(--ink-2)}
.colophon-made a{color:var(--ink)}

@media (pointer:coarse){.search input,input[type=number]{font-size:16px}.search input::placeholder{font-size:11px}}
@media (forced-colors:active){:is(.badge,.stock,.notice,.thanks-items li)::before{background:CanvasText}}

@media (max-width:1279px){.intro .intro-title{grid-column:1/-1;font:300 clamp(52px,10vw,104px)/.9 var(--sans);letter-spacing:-.045em;text-transform:none;margin-bottom:.3em;overflow-wrap:break-word;hyphens:auto}}

@media (max-width:699px){
  .product{gap:0}
  .product-media,.product-info{display:contents}
  .product-hero img,.product-hero.is-empty{height:clamp(75vw,100svh - 400px,133.34vw);aspect-ratio:auto}
  .product-hero{position:relative}
  .product-hero::after{position:absolute;top:100%;right:0}
  .product-title{margin-top:24px;font-size:34px}
  .buy{margin-top:22px}
  .product-more{order:1;margin-top:48px}
  .prose{order:2}
}
@media (min-width:1280px){.is-home .intro-title{position:static;width:auto;height:auto;clip-path:none;white-space:normal;margin-bottom:14px}.intro:not(:has(.intro-tagline)) .intro-title{font:300 clamp(40px,4.4vw,64px)/.95 var(--sans);letter-spacing:-.04em;text-transform:none;margin:0}}


@media (min-width:700px){
  .intro>*{grid-column:7/-1}
  .grid{grid-template-columns:repeat(12,1fr)}
  .card,.card:nth-child(3n+1){grid-column:span 3}
  .card:nth-child(3n+1) .card-media{margin:0;padding:0}
  .card:nth-child(3n+2)::after{content:none}
  .card:nth-child(3n+1)::after{left:0;width:100cqw}
  .card:nth-child(6n+1){grid-column:1/span 5}
  .card:nth-child(6n+2){grid-column:7/span 3}
  .card:nth-child(6n+3){grid-column:10/span 3}
  .card:nth-child(6n+4){grid-column:1/span 3}
  .card:nth-child(6n+5){grid-column:4/span 3}
  .card:nth-child(6n){grid-column:8/span 5}
  .pager{grid-template-columns:repeat(12,1fr)}
  .pager-prev{grid-column:1/span 3}
  .pager-status{grid-column:4/span 6}
  .pager a{grid-row:1}
  .pager-next{grid-column:10/span 3}
  .product-hero{margin:0}
  .product-hero::after,.product-hero.is-empty{padding:0}
}
@media (min-width:700px) and (max-width:999px){
  .product{grid-template-columns:7fr 5fr;column-gap:var(--g);padding-top:24px}
  .product-more{margin:0;padding:0;grid-auto-columns:calc(50% - 3px)}
}

@media (min-width:1000px){
  :root{--x:75%}
  .masthead{grid-template-columns:repeat(12,1fr);padding-top:24px}
  .brand{grid-column:1/span 3}
  .nav{grid-row:1;grid-column:4/span 5}
  .search{grid-column:9/span 3}
  .cart-link{grid-column:12;justify-self:end}
  .product{grid-template-columns:repeat(12,1fr);column-gap:var(--g);padding-top:clamp(24px,5vh,56px)}
  .product-media{grid-column:1/span 8;grid-template-columns:repeat(8,1fr);column-gap:var(--g);row-gap:var(--g);align-items:start}
  .product-hero{grid-column:1/span 6;grid-row:1/span 9}
  .product-more{display:contents}
  .product-more li{grid-column:7/span 2}
  .product-more:has(li:nth-child(4)) li{grid-column:7}
  .product-more:has(li:nth-child(4)) li:nth-child(even){grid-column:8}
  
  .product-info{grid-column:9/span 4;position:sticky;top:24px;align-self:start}
  .product-media:not(:has(li)){grid-column:1/span 7}
  .product-media:not(:has(li)) .product-hero{grid-column:1/-1}
  .product:not(:has(.product-more li)) .product-info{grid-column:8/span 5}
  
  .product-hero.is-empty{max-height:calc(100svh - 130px);justify-self:stretch}
  .cart,.page,.thanks{grid-template-columns:repeat(12,1fr);column-gap:var(--g)}
  .cart,.page{display:grid}
  .cart>*,.page>*,.thanks>*{grid-column:4/-1}
  :is(.page,.thanks)>.page-title{grid-column:1/-1}
  .cart>.page-title{grid-column:1/span 3;font-size:clamp(40px,4.4vw,64px)}
  .cart{align-items:start}
  .summary{grid-column:9/-1}
  .page .prose{grid-template-columns:subgrid;grid-column:1/-1;align-items:first baseline;font-size:17px}
  .page .prose>*{grid-column:4/span 6}
  .page .prose>:is(h2,h3){grid-column:1/span 3;margin:0;border:0;padding:0}
  .page .prose blockquote{grid-column:4/span 7}
  .thanks{max-width:none}
  .thanks>*{grid-column:4/span 6}
  .line{grid-template-columns:96px 1fr auto auto 9em;column-gap:var(--g);padding-block:16px}
  .line-img{width:96px;grid-row:1}
  .line-qty{grid-column:3;grid-row:1;align-self:start}
  .line-remove{grid-column:4;grid-row:1;align-self:start}
  .line-total{grid-column:5;padding-top:2px}
  .empty,.missing{grid-column:1/-1;padding-inline:calc((100% - 11*var(--g))/4 + 3*var(--g)) calc((100% - 11*var(--g))/3 + 4*var(--g))}
}

@media (min-width:1280px){
  .page .prose>*{grid-column:4/span 5}
  .is-home main{display:grid}
  .intro,.catalog{grid-area:1/1;padding-top:clamp(24px,4vh,48px)}
  .intro{z-index:1;padding-bottom:0;align-self:start;pointer-events:none}
  .intro>*{pointer-events:auto;max-width:34ch}
  .results:has(.grid){display:grid;grid-template:auto auto 1fr/repeat(12,1fr);column-gap:var(--g);padding-top:clamp(24px,4vh,48px)}
  .results>*{grid-column:1/-1}
  .results>.grid{grid-row:1/span 3}
  .results>:is(.page-title,.results-count){grid-area:1/7/2/-1;z-index:1}
  .results:has(.grid)>.page-title{font-size:clamp(40px,4.4vw,64px)}
  .results:has(.grid)>.results-count{grid-row:2;margin-bottom:0}
}

@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  img[data-vt]{view-transition-name:attr(data-vt type(<custom-ident>),none)}
  ::view-transition-group(*){animation-duration:.55s;animation-timing-function:var(--ease)}
  .card-media img{transition:clip-path .6s var(--ease)}
  :is(.nav a,.cart-link,.colophon a,.continue){transition:background-size .35s var(--ease)}
  .pager a::before,.pager a::after{transition:width .35s var(--ease)}
  button{transition:background-color .25s,color .25s,border-color .25s,box-shadow .25s var(--ease)}
  .card-media{animation:rise linear forwards;animation-timeline:view();animation-range:entry 0% entry 140px}
  @keyframes rise{from{opacity:0;translate:0 28px}}
  .intro-tagline,.page-title,.product-title{transition:opacity 1s var(--ease),translate 1s var(--ease)}
  @starting-style{.intro-tagline,.page-title,.product-title{opacity:0;translate:0 14px}}
}
.brand-logo{display:block;width:auto;height:auto;max-height:2rem;max-width:min(16rem,50vw)}

/* The bar across a preview of an unsaved look. Only preview stylesheets
   carry it, so it stays the same over every theme. */
.sc-preview {
  position: sticky;
  top: 0;
  z-index: 1000;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.25rem 1rem;
  margin: 0;
  padding: 0.625rem 1rem;
  background: #141210;
  color: #f7f5f0;
  font: 500 0.875rem/1.4 system-ui, -apple-system, "Segoe UI", sans-serif;
  letter-spacing: 0;
  text-transform: none;
}
.sc-preview p { margin: 0; }
.sc-preview b { font-weight: 700; }
.sc-preview a { color: #f7f5f0; font-weight: 700; text-decoration: underline; text-underline-offset: 0.2em; }
/* On the sample store, the look it's in is plain. */
.sc-preview [aria-current] { text-decoration: none; }
