/**
 * VTCA の会員向け画面の意匠。
 *
 * もとはダッシュボードの <style> に直書きしてあったものを、参加登録の画面と
 * 共有するためにそのまま外に出した。**中身は一字も変えていない。**
 * 二重に持つと必ず食い違うので、意匠を変えるときはここだけを触ること。
 *
 * 読み込む順番は style.css の後、そのページ固有の <style> の前。
 * 使うページは IBM Plex Sans / IBM Plex Mono を <head> で読むこと
 * （読めないと字面が別物になる）。見出し用の --font-display も本文と同じ
 * IBM Plex Sans。幅の狭いコンデンス書体は「縦長で
 * 読みにくい」との指摘でやめた（2026-10-05）。階層は大きさ・太さ・大文字で付ける。
 */

/* Hallmark · macrostructure: Index-First (app adaptation) · tone: utilitarian · anchor hue: 85 (paper) / 260 (ink)
 * theme: custom-tuned · vibe: "printed ticket, engineering manifest"
 * paper oklch(97% 0.008 85) · ink oklch(24% 0.040 258) · accent oklch(38% 0.100 262)
 * display IBM Plex Sans (uppercase, tight tracking) · body IBM Plex Sans · mono IBM Plex Mono
 * axes: light paper · display-plain (no condensed face) · cool accent
 * states: default · hover · focus · active · disabled · loading · error · success
 * pre-emit critique: P4 H5 E4 S5 R4 V5
 */

/* ── Tokens ─────────────────────────────────────────────────── */
:root{
  /* Paper is ticket stock: warm, never #fff. Ink is the press colour: navy, never #000. */
  --paper: #f8f5ef;
  --paper: oklch(97% 0.008 85);
  --paper-2: #fefcf9;
  --paper-2: oklch(99.2% 0.004 85);
  --paper-3: #f0ece5;
  --paper-3: oklch(94.5% 0.010 85);
  --rule: #d8d4cc;
  --rule: oklch(87% 0.012 85);
  --rule-strong: #afaaa1;
  --rule-strong: oklch(74% 0.014 85);
  --neutral: #6d6861;
  --neutral: oklch(52% 0.012 80);
  --muted: #4e4a42;
  --muted: oklch(41% 0.014 80);
  --ink: #132032;
  --ink: oklch(24% 0.040 258);
  --ink-2: #33435a;
  --ink-2: oklch(38% 0.045 258);
  --accent: #234077;
  --accent: oklch(38% 0.100 262);
  --accent-ink: #faf8f4;
  --accent-ink: oklch(98% 0.006 85);
  --focus: #2e62c9;
  --focus: oklch(52% 0.170 262);

  /* Signals. Always paired with a word or a shape — never colour alone. */
  --sig-stop: #9e2d26;
  --sig-stop: oklch(47% 0.150 28);
  --sig-wait: #875806;
  --sig-wait: oklch(50% 0.105 72);
  --sig-go: #216740;
  --sig-go: oklch(46% 0.095 155);

  --font-display: "IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --font-body:    "IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --font-mono:    "IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;

  --space-3xs:.125rem; --space-2xs:.25rem; --space-xs:.5rem;  --space-sm:.75rem;
  --space-md:1rem;     --space-lg:1.5rem;  --space-xl:2.5rem; --space-2xl:4rem;

  --text-xs:.6875rem; --text-sm:.8125rem; --text-base:.875rem; --text-body:1rem;
  --text-md:1.125rem; --text-lg:1.375rem; --text-xl:1.75rem;   --text-2xl:2.25rem;

  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in:cubic-bezier(.7,0,.84,0);
  --dur-micro:120ms; --dur-short:220ms; --dur-flip:560ms;

  --radius-card:3px; --radius-chip:2px; --radius-btn:3px;
  --shade: rgba(19,32,50,.10);
  --shade: oklch(24% 0.040 258 / .10);
  --scrim: rgba(13,22,36,.72);
  --scrim: oklch(20% 0.030 258 / .72);
  --z-raised:10; --z-sticky:200; --z-modal:400;

  --stub:168px;                   /* ticket stub width — perforation sits here */
  --act:168px;                    /* 行の操作ボタンの幅。一覧をまたいで同じにする */

  /* 共通ヘッダーのガラス。本番 public/assets/css/style.css の
     .logo-capsule / .nav-capsule / .nav-indicator と同じ作法。 */
  /* ヘッダーはスクロールしても居続ける。下の内容が透けて見えるが、
     白文字が読める濃さを保つ（本番は濃いヒーローの上なので薄くて済む）。 */
  /* 帯は敷かない。カプセル自身が内容の上に浮く。淡い紙地の上でも白文字が
     読める濃さが要る（本番は暗いヒーローの上なので 34% で足りている）。 */
  --glass-bg: rgba(13,22,36,.86);
  --glass-bg: oklch(20% 0.030 258 / .86);
  --site-h:        92px;   /* 本番の固定ヘッダーが占める高さ */
  --glass-line: rgba(255,255,255,.16);
  --glass-line: oklch(100% 0 0 / .16);
  --glass-shadow: rgba(6,11,20,.30);
  --glass-shadow: oklch(15% 0.020 258 / .30);
  --glass-txt: #faf8f5;
  --glass-txt: oklch(98% 0.004 85);
  --glass-txt-dim: rgba(250,248,245,.86);
  --glass-txt-dim: oklch(98% 0.004 85 / .86);   /* 帯が無くなったぶん濃くする（AA 確保） */
  --theme-primary: #0070e5;
  --theme-primary: oklch(56% 0.200 255);   /* #007bff 相当 */
  --theme-primary-light: #36dcec;
  --theme-primary-light: oklch(82% 0.130 205);   /* #00eaff 相当 */
  --sheet:1240px;
}

*{box-sizing:border-box}
/* UA の [hidden]{display:none} は .btn{display:inline-flex} などに負ける。
   属性で消したものが消えないのは事故のもとなので、ここで確定させる。 */
[hidden]{display:none!important}
html,body{margin:0;overflow-x:clip}
body{
  background:var(--paper);color:var(--ink);
  font:400 var(--text-body)/1.55 var(--font-body);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{margin:0;font-style:normal}
:focus{outline:none}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:inherit}
.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.lbl{
  font-family:var(--font-display);font-weight:600;font-size:var(--text-xs);
  letter-spacing:.05em;text-transform:uppercase;color:var(--neutral);
}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
         clip-path:inset(50%);white-space:nowrap;border:0}
.sq{width:8px;height:8px;flex:0 0 8px;border-radius:1px;background:var(--rule-strong);display:inline-block}
.sq--stop{background:var(--sig-stop)} .sq--wait{background:var(--sig-wait)}
.sq--go{background:var(--sig-go)}     .sq--run{background:var(--accent)}
@supports not (backdrop-filter:blur(1px)){ .cap{background:var(--ink)} }

