/* 缶バッジ受付システム 共通スタイル（スマホ優先） */
* { box-sizing: border-box; }
body { margin:0; font-family: -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif; background:#faf7f5; color:#333; }
header.top { background:#5b3a29; color:#fff; padding:12px 16px; display:flex; justify-content:space-between; align-items:center; }
header.top a { color:#ffe9c9; text-decoration:none; font-size:.9em; }
header.top .brand { font-weight:700; }
main { max-width:720px; margin:0 auto; padding:16px; }
.card { background:#fff; border-radius:12px; padding:16px; margin-bottom:16px; box-shadow:0 1px 4px rgba(0,0,0,.08); }
h1 { font-size:1.3em; } h2 { font-size:1.1em; margin-top:0; }
label { display:block; font-size:.9em; margin:10px 0 4px; font-weight:600; }
input[type=text],input[type=password],input[type=date],input[type=number],select,input[type=color] {
  width:100%; padding:10px; font-size:16px; border:1px solid #ccc; border-radius:8px; background:#fff;
}
.btn { display:inline-block; background:#e07b39; color:#fff; border:none; padding:12px 20px; border-radius:999px;
  font-size:1em; font-weight:700; cursor:pointer; text-decoration:none; text-align:center; }
.btn.sub { background:#8a6d5c; } .btn.danger { background:#b0413e; } .btn:disabled { opacity:.5; }
.btn.block { display:block; width:100%; margin-top:12px; }
.err { background:#fdecea; color:#a12622; padding:10px 12px; border-radius:8px; }
.ok { background:#e8f6ec; color:#1d6b38; padding:10px 12px; border-radius:8px; }
.note { font-size:.85em; color:#777; }
table.list { width:100%; border-collapse:collapse; font-size:.9em; }
table.list th, table.list td { border-bottom:1px solid #eee; padding:8px 6px; text-align:left; vertical-align:middle; }
table.list img.thumb { width:52px; height:52px; object-fit:cover; border-radius:50%; border:1px solid #ddd; }
.badge-phase { display:inline-block; padding:2px 10px; border-radius:999px; background:#ffe9c9; font-size:.8em; font-weight:700; }
.qr-placeholder { border:2px dashed #bbb; border-radius:12px; padding:28px 12px; text-align:center; color:#888; background:#fcfcfc; word-break:break-all; }
.sim-wrap { position:relative; width:min(92vw,420px); margin:0 auto; aspect-ratio:1; }
.sim-wrap canvas { position:absolute; inset:0; width:100%; height:100%; border-radius:50%; touch-action:none; }
.sim-wrap svg.guides { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.controls { max-width:420px; margin:12px auto 0; }
.controls input[type=range] { width:100%; }
.row { display:flex; gap:8px; } .row > * { flex:1; }
@media print { header.top, .no-print { display:none !important; } main { max-width:none; } .card { box-shadow:none; }
  /* 折りたたみ（details）は印刷時に展開して表示する。主に assets/print-expand.js の
     beforeprint で open 属性を付けるのが本命で、これは描画系への保険。 */
  details.details .detail-body { display:block !important; }
}

/* ===== 主催者向けシンプル表示（レンタル側はシンプル最優先） ===== */
.event-name { font-size:1.6em; margin:0 0 6px; }
.period-big { font-size:1.15em; font-weight:700; margin:4px 0; }
.remain-big { font-size:1.3em; font-weight:800; color:#b45a1b; margin:6px 0; }
.steps { display:flex; gap:10px; flex-wrap:wrap; }
.step { flex:1 1 150px; background:#fff7f0; border:2px solid #f3d9c4; border-radius:12px; padding:14px 10px; text-align:center; }
.step .num { display:inline-block; width:2em; height:2em; line-height:2em; border-radius:50%; background:#e07b39; color:#fff; font-size:1.3em; font-weight:800; margin-bottom:6px; }
.step .step-title { display:block; font-size:1.15em; font-weight:800; margin-bottom:4px; }
.step .step-desc { font-size:.9em; color:#555; }
ul.points { margin:8px 0; padding-left:1.4em; font-size:1.05em; line-height:1.9; }
details.details { margin-top:10px; border-top:1px dashed #ddd; padding-top:8px; }
details.details summary { cursor:pointer; color:#8a6d5c; font-size:.9em; font-weight:700; }
details.details .detail-body { font-size:.9em; color:#555; margin-top:8px; }
/* 主催者向け簡易受付カード */
.sub-card { display:flex; gap:14px; align-items:center; padding:12px 4px; border-bottom:1px solid #eee; }
.sub-card:last-child { border-bottom:none; }
.sub-card input[type=checkbox] { width:26px; height:26px; flex:none; }
.sub-card img.big-thumb { width:88px; height:88px; object-fit:cover; border-radius:50%; border:1px solid #ddd; flex:none; }
.sub-card .no-thumb { width:88px; height:88px; border-radius:50%; background:#f0f0f0; color:#999; display:flex; align-items:center; justify-content:center; font-size:.8em; flex:none; text-align:center; }
.sub-card .info { flex:1; min-width:0; }
.sub-card .code-big { font-size:1.5em; font-weight:800; letter-spacing:.03em; }
.st-label { display:inline-block; padding:4px 16px; border-radius:999px; font-weight:800; font-size:1em; }
.st-received { background:#fde68a; color:#7c4a03; }
.st-printed { background:#bfdbfe; color:#1e40af; }
.st-completed { background:#bbf7d0; color:#166534; }
.st-gone { background:#e5e7eb; color:#555; }
.btn.big { padding:16px 28px; font-size:1.15em; }
a.btn-link { display:inline-block; padding:10px 18px; border-radius:999px; font-weight:700; text-decoration:none; margin:4px 4px 0 0; }
a.btn-link.primary { background:#e07b39; color:#fff; }
a.btn-link.sub { background:#efe6df; color:#5b3a29; }
a.btn-link.small { padding:6px 12px; font-size:.85em; background:none; color:#8a6d5c; text-decoration:underline; }