/* This site: @font-face (self-hosted woff2), then sections built on base.css tokens. */
@font-face{font-family:Anton;src:url(/fonts/anton-400.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Source Sans 3";font-weight:400;src:url(/fonts/source-sans-400.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Source Sans 3";font-weight:600;src:url(/fonts/source-sans-600.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Source Sans 3";font-weight:700;src:url(/fonts/source-sans-700.woff2) format("woff2");font-display:swap}
:root{--paper:#F1EAD8;--ink:#141414;--red:#D7261E;--edge:clamp(12px,1.6vw,32px)}
html,body{background:var(--paper);color:var(--ink);font-family:"Source Sans 3",sans-serif;font-size:18px;overflow-x:clip}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.page{background:var(--paper) url(/img/ui/paper-b.webp) 0 0/620px;min-height:100svh}

/* printed ink plates: the same generated block, stretched, carries every control */
.ink{display:inline-flex;justify-content:center;align-items:center;gap:.5em;border:0;min-height:48px;padding:0 1em;background:none center/100% 100% no-repeat;color:#fff;font-family:Anton;font-size:22px;line-height:1;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.ink:hover{transform:translateY(-2px);transition-duration:.25s}
.ink:active{transform:translateY(2px) scale(.98);transition-duration:35ms}
.ink-red{background-image:url(/img/ui/ink-red.webp)}
.ink-black{background-image:url(/img/ui/ink-black.webp)}
.ink-grey{background-image:url(/img/ui/ink-grey.webp);color:var(--ink)}
.ink[disabled],.ink.is-off{opacity:.55;cursor:default;transform:none}

.fold{position:relative;height:100svh;min-height:620px;padding:var(--edge);padding-bottom:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;gap:clamp(4px,.6vw,12px)}
.mast{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--s4);border-bottom:4px solid var(--ink);padding-bottom:6px}
.mast-name{margin:0;line-height:0}.mast-name img{height:clamp(56px,6.6vw,118px);width:auto}
.mast-line{margin:0;font-weight:600;font-size:clamp(18px,1.35vw,26px);line-height:1.2;max-width:34em}
.mast-tick{margin:0;font-family:Anton;font-size:clamp(26px,2.4vw,46px);line-height:1;background:url(/img/ui/ink-black.webp) center/100% 100%;color:var(--paper);padding:.82em 1em}
.head{margin:0;font-family:Anton;text-transform:uppercase;color:var(--red);font-size:8.2vw;line-height:1.04;white-space:nowrap;letter-spacing:-.005em}
.head span{white-space:nowrap}

.photo{position:relative;min-height:0;background:#1B1440;overflow:hidden}
#live{position:absolute;inset:0;width:100%;height:100%;display:block;animation:develop .9s steps(6) both}
@keyframes develop{0%{filter:brightness(0) contrast(1.6)}60%{filter:brightness(.7) contrast(1.3)}100%{filter:none}}
.flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.flash.on{animation:flash .34s ease-out}
@keyframes flash{0%{opacity:1}100%{opacity:0}}
.fly{position:fixed;z-index:30;pointer-events:none;background:#fff;padding:6px;transition:transform .55s cubic-bezier(.2,.8,.25,1)}
.fly canvas{display:block;width:100%;height:100%}

.strip{display:flex;align-items:center;gap:var(--s3);min-height:clamp(84px,8vw,124px);padding:6px calc(29vw + var(--s4)) 6px 0}
.shutter{height:clamp(68px,5.4vw,94px);font-size:clamp(26px,2vw,36px);padding:0 1.05em;white-space:nowrap}
.lamp{width:clamp(36px,3vw,52px);height:auto;flex:none}
.last{flex:none;width:clamp(100px,9vw,160px);position:relative;padding:clamp(6px,.55vw,10px);box-sizing:border-box}.last::after{content:"";position:absolute;inset:0;background:url(/img/ui/print.webp) center/100% 100%;pointer-events:none}
.last canvas{display:block;width:100%;height:auto;aspect-ratio:3/2;background:#1B1440}
.last-cap{position:absolute;left:0;right:0;bottom:-2px;margin:0;font-family:Anton;font-size:16px;line-height:1.2;color:#fff;text-align:center;background:url(/img/ui/ink-black.webp) center/100% 100%}
.last-cap:empty{display:none}
.enhance{height:clamp(54px,3.7vw,70px);font-size:clamp(20px,1.4vw,26px)}
.jump{font-weight:700;font-size:clamp(18px,1.25vw,24px);color:var(--ink);white-space:nowrap}

.coupon{position:absolute;right:var(--edge);bottom:var(--s2);width:clamp(340px,29vw,560px);padding:clamp(38px,3vw,58px) clamp(30px,2.5vw,48px) clamp(30px,2.3vw,44px);background:url(/img/ui/coupon.webp) center/100% 100% no-repeat;display:grid;gap:var(--s2)}
.ca-row{display:flex;gap:var(--s2);align-items:center}
.ca{flex:1;min-width:0;font-family:"Source Sans 3";font-weight:600;font-size:18px;overflow-wrap:anywhere;line-height:1.25;user-select:all;background:none;color:var(--ink);font-variant-numeric:tabular-nums}
.copy{flex:none;font-family:"Source Sans 3";font-weight:700;font-size:18px;text-transform:none}
.buy{min-height:clamp(72px,4.8vw,92px);font-size:clamp(24px,1.8vw,34px);text-transform:none;letter-spacing:.01em}
.xbtn{font-family:"Source Sans 3";font-weight:700;font-size:20px;text-transform:none;color:var(--paper)}

.below{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:var(--s5);padding:var(--s5) var(--edge) var(--s6);border-top:4px solid var(--ink);margin-top:var(--s2)}
.sect{margin:0 0 var(--s3);font-family:Anton;font-weight:400;font-size:clamp(40px,4vw,76px);line-height:1.05;text-transform:uppercase;color:var(--ink)}
.wit-frame{position:relative;background:#fff;padding:6px}
.wit-frame img{display:block;width:100%;height:auto;transition:opacity .25s}
.wit-b{position:absolute;inset:6px;width:calc(100% - 12px)!important;opacity:0}
.wit-frame.away .wit-b{opacity:1}
.lore{margin:var(--s3) 0;font-family:Anton;font-size:clamp(26px,2vw,38px);line-height:1.2}
.stamp{display:block;width:min(70%,300px);height:auto;margin:var(--s3) 0}
.risk{margin:0;font-size:16px;line-height:1.35;color:#4c483f}
.prints{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s4) var(--s3)}
.print-open{display:block;width:100%;padding:6px;border:0;background:#fff;cursor:pointer;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.print-open:hover{transform:translateY(-4px) rotate(-.6deg);transition-duration:.25s}
.print-open:active{transform:scale(.98);transition-duration:35ms}
.print-open img,.print-open canvas{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.cap{margin:var(--s1) 0 0;font-family:Anton;font-size:clamp(20px,1.5vw,28px);line-height:1.15}
.mine .cap{color:var(--red)}

.viewer{position:fixed;inset:0;z-index:40;background:var(--paper) url(/img/ui/paper-b.webp) 0 0/620px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s2);padding:var(--s3)}
.viewer[hidden]{display:none}
#vc{max-width:100%;max-height:calc(100svh - 190px);background:#fff;padding:6px}
.v-cap{font-size:clamp(28px,3vw,48px);margin:0}
.v-row{display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:center}
.lost{display:flex;flex-direction:column;gap:var(--s3);align-items:center;padding:var(--s4) var(--edge)}
.lost .head{font-size:clamp(56px,13vw,240px);text-align:center;white-space:normal}
.lost-sky{width:100%;max-height:55vh;object-fit:cover;display:block}
.lost .buy{padding:0 1.4em}

@media (max-width:900px){
  .fold{height:auto;min-height:0;padding-bottom:var(--s3);grid-template-rows:none;gap:var(--s2)}
  .mast{grid-template-columns:auto 1fr;gap:var(--s2) var(--s3)}
  .mast-tick{justify-self:end}
  .mast-line{grid-column:1/-1;grid-row:2}
  .mast-name img{height:clamp(68px,20vw,104px)}
  .head span{display:block}
  .photo{aspect-ratio:4/3}
  .strip{flex-wrap:wrap;padding:0;gap:var(--s2);justify-content:space-between}
  .shutter{flex:1 1 100%}
  .enhance{flex:1}
  .last{width:110px}
  .lamp{width:40px}
  .jump{order:9;flex:1 1 100%;text-align:center}
  .coupon{position:relative;right:auto;bottom:auto;width:100%;box-sizing:border-box;padding:46px 26px 30px}
  .buy{font-size:18px;padding:0 18px;gap:8px;white-space:nowrap}
  .below{grid-template-columns:minmax(0,1fr);gap:var(--s5)}
  .prints{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3) var(--s2)}
  .v-row .ink{flex:1 1 40%}
}