/* 浮いているヘッダーのぶんだけ内容を下げる。飛び先も同じだけ避ける。 */
.sheet{max-width:var(--sheet);margin:0 auto;
       padding:calc(var(--site-h) + var(--space-md)) var(--space-md) var(--space-2xl)}
.sheet [id]{scroll-margin-top:calc(var(--site-h) + var(--space-md))}

/* ── The ticket ────────────────────────────────────────────────────
   A real ticket: printed band, ruled fields, a perforation with punched
   notches, a tear-off stub with serial + code. No gradient fills — the two
   radial-gradients below are mask alpha (they punch the notches), never paint. */
/* 券は表と裏を持つ 1 枚の紙。編集も説明も裏面で行う。
   影は face ではなく内側に掛ける（face に filter を置くと backface-visibility が効かない）。 */
.flipwrap{perspective:1400px}
.flip{position:relative;transform-style:preserve-3d;
      transition:transform var(--dur-flip) var(--ease-out)}
.flip.is-flipped{transform:rotateX(180deg)}
/* 表は流し込みのまま置く。これで枠の高さが表の券から決まり、JS が動かなくても
   券は消えない（両面を absolute にすると枠の高さが 0 になる）。 */
.flip__face{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.flip__front{position:relative}
.flip__back{position:absolute;inset:0;transform:rotateX(180deg)}
/* 裏面は表と同じ .tkt。穿孔のマスクも半券の幅も帯の高さも共有する。 */
.flip__back > .tktwrap,.flip__back .tkt{height:100%}
.flip__back .tkt__main{min-height:0}
.back__in{flex:1;min-height:0;overflow:auto;padding:var(--space-sm) var(--space-md) var(--space-sm)}
.back__stub{justify-content:center;gap:var(--space-xs);padding:var(--space-sm)}
.back__stub .btn{width:100%;min-width:0}
.tktwrap{filter:drop-shadow(0 1px 0 var(--rule)) drop-shadow(0 10px 22px var(--shade))}
.tkt{
  display:flex;border-radius:var(--radius-card);background:var(--paper-2);
  -webkit-mask-image:
    radial-gradient(circle 9px at calc(100% - var(--stub)) 0,   transparent 99%, #fff 100%),
    radial-gradient(circle 9px at calc(100% - var(--stub)) 100%,transparent 99%, #fff 100%);
  -webkit-mask-composite:destination-in;
  mask-image:
    radial-gradient(circle 9px at calc(100% - var(--stub)) 0,   transparent 99%, #fff 100%),
    radial-gradient(circle 9px at calc(100% - var(--stub)) 100%,transparent 99%, #fff 100%);
  mask-composite:intersect;
}
.tkt__main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}
.tkt__band{
  background:var(--accent);color:var(--accent-ink);
  padding:var(--space-2xs) var(--space-md);
  display:flex;align-items:baseline;gap:var(--space-sm);
}
.tkt__kind{font-family:var(--font-display);font-weight:600;font-size:var(--text-xs);
           letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink);opacity:.82}
.tkt__ev{font-family:var(--font-display);font-weight:700;font-size:var(--text-md);letter-spacing:.02em;
         white-space:nowrap;
         text-transform:uppercase;margin-left:auto}
.tkt__body{display:flex;flex-wrap:wrap;gap:var(--space-md) var(--space-xl);
           padding:var(--space-sm) var(--space-md) var(--space-xs)}
.tkt__name{display:block;font-family:var(--font-display);font-weight:700;font-size:var(--text-xl);
           line-height:1.15;letter-spacing:0;text-transform:uppercase;overflow-wrap:anywhere}
.tkt__affil{display:block;font-size:var(--text-base);color:var(--muted)}
.tkt__fields{display:flex;flex-wrap:wrap;gap:var(--space-md) var(--space-xl);margin:0}
.tkt__fields div{min-width:0}
.tkt__fields dt{margin:0 0 var(--space-3xs)}
.tkt__fields dd{margin:0;font-size:var(--text-base);font-weight:500;color:var(--ink)}
.tkt__roles{display:flex;gap:var(--space-2xs);flex-wrap:wrap}
.role{font-family:var(--font-display);font-weight:600;font-size:var(--text-xs);letter-spacing:.04em;
      text-transform:uppercase;border:1px solid var(--rule-strong);border-radius:var(--radius-chip);
      padding:0 var(--space-2xs);color:var(--ink-2)}
.tkt__foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--space-xs) var(--space-md);
           padding:0 var(--space-md) var(--space-sm)}
.tkt__code{
  height:22px;flex:0 1 520px;min-width:120px;border-radius:1px;
  background:repeating-linear-gradient(90deg,
    var(--ink) 0 2px, transparent 2px 4px, var(--ink) 4px 5px, transparent 5px 9px,
    var(--ink) 9px 11px, transparent 11px 13px, var(--ink) 13px 14px, transparent 14px 18px,
    var(--ink) 18px 19px, transparent 19px 22px, var(--ink) 22px 24px, transparent 24px 26px);
  opacity:.62;
}
.tkt__stub{
  width:var(--stub);flex:0 0 var(--stub);border-left:2px dashed var(--rule-strong);
  background:var(--paper-3);
  display:flex;flex-direction:column;align-items:center;gap:var(--space-2xs);
  padding:var(--space-sm) var(--space-sm) var(--space-xs);text-align:center;
}
.tkt__days{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:600;
           font-size:var(--text-xl);line-height:1;color:var(--ink)}
.tkt__qr{border:1px solid var(--rule);background:var(--paper-2);padding:var(--space-3xs);border-radius:1px;
         cursor:pointer;line-height:0;position:relative}
@media (hover:hover){ .tkt__qr:hover{border-color:var(--accent)}}

.tkt__qr:active{transform:translateY(1px)}
.tkt__qr::before{content:"";position:absolute;inset:-10px}   /* 指で押せる大きさに */
/* 受付で読ませるための拡大表示 */
.qrpop{position:fixed;inset:0;z-index:var(--z-modal);display:grid;place-items:center;
       background:var(--scrim);padding:var(--space-md)}
.qrpop[hidden]{display:none}
.qrpop__box{background:var(--paper-2);border:1px solid var(--rule);border-radius:var(--radius-card);
            padding:var(--space-lg);max-width:min(92vw,360px);
            display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);text-align:center}
.qrpop__box canvas{border:1px solid var(--rule)}
.qrpop__who{font-family:var(--font-display);font-weight:700;font-size:var(--text-md);
            text-transform:uppercase;letter-spacing:.01em;line-height:1.25;overflow-wrap:anywhere}
