/* r1 案「特別公演の券」
 * 主役：入場券。借りた作りは、劇場やコンサートの特別公演の券（絵柄入りの記念チケット）と、劇場の定期会員券。
 *  - 足したインクは1色だけ：RISO の Fluorescent Pink（蛍光ピンク）。プレミアムの物（券、棚、会員の入口）にだけ使う。
 *  - 箔は「平らな1色・紙の粒子が乗らない・版ズレしない」で描く。まわりの小さな刷り（PLAYROOM の字）はハブのロゴと同じく版ズレさせる。
 *  - 1枚の券に使う作りは3つまで。公演の券＝箔の公演名、もぎりのミシン目、半券の地紋。会員の券＝箔、もぎり、日付印。 */
:root{
  --pink:#ff48b0;          /* RISO Fluorescent Pink。足したインク */
  --pink-ink:#e0318f;      /* 蛍光ピンクの細い字（12〜14px）を紙の上で読める濃さにしたもの。同じインクの濃い刷り */
  --pink-pale:#ffd6ec;     /* 地紋（蛍光ピンクを網で淡く刷ったもの） */
  --stock:#fffbf2;         /* 券の紙（厚手の白いカード） */
  --edge:#e2d3ad;          /* 厚紙の縁 */
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.16'/%3E%3C/svg%3E");
  --jimon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22'%3E%3Cpath d='M3 2.5l5 3.5-5 3.5z' fill='%23ffc4e2'/%3E%3Cpath d='M14 13.5l5 3.5-5 3.5z' fill='%23ffc4e2'/%3E%3C/svg%3E");
}
/* 紙の粒子：ハブは画面全体に重ねているが、それだと箔の上にも粒子が乗る。紙の面にだけ敷く */
body::after{display:none}
body{background-color:var(--paper);background-image:var(--grain);background-blend-mode:multiply}

/* ---------- 版ズレの小さな刷り（ハブのロゴと同じ。朱を右下、藍を左上） ---------- */
.riso{font-family:"Archivo Black",sans-serif;font-weight:400;color:var(--ink);text-shadow:1.2px 1.2px 0 var(--vermilion),-1px -.8px 0 var(--indigo);letter-spacing:.02em}
/* 箔：平らな1色。影も版ズレもない。紙の粒子（背景）の上に乗るので粒子が見えない */
.foil{font-family:"Archivo Black",sans-serif;font-weight:400;color:var(--pink);letter-spacing:.01em;line-height:1;text-shadow:none}

/* ===================== 公演の券（ゲーム1つにつき1枚） ===================== */
.ev{--hole:var(--paper);position:relative;display:flex;flex-direction:column;color:var(--ink);font-family:var(--jp);text-align:left;
  background:var(--stock) var(--grain);background-blend-mode:multiply;border:2px solid var(--ink);border-radius:6px;
  box-shadow:2px 3px 0 0 var(--edge),2px 3px 0 1.5px var(--ink)}
.ev-pic{border-bottom:2px solid var(--ink);border-radius:4px 4px 0 0;overflow:hidden;aspect-ratio:1200/630;background:var(--paper-3)}
.ev-pic img{display:block;width:100%;height:100%;object-fit:cover}
.ev-main{padding:12px 16px 14px;display:flex;flex-direction:column;gap:6px}
.ev-kind{display:flex;align-items:baseline;gap:10px;font-size:12px;font-weight:700;color:var(--ink-soft);letter-spacing:.02em}
.ev-kind .riso{font-size:12px}
.ev h3.foil{font-size:36px;margin:2px 0 0}
.ev-who{font-family:"Space Mono",monospace;font-size:12.5px;color:var(--ink);font-weight:700}
.ev-d{font-size:14px;line-height:1.7;font-weight:500;color:var(--ink);text-wrap:pretty;word-break:auto-phrase}
/* もぎり：ミシン目で本体と分かれる。上の両端に刻みの半円 */
.ev-stub{position:relative;border-top:2px dotted var(--ink);padding:10px 16px 11px;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:56px;
  background:var(--jimon) 0 0/22px 22px;border-radius:0 0 4px 4px}
.ev-stub::before,.ev-stub::after{content:"";position:absolute;top:-10px;width:18px;height:18px;border-radius:50%;background:var(--hole);border:2px solid var(--ink);box-sizing:border-box}
.ev-stub::before{left:-10px;clip-path:inset(0 0 0 50%)}
.ev-stub::after{right:-10px;clip-path:inset(0 50% 0 0)}
.ev-stub .seat{display:flex;flex-direction:column;line-height:1.35}
.ev-stub .seat .k{font-size:12px;font-weight:700;color:var(--pink-ink)}
.ev-stub .seat b{font-size:14px;font-weight:700;background:var(--stock);padding:0 2px;margin-left:-2px}
.ev-stub .more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap}
.ev-stub .more span{border-bottom:2px solid var(--pink);padding-bottom:1px;background:var(--stock)}
.ev-stub .more svg{width:15px;height:15px}
a.ev:hover{transform:translate(-1px,-1px)}

