/* bexilnervinomad.com: gyotaku catch-record prints on a lodge wall (sumi ink, washi, vermilion hanko seals) */
:root{
  --washi:#EEE6D6;--w2:#E3D7C0;--ink:#1C1A17;--ink2:#45403A;--pencil:#615849;--seal:#A52A19;--sealink:#FBF4E8;
  --yb:'Yuji Boku','Hiragino Mincho ProN','Yu Mincho',serif;
  --zk:'Zen Kaku Gothic Antique','Hiragino Sans','Yu Gothic',sans-serif;
  --kl:'Klee One','Hiragino Maru Gothic ProN','Yu Gothic',cursive;
  --u:1px;--m:min(1px,calc(100vw/360));
  --ox:max(0px,calc(50% - 180*var(--m)));
  --line:rgba(28,26,23,.25);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--washi);color:var(--ink2);font:400 16px/1.65 var(--zk);overflow-wrap:break-word;overflow-x:clip}
img{max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,dt,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
:focus-visible{outline:2px solid var(--seal);outline-offset:3px}
.skip{position:absolute;left:8px;top:-60px;background:var(--washi);padding:8px 14px;border:1px solid var(--ink);z-index:99}
.skip:focus{top:8px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.in{width:100%;max-width:1224px;margin-inline:auto;position:relative}
h1,h2,h3.yb,.yb{font-family:var(--yb);font-weight:400}
h1,h2{font-family:var(--yb);font-weight:400;color:var(--ink)}

/* washi fibres under every ground */
.sec,.band,.gband,.ft,.cookie,.hero{position:relative;isolation:isolate}
.sec::before,.band::before,.gband::before,.ft::before,.cookie::before,.hero::before{content:'';position:absolute;inset:0;z-index:-2;background:url(/assets/img/washi.png) 0 0/256px;opacity:var(--wo,.55);pointer-events:none}
.band,.gband{overflow:clip;background:var(--w2);--wo:.5;border-bottom:1px solid var(--line)}
.hero{--wo:.6}.ft{background:var(--w2);--wo:.45;border-top:1px solid rgba(28,26,23,.3)}
.sq2,.sp,.ctc{background:var(--w2)}.sq2{--wo:.5}.sp{--wo:.45}.ctc{--wo:.45}
.cookie{--wo:.5}

/* ink fragments of the print: cut by the box, mirrored in place */
.ink{position:absolute;overflow:hidden;pointer-events:none;z-index:-1}
.ink img{position:absolute;max-width:none;height:auto;transform:scaleX(-1)}
.js .rv{-webkit-mask:linear-gradient(#000 0 0) top/100% 0 no-repeat;mask:linear-gradient(#000 0 0) top/100% 0 no-repeat}
.js .rv.on{-webkit-mask-size:100% 100%;mask-size:100% 100%;transition:mask-size .6s ease-out,-webkit-mask-size .6s ease-out}

/* hanko seal */
.seal{--s:28px;--r:4deg;display:inline-grid;flex:none;width:var(--s);height:var(--s);padding:calc(var(--s)*.07);background:var(--seal);transform:rotate(var(--r)) scale(var(--sc,1));transform-origin:center}
.seal>span{display:grid;place-items:center;width:100%;height:100%;border:max(1.5px,calc(var(--s)/48)) solid var(--sealink);font:400 var(--f,calc(var(--s)*.26))/.92 var(--yb);color:var(--sealink);text-align:center;white-space:nowrap}
.seal.sm{--s:28px;--f:12px}.seal.md{--s:44px;--f:15px;--r:5deg}.seal.k{--s:34px;--f:16px;--r:-4deg}
.js .seal.pop{--sc:1.22;opacity:0}
.js .seal.pop.on{--sc:1;opacity:1;transition:transform .18s ease-in .55s,opacity .1s linear .55s}

/* stamp, bracket button, brushed arrow */
.stamp{position:absolute;left:calc(var(--tm,10px) + 6px);top:calc(var(--tm,10px) + 8px);padding:3px 8px;border:1.5px solid var(--seal);background:var(--washi);font:600 12px/1.2 var(--kl);letter-spacing:.06em;text-transform:uppercase;color:var(--seal);z-index:2}
.stamp.s0{transform:rotate(4deg)}.stamp.s1{transform:rotate(-3deg)}
.vd .stamp,.stamp.st{position:static;display:inline-block;transform:none;rotate:-3deg;margin-top:6px}
.bk,.bkt{display:inline-flex;align-items:center;gap:.5em;padding:.3em .1em;font:500 16px/1.3 var(--zk);color:var(--ink);text-decoration:none;cursor:pointer}
.bk::before,.bkt::before,.bk::after,.bkt::after{content:'';flex:none;width:.55em;height:.55em;border:1.5px solid var(--seal)}
.bk::before,.bkt::before{border-right:0;border-bottom:0;align-self:flex-start;margin-top:-.25em}
.bk::after,.bkt::after{border-left:0;border-top:0;align-self:flex-end;margin-bottom:-.25em}
.bk:hover{color:var(--seal)}
.arw{display:block;flex:none;width:24px;height:12px;background:url(/assets/img/arrow-red.svg) no-repeat center/contain}
.arw.dk{background-image:url(/assets/img/arrow-ink.svg)}
.ln{color:var(--seal);font-size:14px;text-underline-offset:3px}
.lead{font:400 16px/1.5 var(--kl);color:var(--pencil)}
.tx{font-size:16px;line-height:1.65;color:var(--ink2)}

/* header */
.hd{background:var(--washi);border-bottom:1px solid var(--line);position:relative;z-index:30}
.hdi{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:64px;padding:0 20px}
.mn{display:contents}
.hg{grid-column:1;display:flex;gap:32px}
.ha{grid-column:3;justify-self:end}
.logo{grid-column:2;grid-row:1;display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink)}
.lt{font:400 17px/1.1 var(--yb);color:var(--ink);white-space:nowrap}
.hn{position:relative;font:500 14px/1.3 var(--zk);color:var(--ink2);text-decoration:none;padding:4px 0}
.hn::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:3px;background:var(--seal);transform:scaleX(0);transform-origin:left;width:28px;transition:transform .2s}
.hn[aria-current]{font-weight:700;color:var(--ink)}.hn[aria-current]::after{transform:scaleX(1)}
.hn:hover{color:var(--ink)}
.hh{display:none}

/* hero (mobile composition, 360 column in --m) */
.hero{height:calc(1360*var(--m));overflow:clip;background:var(--washi)}
.hf{inset:0;z-index:-1}
.hf img{left:calc(var(--ox) + 150*var(--m));top:calc(-232*var(--m));width:calc(700*var(--m))}
.hs{position:absolute;top:0;bottom:0;left:var(--ox);width:min(100%,calc(360*var(--m)))}
.hs>*{position:absolute}
.insc{font:400 14px/1.3 var(--kl);color:var(--pencil);white-space:nowrap}
.hs .insc{display:none}
.ht{left:calc(20*var(--m));top:calc(440*var(--m));width:calc(320*var(--m));display:flex;flex-direction:column;align-items:flex-start;gap:calc(28*var(--m))}
.ht h1{font-size:calc(46*var(--m));line-height:1.02;letter-spacing:-.01em;width:100%}
.sf{font-size:calc(16*var(--m));line-height:1.6;color:var(--ink2)}
.ht .bk{font-size:calc(16*var(--m))}
.hs1{--s:calc(84*var(--m));--f:calc(24*var(--m));--r:5deg;left:calc(22*var(--m));top:calc(300*var(--m))}
.slip{left:calc(20*var(--m));top:calc(800*var(--m));width:calc(320*var(--m));padding:24px 22px 14px;background:var(--washi);border:1px solid rgba(28,26,23,.45)}
.hs .slip{position:absolute}
.pin{position:absolute;left:50%;top:8px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--seal)}
.slip h2{font-size:24px;line-height:1.2;padding-bottom:10px;border-bottom:2px solid var(--ink);margin-bottom:3px}
.sr{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid rgba(28,26,23,.2);text-decoration:none;color:var(--ink)}
.slip h2+.sr{border-top:0}
.sr .st{flex:1;display:grid;gap:1px;min-width:0}.sr b{font:500 15px/1.3 var(--zk)}.sr i{font:400 12px/1.3 var(--kl);color:var(--pencil);font-style:normal}
.sr .ar{width:24px;height:12px;background:url(/assets/img/arrow-red.svg) no-repeat center/contain;transition:transform .2s}
.sr:hover .ar{transform:translateX(4px)}
.sr:hover b{color:var(--seal)}
.mn2{display:block;flex:none;width:44px;height:44px}.mn2 img{width:44px;height:44px;display:block}

/* sections */
.sec{padding:64px 20px}
.sec h2{font-size:34px;line-height:1.12}
.stop{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}
.sg{padding:64px 20px 72px}
.wall{position:relative;height:calc(600*var(--m));width:calc(320*var(--m));max-width:100%;margin-inline:auto}
.tile{--tm:7px;position:absolute;display:block;left:calc(var(--x)*var(--m));top:calc(var(--y)*var(--m));width:calc(var(--w)*var(--m));padding:var(--tm);background:var(--washi);border:1px solid rgba(28,26,23,.35);box-shadow:0 6px 14px rgba(28,26,23,.14);transform:rotate(var(--r,0deg));transition:transform .25s ease-out,box-shadow .25s;text-decoration:none;color:var(--ink)}
.tile img{display:block;width:100%;aspect-ratio:1}
.t1{--x:0;--y:0;--w:152;--r:1.5deg}.t2{--x:168;--y:40;--w:152;--r:-1.5deg}.t3{--x:0;--y:190;--w:152;--r:-1.2deg}
.t4{--x:168;--y:230;--w:152;--r:1.2deg}.t5{--x:0;--y:380;--w:152;--r:1deg}.t6{--x:168;--y:420;--w:152;--r:-1.4deg}
.tile .stamp{font-size:10px;padding:2px 6px;left:13px;top:15px}
.tile .lab{display:none}
.tile:hover,.tile:focus-visible{transform:rotate(0) translateY(-4px);box-shadow:0 16px 30px rgba(28,26,23,.24)}
.tile:focus-visible{outline:2px solid var(--seal);outline-offset:2px}

.sq2{padding:64px 20px}
.qrow{display:flex;flex-direction:column;gap:32px}
.ql{display:grid;gap:20px;align-content:start}
.sign{font:600 16px/1.4 var(--kl);color:var(--seal)}
.qg{display:flex;flex-direction:column;gap:20px}
.vd{position:relative;display:grid;gap:16px;padding:24px 24px 22px;background:var(--washi);border:1px solid rgba(28,26,23,.35);box-shadow:0 4px 10px rgba(28,26,23,.1)}
.vd .seal{position:absolute;right:12px;top:-12px;--s:44px;--f:15px;--r:-6deg;z-index:2}
.vh2{display:flex;align-items:center;gap:14px}
.vh2 h3{font:700 16px/1.3 var(--zk);color:var(--ink)}
.vd blockquote p{font:400 22px/1.4 var(--yb);color:var(--ink)}
.vd .bk{font-size:15px;justify-self:start;margin-left:10px}
.sl{padding:64px 20px}
.sl .lead{margin-top:16px;max-width:560px}
.gl{margin-top:28px;display:block}
.tr{display:flex;flex-direction:column;gap:8px;padding:18px 0;border-top:1px solid var(--line)}
.tr dt{display:flex;align-items:center;gap:14px;font:400 24px/1.2 var(--yb);color:var(--ink)}
.tr .arw{margin-top:0}
.tr dd{font-size:16px}
.sp{padding:64px 20px}
.prow{display:flex;flex-direction:column;gap:32px}
.mount{position:relative;width:100%;max-width:320px;height:340px;margin-inline:auto}
.tile.big{--tm:10px;position:absolute;left:0;top:20px;width:calc(100% - 20px);transform:rotate(1.2deg)}
.mount .insc{display:none}
.seal.lg{--s:60px;--f:16px;--r:-5deg;position:absolute;left:calc(100% - 80px);top:calc(100% - 50px)}
.pt{display:grid;gap:22px;align-content:start}
.pt h2{font-size:34px}
.pts{display:block}
.pr{display:flex;gap:16px;padding:10px 0;border-top:1px solid var(--line)}
.pr dt{flex:none;width:110px;font:400 15px/1.45 var(--kl);color:var(--pencil)}
.pr dd{flex:1;font:500 15px/1.45 var(--zk);color:var(--ink)}
.pt .bk{justify-self:start}

/* page bands */
.band{padding:28px 20px 40px}
.band .in{display:grid;gap:16px;z-index:1}
.band h1{font-size:40px;line-height:1.06;max-width:760px}
.band .lead{max-width:640px}
.ink.b{right:0;top:0;width:130px;height:110px;left:auto}
.ink.b img{left:-10px;top:-150px;width:520px}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font:400 14px/1.4 var(--kl)}
.crumbs li{display:flex;align-items:center;gap:8px;color:var(--ink)}
.crumbs a{color:var(--pencil);text-decoration:underline;text-underline-offset:3px}
.crumbs li+li::before{content:'›';color:var(--seal)}
.cat{padding:40px 20px 64px;--wo:.55}
.cds{display:grid;gap:40px}
.cd{position:relative;width:100%;max-width:376px;margin-inline:auto;padding:12px 12px 96px;background:var(--washi);border:1px solid rgba(28,26,23,.35);box-shadow:0 6px 14px rgba(28,26,23,.12);transition:transform .25s,box-shadow .25s}
.cd img{display:block;width:100%;aspect-ratio:1}
.cd .stamp{--tm:12px;left:20px;top:22px}
.cd .lab{position:absolute;left:24px;right:24px;bottom:12px;display:grid;gap:8px;padding:16px 18px;background:var(--washi);border:1px solid rgba(28,26,23,.4);box-shadow:0 4px 10px rgba(28,26,23,.14);transition:transform .25s}
.cd .l0{transform:rotate(-1deg)}.cd .l1{transform:rotate(1deg)}
.lab h2{font:400 24px/1.15 var(--yb);color:var(--ink)}
.lab h2 a{text-decoration:none}.lab h2 a::after{content:'';position:absolute;inset:0;z-index:3}
.lab p{font:400 14px/1.3 var(--kl);color:var(--pencil)}
.bkt{font-size:15px;justify-self:start}
.cd:hover,.cd:focus-within{transform:translateY(-4px);box-shadow:0 14px 28px rgba(28,26,23,.2)}
.cd:hover .lab,.cd:focus-within .lab{transform:rotate(0)}
.cd:focus-within{outline:2px solid var(--seal);outline-offset:2px}.cd a:focus-visible{outline:0}
.cd:hover h2 a{color:var(--seal)}