.qrpop__sub{font-size:var(--text-sm);color:var(--muted)}
/* Wallet に入れるボタン。参加費が確定した人にだけ出す（dashboard-next.js の renderWallet） */
.qrpop__wallet{display:flex;flex-direction:column;gap:var(--space-2xs);width:100%}
.qrpop__wallet[hidden],.walletbtn[hidden]{display:none}
.walletbtn{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 var(--space-sm);
           border-radius:8px;background:#000;color:#fff;font-weight:600;font-size:var(--text-sm);text-decoration:none}
.walletbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* 券の右の半券にも置く（QR を開かずに入れられる。2026-10-07） */
.tkt__wallet{display:flex;flex-direction:column;gap:var(--space-3xs);width:100%;margin-top:var(--space-3xs)}
.tkt__wallet[hidden]{display:none}
.walletbtn--sm{min-height:32px;border-radius:6px;font-size:var(--text-xs);padding:0 var(--space-2xs)}
/* 拡大 QR の上のタブ（本人と、本人が払った同伴者）。多ければタブの列だけが横に動く。
   スマホではスクロールバーが見えないので、隠れている向きに ‹ › を出す（syncQrTabArrows） */
.qrtabbar{display:flex;align-items:stretch;width:100%;border-bottom:1px solid var(--rule)}
.qrtabbar[hidden]{display:none}
.qrtabs{display:flex;gap:var(--space-3xs);flex:1 1 auto;min-width:0;overflow-x:auto;
        overscroll-behavior-x:contain;scrollbar-width:none}
.qrtabarrow{flex:0 0 auto;display:grid;place-items:center;width:32px;border:0;padding:0;background:none;
            color:var(--ink);cursor:pointer}
.qrtabarrow[hidden]{display:none}
.qrtabarrow:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.qrtabs::-webkit-scrollbar{display:none}
.qrtab{flex:0 0 auto;max-width:12rem;min-height:40px;padding:0 var(--space-xs);border:0;background:none;
       border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--muted);font:inherit;
       font-size:var(--text-sm);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.qrtab[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.qrtab:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.tkt__qr canvas{display:block}
.tkt__serial{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--muted);letter-spacing:.02em}
.tkt__acts{display:flex;gap:var(--space-2xs);padding:0 var(--space-md) var(--space-sm)}
.tkt__foot-acts{margin-left:auto;display:flex;gap:var(--space-xs)}
.tkt__foot .btn{min-width:124px}
.tkt__note{max-width:68ch;margin:0;font-size:var(--text-base);color:var(--muted);line-height:1.6}


/* ── Buttons — all eight states ─────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2xs);
  position:relative;font:600 var(--text-sm)/1 var(--font-body);
  color:var(--ink-2);background:var(--paper-2);border:1px solid var(--rule-strong);
  border-radius:var(--radius-btn);padding:var(--space-xs) var(--space-sm);min-width:92px;
  cursor:pointer;white-space:nowrap;
  transition:background var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out),
             border-color var(--dur-micro) var(--ease-out);
}
.btn::before{content:"";position:absolute;inset:-6px}   /* 44px touch target */
@media (hover:hover){ .btn:hover{background:var(--paper-3);color:var(--ink);border-color:var(--ink-2)}}

.btn:active,.btn.is-active{transform:translateY(1px)}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;transform:none}
.btn--key{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
@media (hover:hover){ .btn--key:hover{background:var(--ink);border-color:var(--ink);color:var(--accent-ink)}}

.btn--quiet{border-color:var(--rule);background:transparent}
.btn--onband{background:transparent;border-color:var(--glass-line);color:var(--accent-ink)}
@media (hover:hover){ .btn--onband:hover{background:var(--glass-line);color:var(--accent-ink);
                                          border-color:var(--accent-ink)}}

.btn[data-state="loading"]{color:transparent}
.btn[data-state="loading"]::after{
  content:"";position:absolute;width:13px;height:13px;border-radius:50%;
  border:2px solid var(--rule-strong);border-top-color:var(--ink-2);animation:spin 700ms linear infinite;
}
.btn[data-state="error"]{border-color:var(--sig-stop);color:var(--sig-stop)}
.btn[data-state="success"]{border-color:var(--sig-go);color:var(--sig-go)}
@keyframes spin{to{transform:rotate(1turn)}}
.ico{width:32px;height:32px;min-width:0;padding:0;position:relative}
.is-gone{display:none!important}
/* 読み込みの途中の段は見せない（dashboard-next.js の dn-boot）。そろったら一度に出す。 */
.cols{transition:opacity .15s ease-out}
/* .flip は回転の transition も持つので、opacity だけで上書きしない（10/8 から券が回らなくなっていた）。 */
.flip{transition:transform var(--dur-flip) var(--ease-out),opacity .15s ease-out}
body.dn-boot .cols,body.dn-boot .flip{opacity:0}
.ico svg{width:15px;height:15px;display:block}

/* ── Section heads — a ruled masthead, not a card header ─────────── */
.sec{margin-top:var(--space-xl)}
.sec__hd{display:flex;align-items:baseline;gap:var(--space-sm);
         border-bottom:2px solid var(--ink);padding-bottom:var(--space-2xs);margin-bottom:var(--space-xs)}
.sec__t{font-family:var(--font-display);font-weight:700;font-size:var(--text-md);line-height:1.25;
        letter-spacing:.01em;text-transform:uppercase}
.sec__n{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--neutral);
        font-variant-numeric:tabular-nums}
.sec__sp{flex:1}
.sec__note{font-size:var(--text-sm);color:var(--muted);margin:0 0 var(--space-sm)}

/* ── Needs you — a manifest, hairlines only, no colour stripes ───── */
.mf{border:1px solid var(--rule);border-radius:var(--radius-card);background:var(--paper-2);overflow:hidden}
.mf__row{display:grid;grid-template-columns:150px minmax(0,1fr) var(--act);gap:var(--space-md);
         align-items:center;padding:var(--space-sm) var(--space-md);border-top:1px solid var(--rule)}
.mf__row .btn,.ses__row .btn,.task .btn,.pap__state .btn{width:var(--act)}
.mf__row:first-child{border-top:none}
@media (hover:hover){ .mf__row:hover{background:var(--paper-3)}}

.mf__when{display:flex;align-items:center;gap:var(--space-xs);
          font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-sm);
          font-weight:500;color:var(--muted)}
.mf__row[data-urg="late"] .mf__when{color:var(--sig-stop);font-weight:600}
.mf__row[data-urg="soon"] .mf__when{color:var(--sig-wait);font-weight:600}
.mf__t{font-size:var(--text-base);font-weight:600;line-height:1.35}
.mf__m{font-size:var(--text-sm);color:var(--muted)}
.mf__src{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--neutral)}
.mf__clear{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-md);
           color:var(--sig-go);font-size:var(--text-base);font-weight:600}