/* 会員の券を持っている人の公演の券：もぎりに日付印、部屋を作るボタン */
.ev-stub.own{justify-content:flex-start;gap:12px}
.ev-stub.own .pushbtn{margin-left:auto;min-height:46px;padding:0 14px;font-size:14.5px;background:#FFF;}

/* ===================== 日付印（蛍光ピンクのインク） ===================== */
.dater.pk{--stamp:var(--pink-ink);border-color:var(--pink-ink);color:var(--pink-ink);background:transparent}
.dater.pk b{border-color:var(--pink-ink)}

/* ===================== TOP の棚：特別公演の掲示 ===================== */
.bill{margin:22px 0 0;padding:0!important;scroll-margin-top:84px;text-align:left}
.bill-band{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--pink);color:var(--ink);
  border:2px solid var(--ink);border-radius:6px;padding:12px 16px;position:relative}
.bill-band h2{font-family:var(--jp);font-weight:800;font-size:22px;line-height:1.3;letter-spacing:.01em}
.bill-band .fare{font-size:14px;font-weight:700;white-space:nowrap;background:var(--stock);border:2px solid var(--ink);border-radius:4px;padding:2px 8px}
.bill-band .kick{display:block;font-size:12px;font-weight:700;letter-spacing:.04em;margin-bottom:2px}
.bill-lede{font-size:15px;font-weight:600;line-height:1.75;margin:14px 2px 18px;color:var(--ink);text-wrap:pretty;word-break:auto-phrase}
.bill-grid{display:grid;grid-template-columns:1fr;gap:22px}
@media(min-width:720px){.bill-grid{grid-template-columns:1fr 1fr;gap:26px}.bill-band h2{font-size:26px}.bill-band{padding:14px 22px}}
.bill-foot{margin-top:22px;display:flex;flex-direction:column;gap:10px}
.bill-foot .free{font-size:15px;font-weight:700;border-top:3px double var(--ink);border-bottom:3px double var(--ink);padding:10px 2px}
.bill-foot .row{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center}
.bill-foot .note{font-size:13.5px;font-weight:500;line-height:1.7}
@media(min-width:720px){.bill-foot{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.bill-foot .free{flex:1 1 100%}}

/* 無料の一覧の見出し */
.free-head{margin:56px 0 0!important;align-items:center}
.free-head .jp{font-family:var(--jp)!important;font-weight:800!important}
.free-head + .decks{margin-top:22px}

/* ===================== ヘッダーの会員の入口（小さな券。半券だけ蛍光ピンク） ===================== */
nav.top a.mem .tkt i{background:var(--pink);width:7px}
nav.top a.mem .tkt{background:var(--stock)}
nav.top a.mem.in .tkt{background:var(--stock);color:var(--ink)}
nav.top a.mem.in .tkt > span{flex-direction:column;align-items:flex-start;justify-content:center;gap:0;line-height:1.1}
nav.top a.mem.in .tkt .l2{font-size:12px;font-weight:700;color:var(--pink-ink)}
nav.top a.mem.in .tkt .l1{font-size:12px}
@media(min-width:720px){nav.top a.mem.in .tkt > span{flex-direction:row;align-items:center;gap:2px}nav.top a.mem.in .tkt .l1,nav.top a.mem.in .tkt .l2{font-size:13px}}

/* ===================== 押せる物 ===================== */
.pushbtn.tix{background:var(--stock);padding-left:0;overflow:hidden;gap:0}
.pushbtn.tix i{align-self:stretch;width:10px;background:var(--pink);border-right:2px dotted var(--ink);margin-right:16px}
.pushbtn.tix svg{margin-left:10px}

/* ===================== P3 ゲームの紹介のページ ===================== */
.gp{max-width:640px;margin:0 auto;padding:18px 16px 44px;font-family:var(--jp)}
.gp .ev h3.foil{font-size:44px}
.gp .ev-d{font-size:15px}
.gp h2{font-size:20px;font-weight:800;line-height:1.45;margin:30px 0 12px;display:flex;align-items:center;gap:10px}
.gp h2 .ln{flex:1;border-top:2px dashed var(--ink)}
.how{list-style:none;display:flex;flex-direction:column;gap:14px;counter-reset:s}
.how li{display:grid;grid-template-columns:118px 1fr;gap:14px;align-items:center}
.how .ph{border:2px solid var(--ink);border-radius:12px;overflow:hidden;aspect-ratio:390/500;background:#fff;box-shadow:2px 3px 0 var(--edge)}
.how .ph img{display:block;width:100%;height:auto}
.how .tx{display:flex;flex-direction:column;gap:4px}
.how .n{font-family:"Archivo Black",sans-serif;font-size:22px;line-height:1;color:var(--pink-ink)}
.how .tx p{font-size:16px;font-weight:700;line-height:1.6;text-wrap:pretty;word-break:auto-phrase}
.how .tx small{font-size:12.5px;color:var(--ink-soft);font-weight:500}
.cap2{font-size:13px;color:var(--ink-soft);font-weight:500;margin-top:10px}
.join{margin-top:30px;border:2px solid var(--ink);border-radius:8px;background:var(--stock) var(--grain);background-blend-mode:multiply;padding:0 0 16px;scroll-margin-top:80px;overflow:hidden}
.join-band{background:var(--pink);border-bottom:2px solid var(--ink);padding:12px 16px}
.join-band b{display:block;font-size:18px;font-weight:800;line-height:1.45;text-wrap:pretty;word-break:auto-phrase}
.join .in{padding:14px 16px 0;display:flex;flex-direction:column;gap:10px}
.join p{font-size:15px;font-weight:500;line-height:1.75;text-wrap:pretty;word-break:auto-phrase}
.join .guest{font-weight:700;padding:10px 12px;border:1.5px dashed var(--ink-soft);border-radius:6px;background:var(--paper)}
.join .money{font-size:16px;font-weight:700}
.join .pushbtn{width:100%;justify-content:flex-start;min-height:54px;font-size:16px}
.join .pushbtn span{flex:1}
.join .why{font-size:13.5px;font-weight:500;color:var(--ink);margin-top:-2px}
.join .backs{display:flex;flex-wrap:wrap;gap:0 22px}
.gp .other{margin-top:26px;font-size:14px;font-weight:700}

/* ===================== ポップアップ（P4a） ===================== */
.pop.ad{padding:10px 12px 12px;max-width:440px}
.pop.ad .ad-lead{font-size:15px;font-weight:700;line-height:1.5;margin:8px 2px 0;text-wrap:pretty;word-break:auto-phrase}
.pop.ad .ad-lead em{font-style:normal;color:var(--pink-ink)}
.minis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.mini{background:var(--stock) var(--grain);background-blend-mode:multiply;border:2px solid var(--ink);border-radius:5px;overflow:hidden;box-shadow:2px 2px 0 var(--edge)}
.mini img{display:block;width:100%;aspect-ratio:1200/630;object-fit:cover;border-bottom:2px dotted var(--ink)}
.mini .nm{display:flex;align-items:baseline;justify-content:space-between;gap:4px;padding:4px 7px 5px;background:var(--jimon) 0 0/22px 22px}
.mini .nm .foil{font-size:15px}
.mini .nm small{font-size:12px;font-weight:700;color:var(--ink);background:var(--stock)}
.pop.ad .s3-act{margin-top:10px}
.pop.ad .s3-act .go{background:var(--stock);color:var(--ink);padding-left:0;overflow:hidden}
.pop.ad .s3-act .go i{align-self:stretch;width:9px;background:var(--pink);border-right:2px dotted var(--ink);margin-right:2px;flex:none}
.pop.ad .s3-act .go span{flex:1}
@media(max-height:700px){
  .pop.ad{padding:7px 10px 9px}
  .pop.ad .ad-lead{font-size:14px;margin-top:5px}
  .minis{gap:8px;margin-top:6px}
  .mini img{aspect-ratio:1200/520}
  .pop.ad .s3-act{margin-top:7px}
}

/* ===================== P4b 結果の下の控えめな紹介 ===================== */
.pr-note{border:1.5px solid rgba(43,38,34,.55);border-radius:10px;background:rgba(255,251,242,.92);padding:8px 10px 6px;font-family:var(--jp);color:var(--ink)}
.pr-note p{font-size:13px;font-weight:600;line-height:1.55;text-wrap:pretty;word-break:auto-phrase}
.pr-note .r{display:flex;align-items:center;gap:8px;margin-top:5px}
.pr-note .th{display:flex;align-items:center;gap:6px}
.pr-note .th span{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.pr-note .th img{height:40px;aspect-ratio:1200/630;object-fit:cover;border:1.5px solid var(--ink);border-radius:3px;display:block}
.pr-note .th .foil{font-size:12px;line-height:1.35}
.pr-note .textlink{margin-left:auto;font-size:13px;min-height:44px}

/* ===================== P5 参加者 ===================== */
.rstub .dater{mix-blend-mode:multiply}
.rstub p .g{font-family:"Archivo Black",sans-serif;font-weight:400;color:var(--pink-ink);letter-spacing:.01em}
.rstub{background-image:linear-gradient(#fff,#fff)}
.keep .kstub .dater{border-color:var(--pink-ink);color:var(--pink-ink)}

/* ===================== P6 会員の券（定期会員券の作り） ===================== */
.ss{--hole:var(--paper);position:relative;display:grid;grid-template-columns:1fr 92px;color:var(--ink);font-family:var(--jp);text-align:left;
  background:var(--stock) var(--grain);background-blend-mode:multiply;border:2px solid var(--ink);border-radius:6px;
  box-shadow:2px 3px 0 0 var(--edge),2px 3px 0 1.5px var(--ink)}
.ss-main{padding:12px 12px 12px 14px;min-width:0;display:flex;flex-direction:column;gap:8px}
.ss-kind{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ss-kind .riso{font-size:13px}
.ss-kind b{font-size:17px;font-weight:800}
.ss-kind .fare{margin-left:auto;font-size:12px;font-weight:700;white-space:nowrap}
.ss-games{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ss-games div{display:flex;flex-direction:column;gap:3px;min-width:0}
.ss-games img{display:block;width:100%;aspect-ratio:1200/630;object-fit:cover;border:1.5px solid var(--ink);border-radius:3px}
.ss-games .nm{font-family:"Archivo Black",sans-serif;font-size:15px;line-height:1.1}
.ss-games .nm.plain{color:var(--ink);opacity:.9}
.ss-rows .tk-f{border-top-color:var(--ink-soft)}
.ss-rows .tk-f .k{color:var(--ink);border-right-color:var(--ink-soft)}
.ss-stub{position:relative;border-left:2px dotted var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:10px 4px;text-align:center}
.ss-stub::before,.ss-stub::after{content:"";position:absolute;left:-10px;width:18px;height:18px;border-radius:50%;background:var(--hole);border:2px solid var(--ink);box-sizing:border-box}
.ss-stub::before{top:-10px;clip-path:inset(50% 0 0 0)}
.ss-stub::after{bottom:-10px;clip-path:inset(0 0 50% 0)}
.ss-stub .s{font-size:12px;font-weight:700;line-height:1.35}
.ss .dater.blank{width:72px;height:72px}
.ss-line{font-size:14px;font-weight:700;line-height:1.5;border-top:1.5px dotted var(--ink-soft);padding-top:6px}
.ss .void{border:2px solid var(--vermilion);color:var(--vermilion);font-size:13px;font-weight:700;padding:1px 5px;border-radius:3px;transform:rotate(-8deg);mix-blend-mode:multiply;white-space:nowrap}
.ss.sm .ss-games img{display:none}
.ss.sm .ss-games{display:flex;gap:6px 14px;flex-wrap:wrap}
.ss.sm .ss-games .nm{font-size:18px}

/* 受け取った瞬間：券が袋から出ている。動きは「箔を押す」「印を押す」の1回だけ（0.3秒） */
.got{position:relative;padding:6px 6px 0}
.got .env{position:relative;margin:-36px -6px 0;height:64px;background:var(--pink);border:2px solid var(--ink);border-radius:4px 4px 8px 8px;display:flex;align-items:flex-end;justify-content:space-between;padding:0 14px 10px;z-index:2}
.got .env::before{content:"";position:absolute;left:-2px;right:-2px;top:-2px;height:14px;border-bottom:2px solid var(--ink);background:var(--pink);border-radius:4px 4px 0 0;clip-path:polygon(0 0,100% 0,100% 100%,52% 100%,50% 60%,48% 100%,0 100%)}
.got .env .riso{font-size:14px;position:relative}
.got .env small{font-size:12px;font-weight:700;position:relative}
.got .ss{z-index:1}
@keyframes press{0%{transform:scale(1.06);opacity:.2}100%{transform:none;opacity:1}}
@keyframes stamp{0%{transform:rotate(-9deg) scale(1.35);opacity:0}100%{transform:rotate(-9deg) scale(1);opacity:1}}
.got .ss-games .foil{animation:press .3s ease-out both}
.got .dater{animation:stamp .25s ease-out .1s both}
@media(prefers-reduced-motion:reduce){.got .ss-games .foil,.got .dater{animation:none}}
.done-h{font-size:24px!important;margin-top:20px!important}
.pg .row2{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
.pg .row2 .pushbtn{width:100%;justify-content:space-between;font-size:15.5px}

/* 細かい直し */
.mem-text p,.pop p,.pg p,.terms dd{text-wrap:pretty;word-break:auto-phrase}
@media(max-width:420px){.ss{grid-template-columns:1fr 84px}.ss-kind b{font-size:16px}}

/* ---------- 直し1：PC では公演の券を横長にする（絵｜本文｜もぎり）。カードではなく券に見えるように ---------- */
@media(min-width:820px){
  .bill-grid{grid-template-columns:1fr;gap:22px}
  .bill .ev{display:grid;grid-template-columns:400px 1fr 200px}
  .bill .ev-pic{border-bottom:0;box-shadow:2px 0 0 var(--ink);position:relative;z-index:1;border-radius:4px 0 0 4px;aspect-ratio:auto;height:100%}
  .bill .ev-main{justify-content:center;padding:16px 22px}
  .bill .ev-stub{border-top:0;border-left:2px dotted var(--ink);flex-direction:column;align-items:flex-start;justify-content:center;border-radius:0 4px 4px 0;padding:14px 18px}
  .bill .ev-stub::before{top:-10px;left:-10px;clip-path:inset(50% 0 0 0)}
  .bill .ev-stub::after{top:auto;bottom:-10px;right:auto;left:-10px;clip-path:inset(0 0 50% 0)}
  .bill .ev-stub.own .pushbtn{margin-left:0}
}
/* ---------- 直し2：料金は帯の中に、押せる物に見えない平らな字で ---------- */
.bill-band .fare{background:none;border:0;padding:0;font-size:15px}
@media(max-width:719px){.bill-band{flex-direction:column;align-items:flex-start;gap:2px}}
/* ---------- 直し3：小さい PLAYROOM の版ズレは朱の1版だけ（12px で2版ずらすと、にじみに見える） ---------- */
.riso{text-shadow:1px 1px 0 var(--vermilion)}
.ev-kind .riso{font-size:13px}

/* ---------- 直し4：P4a を 390×844 でも 375×667 でも画面の35%以内に。操作の帯の上の端より上に置く ---------- */
.mini img{aspect-ratio:1200/540}
.pop.ad .ad-lead{margin-top:6px}
.pop.ad .s3-act .go,.pop.ad .s3-act .x{min-height:46px}
@media(max-height:700px){
  .mini img{aspect-ratio:1200/440}
  .mini .nm{padding:3px 7px 4px}
  .pop.ad .ad-lead{font-size:13.5px;line-height:1.45}
  .pop.ad .s3-act .go,.pop.ad .s3-act .x{min-height:44px}
}
/* P4b：全員に見えるので静かに。表のすぐ下に置き、操作の帯から離す */
.pr-note .r{justify-content:flex-start}
.pr-note .th img{height:38px}
.pr-note .textlink{white-space:nowrap}
/* アンカーで飛んだとき、見出しがヘッダーの下に隠れないように */
#how,#join,#terms,#end,#acts{scroll-margin-top:84px}
#decks{scroll-margin-top:150px}
.how li{grid-template-columns:136px 1fr}

/* ---------- 直し5：受け取った直後の袋。券の下の端だけが袋に入っていて、袋の口には指をかける半円の切り欠き ---------- */
.got .ss-main{padding-bottom:46px}
.got .ss-stub{padding-bottom:40px}
.got .env{margin:-40px -6px 0;height:62px;border-radius:2px 2px 8px 8px;align-items:flex-end;padding:0 14px 9px;
  -webkit-mask:radial-gradient(circle 20px at 50% 0,transparent 19.5px,#000 20px);mask:radial-gradient(circle 20px at 50% 0,transparent 19.5px,#000 20px)}
.got .env::before{content:"";position:absolute;left:50%;top:-22px;width:44px;height:44px;margin-left:-22px;border:2px solid var(--ink);border-radius:50%;background:none;clip-path:inset(50% 0 0 0);box-sizing:border-box}
@media(min-width:820px){
  .bill .ev{grid-template-columns:380px 1fr 250px}
  .bill .ev-stub.own .pushbtn{max-width:100%;padding:0 12px;font-size:14px}
}

/* =====================================================================
 * v2（r2・r3 の批評を受けて）
 * ===================================================================== */
:root{
  --pink-deep:#b3206c;  /* 箔を押した縁。熱と圧で紙が少しへこみ、箔の下の辺だけ濃く見える。平らな1色で、ぼかさない */
  /* 地紋：三角（r3 と同じ形だった）をやめ、PLAYROOM の字を小さく並べた刷りにする。JR のきっぷの「JR」と同じ考え方 */
  --jimon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='20'%3E%3Cg font-family='Arial Black,Arial,sans-serif' font-weight='900' font-size='6.4' fill='%23ffdcee' letter-spacing='.5'%3E%3Ctext x='1' y='7'%3EPLAYROOM%3C/text%3E%3Ctext x='45' y='17'%3EPLAYROOM%3C/text%3E%3C/g%3E%3C/svg%3E");
}
/* 箔：ピンクの平らな面に、下の辺だけ押した縁。帯もリンクの下線もピンクにしないので、券の上でピンクの字は箔だけになる */
.foil{text-shadow:0 1.5px 0 var(--pink-deep)}
.mini .foil{text-shadow:0 1px 0 var(--pink-deep)}

/* ---------- 公演の券：スマホでも横長の券（絵と本文｜縦のもぎり） ---------- */
.ev{display:grid;grid-template-columns:minmax(0,1fr) 64px;grid-template-areas:"pic stub" "main stub"}
.ev-pic{grid-area:pic;border-radius:4px 0 0 0}
.ev-main{grid-area:main;padding:10px 14px 12px;gap:5px;min-width:0}
.ev h3.foil{font-size:30px}
.ev-d{font-size:13.5px;line-height:1.65}
.ev-stub{grid-area:stub;border-top:0;border-left:2px dotted var(--ink);border-radius:0 4px 4px 0;flex-direction:column;justify-content:flex-start;align-items:center;gap:12px;padding:16px 4px;min-height:0;
  background:var(--jimon) 0 0/88px 20px}
.ev-stub::before{top:-10px;left:-10px;right:auto;clip-path:inset(50% 0 0 0)}
.ev-stub::after{top:auto;bottom:-10px;left:-10px;right:auto;clip-path:inset(0 0 50% 0)}
.ev-stub .st-h{display:none}
.ev-stub .st-v{display:flex;justify-content:center;flex:1}
.vt{writing-mode:vertical-rl;display:flex;gap:4px;margin:0}
.vt small{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);letter-spacing:.1em}
.vt b{display:block;font-size:14px;font-weight:800;letter-spacing:.12em;color:var(--ink)}
.ev-stub .dater{width:52px;height:52px;flex:none}
.ev-stub .dater b{font-size:12px;margin:0 4px}
.ev-stub .seat .k{color:var(--ink-soft)}
.ev-stub .seat b{background:none;padding:0;margin:0}
.ev .more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap}
.ev .more span{border-bottom:2px solid var(--ink);padding-bottom:1px;background:none}
.ev .more svg{width:15px;height:15px}
.ev-main .more.m-act{align-self:flex-start;margin:-2px 0 -8px}
.ev-main .pushbtn.m-act{margin-top:6px;width:100%;justify-content:space-between;min-height:46px;padding:0 14px;font-size:14.5px;background:#fff}

/* ---------- TOP の棚：見出しは「無料の16卓」と同じ組み。帯で塗らない ---------- */
.bill{margin:14px 0 0}
.bill-head,.free-head{align-items:center;gap:12px}
.bill-head{margin:0 0 12px!important}
.bill-head .jp,.free-head .jp{font-family:var(--jp)!important;font-weight:800!important;font-size:22px;line-height:1.3;color:var(--ink)}
@media(min-width:720px){.bill-head .jp,.free-head .jp{font-size:28px}}
.bill-head .mk{flex:none;display:inline-flex;width:30px;height:20px;border:1.5px solid var(--ink);border-radius:3px;background:var(--stock);overflow:hidden}
.bill-head .mk i{width:9px;background:var(--pink);border-right:1.5px dotted var(--ink)}
.bill-foot{margin-top:14px}
.bill-foot .say{font-size:15px;font-weight:600;line-height:1.75;text-wrap:pretty;word-break:auto-phrase}
.bill-foot .grow{font-size:14px;font-weight:600;line-height:1.7}
@media(min-width:720px){.bill-foot .say,.bill-foot .grow{flex:1 1 100%}}

/* スマホ：券は横に送って見る。2枚目の端が見えるので、横に続くと分かる。棚の高さは券1枚ぶん */
@media(max-width:819px){
  .bill-rail{margin:0 -28px;padding:4px 28px 10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 28px;scrollbar-width:none}
  .bill-rail::-webkit-scrollbar{display:none}
  .bill-grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc(100vw - 92px);gap:14px}
  .bill-grid > .ev{scroll-snap-align:start}
}
/* PC：絵｜本文｜もぎり の3つに分かれた券（v1 のまま） */
@media(min-width:820px){
  .bill .ev{grid-template-columns:380px 1fr 250px;grid-template-areas:"pic main stub"}
  .bill .ev-pic{border-radius:4px 0 0 4px}
  .bill .ev h3.foil{font-size:44px}
  .bill .ev-d{font-size:14px}
  .bill .ev-main{padding:16px 22px}
  .bill .ev-main .m-act{display:none}
  .bill .ev-stub{align-items:flex-start;justify-content:center;padding:14px 18px;gap:10px}
  .bill .ev-stub .st-v{display:none}
  .bill .ev-stub .st-h{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
  .bill .ev-stub .seat{display:flex;flex-direction:column;line-height:1.35;background:var(--stock);padding:2px 6px;margin-left:-6px;border-radius:3px}
  .bill .ev-stub.own .pushbtn{margin:0}
}

/* ---------- ヘッダー：会員のときもスマホは「会員」だけ。ログイン中は棚の下に文字で出す ---------- */
nav.top a.mem.in .tkt i{background:var(--pink)}

/* ---------- P3 ---------- */
.gp .ev h3.foil{font-size:40px}
.gp .ev-stub{gap:14px;padding-top:22px}
.join .guest{border:0;border-radius:4px;background:var(--paper-2);padding:10px 12px}

/* ---------- P4a：絵は上を基準に切る（ゲームの名前が入る側） ---------- */
.mini img{object-position:center top}
/* P4b：押せない名前はピンクにしない */
.pr-note .th .gn{font-family:"Archivo Black",sans-serif;font-size:12px;line-height:1.35;color:var(--ink)}

/* ---------- P6：受け取った直後の袋。券より左右に広い淡いピンクの紙袋で、券の下半分が中に入っている ---------- */
.got{padding:6px 12px 0}
.got .ss-main{padding-bottom:16px}
.got .ss-stub{justify-content:flex-start;padding-top:22px;padding-bottom:16px}
.got .env{margin:-92px -12px 0;height:112px;background:var(--pink-pale) var(--grain);background-blend-mode:multiply;border:2px solid var(--ink);border-radius:3px 3px 8px 8px;padding:0 16px 12px}
.got .env .riso{font-size:15px}
.got .env small{font-size:12.5px}
/* マイページと解約後：もぎりを広げて、日付印と「解約済み」の印に余白を取る */
.ss.sm{grid-template-columns:1fr 104px}
.ss.sm .ss-stub{gap:12px;padding:12px 6px}
.ss .void{transform:rotate(-6deg)}
.ev-kind{flex-wrap:wrap;gap:2px 8px;font-size:12px}
.ev-kind > span{white-space:nowrap}
.bill-foot .say{color:var(--ink)}
@media(min-width:820px){.bill .ev-stub .seat{background:none;padding:0;margin:0}.bill-foot{margin-top:22px}}
.bill-foot .grow{text-wrap:pretty;word-break:auto-phrase}
.pushbtn svg{flex:none}
/* 袋の口は、ゲームの名前の箔より下。欄（アカウント、遊べる人）は袋の中に入っていて見えない（マイページで見せる） */
.got .ss-rows{visibility:hidden}
.got .env{margin-top:-74px;height:96px}

/* =====================================================================
 * v3（最終審査の「r1 で直すこと」）
 * ===================================================================== */
:root{
  /* 地紋はさらに淡く。網の目を粗くした蛍光ピンク */
  --jimon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='88' height='20'%3E%3Cg font-family='Arial Black,Arial,sans-serif' font-weight='900' font-size='6.4' fill='%23ffe6f2' letter-spacing='.5'%3E%3Ctext x='1' y='7'%3EPLAYROOM%3C/text%3E%3Ctext x='45' y='17'%3EPLAYROOM%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* 直す1：もぎりの地紋は、上と下の端に2段ずつ（40px）だけ敷く。縦書きの字は真ん中の無地の所に刷る */
.ev-stub{background:var(--jimon) 0 0/88px 20px repeat-x,var(--jimon) 0 20px/88px 20px repeat-x,
  var(--jimon) 0 100%/88px 20px repeat-x,var(--jimon) 0 calc(100% - 20px)/88px 20px repeat-x;padding:48px 4px}
.ev-stub .st-v{align-items:center}
/* 会員の券は、上の端に日付印を押すので、地紋は下の端だけ */
.ev-stub.own{background:var(--jimon) 0 100%/88px 20px repeat-x,var(--jimon) 0 calc(100% - 20px)/88px 20px repeat-x;padding:16px 4px 48px}
.ev-stub.own .st-v{align-items:flex-start;padding-top:4px}
.gp .ev-stub{padding-top:48px}
@media(min-width:820px){
  .bill .ev-stub{padding:44px 18px}
  .bill .ev-stub.own{padding:16px 18px 44px}
}
/* P4a の小さな券の名前の段は、地紋をやめて紙の地に（名前と人数の字に地紋がかからない） */
.mini .nm{background:var(--stock)}

/* 直す3：棚の見出しのすぐ下に、遊べる2つのゲームの名前を文字で並べる（横に送らなくても2つあると分かる） */
.bill-pair{font-size:15px;font-weight:600;line-height:1.6;color:var(--ink);margin:-4px 2px 12px}
.bill-pair b{font-weight:800}

/* 直す9：片側の太い色線の代わりに、行頭に小さな券の印（棚の見出しの印と同じ形を小さくしたもの） */
.bill-foot .grow{display:flex;align-items:flex-start;gap:8px}
.bill-foot .grow .mk,.join-band .mk{flex:none;display:inline-flex;width:22px;height:15px;border:1.5px solid var(--ink);border-radius:2px;background:var(--stock);overflow:hidden;margin-top:5px}
.bill-foot .grow .mk i,.join-band .mk i{width:7px;background:var(--pink);border-right:1.5px dotted var(--ink)}
.bill-foot .note{color:var(--ink)}

/* 直す9：ヘッダーの「会員」。左の半券は、淡いピンクの紙にミシン目と上下の刻みを付け、太い色線に見えないようにする */
nav.top a.mem .tkt{position:relative}
nav.top a.mem .tkt i,nav.top a.mem.in .tkt i{width:9px;background:var(--pink-pale);border-right:1.5px dotted var(--ink)}
nav.top a.mem .tkt::before,nav.top a.mem .tkt::after{content:"";position:absolute;left:5px;width:8px;height:8px;border-radius:50%;background:var(--paper);border:1.5px solid var(--ink);box-sizing:border-box}
nav.top a.mem .tkt::before{top:-5px}
nav.top a.mem .tkt::after{bottom:-5px}

/* 直す2：P3 の申し込みの段の頭は、ピンクで塗らず紙の地。見出しの下はミシン目の線 */
.join-band{background:none;border-bottom:2px dotted var(--ink);padding:14px 16px 12px;display:flex;align-items:flex-start;gap:10px}
.join-band .mk{width:26px;height:18px;margin-top:4px}
.join-band .mk i{width:8px}
.join-band b{color:var(--ink)}

/* 直す7：P3 の文字のリンクは、押せる高さを 44px 以上に（字の上下にも押せる余白） */
.join .backs{gap:0 18px;margin-top:-4px}
.join .backs .textlink,.gp .other .textlink{min-height:44px;padding:0 4px;margin:0 -4px}

/* 直す4：P5 の待合の名前は墨。前後の字と同じ書体、同じ太さ */
.rstub p .g{font:inherit;color:inherit;letter-spacing:inherit}

/* 直す5：P4(a) は本物の MANNAKA の結果画面の上。画面の下の端に置き、「この合言葉のまま別の卓へ」より下に収める */
.pop.ad{bottom:12px}
@media(max-height:700px){
  /* 375×667：結果の枠の下の端（上から約 500px）より下に収めるため、小さな券は横長の1行にする */
  .pop.ad{bottom:8px;padding:6px 10px 8px}
  .pop.ad .s3-head .dot{width:22px;height:22px}
  .pop.ad .s3-ttl .src{display:none}
  .pop.ad .s3-ttl .only{font-size:14px}
  .pop.ad .ad-lead{font-size:13px;line-height:1.4;margin-top:3px}
  .minis{gap:8px;margin-top:5px}
  .mini{display:flex;align-items:center}
  .mini img{width:54px;height:30px;aspect-ratio:auto;border-bottom:0;border-right:2px dotted var(--ink);flex:none}
  .mini .nm{flex:1;min-width:0;padding:0 6px;flex-direction:column;align-items:flex-start;gap:0;line-height:1.15}
  .mini .nm .foil{font-size:13px}
  .mini .nm small{font-size:12px}
  .pop.ad .s3-act{margin-top:6px}
  .pop.ad .s3-act .go,.pop.ad .s3-act .x{min-height:44px}
}

/* P4(b)：結果の枠の下（操作のボタンの下）に置く。全員に見える静かな枠 */
.pr-note.under-res{max-width:358px;margin:0 auto;padding:10px 12px 6px;background:rgba(255,251,242,.96)} /* 位置の固定は試作の名残なので外した（2026-10-04） */

/* 直す8：P6 支払い直後の、次の更新日と解約の1文 */
.pg .renew{font-size:14.5px;font-weight:600;line-height:1.7;margin-top:18px;color:var(--ink)}