/* goseethat — "Screenplay": script pages on a dark desk, Courier Prime throughout, coloured revision pages, brass brads, one red for stars and links. */
:root{
  --desk:#2b2724;--desk-hi:#3a342f;--bar:rgba(30,27,25,.95);--bar-line:#4a433d;--cream:#efe9dc;--dim:#a69e92;--nav:#cfc8bb;
  --paper:#fdfcf7;--paper-hi:#f4f1e6;--ink:#1b1b1b;--mute:#5b5650;--rule:#b3ada3;--red:#b5121b;--ok:#2f6b2a;
  --blue:#dde8f3;--pink:#f6dde2;--yellow:#f5efc4;--green:#dcecd5;--gold:#f1ddb0;
  --type:"Courier Prime","Courier New",monospace;
  --pad-y:clamp(48px,7vw,88px);--pad-x:clamp(36px,8vw,104px);color-scheme:light
}
*{box-sizing:border-box}
html{scroll-padding-top:90px}
body{margin:0;min-height:100vh;background:var(--desk) radial-gradient(ellipse at 50% 0,var(--desk-hi),var(--desk) 70%) no-repeat;color:var(--ink);font-family:var(--type);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--red);text-decoration:none}
a:hover{color:var(--ink)}
img{max-width:100%}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}
input::placeholder{color:#7a746c}

/* header */
.head{position:sticky;top:0;z-index:10;background:var(--bar);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--bar-line);color:var(--cream)}
.head-in{max-width:1120px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap}
.logo{display:flex;align-items:baseline;gap:10px;color:var(--cream)}
.logo:hover{color:#fff}
.logo-name{font-weight:700;font-size:24px;letter-spacing:.04em;text-transform:uppercase;text-decoration:underline;text-underline-offset:5px}
.logo-cue{font-size:13px;color:var(--dim)}
.nav{display:flex;gap:2px;flex-wrap:wrap;align-items:center;font-size:15px;text-transform:uppercase}
.nav a{padding:8px 11px;color:var(--nav)}
.nav a:hover,.nav a[aria-current]{color:#fff;text-decoration:underline}
.nav .nav-random{background:var(--red);color:#fff;font-weight:700;padding:8px 14px;margin-left:8px}
.nav .nav-random:hover{background:var(--cream);color:var(--ink);text-decoration:none}

/* pages */
.stack{padding:48px 16px 24px;display:flex;flex-direction:column;gap:36px}
.sheet{display:block;max-width:1040px;width:100%;margin:0 auto;background:var(--paper);color:var(--ink);position:relative;padding:var(--pad-y) var(--pad-x);box-shadow:0 24px 60px rgba(0,0,0,.5)}
.sheet-blue{background:var(--blue)}
.sheet-pink{background:var(--pink)}
.sheet-yellow{background:var(--yellow)}
.sheet-green{background:var(--green)}
.sheet-gold{background:var(--gold)}
.sheet-short{padding-block:clamp(36px,5vw,56px)}
.brad{position:absolute;left:14px;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f4d98a,#a37b22)}
.brad-top{top:16%}
.brad-bottom{top:84%}
.brad-mid{top:50%;background:var(--desk)}
.brad-page{top:120px}
.rev{position:absolute;top:22px;left:var(--pad-x);right:var(--pad-x);display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--mute)}
.sheet-blue .rev{color:#3d4a5a}
.sheet-pink .rev{color:#6a3e46}
.sheet-yellow .rev{color:#5e5528}
.sheet-green .rev{color:#3c5434}
.sheet-gold .rev{color:#5e4a1e}

/* type */
.h2{font-weight:700;font-size:clamp(32px,5vw,56px);line-height:1.05;margin:0 0 10px;text-transform:uppercase;text-wrap:balance}
.h3{font-weight:700;font-size:26px;margin:0 0 12px;text-transform:uppercase;text-decoration:underline;text-underline-offset:5px}
.underlined{text-decoration:underline;text-underline-offset:8px}
.centered{text-align:center}
.slug-line{display:block;font-weight:700;font-size:18px;text-transform:uppercase;margin:0 0 10px}
.slug-line a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.slug-line a:hover{color:var(--red)}
.sheet-lede{font-size:18px;line-height:1.5;margin:0 0 32px;max-width:640px}
.sheet-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px 16px;flex-wrap:wrap;margin-bottom:28px}
.sheet-head .h2{margin:0}
.more{text-transform:uppercase;font-size:15px;color:var(--ink)}
.more:hover{color:var(--red)}
.row-meta{display:block;font-size:13px;text-transform:uppercase;color:var(--mute)}
.stars{display:block;font-size:26px;color:var(--red);letter-spacing:.06em;line-height:1.2}
.stars-lg{font-size:32px;letter-spacing:.08em}
.price{font-weight:700;font-size:19px;white-space:nowrap}
.spec-line{display:block;font-size:14px;margin:0}
.note{font-size:14px;line-height:1.5;max-width:380px;margin:0}
.leader{display:flex;align-items:baseline;gap:10px;min-width:0}
.leader-name{min-width:0}
.dots{flex:1;min-width:20px;border-bottom:2px dotted currentColor}
.leader-price{font-weight:700;white-space:nowrap}

/* buttons + shop links */
.btn{display:inline-block;font:700 16px var(--type);text-transform:uppercase;background:transparent;color:var(--ink);border:2px solid var(--ink);padding:10px 18px;cursor:pointer}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn-solid{background:var(--red);border-color:var(--red);color:#fff}
.btn-solid:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.shop{display:inline-flex;justify-content:space-between;gap:10px;align-items:center;padding:7px 12px;background:var(--ink);color:var(--paper);font-weight:700;font-size:13px;text-transform:uppercase;white-space:nowrap;border:2px solid var(--ink)}
.shop:hover{background:var(--red);border-color:var(--red);color:#fff}
.stock{font-size:13px;color:var(--mute)}
.stock.on{color:var(--ok)}

/* title page */
.sheet-title{padding:clamp(48px,9vw,120px) var(--pad-x)}
.title-page{text-align:center;display:flex;flex-direction:column;align-items:center;gap:22px}
.title-name{font-weight:700;font-size:clamp(48px,10vw,132px);line-height:.95;margin:0;text-transform:uppercase;text-decoration:underline;text-decoration-thickness:6px;text-underline-offset:14px;text-wrap:balance}
.title-by{font-size:18px;margin:0}
.title-lede{font-size:clamp(19px,2.4vw,26px);line-height:1.5;max-width:640px;margin:14px 0 0;text-wrap:balance}
.title-cues{display:flex;flex-direction:column;align-items:flex-end;gap:12px;margin-top:64px;font-size:clamp(16px,2vw,20px);text-transform:uppercase;text-align:right}
.cue{color:var(--ink);padding:6px 0;border-bottom:1px solid var(--ink)}
.cue-main{font-weight:700;border-bottom-width:3px}
.cue:hover{color:var(--red);border-color:var(--red)}

/* feature */
.feature{cursor:pointer}
.feature:hover{color:var(--ink)}
.feature-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(200px,1fr);gap:40px;align-items:start}
.feature-body{display:flex;flex-direction:column;gap:18px;min-width:0}
.feature .slug-line{display:flex;gap:12px}
.slug-line .slug-text{flex:1}
.action{font-size:17px;line-height:1.5}
.feature-title{font-weight:700;font-size:clamp(36px,5vw,64px);line-height:.98;text-transform:uppercase;text-wrap:balance;overflow-wrap:anywhere}
.feature:hover .feature-title{color:var(--red)}
.dialogue{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:10px;padding:0 clamp(0px,6vw,80px)}
.character{text-transform:uppercase;font-size:18px}
.paren{font-style:italic;font-size:17px}
.dialogue .stars{font-size:30px;letter-spacing:.08em}
.line{font-size:20px;line-height:1.5;text-align:left;max-width:440px}
.polaroid{display:block;background:var(--paper);padding:10px 10px 30px;transform:rotate(2.5deg);box-shadow:0 10px 24px rgba(0,0,0,.25);position:relative;max-width:320px;justify-self:center;width:100%}
.clip{position:absolute;top:-12px;left:50%;width:30px;height:46px;margin-left:-15px;border:3px solid #8e9aa6;border-radius:14px;border-bottom-color:transparent}
.polaroid-img{aspect-ratio:2/3;background:repeating-linear-gradient(135deg,#e8e5dc 0 8px,#f1eee6 8px 16px);display:grid;place-items:center;font-size:12px;text-transform:uppercase;color:var(--mute);overflow:hidden}
.polaroid-img img{width:100%;height:100%;object-fit:contain;background:#fff;padding:8%}
.sheet-blue .polaroid-img{background:repeating-linear-gradient(135deg,#d6dde4 0 8px,#e3e8ed 8px 16px);color:#4a5560}
.polaroid-left{transform:rotate(-2deg);background:#fff}
.polaroid-type{padding:18px;font-weight:700;font-size:clamp(22px,3vw,30px);line-height:1.05;text-align:center;color:var(--ink);text-wrap:balance}
.props-head{display:block;margin-top:36px;font-size:17px;text-transform:uppercase;font-weight:700}
.props{display:flex;flex-direction:column;margin-top:8px}
.props .leader{padding:8px 0;font-size:17px}
.contd{display:block;text-align:right;margin-top:24px;font-size:18px;font-weight:700;text-transform:uppercase;color:var(--red)}

/* now playing */
.lead{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:32px;color:var(--ink);padding-bottom:28px;border-bottom:1px solid var(--ink);margin-bottom:12px}
.lead:hover{color:var(--ink)}
.lead:hover .lead-title{color:var(--red)}
.slate{aspect-ratio:16/9;background:var(--ink);color:var(--paper);display:flex;flex-direction:column;border:1px solid var(--ink);overflow:hidden}
.slate-bar{height:18%;flex:none;background:repeating-linear-gradient(-55deg,var(--paper) 0 18px,var(--ink) 18px 36px);border-bottom:3px solid var(--ink)}
.slate-grid{display:grid;grid-template-columns:1fr 1fr 2fr;border-bottom:1px solid #6b665f}
.slate-grid span{padding:6px 10px;font-size:11px;text-transform:uppercase;color:var(--dim);border-right:1px solid #6b665f;min-width:0;overflow:hidden}
.slate-grid span:last-child{border-right:0}
.slate-grid b{display:block;color:var(--paper);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slate-title{flex:1;display:flex;align-items:center;padding:12px 16px;font-weight:700;font-size:clamp(18px,2.6vw,28px);line-height:1.1;text-transform:uppercase;text-wrap:balance;overflow:hidden}
.lead-body{display:flex;flex-direction:column;gap:10px;min-width:0}
.lead-title{font-weight:700;font-size:clamp(28px,3.4vw,36px);line-height:1.05;text-transform:uppercase;overflow-wrap:anywhere}
.lead-hook{font-size:17px;line-height:1.5}
.scenes{display:flex;flex-direction:column}
.scene{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;padding:16px 0;border-bottom:1px dashed var(--rule);color:var(--ink)}
.scene:hover,.row:hover{background:var(--paper-hi);color:var(--ink)}
.scene-n{font-weight:700;font-size:17px}
.scene-main{min-width:0}
.scene-title{display:block;font-weight:700;font-size:18px;text-transform:uppercase;overflow-wrap:anywhere}
.scene-hook{display:block;font-size:16px;line-height:1.5;margin-top:4px}
.badge{text-align:right;white-space:nowrap}
.badge-big{display:block;font-weight:700;font-size:20px;color:var(--red)}
.badge-sub{display:block;font-size:12px;text-transform:uppercase;color:var(--mute)}
.empty{padding:48px 0;text-align:center}
.empty p{font-weight:700;font-size:28px;text-transform:uppercase;margin:0 0 12px}

/* pickers: index cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:28px}
.index-card{background-color:#fffef9;background-image:linear-gradient(#e0565e,#e0565e),repeating-linear-gradient(180deg,transparent 0 27px,#b9d2ea 27px 28px);background-size:100% 2px,100% 100%;background-position:0 52px,0 52px;background-repeat:no-repeat,repeat;padding:16px 20px 20px;box-shadow:0 8px 18px rgba(0,0,0,.18);transform:rotate(-1deg);transition:transform .15s;display:flex;flex-direction:column;gap:10px;min-height:240px;color:var(--ink)}
.index-card:nth-child(2n){transform:rotate(1deg)}
.index-card:hover{transform:rotate(0) translateY(-4px);color:var(--ink)}
.ic-top{display:flex;justify-content:space-between;font-size:14px;text-transform:uppercase;height:28px}
.ic-title{font-weight:700;font-size:22px;line-height:28px;text-transform:uppercase;margin-top:6px}
.ic-hook{font-size:16px;line-height:28px;flex:1}
.ic-go{font-weight:700;color:var(--red);line-height:28px}

/* props */
.prop-list{display:flex;flex-direction:column;border-top:2px solid var(--ink)}
.prop{display:grid;grid-template-columns:40px 96px minmax(0,1fr) auto;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid var(--ink)}
.prop-rank{font-weight:700;font-size:22px}
.prop-img{aspect-ratio:1;background:#fff;border:1px solid var(--ink);display:grid;place-items:center;padding:8px;font-size:10px;text-transform:uppercase;color:#5e5528;overflow:hidden}
.prop-img img{width:100%;height:100%;object-fit:contain}
.prop-main{min-width:0;display:flex;flex-direction:column;gap:4px}
.sheet-yellow .row-meta{color:#5e5528}
.prop-name{font-weight:700;font-size:19px;text-transform:uppercase;color:var(--ink);overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.prop-name:hover{color:var(--red)}
.prop-from{font-size:14px;font-style:italic;color:#5e5528;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prop-from:hover{color:var(--ink)}
.prop-buy{display:flex;flex-direction:column;align-items:flex-end;gap:8px}

/* scene index */
.index{display:flex;flex-direction:column;max-width:720px;margin:24px auto 0}
.index-row{display:block;padding:12px 0;color:var(--ink)}
.index-row:hover{color:var(--red)}
.index-row .leader{font-size:20px;font-weight:700;text-transform:uppercase}
.index-desc{display:block;font-size:15px;padding-left:44px}

/* notes */
.rules{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px;font-size:18px;line-height:1.5}
.rules li{display:grid;grid-template-columns:48px 1fr;gap:12px}
.rules li span:first-child{font-weight:700}

/* browse */
.page-title{font-weight:700;font-size:clamp(44px,7vw,88px);line-height:1;margin:0 0 28px;text-transform:uppercase;text-wrap:balance;overflow-wrap:anywhere}
.search{display:flex;gap:12px;align-items:end;margin-bottom:20px}
.search input{flex:1;min-width:0;padding:12px 0;background:transparent;border:0;border-bottom:2px solid var(--ink);border-radius:0;font:400 20px var(--type);color:var(--ink);outline:none;-webkit-appearance:none;appearance:none}
.search input:focus{border-color:var(--red)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px;font-size:15px;text-transform:uppercase}
.filters a{padding:5px 10px;color:var(--ink);border:1px solid var(--ink)}
.filters a:hover{background:var(--paper-hi)}
.filters a[aria-current]{background:var(--ink);color:var(--paper)}
.results{font-size:14px;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.rows{display:flex;flex-direction:column;border-top:2px solid var(--ink)}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;padding:18px 0;border-bottom:1px dashed var(--rule);color:var(--ink)}
.row-main{min-width:0}
.row-title{display:block;font-weight:700;font-size:22px;text-transform:uppercase;margin-top:4px;overflow-wrap:anywhere}
.row-hook{display:block;font-size:16px;line-height:1.5;margin-top:4px}
.row-picks{display:block;font-size:14px;font-style:italic;margin-top:4px}
.row .badge-big{font-size:26px}
.pages{display:flex;gap:10px;justify-content:center;align-items:center;margin-top:36px;flex-wrap:wrap;text-transform:uppercase}
.pages-step{padding:8px 10px;color:var(--ink)}
.pages-step.off{color:var(--rule)}
.pages-n{padding:6px 12px;font-weight:700;font-size:18px;color:var(--ink);border:1px solid var(--ink)}
.pages-n[aria-current]{background:var(--ink);color:var(--paper)}

/* friends */
.friends{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:0 28px;border-top:2px solid var(--ink)}
.friend{height:100%;padding:18px 0;border-bottom:1px dashed var(--rule);display:grid;grid-template-columns:40px minmax(0,1fr);gap:2px 14px;align-items:center;color:var(--ink)}
.friend:hover{color:var(--red)}
.friend-mark{width:36px;height:36px;grid-row:span 2}
.friend-mark-cut{fill:var(--paper)}
.friend-name{font-weight:700;font-size:19px;text-transform:uppercase}
.friend-domain{font-size:14px;color:var(--mute)}

/* article */
.back{display:inline-block;margin-bottom:28px;text-transform:uppercase;font-size:15px;color:var(--ink)}
.back:hover{color:var(--red)}
.intro-title{font-weight:700;font-size:clamp(40px,7.5vw,96px);line-height:.98;margin:18px 0;text-transform:uppercase;text-wrap:balance;overflow-wrap:anywhere}
.intro-grid{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,2fr);gap:40px;margin-top:36px;align-items:start}
.dialogue-intro{gap:6px;padding:0}
.intro-hook{font-size:20px;max-width:460px}
.intro-hook p{margin:0 0 .8em}
.dialogue-intro .row-meta{margin-top:8px}
.tags{list-style:none;display:flex;gap:8px;flex-wrap:wrap;margin:32px 0 0;padding:0}
.tags a{display:inline-block;font-size:14px;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:3px 10px}
.tags a:hover{background:var(--ink);color:var(--paper)}
.dive{margin-top:40px;border-top:2px solid var(--ink);padding-top:24px}
.dive-frame{display:block;width:100%;height:600px;border:0;background:var(--paper)}
.picks-head{align-items:flex-end}
.picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px}
.pick{background:#fffdf0;border:2px solid var(--ink);padding:18px;display:flex;flex-direction:column;gap:12px;min-width:0}
.tier-line{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.pick-img{aspect-ratio:4/3;background:#fff;border:1px solid var(--ink);display:grid;place-items:center;padding:12px;font-size:12px;text-transform:uppercase;color:#5e5528;overflow:hidden}
.pick-img img{width:100%;height:100%;object-fit:contain}
.pick-title{font-weight:700;font-size:20px;line-height:1.15;text-transform:uppercase;margin:0;overflow-wrap:anywhere}
.pick-title a{color:var(--ink)}
.pick-title a:hover{color:var(--red)}
.pick-note{font-size:16px;line-height:1.5;margin:0}
.pick .spec-line{font-size:13px;color:#5e5528}
.pick-buy{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.pick-buy .shop{padding:10px 14px;font-size:15px}
.pick-buy .more{font-size:14px;color:var(--red)}
.pick-buy .more:hover{color:var(--ink)}
.quiz>*{max-width:820px}
.q{border:0;border-top:2px solid var(--ink);padding:18px 0 22px;margin:0}
.q legend{font-weight:700;font-size:19px;line-height:1.3;padding:18px 0 0;float:left;width:100%;margin-bottom:12px}
.opts{display:grid;gap:8px;clear:both}
.opt{display:flex;gap:12px;align-items:center;text-align:left;font:400 16px var(--type);color:var(--ink);background:#fffef9;border:1px solid var(--ink);padding:10px 14px;cursor:pointer}
.opt:hover{background:var(--paper)}
.opt-key{font-weight:700}
.opt.right{background:var(--green);border-color:var(--ok)}
.opt.wrong{background:#fff;border-color:var(--red);color:var(--red);text-decoration:line-through}
.why{margin:12px 0 0;font-style:italic}
.sources ul{margin:0;padding-left:20px}
.sources li{margin-bottom:8px}
.sources span{font-size:13px;color:var(--mute)}
.next-list{display:flex;flex-direction:column}
.next{padding:10px 0;font-size:18px;color:var(--ink)}
.next .leader-name{font-weight:700;text-transform:uppercase}
.next span:last-child{white-space:nowrap}
.next:hover{color:var(--red)}
.items{display:flex;flex-direction:column}
.item{display:block;padding:12px 0;border-bottom:1px dashed var(--rule);color:var(--ink)}
.item:hover{color:var(--red)}
.item-title{display:block;font-weight:700;font-size:19px;text-transform:uppercase}
.item-hook{display:block;font-size:15px;line-height:1.5}

/* product */
.crumbs{display:flex;gap:8px;flex-wrap:wrap;font-size:15px;text-transform:uppercase;margin-bottom:24px}
.crumbs a{color:var(--ink);text-decoration:underline}
.product-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:40px;align-items:start}
.gallery{display:flex;flex-direction:column;gap:12px}
.gallery-main{display:block;position:relative;aspect-ratio:1;background:#fff;border:2px solid var(--ink)}
.plate{position:absolute;inset:6%;display:grid;place-items:center;font-size:13px;text-transform:uppercase;color:#5e5528}
.plate img{width:100%;height:100%;object-fit:contain}
.thumbs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.thumb{aspect-ratio:1;padding:8%;background:#fff;border:2px solid transparent;cursor:pointer;display:grid;place-items:center;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:contain}
.thumb[aria-current]{border-color:var(--ink)}
.product-info{display:flex;flex-direction:column;gap:14px;min-width:0}
.kicker{display:block;font-size:14px;text-transform:uppercase;margin:0}
.product-title{font-weight:700;font-size:clamp(28px,4vw,48px);line-height:1.05;margin:0;text-transform:uppercase;text-wrap:balance;overflow-wrap:anywhere}
.product-why{font-size:18px;line-height:1.55;margin:0;text-wrap:pretty}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips span{font-size:13px;padding:4px 10px;border:1px solid var(--ink);text-transform:uppercase}
.product-price{display:flex;align-items:baseline;gap:8px 14px;flex-wrap:wrap}
.big-price{font-weight:700;font-size:30px}
.big-price small{font-size:16px;font-weight:400}
.price-note{font-size:14px;text-transform:uppercase;color:#5e5528}
.product-none{font-size:17px;margin:0}
.offers{display:flex;flex-direction:column;border-top:2px solid var(--ink)}
.offer{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ink)}
.offer-shop{font-size:18px;font-weight:700}
.offer-shop small{font-size:12px;font-weight:400;color:#5e5528}
.offer-meta{font-size:12px;color:#5e5528}
.offer-price{font-weight:700;font-size:18px;white-space:nowrap}
.offer .shop{padding:8px 14px;font-size:14px}
.offer .shop:not(.shop-solid){background:transparent;color:var(--ink)}
.offer .shop:not(.shop-solid):hover{background:var(--ink);color:var(--paper)}
.fine{font-size:14px;line-height:1.5;margin:0}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:40px;padding-block:clamp(48px,7vw,72px)}
.specs{margin:0}
.specs div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:14px;padding:10px 0;border-bottom:1px dashed var(--rule);font-size:16px}
.specs dt{text-transform:uppercase;color:var(--mute)}
.specs dd{margin:0;overflow-wrap:anywhere}
.alts{display:flex;flex-direction:column}
.alt{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;padding:10px 0;border-bottom:1px dashed var(--rule);color:var(--ink)}
.alt:hover{color:var(--red)}
.alt-img{aspect-ratio:1;background:#fff;border:1px solid var(--ink);display:grid;place-items:center;padding:6px;font-size:10px;overflow:hidden}
.alt-img img{width:100%;height:100%;object-fit:contain}
.alt .tier{display:block;font-size:13px;text-transform:uppercase;color:var(--mute)}
.alt-name{display:block;font-weight:700;overflow-wrap:anywhere}
.alt .price{font-size:16px}

/* footer */
.foot{color:var(--dim)}
.foot-in{max-width:1040px;margin:0 auto;padding:24px 24px 48px;display:flex;flex-direction:column;align-items:center;gap:14px;font-size:14px;text-align:center}
.foot-logo{font-weight:700;font-size:22px;color:var(--cream);text-transform:uppercase}
.foot-links{display:flex;gap:8px 18px;flex-wrap:wrap;justify-content:center;text-transform:uppercase}
.foot-links a{color:var(--dim)}
.foot-links a:hover{color:#fff}

@media (max-width:640px){
  :root{--pad-x:clamp(28px,7vw,36px)}
  .stack{padding:28px 10px 16px;gap:24px}
  .brad{left:8px;width:11px;height:11px}
  .head-in{padding:10px 16px}
  .logo-name{font-size:20px}
  .nav{font-size:14px}
  .nav a{padding:6px 8px}
  .nav .nav-random{margin-left:4px}
  .rev{top:16px;font-size:11px}
  .title-name{line-height:1.15;text-decoration-thickness:4px;text-underline-offset:8px}
  .feature-grid,.intro-grid{grid-template-columns:minmax(0,1fr)}
  .polaroid{max-width:240px}
  .dialogue{padding:0}
  .prop{grid-template-columns:28px 64px minmax(0,1fr);gap:12px}
  .prop-buy{grid-column:2/-1;flex-direction:row;justify-content:space-between;align-items:center}
  .scene{grid-template-columns:32px minmax(0,1fr) auto;gap:10px}
  .index-desc{padding-left:0}
  .offer{grid-template-columns:minmax(0,1fr) auto}
  .offer .shop{grid-column:1/-1;justify-content:center}
  .specs div{grid-template-columns:110px minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}