/* ── Papers — one card, one route diagram ───────────────────────── */
.pap{border:1px solid var(--rule);border-radius:var(--radius-card);background:var(--paper-2);
     margin-bottom:var(--space-sm)}
/* style.css の header{position:fixed;top:0;z-index:1000} は要素セレクタなので、
   本文の中の <header>（論文カードの見出し）まで画面の最上部に貼り付けてしまう。
   サイト共通の CSS を読み込んでいる以上、本文側で必ず流れに戻しておく。 */
.sheet header{position:static;inset:auto;z-index:auto;background:none;transition:none}
.pap__hd{display:flex;gap:var(--space-md);align-items:flex-start;padding:var(--space-sm) var(--space-md) 0;
         position:static;inset:auto;z-index:auto;background:none;transition:none}
.pap__hd .sp{flex:1;min-width:0}
.pap__meta{display:flex;align-items:center;gap:var(--space-xs);flex-wrap:wrap;margin-bottom:var(--space-3xs)}
.pap__id{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--neutral)}
.tag{font-family:var(--font-display);font-weight:600;font-size:var(--text-xs);letter-spacing:.04em;
     text-transform:uppercase;border:1px solid var(--rule-strong);border-radius:var(--radius-chip);
     padding:0 var(--space-2xs);color:var(--ink-2)}
.tag--fill{background:var(--ink);border-color:var(--ink);color:var(--paper-2)}
.pap__kind{font-size:var(--text-sm);color:var(--neutral)}
.pap__t{font-size:var(--text-md);font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.pap__act{display:flex;gap:var(--space-2xs);align-items:center;flex-shrink:0}
/* 取り下げ・不採択の論文は 1 行に畳む（dashboard-next.js の PAPER_CLOSED）。押すと中身が開く。 */
.pap--closed{background:transparent;border-style:dashed}
.pap__mini{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-2xs) var(--space-md);
           cursor:pointer;list-style:none;color:var(--muted);font-size:var(--text-sm)}
.pap__mini::-webkit-details-marker{display:none}
.pap__mini::before{content:"";flex-shrink:0;width:0;height:0;border-style:solid;border-width:4px 0 4px 6px;
                   border-color:transparent transparent transparent currentColor;transition:transform .15s}
.pap--closed[open] > .pap__mini::before{transform:rotate(90deg)}
.pap__mini-t{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pap__mini:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.pap--closed[open] > .pap__mini{border-bottom:1px dashed var(--rule)}

.route{padding:var(--space-md) var(--space-md) var(--space-xs);overflow-x:auto}
.route__line{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));min-width:480px}
.stop{position:relative;padding-top:var(--space-md);text-align:center;min-width:0}
.stop::before,.stop::after{content:"";position:absolute;top:4px;border-top:2px dotted var(--rule-strong)}
.stop::before{left:0;right:50%} .stop::after{left:50%;right:0}
.stop:first-child::before,.stop:last-child::after{display:none}
.stop.is-done::before,.stop.is-done::after,.stop.is-here::before{
  border-top:2px solid var(--accent)}
.stop__n{position:absolute;top:0;left:50%;transform:translateX(-50%);width:10px;height:10px;
         border-radius:50%;background:var(--paper-2);border:2px solid var(--rule-strong);z-index:var(--z-raised)}
.stop.is-done .stop__n{background:var(--accent);border-color:var(--accent)}
.stop.is-here .stop__n{width:14px;height:14px;top:-2px;border-width:3px;border-color:var(--accent);
                       background:var(--paper-2)}
.stop.is-here[data-sig="wait"] .stop__n{border-color:var(--sig-wait)}
.stop.is-here[data-sig="stop"] .stop__n{border-color:var(--sig-stop)}
.stop.is-here[data-sig="go"]   .stop__n{border-color:var(--sig-go)}
.stop__l{display:block;font-family:var(--font-display);font-weight:600;font-size:var(--text-xs);
         letter-spacing:.04em;text-transform:uppercase;color:var(--neutral);line-height:1.2}
.stop__l .short{display:none}
.stop.is-done .stop__l,.stop.is-here .stop__l{color:var(--ink-2)}
.stop.is-here .stop__l{color:var(--ink);font-weight:700}
.stop__d{display:block;font-family:var(--font-mono);font-size:var(--text-xs);color:var(--neutral);
         margin-top:var(--space-3xs);font-variant-numeric:tabular-nums}

.pap__state{display:flex;align-items:flex-start;gap:var(--space-sm);flex-wrap:wrap;
            border-top:1px solid var(--rule);padding:var(--space-sm) var(--space-md);background:var(--paper-3)}
.pap__state .sp{flex:1;min-width:200px}
.pap__st{font-size:var(--text-base);font-weight:600;display:flex;align-items:center;gap:var(--space-xs)}
.pap__sm{font-size:var(--text-sm);color:var(--muted);margin-top:var(--space-3xs)}
.pap__tasks{background:var(--paper-3);padding:0 var(--space-md) var(--space-sm)}
.task{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) 0;
      border-top:1px dotted var(--rule-strong);font-size:var(--text-base)}
.task .sp{flex:1;min-width:0}
.task small{display:block;font-family:var(--font-mono);font-size:var(--text-xs);color:var(--neutral)}

/* ── Reviews ─────────────────────────────────────────────────────── */
.rvw{border:1px solid var(--rule);border-radius:var(--radius-card);background:var(--paper-2);overflow:hidden}
.rvw__row .btn{width:96px}
.rvw__row{display:grid;grid-template-columns:minmax(0,1fr) 204px 116px 104px;gap:var(--space-sm);
          align-items:center;padding:var(--space-sm) var(--space-md);border-top:1px solid var(--rule)}
.rvw__row:first-child{border-top:none}
.rvw__row[data-ask="1"]{background:var(--paper-3)}
.rvw__t{font-size:var(--text-base);font-weight:500;line-height:1.3;
        display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.rvw__row[data-done="1"] .rvw__t{color:var(--muted)}
.rvw__id{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--neutral)}
.rvw__due{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-sm);
          color:var(--muted);text-align:right}
.rvw__due[data-urg="late"]{color:var(--sig-stop);font-weight:600}
.rvw__due[data-urg="soon"]{color:var(--sig-wait);font-weight:600}
.score{display:inline-flex;gap:var(--space-3xs)}
.score b{width:21px;height:21px;display:grid;place-items:center;border:1px solid var(--rule);
         border-radius:var(--radius-chip);background:var(--paper-2);
         font:600 var(--text-xs)/1 var(--font-mono);font-variant-numeric:tabular-nums;color:var(--neutral)}