/* game page */
.gband{padding:24px 20px 40px}
.grow{display:flex;flex-direction:column;gap:24px;margin-top:20px}
.gm2{position:relative;width:100%;max-width:330px}
.gm2 .tile.big{position:relative;left:0;top:0;width:100%;--tm:10px;transform:rotate(1deg)}
.gm2 .insc{display:none}
.gt3{display:grid;gap:18px;align-content:start}
.gt3 h1{font-size:42px;line-height:1.04}
.one{font-size:16px;line-height:1.55;color:var(--ink2)}
.meta{font:400 14px/1.4 var(--kl);color:var(--pencil)}
.gt3 .pts .pr{padding:8px 0}.gt3 .pts .pr dt{font-size:14px;width:96px}
.gt3 .pts{margin-top:2px}
.tabs{background:var(--washi);border-bottom:1px solid rgba(28,26,23,.3)}
.tabs .in{display:flex;gap:18px;padding:0 20px;overflow-x:auto}
.tabs a{position:relative;padding:14px 0 12px;font:500 14px/1.4 var(--zk);color:var(--pencil);text-decoration:none;white-space:nowrap}
.tabs a::after{content:'';position:absolute;left:0;bottom:-1px;width:30px;height:3px;background:var(--seal);opacity:0}
.tabs a[aria-current]{font-weight:700;color:var(--ink)}.tabs a[aria-current]::after{opacity:1}
.gb{padding:32px 20px 56px;--wo:.5}
.col{display:grid;gap:36px;max-width:800px}
.pan{display:grid;gap:16px;align-content:start;scroll-margin-top:12px}
.pan h2{font-size:26px;line-height:1.2}
.al{display:grid;gap:12px}.al li{display:flex;gap:12px;align-items:flex-start}.al .arw{margin-top:.62em}
.al span:not(.arw){font-size:16px;line-height:1.65}
.keys{display:block}
.kr{display:flex;flex-direction:column;gap:6px;padding:10px 0;border-top:1px solid var(--line)}
.kr kbd{align-self:flex-start;padding:3px 8px;border:1.5px solid var(--seal);font:600 13px/1.2 var(--kl);letter-spacing:.2em;text-transform:uppercase;color:var(--seal)}
.kr span{font-size:16px;line-height:1.5;color:var(--ink2)}
.faq .qa{display:grid;gap:6px;padding:12px 0;border-top:1px solid var(--line)}
.qa h3{font:700 17px/1.4 var(--zk);color:var(--ink)}.qa p{font-size:16px}
.where{position:relative;display:grid;gap:14px;padding:28px;background:var(--w2);border:1px solid rgba(28,26,23,.4)}
.where h2{font-size:24px;line-height:1.2}
.where .bk{justify-self:start}
.seal.md2{--s:52px;--f:17px;--r:-5deg;position:absolute;right:18px;top:-16px}
.sim{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sim a{display:grid;gap:10px;align-content:start;text-decoration:none}
.sim .tile{position:relative;left:0;top:0;--tm:7px;width:130px;transform:none}
.sim b{font:700 15px/1.3 var(--zk);color:var(--ink)}.sim span:not(.tile){font-size:14px;line-height:1.45;color:var(--ink2)}
.sim a:hover b{color:var(--seal)}
.ink.gf,.ink.lgf{display:none}

.ink.q{right:0;bottom:0;width:170px;height:150px}
.ink.q img{left:-330px;top:-140px;width:700px}
.ink.l{right:0;bottom:0;width:150px;height:110px}
.ink.l img{left:-200px;top:-20px;width:600px}
/* grids must not grow past their column */
.cslip,.col,.pan,.gt3,.pt,.band .in,.where,.fi,.ab>div,.ql,.cd .lab{grid-template-columns:minmax(0,1fr)}
.pr dd{min-width:0;overflow-wrap:anywhere}
/* about, legal */
.abs{padding:36px 20px 32px;--wo:.5}
.ab{display:flex;flex-direction:column;gap:12px;padding:24px 0;border-top:1px solid var(--line)}
.ab h2{font-size:26px;line-height:1.2}.ab>div{display:grid;gap:12px}
.ctc{padding:44px 20px}
.cslip{position:relative;display:grid;gap:16px;padding:32px;background:var(--washi);border:1px solid rgba(28,26,23,.4);box-shadow:0 6px 14px rgba(28,26,23,.12);max-width:720px}
.cslip h2{font-size:26px;line-height:1.2;max-width:calc(100% - 70px)}
.cslip .pr{padding:8px 0}.cslip .pr dt{width:90px;font-size:14px}.cslip .pr.em dd a{color:var(--seal)}
.seal.k2{--s:60px;--f:26px;--r:-5deg;position:absolute;right:24px;top:22px}
.fq{padding:44px 20px;--wo:.5}.fq h2{font-size:28px;margin-bottom:24px}
.fq .faq{max-width:800px}.fq .qa{padding:16px 0}
.lgs{padding:32px 20px 56px;--wo:.5}
.lr{display:flex;flex-direction:column;gap:10px;padding:20px 0;border-top:1px solid var(--line)}
.lr h2{font-size:22px;line-height:1.25}
.band .upd{font:400 16px/1.5 var(--kl);color:var(--pencil)}

/* footer */
.ft{padding:36px 20px 32px}
.fi{display:grid;gap:24px}
.ftop{display:flex;flex-direction:column;gap:18px}
.fid{display:flex;flex-direction:column;gap:10px}
.fl{font:400 15px/1.4 var(--kl);color:var(--pencil);max-width:420px}
.fk{display:flex;align-items:center;gap:12px}
.fkt{font:500 15px/1.3 var(--zk);color:var(--ink)}
.fk a{font-size:15px;color:var(--seal);text-underline-offset:3px}
.ft hr{border:0;border-top:1px solid var(--line);margin:0;width:100%}
.flk{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center}
.flk a,.fck{font:400 14px/1.4 var(--zk);color:var(--ink2);text-decoration:none}
.flk a:hover,.fck:hover{color:var(--seal);text-decoration:underline}
.fc{font-size:13px;line-height:1.5;color:var(--pencil)}

/* cookie */
.cookie{position:fixed;z-index:60;left:10px;right:10px;bottom:10px;max-width:500px;display:grid;gap:14px;padding:22px 20px;background:var(--washi);border:1px solid rgba(28,26,23,.45);box-shadow:0 12px 28px rgba(28,26,23,.2)}
.cookie[hidden]{display:none}
.ckh{display:flex;align-items:center;gap:14px}
.cookie h2{font-size:22px;line-height:1.2}
.cookie p{font-size:15px;line-height:1.6}
.ck-acts{display:flex;flex-wrap:wrap;gap:8px 20px}
.cookie .bk{font-size:15px}
.ck-manage{display:grid;gap:8px;font-size:15px}.ck-manage[hidden]{display:none}.ck-manage label{display:flex;gap:8px;align-items:center}

@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}.js .rv{-webkit-mask:none;mask:none}.js .seal.pop{--sc:1;opacity:1}}
@media(min-width:600px){
  .cookie{left:auto;right:20px;bottom:20px;width:min(500px,calc(100% - 40px))}
  .cds{grid-template-columns:1fr 1fr;gap:40px 28px}
  .sim{grid-template-columns:repeat(3,1fr)}
}

