/* Japanese Poké Cards: indigo night, sumi ink and vermilion on washi paper. The painted pieces live in /a/ (build/art). */
:root{--paper:#F1EADB;--paper2:#F7F1E6;--ink:#151413;--red:#C42A1C;--red-l:#F08A78;--indigo:#1D2F52;--muted:#6b6257;--line:#15141322;
  --serif:'Zen Old Mincho',serif;--sans:'Zen Kaku Gothic New',system-ui,sans-serif;--brush:'Yuji Boku',serif;--ease:cubic-bezier(.32,.72,0,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--paper) url(/a/paper.webp) 0 0/1200px auto;color:var(--ink);font:16px/1.65 var(--sans);min-height:100vh}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:40;opacity:.28;mix-blend-mode:multiply;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .38 0 0 0 0 .28 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
img{display:block;max-width:100%;height:auto}a{color:inherit}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:60;background:var(--paper);padding:8px 12px}

/* ---------------------------------------------------------------- sky (header + hero) */
.sky{position:relative;color:var(--paper);background:url(/a/sky-1.webp) 62% 100%/cover no-repeat;padding-bottom:64px}
.sky.s2{background-image:url(/a/sky-2.webp)}.sky.s3{background-image:url(/a/sky-3.webp)}
.top{position:relative;z-index:30;display:flex;align-items:center;gap:10px;max-width:1160px;margin:0 auto;padding:14px 20px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}.brand img{width:36px;height:36px}
.brand b{display:block;font:700 16px/1.15 var(--serif);letter-spacing:.02em}.brand small{display:block;font-size:11px;opacity:.7;letter-spacing:.08em}
.nav{display:flex;gap:4px}.nav a{text-decoration:none;font:500 15px var(--sans);padding:8px 14px;border-radius:999px;transition:background .5s var(--ease)}
.nav a:hover,.nav a[aria-current]{background:#ffffff1c}
.ic{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;transition:background .5s var(--ease),transform .4s var(--ease)}.ic:hover{background:#ffffff1c}.ic:active{transform:scale(.94)}
.ic svg{width:22px;height:22px}.menu-btn{display:none}
.menu-btn .l{transition:transform .5s var(--ease),opacity .3s;transform-origin:center}
.menu-open .menu-btn .l1{transform:translateY(5px) rotate(45deg)}.menu-open .menu-btn .l2{opacity:0}.menu-open .menu-btn .l3{transform:translateY(-5px) rotate(-45deg)}
@media (max-width:760px){
  .menu-btn{display:grid}.nav{position:absolute;left:12px;right:12px;top:66px;flex-direction:column;gap:2px;padding:10px;border-radius:20px;
    background:#101a30f2;box-shadow:0 30px 60px -20px #000c;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .4s var(--ease),transform .5s var(--ease)}
  .nav a{font-size:19px;padding:12px 16px;font-family:var(--serif)}
  .menu-open .nav{opacity:1;transform:none;pointer-events:auto}
}
.hero{max-width:1160px;margin:0 auto;padding:6px 20px 0;display:grid;grid-template-columns:auto 1fr;gap:6px 26px;align-items:end;min-height:400px}
.brush-col{grid-row:1;align-self:start;padding-top:6px}
.brush{font:400 var(--fs,118px)/1 var(--brush);writing-mode:vertical-rl;text-orientation:upright;letter-spacing:-.03em;color:var(--paper);
  -webkit-text-stroke:.03em var(--paper);-webkit-mask-image:url(/a/mask.webp);mask-image:url(/a/mask.webp);-webkit-mask-size:260px;mask-size:260px;
  filter:drop-shadow(0 0 1.5px #f1eadb88);white-space:nowrap;max-height:calc(var(--fs,118px) * 6.4)}
.brush.h{writing-mode:horizontal-tb}
.cap{font:12px/1.4 var(--sans);letter-spacing:.08em;color:var(--red-l);margin-top:10px;writing-mode:horizontal-tb}
.ht{grid-column:1/-1;padding-bottom:6px}
.crumbs{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:12.5px;opacity:.75;margin-bottom:12px}.crumbs a{text-decoration:none}.crumbs a:hover{text-decoration:underline}.crumbs span[aria-hidden]{opacity:.6}
.eyebrow{font:700 11.5px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--red-l)}
h1{font:900 clamp(32px,7.4vw,58px)/1.06 var(--serif);letter-spacing:-.01em;margin:8px 0 6px;text-wrap:balance}
.jname{font:400 22px/1.3 'Yuji Syuku',serif;color:var(--red-l)}
.lede{color:#E6DDCC;max-width:62ch;margin-top:10px;font-size:15.5px}
@media (min-width:900px){
  .hero{grid-template-columns:auto minmax(0,1fr);min-height:470px;gap:0 56px;padding-top:20px}
  .brush{font-size:var(--fsd,150px);max-height:calc(var(--fsd,150px) * 6.4)}.ht{grid-column:2;grid-row:1;align-self:end;padding-bottom:20px}
  .sky{padding-bottom:84px}
}

/* ---------------------------------------------------------------- painted pieces */
.rings{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;max-width:640px;margin:10px auto 0}
.ring{aspect-ratio:1;display:grid;place-content:center;text-align:center;background:url(/a/enso-red.webp) center/contain no-repeat;padding:12%}
.ring:nth-child(2){background-image:url(/a/enso-indigo.webp)}.ring:nth-child(3){background-image:url(/a/enso-red-2.webp)}.ring:nth-child(4){background-image:url(/a/enso-ink.webp)}
.ring b{font:900 clamp(21px,5.6vw,32px)/1.05 var(--serif)}.ring b.l{font-size:clamp(17px,4.5vw,27px)}.ring span{font-size:clamp(9px,2.3vw,11px);line-height:1.2;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.bh{display:inline-block;position:relative;margin:44px 0 8px -6px;padding:11px 54px 13px 24px;color:var(--paper);font:700 clamp(17px,4.4vw,21px)/1.25 var(--serif);letter-spacing:.03em;
  background:url(/a/bn-indigo.webp) 0 50%/100% 100% no-repeat;scroll-margin-top:20px}
.bh.ink{background-image:url(/a/bn-ink.webp)}.bh.red{background-image:url(/a/bn-red.webp)}.bh.ind2{background-image:url(/a/bn-indigo-2.webp)}
.bh small{font:500 13px var(--sans);opacity:.8;margin-left:8px;letter-spacing:0}
.band{position:relative;display:grid;grid-template-columns:repeat(4,1fr);text-align:center;color:#fff;padding:22px 58px 24px 14px;margin:26px -6px 0;
  background:url(/a/band-indigo.webp) 0 50%/100% 100% no-repeat}
.band b{display:block;font:900 clamp(22px,5.6vw,32px)/1.1 var(--serif)}.band span{font-size:clamp(9px,2.4vw,11px);letter-spacing:.06em;text-transform:uppercase;opacity:.9;white-space:nowrap}
.ul{background:url(/a/rule-red.webp) 0 100%/100% 12px no-repeat;padding-bottom:6px}
.note{color:var(--muted);font-size:14.5px;max-width:70ch;margin:4px 0 18px}
h3{font:700 19px var(--serif);margin:30px 0 8px}

/* ---------------------------------------------------------------- tools row, chips */
.tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:30px 0 0}
.seg{display:inline-flex;padding:4px;border-radius:999px;background:#15141310;box-shadow:inset 0 0 0 1px #1514131a}
.seg button{padding:7px 16px;border-radius:999px;font:500 14px var(--sans);transition:background .5s var(--ease),color .5s var(--ease)}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.act{display:inline-flex;align-items:center;gap:8px;padding:8px 8px 8px 16px;border-radius:999px;background:var(--paper2);box-shadow:0 0 0 1px #1514131f,0 8px 20px -14px #0006;
  font:500 14px var(--sans);text-decoration:none;transition:transform .5s var(--ease)}
.act i{width:26px;height:26px;border-radius:50%;background:#15141312;display:grid;place-items:center;font-style:normal;transition:transform .5s var(--ease)}
.act:hover i{transform:translate(2px,-1px) scale(1.06)}.act:active{transform:scale(.98)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0}
.chip{display:inline-flex;align-items:baseline;gap:6px;padding:6px 13px;border-radius:999px;background:var(--paper2);box-shadow:0 0 0 1px #1514131f;font-size:13.5px;text-decoration:none;
  transition:background .4s var(--ease),transform .4s var(--ease)}
.chip:hover{background:#fff}.chip small{color:var(--muted);font-size:12px}.chip .j{font:15px 'Yuji Syuku',serif;color:var(--red)}

/* ---------------------------------------------------------------- cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:24px 18px;margin-top:6px}
@media (min-width:900px){.grid{grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:30px 24px}}
.cd{min-width:0}.zoom{display:block;width:100%;text-align:left;cursor:zoom-in}
.cw{position:relative;display:block}.cw::before{content:'';position:absolute;inset:-7px -12px -12px -13px;background:url(/a/smear-1.webp) center/100% 100% no-repeat;opacity:.9}
.cw.s1::before{background-image:url(/a/smear-2.webp)}.cw.s2::before{background-image:url(/a/smear-3.webp)}
.cw img{position:relative;width:100%;aspect-ratio:240/336;object-fit:cover;border-radius:4.6%/3.3%;box-shadow:0 12px 20px -14px #000b;background:#e4dccb;
  transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.zoom:hover .cw img{transform:translateY(-3px) rotate(-.6deg);box-shadow:0 20px 28px -16px #000c}
.nopic{position:relative;aspect-ratio:240/336;border-radius:4.6%/3.3%;background:var(--paper2);box-shadow:inset 0 0 0 1px #15141322;display:grid;place-content:center;text-align:center;
  font:13px var(--serif);color:var(--muted);padding:10px}
.cd figcaption{padding-top:10px;font-size:12.5px;line-height:1.4}.cd b{display:block;font:700 14px/1.3 var(--serif)}.cd small{color:var(--muted);font-size:12px}
.list-only{display:none}[data-view=list] .list-only{display:block}[data-view=list] .pics-only{display:none}
.tl{width:100%;border-collapse:collapse;margin-top:18px;font-size:14px}
.tl th{text-align:left;font:700 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:8px 6px;border-bottom:1.5px solid var(--ink)}
.tl td{padding:9px 6px;border-bottom:1px solid var(--line);vertical-align:top}.tl td:first-child{white-space:nowrap;font-variant-numeric:tabular-nums}
.tl a{text-decoration:none}.tl a:hover{text-decoration:underline}
.tl .rc{display:inline-block;min-width:34px;text-align:center;font:700 11px/1 var(--sans);padding:4px 6px;border-radius:4px;background:#1d2f5214;color:var(--indigo)}

/* ---------------------------------------------------------------- tiles (hubs, home) */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:22px 16px;margin-top:14px}
@media (min-width:900px){.tiles{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:28px 22px}}
.tile{text-decoration:none;display:block}.tile .cw{width:78%;margin:0 auto 10px}.tile b{display:block;font:700 15px/1.3 var(--serif)}.tile small{display:block;color:var(--muted);font-size:12.5px}
.tile:hover b{text-decoration:underline}
.ptiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:14px}
.pt{display:block;text-decoration:none;padding:12px 14px;border-radius:18px;background:var(--paper2);box-shadow:0 0 0 1px #1514131a;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.pt:hover{transform:translateY(-2px);box-shadow:0 0 0 1px #15141330,0 14px 26px -18px #0008}
.pt .j{display:block;font:20px/1.25 'Yuji Syuku',serif;color:var(--red)}.pt b{display:block;font:700 14.5px var(--serif)}.pt small{color:var(--muted);font-size:12px}
.filter{width:100%;max-width:420px;margin-top:18px;padding:12px 18px;border-radius:999px;border:0;background:var(--paper2);box-shadow:0 0 0 1px #15141326;font:16px var(--sans)}
.series-list{columns:2 220px;gap:28px;margin-top:14px;list-style:none}.series-list li{break-inside:avoid;padding:7px 0;border-bottom:1px solid var(--line)}
.series-list a{text-decoration:none;font:700 16px var(--serif)}.series-list small{color:var(--muted);margin-left:6px}.series-list .j{font:17px 'Yuji Syuku',serif;color:var(--red);margin-right:8px}
.pager{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:40px}.pager a{display:block;padding:14px 18px;border-radius:18px;background:var(--paper2);box-shadow:0 0 0 1px #1514131a;text-decoration:none}
.pager small{display:block;color:var(--muted);font-size:12px}.pager b{font:700 15px var(--serif)}.pager .nx{text-align:right;grid-column:2}

/* ---------------------------------------------------------------- FAQ, prose */
.faq{max-width:780px;margin-top:10px}.faq details{background:url(/a/rule-ink.webp) 0 100%/100% 8px no-repeat;padding:4px 0 12px}
.faq summary{list-style:none;cursor:pointer;font:700 17px/1.4 var(--serif);padding:12px 34px 6px 0;position:relative}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:'+';position:absolute;right:6px;top:10px;font:400 22px var(--sans);color:var(--red);transition:transform .5s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}.faq p{color:#3d3832;max-width:70ch}
.prose{max-width:720px;padding-top:30px}.prose p{margin:0 0 14px}.prose h2{font:900 24px var(--serif);margin:30px 0 10px}

/* ---------------------------------------------------------------- footer */
.foot{margin-top:90px;color:var(--paper);background:url(/a/foot.webp) center top/max(100%,1600px) 360px no-repeat,linear-gradient(transparent 150px,var(--indigo) 150px);padding:90px 0 40px}
.foot .wrap{display:grid;gap:18px}.foot nav{display:flex;flex-wrap:wrap;gap:6px 18px}.foot nav a{text-decoration:none;opacity:.9}.foot nav a:hover{text-decoration:underline}
.foot .fine{font-size:12.5px;opacity:.7;max-width:70ch}

/* ---------------------------------------------------------------- search + picture viewer */
.search{position:fixed;inset:0;z-index:50;background:#0e1830e6;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:70px 20px 20px;overflow:auto}
.search[hidden]{display:none}.search-in{max-width:640px;margin:0 auto}
.search input{width:100%;padding:16px 22px;border-radius:999px;border:0;font:18px var(--sans);background:var(--paper);color:var(--ink)}
.s-x{position:absolute;top:16px;right:16px;color:var(--paper)}
.results{margin-top:16px;display:grid;gap:6px}.results a{display:block;padding:12px 18px;border-radius:16px;background:#ffffff12;color:var(--paper);text-decoration:none}
.results a:hover,.results a:focus{background:#ffffff26}.results small{display:block;opacity:.7;font-size:12.5px}.results .none{color:var(--paper);opacity:.8;padding:10px}
.hero-search{display:flex;max-width:520px;margin-top:20px;border-radius:999px;background:var(--paper);color:var(--muted);padding:13px 20px;gap:10px;align-items:center;text-decoration:none;font-size:16px;
  box-shadow:0 20px 40px -24px #000c}
.hero-search svg{width:20px;height:20px}
.lb{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%;margin:0;color:var(--paper)}
.lb::backdrop{background:#0b1222e8}
.lb-in{height:100%;display:grid;place-items:center;align-content:center;gap:14px;padding:60px 16px 30px}
.lb img{max-height:72vh;width:auto;border-radius:4.6%/3.3%;box-shadow:0 30px 60px -20px #000}
.lb-t{font:700 19px var(--serif);text-align:center}.lb-d{font-size:13.5px;opacity:.8;text-align:center;max-width:60ch}
.lb-x,.lb-prev,.lb-next{position:fixed;width:48px;height:48px;border-radius:50%;background:#ffffff18;display:grid;place-items:center;font-size:22px}
.lb-x{top:14px;right:14px}.lb-prev{left:12px;top:50%}.lb-next{right:12px;top:50%}
@media (max-width:600px){.lb-prev,.lb-next{top:auto;bottom:16px}}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{
  body{background:#fff}body::after,.sky,.foot,.tools,.chips,.pics-only,.rings,.faq,.pager,.no-print{display:none!important}
  .list-only{display:block!important}.print-head{display:block!important;font:900 22px var(--serif);margin-bottom:8px}
  .tl td{padding:4px}.tl td:first-child::before{content:'\2610  ';}
}
.print-head{display:none}

/* ---------------------------------------------------------------- hero picture (Pokémon artwork, set logo, trainer sprite) */
.hero{position:relative}
.hero-pic{position:absolute;right:6px;top:0;width:min(47vw,215px);z-index:1;pointer-events:none}
.hero-pic img{width:100%;height:auto;filter:drop-shadow(0 18px 22px #0009)}
.hero-pic.logo{top:24px;width:min(50vw,250px)}.hero-pic.logo img{filter:drop-shadow(0 4px 12px #000a)}
.hero-pic.px{width:auto;right:14px}.hero-pic.px img{width:auto;height:min(58vw,250px);image-rendering:pixelated}
.hero-pic.card{width:min(34vw,150px);top:20px;transform:rotate(4deg)}.hero-pic.card img{border-radius:4.6%/3.3%}
h1 .jn{font:400 .6em/1.2 'Yuji Syuku',serif;color:var(--red-l);letter-spacing:0;display:inline-block}
@media (min-width:900px){
  .hero-pic{right:20px;top:-6px;width:330px}.hero-pic.logo{width:360px;top:30px}.hero-pic.px img{height:330px}.hero-pic.card{width:220px}
  .has-pic .ht{padding-right:360px}
}

/* ---------------------------------------------------------------- set tiles: logo on a wash, handwritten red caption */
.stiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:28px 16px;margin-top:16px}
@media (min-width:900px){.stiles{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:36px 26px}}
.stile{display:block;text-decoration:none}
.lg{position:relative;display:grid;place-items:center;aspect-ratio:16/10;padding:10% 9%}
.lg::before{content:'';position:absolute;inset:0;background:url(/a/smear-2.webp) center/100% 100% no-repeat;opacity:.5}
.lg img{position:relative;max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 6px 10px #0003);transition:transform .7s var(--ease)}
.stile:hover .lg img{transform:scale(1.05) rotate(-1deg)}
.nologo::before{background-image:url(/a/smear-3.webp)}.nologo .lj{position:relative;font:400 clamp(17px,4.4vw,23px)/1.3 'Yuji Syuku',serif;text-align:center}
.hw{display:block;font-family:'Zen Kurenaido',sans-serif;color:var(--red);margin-top:8px;line-height:1.3;text-align:center}
.hw b{display:block;font-weight:400;font-size:18px}.hw i{display:block;font-style:normal;font-size:15px}.hw small{display:block;font-size:14.5px;opacity:.85;margin-top:2px}
.stile:hover .hw b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

/* ---------------------------------------------------------------- Pokémon tabs and tiles, trainer tiles */
.tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:16px -20px 0;padding:4px 20px 10px;-webkit-overflow-scrolling:touch}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;padding:8px 15px;border-radius:999px;background:var(--paper2);box-shadow:0 0 0 1px #1514131f;font:500 14px var(--sans);white-space:nowrap;transition:background .5s var(--ease),color .5s var(--ease)}
.tab[aria-selected=true]{background:var(--indigo);color:var(--paper);box-shadow:none}
.tabbed .group:not(.on){display:none}.tabbed .group .bh{display:none}
.pt{display:grid;grid-template-columns:60px 1fr;column-gap:10px;align-items:center}.pt img{grid-row:1/4;width:60px;height:60px;object-fit:contain}
.ttiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:22px 14px;margin-top:16px;text-align:center}
@media (min-width:900px){.ttiles{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}}
.ttile{display:block;text-decoration:none}.spr{position:relative;display:grid;place-items:center;height:150px}
.spr::before{content:'';position:absolute;inset:8% 6%;background:url(/a/enso-ink.webp) center/contain no-repeat;opacity:.16}
.spr img{position:relative;max-height:140px;width:auto;image-rendering:pixelated;transition:transform .6s var(--ease)}.spr.card img{max-height:130px;image-rendering:auto;border-radius:4.6%/3.3%;transform:rotate(-3deg)}
.ttile:hover .spr img{transform:translateY(-4px)}
.ttile .j{display:block;font:17px/1.3 'Yuji Syuku',serif;color:var(--red);margin-top:6px}.ttile b{display:block;font:700 15px var(--serif)}.ttile small{color:var(--muted);font-size:12.5px}
.pt .j{font-size:15.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pt b,.pt small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pt>*{min-width:0}
.ptiles{grid-template-columns:repeat(auto-fill,minmax(148px,1fr))}@media (min-width:900px){.ptiles{grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:12px}}
@media (max-width:899px){.pt{display:block;text-align:center;padding:12px 8px}.pt img{margin:0 auto 4px;width:72px;height:72px}.pt .j,.pt b,.pt small{white-space:normal;overflow:visible}}

/* ---------------------------------------------------------------- painted tabs (Tom: "a stroke of paint, handwritten writing, not modern") */
.tab,.seg button{position:relative;background:none;box-shadow:none;border-radius:0;padding:9px 30px 12px 18px;font:400 18px/1.1 'Kaushan Script',cursive;color:var(--ink);letter-spacing:.01em}
.tab::before,.seg button::before{content:'';position:absolute;inset:-2px -6px -2px -8px;background:url(/a/tab-1.webp) 0 50%/100% 100% no-repeat;opacity:.14;
  transition:opacity .5s var(--ease),transform .6s var(--ease);z-index:-1}
.tab:nth-child(3n+2)::before,.seg button:nth-child(2)::before{background-image:url(/a/tab-2.webp)}.tab:nth-child(3n)::before{background-image:url(/a/tab-3.webp)}
.tab:hover::before,.seg button:hover::before{opacity:.28}
.tab[aria-selected=true],.seg button[aria-pressed=true]{background:none;color:var(--paper)}
.tab[aria-selected=true]::before,.seg button[aria-pressed=true]::before{opacity:1;transform:rotate(-1deg)}
.tab,.seg button{isolation:isolate}
.tabs{gap:4px;padding-top:8px}
.seg{background:none;box-shadow:none;padding:0;gap:2px}
.more{margin-top:14px}.more a{font:400 19px 'Kaushan Script',cursive;color:var(--red);text-decoration:none;background:url(/a/rule-red.webp) 0 100%/100% 8px no-repeat;padding-bottom:6px}

/* ---------------------------------------------------------------- masthead alignment (Tom 2026-10-30): brush name | text | picture, bottoms lined up */
h1 .jn{font-size:.5em;vertical-align:.12em;margin-left:.2em}
@media (min-width:900px){
  .hero{grid-template-columns:auto minmax(0,1fr) auto;column-gap:52px;align-items:end;min-height:440px;padding-top:24px}
  .brush-col{grid-column:1;grid-row:1;align-self:end;padding:0 0 18px}
  .ht{grid-column:2;grid-row:1;align-self:end;padding:0 0 22px}
  .has-pic .ht{padding-right:0}
  .hero-pic,.hero-pic.logo,.hero-pic.card{position:relative;right:auto;top:auto;grid-column:3;grid-row:1;align-self:end;width:300px;margin:0 0 18px;transform:none}
  .hero-pic.logo{width:330px;align-self:center}.hero-pic.card{width:210px;transform:rotate(4deg)}
  .hero-pic.px{width:auto}.hero-pic.px img{height:300px}
}
@media (max-width:899px){.ht{padding-top:14px}}
@media (min-width:900px){h1{font-size:clamp(36px,4.2vw,50px)}}

/* ---------------------------------------------------------------- item doodles (watercolour, Tom 2026-10-30) */
.bhw{position:relative}.bhw>.bh{max-width:calc(100% - 92px)}
.dd{position:absolute;right:0;bottom:-10px;width:clamp(62px,16vw,96px);height:auto;transform:rotate(var(--r,0deg));pointer-events:none;
  filter:drop-shadow(0 6px 8px #15141318);transition:transform .8s var(--ease)}
@media (min-width:900px){.bhw>.dd{right:4%}}
.foot{position:relative}.dd-foot{top:44px;bottom:auto;right:max(16px,7%);width:clamp(70px,18vw,110px);z-index:1}
.tabbed .group .bhw>.dd{display:none}
.bhw>.bh{max-width:calc(100% - 104px)}.dd{width:clamp(80px,21vw,120px)}.dd-foot{width:clamp(86px,22vw,130px);top:30px}

/* ---------------------------------------------------------------- "in numbers" boards: washi notes in a swipeable row */
.board{position:relative;margin:6px -20px 0}
.board .hint{padding:0 20px;font:400 16px 'Kaushan Script',cursive;color:var(--red);opacity:.85}.h-mouse{display:none}@media (hover:hover){.h-touch{display:none}.h-mouse{display:inline}}
.track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 20px 26px;scrollbar-width:none;cursor:grab;-webkit-overflow-scrolling:touch}
.track::-webkit-scrollbar{display:none}.track.drag{cursor:grabbing;scroll-snap-type:none}.track.drag *{pointer-events:none}
.nt{flex:none;width:min(84vw,var(--w,360px));scroll-snap-align:start;background:var(--paper2);border-radius:5px;padding:18px 18px 16px;position:relative;
  box-shadow:0 0 0 1px #1514131a,0 22px 30px -26px #000a;background-image:url(/a/paper.webp);background-size:900px}
.nt::before{content:'';position:absolute;right:14px;top:14px;width:22px;height:22px;background:url(/a/seal-red.webp) center/contain no-repeat;opacity:.85;transform:rotate(-6deg)}
.w4{--w:300px}.w5{--w:350px}.w6{--w:390px}.w7{--w:430px}.w8{--w:500px}.w12{--w:640px}
.nt h3{font:700 18px/1.25 var(--serif);margin:0 30px 4px 0;padding-bottom:6px;background:url(/a/rule-red.webp) 0 100%/120px 7px no-repeat}
.nt .sub{font-size:13px;color:var(--muted);margin:6px 0 12px}
.nt .scrib{font:400 16px/1.3 'Zen Kurenaido',sans-serif;color:var(--red);margin-top:12px;transform:rotate(-1deg)}
.bars{display:grid;gap:7px}.br{display:grid;grid-template-columns:minmax(0,42%) 1fr auto;align-items:center;gap:8px;font-size:13px}
.br .lab{display:flex;align-items:center;gap:6px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.br .lab>span:last-child{overflow:hidden;text-overflow:ellipsis}
.br .trk{height:15px;position:relative}.br .trk i{position:absolute;left:0;top:0;bottom:0;background:url(/a/bar-indigo.webp) 0 50%/100% 100% no-repeat}
.br .trk i.red{background-image:url(/a/bar-red.webp)}.br .trk i.ink{background-image:url(/a/bar-ink.webp)}
.br b{font:700 13px var(--serif);min-width:22px;text-align:right}.br.me .lab{font-weight:700;color:var(--red)}
.br .rc{display:inline-block;min-width:34px;text-align:center;font:700 10.5px/1 var(--sans);padding:3px 4px;border-radius:3px;background:#1d2f5214;color:var(--indigo)}
.cols{display:flex;align-items:flex-end;gap:5px;height:170px;padding-top:6px}.cl{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;min-width:0}
.cl b{font:700 11px var(--serif);height:15px}.cl .trk{flex:1;width:100%;max-width:26px;position:relative}
.cl .trk i{position:absolute;left:0;right:0;bottom:0;background:url(/a/col-indigo.webp) 50% 100%/100% 100% no-repeat}
.cl small{font-size:10.5px;color:var(--muted);margin-top:4px;text-align:center;line-height:1.15}.cl small em{display:block;font-style:normal;font-size:9px}
.cols.many .cl b{font-size:0}.cols.many .cl small{font-size:9px}
.big{display:grid;grid-template-columns:1fr 1fr;gap:14px 10px;margin-top:10px}.big b{display:block;font:900 30px/1 var(--serif)}.big span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:12px 8px;margin-top:6px}.mon{text-decoration:none;text-align:center;font-size:12px}
.mon .ring{display:grid;place-items:center;aspect-ratio:1;background:url(/a/enso-ink.webp) center/contain no-repeat;padding:16%}
.mon:nth-child(2n) .ring{background-image:url(/a/enso-red.webp)}.mon:nth-child(3n) .ring{background-image:url(/a/enso-indigo.webp)}
.mon img{width:100%;height:auto;object-fit:contain}.mon b{display:block;font:700 13px var(--serif);margin-top:2px}.mon small{color:var(--muted)}
.tseal{display:inline-grid;place-items:center;width:22px;height:22px;flex:none;border-radius:3px;background:var(--c);color:#fff;font:400 14px/1 'Yuji Syuku',serif;
  transform:rotate(-4deg);box-shadow:inset 0 0 0 1.5px #ffffff55}
.tl .opt .tseal{width:24px;height:24px;font-size:15px}
@media (max-width:600px){.tl .opt{display:none}}
.about p{color:#3d3832}

/* ---------------------------------------------------------------- painted download button + its sheet */
.dlbtn{position:fixed;right:14px;bottom:16px;z-index:35;padding:16px 34px 18px 26px;background:url(/a/dl-btn.webp) 0 50%/100% 100% no-repeat;color:var(--paper);
  font:400 19px/1 'Kaushan Script',cursive;filter:drop-shadow(0 10px 14px #0005);transition:transform .5s var(--ease)}
.dlbtn:hover{transform:translateY(-2px) rotate(-1deg)}.dlbtn:active{transform:scale(.97)}
.dlsheet{position:fixed;inset:0;z-index:55;background:#0e1830cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;place-items:end center;padding:16px}
.dlsheet[hidden]{display:none}
.dlbox{width:min(460px,100%);background:var(--paper) url(/a/paper.webp) 0 0/900px;border-radius:8px;padding:22px 20px 18px;box-shadow:0 30px 60px -20px #000c}
@media (min-width:700px){.dlsheet{place-items:center}}
.dlbox h3{font:700 21px var(--serif);margin-bottom:4px}.dlbox>p{font-size:13.5px;color:var(--muted);margin-bottom:12px}
.dlbox .opt{display:block;width:100%;text-align:left;padding:13px 16px;border-radius:6px;margin-top:8px;background:var(--paper2);box-shadow:0 0 0 1px #1514131f}
.dlbox .opt:hover{box-shadow:0 0 0 1.5px var(--red)}.dlbox .opt b{display:block;font:700 16px var(--serif)}.dlbox .opt small{color:var(--muted);font-size:12.5px}
.dlbox .row{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:13px}.dlbox .x{margin-left:auto;font:400 17px 'Kaushan Script',cursive;color:var(--red)}
.dlbox .busy{margin-top:12px;font:400 15px 'Zen Kurenaido',sans-serif;color:var(--red)}
@media print{.dlbtn,.dlsheet{display:none!important}}
.track{align-items:flex-start}
@media (max-width:600px){.dlbtn{font-size:16px;padding:13px 28px 15px 20px;right:10px;bottom:12px}}
.cl .trk i{background-size:100% 150px;background-position:50% 0}
.howto{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:12px}.howto .nt{width:auto}

/* ================================================================ centred page top (Tom 2026-10-30): moon in the middle, subject on it,
   the Japanese word painted behind, text centred below. Plain skies (no moon) so the painted moon can sit exactly in the middle. */
.sky{background:url(/a/sky-plain-1.webp) 50% 100%/cover no-repeat;padding-bottom:70px}.sky.s2{background-image:url(/a/sky-plain-2.webp)}.sky.s3{background-image:url(/a/sky-plain-3.webp)}
.mast{max-width:1160px;margin:0 auto;padding:0 20px;text-align:center}
.stage{position:relative;height:330px;margin:0 -20px;overflow:visible}
.stage .moon{position:absolute;left:50%;top:0;width:290px;height:auto;transform:translateX(-50%)}
.stage .word{position:absolute;left:0;right:0;top:186px;margin:0;text-align:center;white-space:nowrap;z-index:1;color:var(--paper);
  font:400 min(76px, calc(340px / var(--n)))/1 var(--brush);-webkit-text-stroke:.03em var(--paper);-webkit-mask-image:url(/a/mask.webp);mask-image:url(/a/mask.webp);
  -webkit-mask-size:260px;mask-size:260px;filter:drop-shadow(0 0 1.5px #f1eadb88)}
.stage .subj{position:absolute;left:50%;transform:translateX(-50%);z-index:2;filter:drop-shadow(0 18px 22px #000a)}
.stage.art .subj{width:215px;height:auto;top:-4px}
.stage.sprite .subj{height:175px;width:auto;top:58px;image-rendering:pixelated}
.stage.card .subj{width:140px;top:22px;border-radius:4.6%/3.3%;transform:translateX(-50%) rotate(4deg)}
.stage.plain .word{top:145px;transform:translateY(-50%);font-size:min(150px, calc(280px / var(--n)))}
.stage.plain .cap{position:absolute;left:0;right:0;top:298px;margin:0}
.stage.set{height:370px}.stage.set .moon{width:300px;top:-6px}
.fan{position:absolute;left:50%;top:6px;width:300px;height:210px;transform:translateX(-50%);z-index:2}
.fan img{position:absolute;width:112px;height:auto;border-radius:4.6%/3.3%;box-shadow:0 16px 22px -10px #000c}
.fan .f1{left:0;top:26px;transform:rotate(-13deg)}.fan .f3{right:0;top:26px;transform:rotate(13deg)}.fan .f2{left:50%;top:0;width:120px;transform:translateX(-50%);z-index:2}
.stage.set .slogo{position:absolute;left:50%;top:200px;width:min(300px,82vw);height:auto;transform:translateX(-50%);z-index:3;filter:drop-shadow(0 8px 14px #000a)}
.stage.set .word{top:222px;z-index:3}
.mtxt{max-width:780px;margin:0 auto}.mtxt h1{text-wrap:balance}.mtxt h1 .jn{display:block;font-size:.52em;margin:6px 0 0;vertical-align:baseline}
.mtxt .lede{margin:12px auto 0;max-width:640px}.mtxt .hero-search{margin:20px auto 0}
@media (min-width:900px){
  .sky{padding-bottom:84px}
  .stage{height:400px}.stage .moon{width:420px;top:-22px}
  .stage .word{top:218px;font-size:min(108px, calc(640px / var(--n)))}
  .stage.art .subj{width:300px;top:-2px}.stage.sprite .subj{height:230px;top:44px}.stage.card .subj{width:190px}
  .stage.plain .word{top:170px;font-size:min(200px, calc(420px / var(--n)))}.stage.plain .cap{top:360px}
  .stage.set{height:470px}.stage.set .moon{width:520px;top:-96px}
  .fan{width:470px;height:270px;top:10px}.fan img{width:176px}.fan .f2{width:186px}
  .stage.set .slogo{top:262px;width:430px}.stage.set .word{top:300px}
}

/* ---------------------------------------------------------------- the boards on little scrolls: parchment with wooden rods, both level */
.nt{background:url(/a/parch-scroll.webp) center/100% 100% no-repeat;box-shadow:none;border-radius:0;padding:34px 24px 26px;margin:14px 0 12px;
  filter:drop-shadow(0 14px 14px #0002)}
.nt::before,.nt::after{content:'';position:absolute;left:-12px;right:-12px;width:auto;height:14px;border-radius:7px;opacity:1;transform:none;
  background:linear-gradient(#7a5232,#3a2414 60%,#5e3d24);box-shadow:0 3px 5px #0005}
.nt::before{top:-7px}.nt::after{bottom:-7px;top:auto}
.nt h3{color:#3b2a16}.nt .sub{color:#6e5a3e}
.howto .nt{margin-top:14px}

/* rarity jump links: one swipeable row instead of a stack (Tom 2026-10-30) */
.jumps{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;margin:16px -20px 0;padding:4px 20px 12px;scrollbar-width:none;cursor:grab;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 40px),transparent)}
.jumps::-webkit-scrollbar{display:none}.jumps .chip{flex:none;scroll-snap-align:start;white-space:nowrap}
.jumps.drag{cursor:grabbing;scroll-snap-type:none}

/* ---------------------------------------------------------------- the visit-counting question (consent.js): a little scroll, painted buttons */
#jpc-ask{position:fixed;left:12px;bottom:14px;z-index:58;width:min(400px,calc(100% - 24px));background:url(/a/parch-scroll.webp) center/100% 100% no-repeat;
  padding:30px 24px 22px;color:#3b2a16;filter:drop-shadow(0 18px 22px #0007);font-size:14px;line-height:1.5}
#jpc-ask b{display:block;font:700 17px/1.3 var(--serif);margin-bottom:4px}#jpc-ask a{color:var(--red)}
#jpc-ask .ask-b{display:flex;justify-content:flex-end;gap:6px;margin-top:12px;flex-wrap:wrap}
#jpc-ask button{position:relative;isolation:isolate;padding:9px 22px 11px 16px;font:400 17px/1.1 'Kaushan Script',cursive;color:var(--ink)}
#jpc-ask button::before{content:'';position:absolute;inset:-2px -6px -2px -8px;z-index:-1;background:url(/a/tab-2.webp) 0 50%/100% 100% no-repeat;opacity:.2}
#jpc-ask button.yes{color:var(--paper)}#jpc-ask button.yes::before{background-image:url(/a/tab-1.webp);opacity:1;transform:rotate(-1deg)}
#jpc-ask button:hover::before{opacity:.35}#jpc-ask button.yes:hover::before{opacity:1;transform:rotate(1deg)}
@media print{#jpc-ask{display:none!important}}