.score b[data-v="5"],.score b[data-v="4"]{color:var(--sig-go);border-color:var(--sig-go)}
.score b[data-v="3"]{color:var(--sig-wait);border-color:var(--sig-wait)}
.score b[data-v="2"],.score b[data-v="1"]{color:var(--sig-stop);border-color:var(--sig-stop)}
.state{display:inline-flex;align-items:center;gap:var(--space-2xs);font-size:var(--text-sm);
       font-weight:600;color:var(--ink-2)}

/* ── Sessions ───────────────────────────────────────────────────── */
.ses{border:1px solid var(--rule);border-radius:var(--radius-card);background:var(--paper-2);overflow:hidden}
.ses__row{display:grid;grid-template-columns:minmax(0,1fr) 210px var(--act);gap:var(--space-md);
          align-items:center;padding:var(--space-sm) var(--space-md);border-top:1px solid var(--rule)}
.ses__row:first-child{border-top:none}
.ses__t{font-size:var(--text-base);font-weight:500;line-height:1.3;
        display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bar{display:flex;height:9px;border:1px solid var(--rule);border-radius:1px;overflow:hidden;background:var(--paper-3)}
.bar i{display:block;height:100%}
.bar i[data-k="u"]{background:var(--sig-stop)} .bar i[data-k="r"]{background:var(--accent)}
.bar i[data-k="w"]{background:var(--sig-wait)} .bar i[data-k="c"]{background:var(--sig-go)}
.key{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-top:var(--space-2xs);
     font-size:var(--text-xs);color:var(--muted)}
.key span{display:inline-flex;align-items:center;gap:var(--space-3xs)}
.key b{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink-2)}

/* ── Two-column body + side modules ─────────────────────────────── */
.cols{display:grid;grid-template-columns:minmax(0,1fr) 318px;gap:var(--space-lg);
      align-items:start;margin-top:var(--space-xl)}
/* 左右の段は同じ高さから始める。節の見出しには既定で上マージンが付くので、
   段の先頭だけ外し、カード見出しの文字と目線が揃うぶんだけ下げ直す。 */
.cols > div > .sec:first-child{margin-top:0}
.cols > div > .sec:first-child > .sec__hd{padding-top:var(--space-2xs)}
.mod{border:1px solid var(--rule);border-radius:var(--radius-card);background:var(--paper-2);
     margin-bottom:var(--space-md)}
.mod__hd{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);
         border-bottom:1px solid var(--rule)}
.mod__hd .sp{flex:1}
.mod__b{padding:var(--space-sm) var(--space-md) var(--space-md)}
.fee{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-xl);
     font-weight:600;letter-spacing:-.01em}
.mod__m{font-size:var(--text-sm);color:var(--muted);margin:var(--space-2xs) 0 var(--space-sm)}
.mod__fine{font-size:var(--text-xs);color:var(--neutral);margin:var(--space-xs) 0 0}
/* 目立たせたいカード（Before you come）。見出しを券の帯と同じ色にする。縦の色帯は使わない。 */
.mod--key{border-color:var(--accent)}
.mod--key .mod__hd{background:var(--accent);border-bottom-color:var(--accent);color:var(--accent-ink)}
.mod--key .mod__hd .lbl,.mod--key .mod__hd .state{color:var(--accent-ink)}
.mod__big{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-xl);
  font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.mod__big small{font-size:var(--text-sm);font-weight:500;color:var(--neutral);letter-spacing:0;margin-left:var(--space-2xs)}
.doc{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) 0;
     border-top:1px dotted var(--rule-strong);font-size:var(--text-base)}
.doc:first-child{border-top:none}
.doc .sp{flex:1;min-width:0}
.doc small{display:block;font-size:var(--text-xs);color:var(--neutral);font-family:var(--font-mono)}
.dates{list-style:none;margin:0;padding:0}
.dates li{display:flex;align-items:baseline;gap:var(--space-xs);padding:var(--space-2xs) 0;
          border-top:1px dotted var(--rule-strong);font-size:var(--text-sm)}
.dates li:first-child{border-top:none}
.dates .d{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-xs);
          color:var(--ink-2);white-space:nowrap;min-width:62px}
.dates .k{flex:1;min-width:0}
.dates .n{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--neutral);white-space:nowrap}
.dates li[data-past="1"]{color:var(--neutral)}
.dates li[data-past="1"] .d{color:var(--neutral)}
.dates li[data-next="1"] .k{font-weight:600}
.slot{border:1px dashed var(--rule-strong);border-radius:var(--radius-card);padding:var(--space-sm) var(--space-md);
      color:var(--muted);font-size:var(--text-sm);background:var(--paper-3)}
/* 5 行を超える一覧は高さを 5 行ぶんに切ってスクロールさせる（本番の
   .table-scroll と同じ作法）。件数は下に出す。カードの一覧だけは畳む。 */
.is-scroll{overflow-y:scroll;overscroll-behavior:contain;   /* 常に軌道を出して、動かせると分かるように */
           
           /* scrollbar-width を指定すると Chrome は ::-webkit-scrollbar を無視し、
              macOS では出たり消えたりする細い軌道になる。常に見える軌道が要るので
              標準プロパティは書かず、下の疑似要素で描く（Firefox は既定の軌道）。 */
           }
.is-scroll::-webkit-scrollbar{width:10px}
.is-scroll::-webkit-scrollbar-track{background:var(--paper-3)}
.is-scroll::-webkit-scrollbar-thumb{background:var(--rule-strong);border-radius:8px;
                                    border:2px solid var(--paper-3)}
@media (hover:hover){ .is-scroll::-webkit-scrollbar-thumb:hover{background:var(--neutral)}}

.scrollnote{margin:var(--space-2xs) var(--space-3xs) 0;text-align:right;
            font:500 var(--text-xs)/1.4 var(--font-mono);color:var(--neutral)}
/* 投稿期間が閉じたときの案内。旧ダッシュボードが出していたものと同じ内容を、
   同じ場所（My papers の先頭）に出す。 */
.secnote{margin:0 0 var(--space-sm);padding:var(--space-xs) var(--space-sm);
         border-left:3px solid var(--sig-wait);background:var(--paper-3);
         font-size:var(--text-sm);line-height:1.55;color:var(--muted)}
.secnote[data-tone="stop"]{border-left-color:var(--sig-stop)}
.secnote[hidden]{display:none}
/* 飛んできた先を一瞬だけ示す */
.is-target{outline:2px solid var(--accent);outline-offset:3px}

/* ── 長い文字列への備え ──────────────────────────────
   題目・所属・ID は人が入れるものなので、空白の無い長大な文字列が来る。
   (1) どこでも折り返す (2) 券とカードは行数で頭打ちにする。 */