/* ---------- desktop: composition in --u (1368 wide) ---------- */
@media(min-width:1024px){
  :root{--u:min(1px,calc(100vw/1368));--ox:max(0px,calc(50% - 684*var(--u)))}
  .in{max-width:calc(1224*var(--u))}
  .tx{font-size:calc(17*var(--u))}
  .lead{font-size:calc(18*var(--u))}
  .seal.sm{--s:calc(36*var(--u));--f:calc(14*var(--u))}
  .hdi{height:calc(88*var(--u));padding:0 calc(72*var(--u))}
  .hg{gap:calc(32*var(--u))}
  .hh{display:block}
  .hn{font-size:calc(16*var(--u))}
  .logo{gap:calc(12*var(--u))}.lt{font-size:calc(24*var(--u))}
  .bk,.bkt{font-size:calc(16*var(--u))}
  .hero{height:calc(812*var(--u))}
  .hf img{left:calc(var(--ox) + 560*var(--u));top:calc(-495*var(--u));width:calc(1900*var(--u))}
  .hs{width:min(100%,calc(1368*var(--u)))}
  .hs .insc{display:block;left:calc(28*var(--u));top:calc(330*var(--u));font-size:calc(15*var(--u));writing-mode:vertical-rl}
  .ht{left:calc(72*var(--u));top:calc(112*var(--u));width:calc(520*var(--u));gap:calc(28*var(--u))}
  .ht h1{font-size:calc(92*var(--u))}
  .sf{font-size:calc(19*var(--u));max-width:calc(430*var(--u));line-height:1.6}
  .ht .bk{font-size:calc(18*var(--u))}
  .hs1{--s:calc(104*var(--u));--f:calc(30*var(--u));left:calc(470*var(--u));top:calc(600*var(--u))}
  .slip{left:calc(996*var(--u));top:calc(70*var(--u));width:calc(300*var(--u))}
  .sec{padding:calc(112*var(--u)) calc(72*var(--u))}
  .sec h2{font-size:calc(54*var(--u))}
  .sg{padding:calc(104*var(--u)) calc(72*var(--u)) calc(120*var(--u))}
  .stop{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:calc(16*var(--u));margin-bottom:0}
  .stop h2{max-width:calc(640*var(--u))}.stop .lead{max-width:calc(360*var(--u))}
  .wall{width:100%;height:calc(900*var(--u));margin-top:0}
  .tile{--tm:calc(10*var(--u));left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--w)*var(--u))}
  .t1{--x:0;--y:40;--w:420;--r:1.5deg}.t2{--x:470;--y:0;--w:300;--r:-1.2deg}.t3{--x:844;--y:70;--w:380;--r:1deg}
  .t4{--x:60;--y:540;--w:320;--r:-1deg}.t5{--x:430;--y:380;--w:380;--r:1.8deg}.t6{--x:880;--y:520;--w:330;--r:-1.5deg}
  .stop{margin-bottom:calc(48*var(--u))}
  .tile .stamp{font-size:calc(13*var(--u));padding:calc(3*var(--u)) calc(8*var(--u));left:calc(16*var(--u));top:calc(18*var(--u))}
  .tile .lab{position:absolute;display:grid;left:24px;right:-24px;bottom:-30px;gap:8px;padding:16px 18px;background:var(--washi);border:1px solid rgba(28,26,23,.4);box-shadow:0 4px 10px rgba(28,26,23,.14);opacity:0;transform:translateY(12px) rotate(-1deg);pointer-events:none;transition:opacity .25s,transform .25s;z-index:5}
  .tile .lab b{font:400 24px/1.15 var(--yb);color:var(--ink)}
  .tile .lab i{font:400 14px/1.3 var(--kl);color:var(--pencil);font-style:normal}
  .tile:hover .lab,.tile:focus-visible .lab{opacity:1;transform:rotate(-1deg)}
  .sq2{padding:calc(112*var(--u)) calc(72*var(--u))}
  .qrow{flex-direction:row;gap:calc(64*var(--u))}
  .ql{width:calc(380*var(--u));flex:none;gap:20px}
  .qg{flex-direction:row;flex-wrap:wrap;gap:calc(40*var(--u));width:calc(780*var(--u));max-width:calc(100% - 444*var(--u))}
  .vd{width:calc(360*var(--u));padding:24px 24px 22px}
  .vd:nth-child(odd){transform:rotate(.8deg)}.vd:nth-child(even){transform:rotate(-.8deg)}
  .vd blockquote p{font-size:22px}
  .ink.q{left:0;right:auto;bottom:auto;top:calc(470*var(--u));width:calc(470*var(--u));height:calc(520*var(--u));z-index:-1}
  .ink.q img{left:calc(-760*var(--u));top:calc(-560*var(--u));width:calc(1500*var(--u))}
  .sl{padding:calc(112*var(--u)) calc(72*var(--u))}
  .sl .lead{margin-top:calc(20*var(--u));max-width:calc(560*var(--u))}
  .sl h2{max-width:calc(720*var(--u))}
  .gl{margin-top:calc(40*var(--u))}
  .tr{flex-direction:row;gap:calc(24*var(--u));padding:calc(22*var(--u)) 0;align-items:flex-start}
  .tr dt{width:calc(420*var(--u));font-size:calc(30*var(--u))}
  .tr dd{width:calc(640*var(--u));font-size:calc(17*var(--u))}
  .tr:last-child{padding-bottom:0}
  .ink.l{right:0;left:auto;bottom:auto;top:0;width:calc(470*var(--u));height:calc(300*var(--u))}
  .ink.l img{left:calc(-480*var(--u));top:calc(-40*var(--u));width:calc(1500*var(--u))}
  .sp{padding:calc(112*var(--u)) calc(72*var(--u))}
  .prow{flex-direction:row;gap:calc(80*var(--u));align-items:center}
  .mount{width:calc(520*var(--u));max-width:none;height:calc(560*var(--u));flex:none;margin:0}
  .tile.big{left:calc(40*var(--u));top:calc(20*var(--u));width:calc(460*var(--u))}
  .mount .insc{display:block;position:absolute;left:calc(4*var(--u));top:calc(440*var(--u));font-size:calc(15*var(--u));writing-mode:vertical-rl;transform:none}
  .seal.lg{--s:calc(76*var(--u));--f:calc(20*var(--u));left:calc(420*var(--u));top:calc(470*var(--u))}
  .pt{width:calc(624*var(--u))}
  .pt h2{font-size:calc(46*var(--u))}
  .pr dt{width:calc(150*var(--u))}
  .band{padding:calc(48*var(--u)) calc(72*var(--u)) calc(72*var(--u))}
  .band .in{gap:calc(24*var(--u))}
  .band h1{font-size:calc(72*var(--u));max-width:calc(760*var(--u))}
  .band.lg h1{font-size:calc(64*var(--u))}
  .band .lead{max-width:calc(640*var(--u))}
  .ink.b{left:auto;right:0;width:calc(520*var(--u));height:calc(420*var(--u))}
  .ink.b img{left:calc(-40*var(--u));top:calc(-330*var(--u));width:calc(1300*var(--u))}
  .cat{padding:calc(72*var(--u)) calc(72*var(--u)) calc(112*var(--u))}
  .cds{grid-template-columns:repeat(3,calc(376*var(--u)));gap:calc(64*var(--u)) calc(48*var(--u));justify-content:center}
  .cd{max-width:none;width:calc(376*var(--u))}
  .gband{padding:calc(40*var(--u)) calc(72*var(--u)) calc(64*var(--u))}
  .grow{flex-direction:row;gap:calc(64*var(--u));margin-top:calc(28*var(--u))}
  .gm2{width:calc(430*var(--u));max-width:none;flex:none;height:calc(430*var(--u))}
  .gm2 .tile.big{position:absolute;left:calc(30*var(--u));width:calc(390*var(--u))}
  .gm2 .insc{display:block;position:absolute;left:calc(2*var(--u));top:calc(60*var(--u));font-size:calc(14*var(--u));writing-mode:vertical-rl}
  .gt3{width:calc(640*var(--u));gap:calc(18*var(--u))}
  .gt3 h1{font-size:calc(72*var(--u))}
  .one{font-size:calc(19*var(--u));line-height:1.55}
  .gt3 .pts .pr dt{width:calc(130*var(--u))}
  .tabs .in{gap:calc(40*var(--u));padding:0;overflow:visible}
  .tabs{padding:0 calc(72*var(--u))}
  .tabs a{font-size:calc(16*var(--u));padding-top:calc(18*var(--u))}.tabs a::after{width:calc(40*var(--u))}
  .gb{padding:calc(56*var(--u)) calc(72*var(--u)) calc(96*var(--u))}
  .col{gap:calc(56*var(--u));width:calc(800*var(--u));max-width:100%}
  .pan h2{font-size:calc(36*var(--u))}
  .al span:not(.arw){font-size:calc(17*var(--u))}
  .kr{display:grid;grid-template-columns:calc(220*var(--u)) 1fr;align-items:center;gap:16px;padding:10px 0}
  .kr kbd{justify-self:start}
  .kr kbd{align-self:center}
  .where h2{font-size:calc(30*var(--u))}
  .sim{grid-template-columns:repeat(3,calc(240*var(--u)));gap:calc(32*var(--u))}
  .sim .tile{width:calc(160*var(--u));--tm:calc(10*var(--u))}
  .ink.gf{display:block;right:0;left:auto;top:calc(800*var(--u));width:calc(380*var(--u));height:calc(1100*var(--u))}
  .ink.gf img{left:calc(-160*var(--u));top:calc(-260*var(--u));width:calc(1300*var(--u))}
  .gb{position:relative;overflow:clip}
  .abs{padding:calc(64*var(--u)) calc(72*var(--u)) calc(48*var(--u))}
  .ab{flex-direction:row;gap:calc(48*var(--u));padding:calc(32*var(--u)) 0}
  .ab h2{width:calc(400*var(--u));flex:none;font-size:calc(32*var(--u))}.ab>div{width:calc(680*var(--u))}
  .ctc{padding:calc(72*var(--u)) calc(72*var(--u))}
  .cslip h2{font-size:calc(36*var(--u));max-width:calc(560*var(--u))}
  .cslip{width:calc(720*var(--u));max-width:100%}
  .fq{padding:calc(72*var(--u)) calc(72*var(--u))}.fq h2{font-size:calc(40*var(--u))}
  .lgs{padding:calc(56*var(--u)) calc(72*var(--u)) calc(96*var(--u))}
  .lr{flex-direction:row;gap:calc(48*var(--u));padding:calc(26*var(--u)) 0}
  .lr h2{width:calc(360*var(--u));flex:none;font-size:calc(26*var(--u))}
  .lr .tx{width:calc(600*var(--u))}
  .ink.lgf{display:block;right:0;left:auto;top:calc(40*var(--u));width:calc(260*var(--u));height:calc(620*var(--u))}
  .ink.lgf img{left:calc(-40*var(--u));top:calc(-220*var(--u));width:calc(1000*var(--u))}
  .ft{padding:calc(36*var(--u)) calc(72*var(--u)) calc(32*var(--u))}
  .ftop{flex-direction:row;justify-content:space-between;align-items:flex-start}
  .fid{flex-direction:row;align-items:center;gap:calc(20*var(--u))}
  .fl{width:calc(420*var(--u))}
  .cookie{width:min(500px,calc(100% - 40px));padding:28px}
  .cookie h2{font-size:26px}
  .cd .lab h2{font-size:calc(24*var(--u))}
  .cd .lab{left:calc(24*var(--u));right:calc(24*var(--u))}
}
/* social icons */
.socs{display:inline-flex;align-items:center;gap:8px}
.socs a.sic{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line);border-radius:2px;color:var(--ink2);text-decoration:none;transition:color .18s,background .18s,border-color .18s}
.socs a.sic svg{display:block;width:15px;height:15px;fill:currentColor}
.socs a.sic:hover{background:var(--seal);border-color:var(--seal);color:var(--sealink)}
.socs a.sic:focus-visible{outline:2px solid var(--seal);outline-offset:2px}