.pap__id,.rvw__id,.mf__src,.mf__t,.mf__m,.tkt__serial,.stop__d,.tag,.psess,.pap__kind,
.dates .k,.task .sp,.doc .sp,.tkt__fields dd,.state,.key{overflow-wrap:anywhere;min-width:0}
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tkt__name{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.tkt__affil{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;
            overflow-wrap:anywhere}
.pap__t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mf__m{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* 5 件を超える一覧は畳む。開いた状態は一覧ごとに覚える。 */
.more{display:block;width:100%;border:1px solid var(--rule);background:var(--paper-2);
      color:var(--muted);font:600 var(--text-sm)/1 var(--font-mono);letter-spacing:.04em;
      padding:var(--space-sm);cursor:pointer;border-radius:var(--radius-card);text-align:center}
.mf .more,.rvw .more,.ses .more{border:none;border-top:1px solid var(--rule);border-radius:0}
@media (hover:hover){ .more:hover{background:var(--paper-3);color:var(--ink)}}

.more:active{transform:translateY(1px)}

/* プロフィールの編集。入力は 8 状態ぶん用意する。 */
.edit{margin:0}
.flip__back .field .hint{font-size:var(--text-xs);line-height:1.35}
.edit__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-md)}
.field label{display:block;margin-bottom:var(--space-2xs)}
.field input,.field select{width:100%;height:42px;padding:0 var(--space-sm);
  font:400 var(--text-base) var(--font-body);color:var(--ink);background:var(--paper);
  border:1px solid var(--rule-strong);border-radius:var(--radius-btn);
  outline:2px solid transparent;outline-offset:1px}
.field input:focus-visible,.field select:focus-visible{outline-color:var(--focus)}
@media (hover:hover){ .field input:hover,.field select:hover{background:var(--paper-2)}}

.field input:disabled,.field select:disabled{opacity:.55;cursor:not-allowed}
.field .hint{display:block;min-height:1lh;margin-top:var(--space-2xs);
             font-size:var(--text-xs);line-height:1.45;color:var(--neutral)}
.field[data-err] input{border-color:var(--sig-stop)}
.field[data-err] .hint{color:var(--sig-stop);font-weight:500}
@media (max-width:860px){ .edit__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media (max-width:620px){ .edit__grid{grid-template-columns:minmax(0,1fr)}}


.out{margin-top:var(--space-xl);text-align:center}
.out button{background:none;border:none;color:var(--neutral);font:500 var(--text-base) var(--font-body);
            cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:var(--space-xs);
            border-radius:var(--radius-btn)}
@media (hover:hover){ .out button:hover{color:var(--ink)}}

.out button:active{transform:translateY(1px)}

@media (prefers-reduced-motion:reduce){
  .flip{transition:none}
  *,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;
                       transition-duration:1ms!important}}

@media (max-width:1040px){ .cols{grid-template-columns:minmax(0,1fr)}}

@media (max-width:860px){
  :root{--stub:132px}
  .tkt__name{font-size:var(--text-lg)}
  .rvw__row{grid-template-columns:minmax(0,1fr) auto;row-gap:var(--space-xs)}
  .rvw__due{text-align:left}
  .ses__row{grid-template-columns:minmax(0,1fr);row-gap:var(--space-xs)}
  .ses__row .btn{justify-self:start}}

@media (max-width:620px){
  /* 一括指定にすると上余白（ヘッダーのぶん）が消えるので、個別に指定する。 */
  .sheet{padding-right:var(--space-sm);padding-bottom:var(--space-xl);padding-left:var(--space-sm)}
  .tkt{-webkit-mask-image:none;mask-image:none;flex-wrap:wrap}
  /* basis 100% on both halves forces the wrap; with basis 0 the stub's 100%
     fitted on the same line and squeezed the main half to zero width. */
  .tkt__main{flex:1 1 100%}
  .tkt__stub{width:100%;flex:1 1 100%;border-left:none;border-top:2px dashed var(--rule-strong);
             flex-direction:row;justify-content:space-between;align-items:center;text-align:left}
  .mf__row{grid-template-columns:minmax(0,1fr);row-gap:var(--space-xs)}
  .mf__row .btn{justify-self:start}
  /* let the route fit the screen instead of hiding half of it in a scroller */
  .route{padding-inline:var(--space-sm)}
  .route__line{min-width:0}
  .stop__l{letter-spacing:.02em}
  .stop__l .long{display:none} .stop__l .short{display:inline}
  .tkt__code{flex:1 1 100%;order:2}
  .tkt__foot-acts{margin-left:0}}

/* ── 共通ヘッダー。マークアップは本番のまま（main.js のインジケータとドロップダウンが動く）。
   カプセルの濃さだけ、明るい紙地の上でも白文字が読める値に上書きする。 */
.logo-capsule,.nav-capsule{background:var(--glass-bg);backdrop-filter:blur(20px) saturate(1.6);
  -webkit-backdrop-filter:blur(20px) saturate(1.6);border-color:var(--glass-line);
  box-shadow:0 6px 24px var(--glass-shadow)}
.logo-capsule{text-shadow:none;font-family:var(--font-display);letter-spacing:.02em;text-transform:uppercase}
.logo-capsule:hover{background:var(--ink);border-color:var(--glass-line);box-shadow:0 6px 24px var(--glass-shadow)}
.nav-item{color:var(--glass-txt-dim);text-shadow:none}
.nav-item:hover,.nav-item.active{color:var(--glass-txt);text-shadow:none}
.menu-toggle{background:var(--glass-bg);border-color:var(--glass-line)}
@supports not (backdrop-filter:blur(1px)){ .logo-capsule,.nav-capsule{background:var(--ink)} }

/* 一覧の枠は角を丸めるために overflow:hidden を持つ。切り取ってスクロールさせるときは
   そちらが勝たないよう、詳細度を上げて上書きする。 */
.mf.is-scroll,.rvw.is-scroll,.ses.is-scroll{overflow-y:scroll}

/* 投稿の詳細。要旨・著者・状態の履歴はここでしか見られない。 */
.det__box{max-width:min(94vw,760px);align-items:stretch;text-align:left;padding:0;overflow:hidden}
.det__hd{display:flex;align-items:center;gap:var(--space-sm);background:var(--accent);
         padding:var(--space-2xs) var(--space-md)}
.det__hd .lbl{color:var(--accent-ink);opacity:.9;flex:1}
.det__in{padding:var(--space-md);overflow:auto;max-height:70vh}
.det{display:flex;gap:var(--space-md);padding:var(--space-xs) 0;border-top:1px dotted var(--rule-strong);
     font-size:var(--text-base)}
.det:first-child{border-top:none}
.det > .lbl{min-width:120px;flex:0 0 120px;padding-top:2px}
.det > span:last-child{flex:1;min-width:0;overflow-wrap:anywhere}
.det__body{white-space:pre-wrap;line-height:1.6;color:var(--muted)}
.det__list{margin:0;padding-left:1.1rem;color:var(--muted)}

/* camera-ready（最終原稿）と著作権譲渡。admin 限定の機能なので、この画面に
   しか無い。トークンは上の :root のものだけを使う。 */
.cr__load{padding:var(--space-lg) 0;text-align:center;color:var(--neutral);font-size:var(--text-base)}
.cr__note{margin:0 0 var(--space-sm);font-size:var(--text-base);color:var(--muted)}
.cr__note--stop{color:var(--sig-stop)}
.cr__h{margin:0 0 var(--space-2xs);font-family:var(--font-display);font-weight:600;
       font-size:var(--text-md);letter-spacing:0;line-height:1.3;color:var(--ink)}
.cr__sub{margin:0 0 var(--space-sm);font-size:var(--text-sm);color:var(--neutral);line-height:1.55}
.cr__tbl{width:100%;border-collapse:collapse;margin:0 0 var(--space-sm);font-size:var(--text-sm)}
.cr__tbl th{text-align:left;width:11rem;padding:var(--space-2xs) var(--space-xs) var(--space-2xs) 0;
            color:var(--neutral);font-weight:600;vertical-align:top}
.cr__tbl td{padding:var(--space-2xs) 0;color:var(--muted);overflow-wrap:anywhere}
.cr__tbl tr + tr th,.cr__tbl tr + tr td{border-top:1px dotted var(--rule)}
.cr__none{margin:0 0 var(--space-sm);font-size:var(--text-sm);color:var(--neutral)}
.cr__have{margin:0 0 var(--space-sm);font-size:var(--text-sm);color:var(--muted);
          display:flex;align-items:center;gap:var(--space-xs);flex-wrap:wrap}
.cr__ok{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--sig-go);
        border:1px solid var(--sig-go);border-radius:3px;padding:0 var(--space-2xs)}
.cr__file-name{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--ink);
               background:var(--paper-3);border-radius:3px;padding:0 var(--space-2xs);
               overflow-wrap:anywhere}
.cr__file{display:flex;align-items:center;gap:var(--space-xs);flex-wrap:wrap;margin-top:var(--space-xs)}
.cr__input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.cr__input:focus-visible + label{outline:2px solid var(--focus);outline-offset:2px}
.cr__name{flex:1;min-width:8rem;font-size:var(--text-sm);color:var(--neutral);overflow-wrap:anywhere}
.cr__bar{height:4px;background:var(--paper-3);border-radius:2px;margin-top:var(--space-xs);overflow:hidden}
.cr__bar i{display:block;height:100%;width:0;background:var(--accent);transition:width var(--dur-micro) linear}
.cr__choice{display:flex;gap:var(--space-md);margin:var(--space-md) 0 var(--space-sm);flex-wrap:wrap}
.cr__choice label{display:flex;align-items:center;gap:var(--space-2xs);font-size:var(--text-sm);color:var(--muted)}
.cr__lab{display:block;margin-top:var(--space-xs);font-size:var(--text-sm);color:var(--muted);font-weight:600}
.cr__text{width:100%;max-width:26rem;margin-top:var(--space-2xs);padding:var(--space-2xs) var(--space-xs);
          border:1px solid var(--rule-strong);border-radius:4px;background:var(--paper-2);
          font-family:var(--font-body);font-size:var(--text-base);color:var(--ink)}
.cr__text:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.cr__hint{display:block;margin-top:var(--space-3xs);font-size:var(--text-xs);color:var(--neutral)}
.cr__set{margin:var(--space-md) 0 var(--space-sm);padding:var(--space-xs) var(--space-sm);
         border:1px solid var(--rule);border-radius:4px}
.cr__set legend{padding:0 var(--space-2xs);font-size:var(--text-xs);text-transform:uppercase;
                letter-spacing:.06em;color:var(--neutral)}
.cr__chk,.cr__agree{display:flex;gap:var(--space-2xs);align-items:flex-start;
                    font-size:var(--text-sm);color:var(--muted);line-height:1.5;margin:var(--space-2xs) 0}
.cr__agree{margin:var(--space-sm) 0}
/* 何が残っているかを札の下に書く。出した札だけ見て終わったと思わせない
   （2026-09-26 のご指摘）。 */
.task__left{margin:var(--space-2xs) 0 0;font-size:var(--text-xs);color:var(--sig-stop);line-height:1.5}
.task__left--go{color:var(--sig-go)}

/* camera-ready の窓を「手順」に割る。地の文が続くと誰も読まない
   （2026-09-26 のご指摘）。1 つの段が 1 つの提出物に対応する。 */
.cr__step{padding:var(--space-sm) 0;border-top:1px solid var(--rule)}
.cr__step:first-of-type{border-top:0;padding-top:0}
.cr__step--wait{opacity:.7}
.cr__step--wait .cr__h{color:var(--neutral)}
/* 決まりごとは箇条書き。上限・料金・保存名はそれぞれ別の決まり。 */
.cr__rules{margin:0 0 var(--space-sm);padding-left:1.1rem;font-size:var(--text-sm);
           color:var(--neutral);line-height:1.55}
.cr__rules li{margin:var(--space-3xs) 0}
.cr__rules li b{color:var(--muted)}
/* 確認の欄。label を縦に並べる（既定の inline だと 1 段落に潰れる）。 */
.cr__set .cr__chk{display:flex;gap:var(--space-xs);align-items:flex-start;
                  margin:var(--space-xs) 0;cursor:pointer}
.cr__set .cr__chk input{margin-top:.2em;flex:none}
.cr__set .cr__chk span{flex:1}

.cr__acts{display:flex;gap:var(--space-xs);flex-wrap:wrap;margin-top:var(--space-sm)}
.cr__steps{margin:var(--space-xs) 0;padding-left:1.2rem;font-size:var(--text-sm);
           color:var(--muted);line-height:1.7}
.cr__msg{margin:var(--space-sm) var(--space-md);padding:var(--space-xs) var(--space-sm);
         border-radius:4px;font-size:var(--text-sm);background:var(--paper-3);color:var(--muted)}
.cr__msg--ok{color:var(--sig-go)}
.cr__msg--warn{color:var(--sig-wait)}
.cr__msg--stop{color:var(--sig-stop)}
@media (max-width:620px){
  .cr__tbl th{width:auto;display:block;padding-bottom:0}
  .cr__tbl td{display:block;padding-top:0}
  .cr__tbl tr + tr td{border-top:none}
}

/* ── 領収書の宛名のポップアップ ──────────────────────────────────
   register.html の中に書いていたが、「Download receipt (PDF)」は
   registration-complete.html と dashboard.html にも出る。そちらでは
   素の HTML のまま流し込まれ、ポップにならなかった
   （2026-09-21 実機で発見）。組み立ては registration-form.js、
   見た目はここ。3枚とも pass.css を読んでいる。 */
.rg-dialog { position: fixed; inset: 0; z-index: var(--z-modal);
             display: flex; align-items: center; justify-content: center;
             padding: var(--space-md); }
.rg-dialog[hidden] { display: none; }
.rg-dialog__scrim { position: absolute; inset: 0; background: var(--scrim); }
.rg-dialog__box { position: relative; width: min(520px, 100%);
                  background: var(--paper-2); border: 1px solid var(--rule-strong);
                  border-radius: var(--radius-card); padding: var(--space-md);
                  box-shadow: 0 18px 48px var(--shade); }
.rg-dialog__t { font-family: var(--font-display); font-weight: 700; font-size: var(--text-md);
                line-height: 1.25; letter-spacing: .01em; text-transform: uppercase;
                border-bottom: 2px solid var(--ink); padding-bottom: var(--space-2xs);
                margin: 0 0 var(--space-sm); }
.rg-dialog__field { display: block; margin: var(--space-sm) 0; }
.rg-dialog__field .ss-form-input { width: 100%; padding: 0 var(--space-sm); height: 40px;
    font: 400 var(--text-base) var(--font-body); color: var(--ink); background: var(--paper);
    border: 1px solid var(--rule-strong); border-radius: var(--radius-btn); }
.rg-dialog__field .ss-form-input:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.rg-dialog__field .ss-form-label { display: block; font-family: var(--font-display); font-weight: 600;
    font-size: var(--text-xs); letter-spacing: .05em; text-transform: uppercase;
    color: var(--neutral); margin-bottom: var(--space-2xs); }
.rg-dialog__field .ss-form-hint { display: block; margin-top: var(--space-2xs);
    font-size: var(--text-sm); color: var(--muted); }
.rg-pick { list-style: none; margin: 0; padding: 0;
           border: 1px solid var(--rule); border-radius: var(--radius-card);
           background: var(--paper); max-height: 240px; overflow-y: auto; }
.rg-pick li { display: flex; align-items: baseline; gap: var(--space-xs);
              padding: var(--space-2xs) var(--space-sm); border-top: 1px dotted var(--rule-strong);
              font-size: var(--text-sm); }
.rg-pick li:first-child { border-top: none; }
.rg-pick li.rg-pick-all { border-bottom: 1px solid var(--rule); font-weight: 600;
                          background: var(--paper-3); }
.rg-pick label { display: flex; align-items: baseline; gap: var(--space-xs); flex: 1; cursor: pointer; }
.rg-pick input { accent-color: var(--accent); }
.rg-pick .rg-pick-t { flex: 1; overflow-wrap: anywhere; }
.rg-pick .rg-pick-a { font-family: var(--font-mono); font-variant-numeric: tabular-nums;
                      white-space: nowrap; }
.rg-dialog__total { display: flex; justify-content: space-between; align-items: baseline;
                    margin-top: var(--space-xs); padding-top: var(--space-xs);
                    border-top: 2px solid var(--ink); font-weight: 700; }
.rg-dialog__total .rg-pick-a { font-family: var(--font-mono); font-size: var(--text-md); }
.rg-dialog__acts { display: flex; justify-content: flex-end; gap: var(--space-xs);
                   margin-top: var(--space-md); }

/* ── 寄与者コードの窓 ─────────────────────────────────────────
   学生証の窓と同じ枠に並べる。値引きの操作ではないので、合計の枠
   （.rg-side）には置かない。 */
.rg-contrib-row { display: flex; flex-wrap: wrap; gap: var(--space-xs);
                  align-items: center; margin-top: var(--space-2xs); }
.rg-contrib-input { flex: 1 1 200px; min-width: 0; height: 40px;
                    padding: 0 var(--space-sm);
                    font: 500 var(--text-base) var(--font-mono);
                    letter-spacing: .08em; text-transform: uppercase;
                    color: var(--ink); background: var(--paper);
                    border: 1px solid var(--rule-strong); border-radius: var(--radius-btn); }
.rg-contrib-input::placeholder { letter-spacing: .08em; color: var(--muted); text-transform: none; }
.rg-contrib-input:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }

/* ── 試験用のやり直し ──────────────────────────────────────
   admin かつ Stripe がテスト鍵のときにしか出ない。本物の参加者には
   一度も見えないが、見えたときに「普通の操作ではない」と分かる字面に
   しておく（薄い枠と控えめな色）。 */
.rg-reset { margin-top: var(--space-md); padding-top: var(--space-sm);
            border-top: 1px dashed var(--rule-strong); }
.rg-reset-note { margin: var(--space-2xs) 0 var(--space-xs);
                 font-size: var(--text-sm); color: var(--muted); }
.rg-reset .btn + .btn { margin-left: var(--space-xs); }
/* ダッシュボードの Registration カードの中の、試験用のやり直し。
   本物の操作と地続きに見えないよう、破線で区切る（register.html の .rg-reset と同じ）。
   釦は縦に積むので、くっつかないよう少しだけ空ける。 */
.mod__test { margin-top: var(--space-sm); padding-top: var(--space-xs);
             border-top: 1px dashed var(--rule-strong); }
.mod__test .mod__fine { margin-top: 0; }
.mod__test .btn + .btn { margin-top: var(--space-2xs); }

/* ── ひなたキャンパスの門の QR（2026-10-15）──────────────────────
   会議の券の下に置く細い券。受付の券（紺の帯）と取り違えないよう、帯を深い青緑にする
   （Wallet の門のカードと同じ色）。形・穿孔・半券は会議の券と同じ .tkt を使う。 */
.gatewrap{margin-top:var(--space-md)}
.gatewrap[hidden]{display:none}
.tkt--gate{--accent:#0f5257}
.tkt--gate .tkt__stub{justify-content:center}
.gate__body{align-items:flex-start;padding-bottom:var(--space-sm)}
.gate__text{flex:1 1 26rem;min-width:0}
.gate__t{margin:0 0 var(--space-3xs);font-family:var(--font-display);font-weight:700;font-size:var(--text-md);
         text-transform:uppercase;letter-spacing:.01em;color:var(--ink)}
.gate__p{margin:0;max-width:62ch;font-size:var(--text-sm);line-height:1.55;color:var(--muted)}
.gate__p strong{color:var(--ink)}
/* 拡大 QR を門の QR にしたときは、見出しの色で受付の QR と見分ける */
.qrpop--gate #qr-lbl{color:#0f5257;font-weight:700}