/* ver24: common/base styles shared by light and dark themes */
/* 表側専用CSS（ver21以降、管理画面は /admin/assets/css/admin.css を使用） */ @import url("https://fonts.googleapis.com/css2?family=DotGothic16&family=M+PLUS+Rounded+1c&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap");
* {
  box-sizing:border-box
}


body {
  margin:0;
  background:#0d0805;
  color:#f5e6c0;
  font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif
}


.screen {
  min-height:100svh;
  display:flex;
  flex-direction:column;
  padding:22px 18px 100px 18px;
  background:linear-gradient(180deg,#0d0805,#1e0e05 60%,#150b04)
}


.title {
  font-family:serif;
  text-align:center;
  letter-spacing:.18em;
  color:#f5e6c0;
  text-shadow:0 0 24px #c8a03044
}


.sub {
  text-align:center;
  color:#c8a060;
  font-size:12px;
  letter-spacing:.15em
}


.card {
  background:#2a160844;
  border:1px solid #8b654055;
  border-radius:8px;
  padding:14px;
  margin:12px 0
}


.btn {
  display:block;
  width:100%;
  border:0;
  border-radius:4px;
  padding:14px;
  margin:10px 0;
  background:linear-gradient(135deg,#8b2020,#c0392b,#8b2020);
  color:#f5e6c0;
  font-weight:700;
  letter-spacing:.15em
}


.btn.gold {
  background:linear-gradient(135deg,#6b4800,#c8a030,#6b4800);
  color:#1a0e05
}


.btn.outline {
  background:transparent;
  border:1px solid #c8a060;
  color:#c8a060
}


.btn.link {
  background:transparent;
  color:#e8c870;
  text-decoration:underline;
  padding:8px
}


input,
textarea,
select {
  width:100%;
  padding:12px;
  border-radius:4px;
  border:1px solid #c8a06066;
  background:#1a0e05;
  color:#e8d0a0;
  margin:6px 0 12px
}


.grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px
}


.spot {
  border:1px solid #c8a03055;
  border-radius:8px;
  padding:12px;
  text-align:center;
  background:#1e1005
}


.spot.done {
  background:#c8a030;
  color:#2a1400
}


.toast {
  position:fixed;
  left:14px;
  right:14px;
  bottom:16px;
  background:#2e1c0a;
  border:1px solid #c8a030;
  border-radius:8px;
  padding:12px;
  color:#e8c870
}


.admin {
  background:#f5f7fa;
  color:#222;
  min-height:100vh;
  padding:20px
}


.admin .panel {
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:8px;
  padding:18px;
  margin-bottom:14px
}


.admin table {
  width:100%;
  border-collapse:collapse;
  font-size:13px
}


.admin th,
.admin td {
  border-bottom:1px solid #eee;
  text-align:left;
  padding:8px
}


.admin input,
.admin select,
.admin textarea {
  background:#fff;
  color:#222;
  border:1px solid #ddd
}


.admin input:focus,
.admin select:focus,
.admin textarea:focus {
  background:#fff;
  color:#222;
  border-color:#999;
  outline:2px solid rgba(0,0,0,.08)
}


.admin .btn {
  max-width:260px;
  color:#fff;
  background:#222
}


.muted {
  color:#8b8070;
  font-size:12px
}


.error {
  color:#ff9a9a
}


.ok {
  color:#83d097
}


.goshuin {
  aspect-ratio:533/800;
  background:linear-gradient(160deg,#3a1a00,#5a2a00);
  border:1px solid #c8a030;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:serif;
  font-size:28px;
  color:#c8a030;
  margin:12px 0
}


.qrbox {
  aspect-ratio:1/1;
  background:#050505;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #c8a03044
}


.qrframe {
  width:160px;
  height:160px;
  border:3px solid #c8a030
}


.nav {
  position:sticky;
  bottom:0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  background:#0d0805cc;
  border-top:1px solid #8b654033
}


.nav button {
  background:transparent;
  color:#c8a060;
  border:0;
  padding:12px 4px;
  font-size:11px
}


.roulette-wrap {
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:14px 0 16px
}


.roulette-label {
  font-size:11px;
  color:#c8a060;
  letter-spacing:.18em;
  text-align:center
}


.roulette-slot {
  min-height:58px;
  border:1px solid #c8a03077;
  background:#1e1005;
  border-radius:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:12px;
  font-family:serif;
  font-size:18px;
  font-weight:700;
  color:#e8c870;
  letter-spacing:.08em;
  box-shadow:0 0 20px #c8a03022 inset
}


.roulette-slot.rolling {
  animation:slotPulse .12s linear infinite;
  color:#fff1b8
}


.roulette-slot.decided {
  background:linear-gradient(135deg,#2e1c0a,#4a2c08);
  border-color:#e8c870;
  color:#fff4c8;
  box-shadow:0 0 28px #c8a03055
}


@keyframes slotPulse {
  0% {
    transform:translateY(-1px);
    opacity:.75
  }
  100% {
    transform:translateY(1px);
    opacity:1
  }
}

.error-card {
  border-color:#8b2020;
  background:#2a1008;
  color:#ffb0a0
}


.btn:disabled {
  opacity:.65;
  cursor:not-allowed
}


.id-card {
  background:#2e1c0a;
  border:1px solid #c8a030;
  border-radius:10px;
  padding:18px;
  margin:16px 0;
  text-align:center;
  box-shadow:0 0 24px #c8a03022
}


.issued-id {
  font-family:serif;
  font-size:34px;
  letter-spacing:.16em;
  color:#fff1b8;
  margin:10px 0;
  text-shadow:0 0 22px #c8a03077
}


.role-tabs {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:12px 0
}


.role-tab {
  border:1px solid #c8a06066;
  background:#1a0e05;
  color:#c8a060;
  border-radius:6px;
  padding:11px 6px
}


.role-tab.active {
  background:#c8a030;
  color:#1a0e05;
  font-weight:700
}


.issued-id.small {
  font-size:21px;
  letter-spacing:.08em;
  word-break:break-all
}


.id-card.compact {
  padding:12px;
  margin:10px 0
}


.card small {
  color:#b99a68;
  line-height:1.7
}


.camera-box {
  position:relative;
  overflow:hidden;
  min-height:280px
}


.qr-video {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover
}


.camera-frame {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  background:transparent;
  box-shadow:0 0 0 999px rgba(0,0,0,.28)
}


.qr-status {
  position:absolute;
  left:12px;
  right:12px;
  bottom:12px;
  background:rgba(13,8,5,.78);
  border:1px solid #c8a03055;
  border-radius:6px;
  padding:8px;
  text-align:center;
  font-size:12px;
  color:#e8c870
}


.small-note {
  font-size:12px;
  line-height:1.7;
  color:#c8a060
}


.debug-qr {
  border:1px solid #8b654055;
  border-radius:6px;
  padding:10px;
  margin:8px 0;
  color:#8b8070
}


.debug-qr summary {
  cursor:pointer;
  font-size:12px;
  color:#c8a060
}


/* v17: 管理画面の操作ボタンはリンクらしく見えるようにする */ button,
.btn,
[onclick],
.admin button,
.admin .btn,
.admin a {
  cursor:pointer
}


.goshuin-preview {
  max-width:180px;
  max-height:260px;
  display:block;
  margin:8px 0 12px;
  border:1px solid #ddd;
  border-radius:6px;
  background:#f7f7f7;
  object-fit:contain;
  padding:4px
}


.goshuin-preview-wrap {
  margin:10px 0 14px
}


.goshuin-preview-label {
  font-size:12px;
  color:#666;
  margin-bottom:4px
}


.goshuin-img {
  width:100%;
  max-width:320px;
  aspect-ratio:533/800;
  object-fit:contain;
  background:#2e1c0a;
  border:1px solid #c8a030;
  border-radius:8px;
  margin:12px auto;
  display:block
}


/* v18: QR読み取りアラートを中央表示に変更 */ .qr-modal-backdrop {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.62);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
  padding:20px
}


.qr-modal {
  width:min(92vw,360px);
  background:#2e1c0a;
  border:1px solid #c8a030;
  border-radius:12px;
  padding:20px 18px;
  text-align:center;
  box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 28px #c8a03033
}


.qr-modal-title {
  font-family:serif;
  font-size:18px;
  font-weight:700;
  color:#fff1b8;
  letter-spacing:.12em;
  margin-bottom:10px
}


.qr-modal-message {
  font-size:14px;
  line-height:1.8;
  color:#f5e6c0
}


.qr-modal-message small {
  color:#c8a060
}


.qr-modal-actions {
  margin-top:16px;
  display:flex;
  flex-direction:column;
  gap:6px
}


.qr-modal-actions .btn {
  margin:0
}


/* v19: 必須ラベルを拠点名と分離して表示 */ .must-label {
  display:block;
  width:max-content;
  margin:0 auto 6px;
  padding:2px 8px;
  border-radius:999px;
  background:#8b2020;
  color:#f5e6c0;
  font-size:10px;
  line-height:1.3;
  letter-spacing:.12em;
  font-weight:700
}


.spot.done .must-label {
  background:#5a3a00;
  color:#fff1b8
}


.spot-name {
  display:block;
  line-height:1.45
}


/* v20: トップページのミッション再開欄を独立した枠として表示 */ .resume-box {
  margin-top:18px;
  padding:16px 14px;
  border:1px solid #c8a03088;
  border-radius:12px;
  background:#2a160866;
  box-shadow:0 0 24px #c8a03022
}


.resume-title {
  margin:0 0 10px;
  text-align:center;
  font-family:serif;
  font-size:18px;
  letter-spacing:.14em;
  color:#fff1b8
}


.resume-box input {
  margin-bottom:8px
}


.text-link {
  display:block;
  width:100%;
  border:0;
  background:transparent;
  color:#e8c870;
  text-decoration:underline;
  text-align:center;
  padding:6px 4px;
  margin:2px 0 0;
  font-size:13px;
  letter-spacing:.04em
}


/* v23: 管理画面システム設定と応募フォーム調整 */ .entry-intro {
  font-size:13px;
  line-height:1.9;
  color:#e8d0a0;
  background:#2a160844;
  border:1px solid #8b654055;
  border-radius:8px;
  padding:14px;
  margin:12px 0
}


.entry-intro p {
  margin:0 0 12px
}


.entry-intro p:last-child {
  margin-bottom:0
}


.entry-intro a {
  color:#fff1b8;
  text-decoration:underline
}


/* v24: 管理メニュー、確率入力、ユーザー登録画面の見やすさ調整 */ .auth-step-card {
  margin:14px 0;
  padding:16px 14px;
  border:1px solid #8b654066;
  border-radius:12px;
  background:#2a160866;
  box-shadow:0 0 18px #00000022
}


.auth-step-card-gold {
  border-color:#c8a03088;
  background:#2e1c0a66;
  box-shadow:0 0 24px #c8a03022
}


.auth-step-card h3 {
  margin:0 0 8px;
  font-family:serif;
  color:#fff1b8;
  font-size:17px;
  letter-spacing:.08em
}


.auth-step-card .small-note {
  margin:0 0 10px
}


/* v26: トップ導線と管理ボタン調整 */ .reception-periods {
  line-height:1.9;
  text-align:center;
  color:#f5e6c0
}


.challenge-mode-modal .qr-modal-actions .btn.outline {
  border-color:#c8a060;
  color:#c8a060;
  background:transparent
}


.auth-step-card.auth-step-locked {
  opacity:.45;
  filter:grayscale(.25);
  position:relative
}


.auth-step-card.auth-step-locked input,
.auth-step-card.auth-step-locked button {
  pointer-events:none
}


.auth-step-card.auth-step-active {
  opacity:1;
  filter:none;
  box-shadow:0 0 0 2px rgba(200,160,48,.35)
}


.auth-step-card button[disabled] {
  opacity:.6;
  cursor:not-allowed
}


/* v30: チャレンジ導線、拠点サブ名、必須ラベル調整 */ .challenge-entry-btn {
  font-size:20px;
  padding:18px 14px;
  border-radius:8px;
  letter-spacing:.18em;
  box-shadow:0 0 26px rgba(200,160,48,.35)
}


.challenge-mode-modal .challenge-solo-btn {
  background:linear-gradient(135deg,#8b2020,#d94a3a,#8b2020);
  color:#fff;
  font-size:16px
}


.challenge-mode-modal .challenge-group-btn {
  background:linear-gradient(135deg,#174a8b,#2f7fd0,#174a8b);
  color:#fff;
  font-size:16px
}


.must-label {
  font-size:13px;
  padding:4px 10px;
  margin-bottom:8px
}


.spot-name {
  font-size:17px;
  font-weight:700;
  color:#fff1b8
}


.spot-sub-name {
  display:block;
  font-size:12px;
  line-height:1.45;
  color:#c8a060;
  margin:2px 0 7px
}


.spot.done .spot-name {
  color:#2a1400
}


.spot.done .spot-sub-name {
  color:#5a3a00
}


.spot-current-name {
  text-align:center
}


.roulette-start-btn {
  font-size:1.28rem;
  font-weight:900;
  padding:16px 22px;
}


/* v32: クリア画面演出と応募フォーム必須項目表示 */ .clear-screen .title {
  margin-bottom:10px
}


.clear-illust {
  display:block;
  width:min(92%,420px);
  margin:4px auto 12px;
  border-radius:0;
  box-shadow:none;
  background:transparent
}


.clear-message {
  text-align:center;
  font-size:15px;
  line-height:1.8
}


.entry-apply-btn {
  font-size:20px;
  padding:18px 14px;
  border-radius:8px;
  letter-spacing:.15em;
  box-shadow:0 0 26px rgba(200,160,48,.35)
}


.required-note {
  color:#fff1b8;
  font-weight:700;
  border:1px solid rgba(200,160,48,.45);
  background:rgba(139,32,32,.26);
  border-radius:6px;
  padding:8px 10px
}


.entry-required {
  border:2px solid #d93025!important;
  background:#1a0e05
}


.entry-required.entry-missing {
  background:#fff!important;
  color:#222!important;
  border-color:#d93025!important
}


.entry-required.entry-missing::placeholder {
  color:#777
}


/* v34: 応募導線・下部メニュー・残り拠点表示 */ .list-entry-btn {
  font-size:20px;
  padding:18px 14px;
  border-radius:8px;
  letter-spacing:.15em;
  font-weight:900
}


.remain-badge {
  display:inline-block;
  margin-top:8px;
  padding:8px 14px;
  border:1px solid #c8a030;
  background:rgba(200,160,48,.14);
  color:#fff1b8;
  border-radius:999px;
  font-size:16px;
  font-weight:900;
  letter-spacing:.08em;
  box-shadow:0 0 18px rgba(200,160,48,.22)
}


.nav button {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  font-size:12.5px;
  font-weight:700;
  line-height:1.2;
  padding:10px 3px 9px;
  color:#e8c870
}


.nav-icon {
  display:block;
  font-size:19px;
  line-height:1;
  margin-bottom:2px
}


/* v35: スタッフ手動チェックイン（ダブルタップ起動） */ .staff-help-text span {
  display:inline-block;
  margin-top:6px;
  color:#fff1b8;
  font-weight:700
}


.confirm-list {
  display:grid;
  grid-template-columns:110px 1fr;
  gap:6px 10px;
  text-align:left;
  margin:12px 0 0;
  font-size:13px;
  line-height:1.6
}


.confirm-list dt {
  color:#c8a060;
  font-weight:700
}


.confirm-list dd {
  margin:0;
  color:#fff1b8;
  word-break:break-all
}


.qr-modal-message input {
  width:100%;
  box-sizing:border-box;
  margin-top:8px
}


/* v36: スマホ入力時の自動ズーム抑制と数字/パスワード入力補助 */ input,
textarea,
select {
  font-size:16px;
}


input[inputmode="numeric"],
input[data-digits="1"],
input[type="tel"],
input[type="password"],
input[data-latin="1"] {
  ime-mode:disabled;
}


/* v40: サービスロゴと下部メニューアイコン調整 */ .title-logo {
  letter-spacing:0;
  margin-top:18px;
  margin-bottom:18px
}


.title-logo img {
  display:block;
  width:100vw;
  max-width:100vw;
  max-height:200px;
  height:auto;
  margin:0 calc(50% - 50vw);
  object-fit:contain
}


/* v41: トップ再開フローをモーダル化、参加/再開ボタン色分け */ .top-entry-btn {
  background:linear-gradient(135deg,#8b2020,#d94a3a,#8b2020);
  color:#fff;
  font-size:20px;
  padding:18px 14px;
  border-radius:8px;
  letter-spacing:.18em;
  box-shadow:0 0 26px rgba(217,74,58,.32)
}


.top-resume-btn {
  background:linear-gradient(135deg,#174a8b,#2f7fd0,#174a8b);
  color:#fff;
  font-size:18px;
  padding:16px 14px;
  border-radius:8px;
  letter-spacing:.14em;
  box-shadow:0 0 22px rgba(47,127,208,.28)
}


.resume-mode-modal .qr-modal-message input {
  margin-top:10px;
  text-align:center;
  letter-spacing:.08em
}


.resume-mode-modal .btn.outline {
  border-color:#c8a060;
  color:#c8a060;
  background:transparent
}


.stamp-icon {
  font-family:serif;
  border:2px solid currentColor;
  border-radius:4px;
  padding:1px 4px;
  font-size:15px;
  line-height:1.05;
  box-shadow:0 0 0 1px rgba(200,160,96,.2) inset
}


.brush-icon {
  font-family:serif;
  font-size:22px;
  line-height:1;
  transform:rotate(-18deg);
  display:inline-block
}


.staff-help-text {
  cursor:default;
  -webkit-tap-highlight-color:transparent;
  user-select:none
}


/* v43 admin entry / lottery improvements */ /* v44: ライト/ダークモード */ :root {
  --app-bg:#0d0805;
  --app-bg2:#1e0e05;
  --app-text:#f5e6c0;
  --app-muted:#c8a060;
  --app-card:#2a160866;
  --app-card-border:#8b654055;
  --app-title:#f5e6c0;
  --app-title-strong:#fff1b8;
  --app-input-bg:#1a0e05;
  --app-input-text:#e8d0a0;
  --app-link:#e8c870;
  --app-nav-bg:#0d0805ee;
  --app-modal-bg:#2e1c0a;
  --app-danger:#8b2020;
  --app-gold:#c8a030;
  --map-color-done:#53c27b;
}








































/* ver03: setup/pre-launch status card */ .prelaunch-card {
  text-align:center
}


.prelaunch-card h3,
.prelaunch-card p {
  text-align:center
}


/* v45: mission layout, home icon, stamp thumbnails, QR scan effect */ .home-icon-btn {
  background:transparent;
  border:1px solid var(--app-card-border);
  color:var(--app-link);
  font-size:14px;
  letter-spacing:.08em;
  padding:12px 10px
}


.mission-start-text {
  font-size:15px;
  color:var(--app-title-strong);
  font-weight:800;
  letter-spacing:.12em;
  margin:10px 0 6px
}


.brush-img-icon {
  width:24px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 2px;
  transform:none
}


.brush-img-icon img {
  display:block;
  width:24px;
  height:24px;
  object-fit:contain;
  filter:none
}


.spot.done {
  background:rgba(200,160,48,.22);
  color:var(--app-text);
  border-color:rgba(200,160,48,.7)
}


.spot.done .spot-name {
  color:var(--app-title-strong)
}


.spot.done .spot-sub-name {
  color:var(--app-muted)
}


.spot-stamp-thumb {
  display:block;
  width:64px;
  height:84px;
  object-fit:cover;
  border-radius:6px;
  margin:0 auto 8px;
  background:var(--app-card);
  border:1px solid var(--app-card-border)
}


.goshuin-img {
  max-height:440px;
  object-fit:contain
}


.qr-scan-effect {
  position:absolute;
  left:50%;
  top:50%;
  width:170px;
  height:170px;
  transform:translate(-50%,-50%);
  pointer-events:none;
  overflow:hidden;
  border-radius:6px
}


.qr-scan-effect::before {
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:3px;
  top:-8px;
  background:rgba(255,241,184,.95);
  box-shadow:0 0 14px rgba(255,241,184,.95);
  animation:qrScanLine 1.05s ease-in-out 1
}


@keyframes qrScanLine {
  0% {
    top:-8px;
    opacity:0
  }
  18% {
    opacity:1
  }
  82% {
    opacity:1
  }
  100% {
    top:178px;
    opacity:0
  }
}





/* v48: manual load radar */ .radar-screen {
  padding-bottom:86px
}


.radar-lead {
  display:flex;
  gap:12px;
  align-items:center;
  line-height:1.7
}


.radar-lead-icon {
  width:42px;
  height:42px;
  border:2px solid var(--app-gold);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--app-gold);
  font-weight:900;
  font-size:24px;
  flex:none
}


.radar-status-card {
  text-align:center;
  margin-bottom:10px
}


.radar-canvas {
  position:relative;
  width:min(88vw,420px);
  aspect-ratio:1/1;
  margin:10px auto 16px;
  border:2px solid rgba(200,160,48,.45);
  border-radius:50%;
  background:radial-gradient(circle at center,rgba(200,160,48,.10) 0 8%,transparent 8.5% 100%),repeating-radial-gradient(circle at center,transparent 0 13.5%,rgba(200,160,48,.17) 14% 14.5%,transparent 15% 100%),linear-gradient(40deg,transparent 0 55%,rgba(200,160,48,.18) 55% 72%,transparent 72% 100%),rgba(0,0,0,.22);
  box-shadow:0 0 28px rgba(200,160,48,.16) inset,0 12px 28px rgba(0,0,0,.18);
  overflow:hidden
}


.radar-canvas:before,
.radar-canvas:after {
  content:"";
  position:absolute;
  background:rgba(200,160,48,.18)
}


.radar-canvas:before {
  left:50%;
  top:0;
  bottom:0;
  width:1px
}


.radar-canvas:after {
  top:50%;
  left:0;
  right:0;
  height:1px
}


.radar-axis {
  position:absolute;
  left:50%;
  top:7px;
  transform:translateX(-50%);
  font-weight:900;
  color:#e84d4d;
  z-index:2
}


.radar-axis.ns span {
  position:absolute;
  top:calc(min(88vw,420px) - 38px);
  left:50%;
  transform:translateX(-50%);
  color:var(--app-text)
}


.radar-axis.ew {
  left:7px;
  right:7px;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  justify-content:space-between;
  color:var(--app-text)
}


.radar-axis.ew span {
  color:var(--app-text)
}


.radar-person {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:46px;
  height:46px;
  border-radius:50%;
  border:2px solid rgba(200,160,48,.65);
  background:rgba(0,0,0,.45);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:900;
  z-index:4;
  font-size:13px
}


.radar-dot {
  position:absolute;
  transform:translate(-50%,-50%);
  width:34px;
  height:34px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.78);
  color:#fff;
  font-weight:900;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:5;
  box-shadow:0 0 16px rgba(0,0,0,.35);
  padding:0;
  margin:0;
  letter-spacing:0
}


.radar-dot.near100,
.r-dot.near100,
.radar-list-icon.near100,
.radar-badge.near100 {
  background:#d84c4c
}


.radar-dot.near300,
.r-dot.near300,
.radar-list-icon.near300,
.radar-badge.near300 {
  background:#d97a25
}


.radar-dot.near1000,
.r-dot.near1000,
.radar-list-icon.near1000,
.radar-badge.near1000 {
  background:#c8a030
}


.radar-dot.far,
.r-dot.far,
.radar-list-icon.far,
.radar-badge.far {
  background:#6f7478
}


.radar-load-btn small {
  display:block;
  font-size:12px;
  letter-spacing:.05em;
  margin-top:4px;
  opacity:.88
}


.radar-legend {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:4px;
  margin:0 0 12px;
  padding:10px;
  border:1px solid var(--app-card-border);
  border-radius:8px;
  background:var(--app-card);
  font-size:12px;
  text-align:center
}


.r-dot {
  display:inline-block;
  width:13px;
  height:13px;
  border-radius:50%;
  vertical-align:-2px;
  margin-right:4px
}


.radar-list-title {
  margin:14px 0 8px;
  color:var(--app-title-strong);
  font-size:16px
}


.radar-list {
  display:flex;
  flex-direction:column;
  gap:8px
}


.radar-list-item {
  display:grid;
  grid-template-columns:44px 1fr auto 16px;
  gap:10px;
  align-items:center;
  padding:11px 10px;
  border:1px solid var(--app-card-border);
  border-radius:10px;
  background:var(--app-card);
  cursor:pointer
}


.radar-list-icon {
  width:40px;
  height:40px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:900;
  border:1px solid rgba(255,255,255,.55)
}


.radar-list-main b {
  display:block;
  color:var(--app-title-strong);
  font-size:15px
}


.radar-list-main small {
  display:block;
  color:var(--app-muted);
  font-size:12px;
  margin-top:3px
}


.radar-list-distance {
  text-align:right
}


.radar-list-distance b {
  display:block;
  color:var(--app-text);
  font-size:16px
}


.radar-badge {
  display:inline-block;
  color:#fff;
  border-radius:999px;
  padding:2px 7px;
  font-size:10px;
  margin-top:4px
}


.radar-arrow {
  font-size:26px;
  color:var(--app-muted)
}


.radar-detail-icon {
  width:56px;
  height:56px;
  border-radius:50%;
  margin:0 auto 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#d84c4c;
  color:#fff;
  border:2px solid rgba(255,255,255,.6);
  font-weight:900
}


.radar-detail-modal h3 {
  margin:4px 0 0;
  color:var(--app-title-strong)
}






/* v49: radar layout refinements */ .radar-lead b {
  display:block;
  white-space:nowrap;
  font-size:clamp(13px,3.4vw,16px)
}


.radar-lead span {
  display:block;
  margin-top:2px;
  color:var(--app-muted);
  font-size:13px
}


.radar-load-btn {
  margin:12px 0 10px
}


.radar-heading-note {
  text-align:center;
  margin:-6px 0 10px;
  color:var(--app-muted)
}


.radar-axis.ns {
  line-height:1.05;
  text-align:center
}


.radar-axis.ns small {
  font-size:10px;
  color:var(--app-gold);
  font-weight:700
}


.radar-axis.ns span {
  font-size:12px
}


.radar-dot.required,
.r-dot.required,
.radar-list-icon.required,
.radar-badge.required,
.radar-detail-icon.required {
  background:#d84c4c!important
}


.radar-detail-icon.near100,
.radar-detail-icon.near300,
.radar-detail-icon.near1000,
.radar-detail-icon.far {
  color:#fff
}


@media (max-width:360px) {
  .radar-lead b {
    white-space:normal
  }
}

/* v50: radar sonar effect and simplified legend */ .radar-sonar,
.radar-sweep {
  pointer-events:none;
  position:absolute;
  inset:0;
  border-radius:50%;
  opacity:0;
  z-index:1
}


#radarCanvasWrap.is-scanning .radar-sonar {
  opacity:1;
  background:radial-gradient(circle at center,rgba(200,160,48,.30) 0 2%,transparent 3% 100%)
}


#radarCanvasWrap.is-scanning .radar-sonar:before,
#radarCanvasWrap.is-scanning .radar-sonar:after {
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:18%;
  height:18%;
  border:2px solid rgba(200,160,48,.58);
  border-radius:50%;
  transform:translate(-50%,-50%) scale(.25);
  animation:radarRipple 1.35s ease-out infinite;
  box-shadow:0 0 18px rgba(200,160,48,.28)
}


#radarCanvasWrap.is-scanning .radar-sonar:after {
  animation-delay:.45s
}


#radarCanvasWrap.is-scanning .radar-sweep {
  opacity:1;
  background:conic-gradient(from 0deg,rgba(200,160,48,.42) 0deg,rgba(200,160,48,.18) 28deg,transparent 60deg,transparent 360deg);
  animation:radarSweep 1.2s linear infinite;
  mix-blend-mode:screen
}


#radarCanvasWrap.is-scanning .radar-canvas {
  box-shadow:0 0 34px rgba(200,160,48,.32) inset,0 0 26px rgba(200,160,48,.18),0 12px 28px rgba(0,0,0,.18)
}


@keyframes radarRipple {
  0% {
    opacity:.95;
    transform:translate(-50%,-50%) scale(.25)
  }
  100% {
    opacity:0;
    transform:translate(-50%,-50%) scale(5.5)
  }
}

@keyframes radarSweep {
  to {
    transform:rotate(360deg)
  }
}

/* v51: radar text wrap and clearer required spot colors */ .radar-lead {
  align-items:flex-start
}


.radar-lead b {
  white-space:normal!important;
  overflow-wrap:break-word;
  word-break:normal;
  line-height:1.45;
  font-size:clamp(12px,3.15vw,15px)
}


.radar-lead span {
  font-size:clamp(11px,3vw,13px)
}


.radar-dot.near100,
.r-dot.near100,
.radar-list-icon.near100,
.radar-badge.near100,
.radar-detail-icon.near100 {
  background:#f59e0b!important
}


.radar-dot.near300,
.r-dot.near300,
.radar-list-icon.near300,
.radar-badge.near300,
.radar-detail-icon.near300 {
  background:#d97706!important
}


.radar-dot.near1000,
.r-dot.near1000,
.radar-list-icon.near1000,
.radar-badge.near1000,
.radar-detail-icon.near1000 {
  background:#b7791f!important
}


.radar-dot.far,
.r-dot.far,
.radar-list-icon.far,
.radar-badge.far,
.radar-detail-icon.far {
  background:#6f7478!important
}


.radar-dot.required,
.r-dot.required,
.radar-list-icon.required,
.radar-badge.required,
.radar-detail-icon.required {
  background:#e60033!important;
  border-color:#fff!important;
  box-shadow:0 0 0 3px rgba(230,0,51,.22),0 0 18px rgba(230,0,51,.42)!important
}


@media (max-width:380px) {
  .radar-lead {
    gap:9px
  }
  .radar-lead-icon {
    width:34px;
    height:34px;
    font-size:20px
  }
  .radar-lead b {
    font-size:12px
  }
}

/* v52: radar normal spot light-blue, button label sizing, read time spacing */ .radar-lead span {
  margin-top:4px
}


.radar-load-btn {
  font-size:inherit;
  line-height:1.35
}


.radar-load-btn .radar-main-label {
  display:block;
  font-size:18px;
  font-weight:900;
  letter-spacing:.12em
}


.radar-load-btn small {
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em
}


.radar-dot.near100,
.r-dot.near100,
.radar-list-icon.near100,
.radar-badge.near100,
.radar-detail-icon.near100,
.radar-dot.near300,
.r-dot.near300,
.radar-list-icon.near300,
.radar-badge.near300,
.radar-detail-icon.near300,
.radar-dot.near1000,
.r-dot.near1000,
.radar-list-icon.near1000,
.radar-badge.near1000,
.radar-detail-icon.near1000,
.radar-dot.far,
.r-dot.far,
.radar-list-icon.far,
.radar-badge.far,
.radar-detail-icon.far {
  background:#9ddff5!important;
  color:#073047!important;
  border-color:#e8fbff!important
}


.radar-dot.required,
.r-dot.required,
.radar-list-icon.required,
.radar-badge.required,
.radar-detail-icon.required {
  background:#e60033!important;
  color:#fff!important;
  border-color:#fff!important;
  box-shadow:0 0 0 3px rgba(230,0,51,.22),0 0 18px rgba(230,0,51,.42)!important
}


/* v54: cleared mission entry button in progress area */ .inline-entry-btn {
  display:inline-flex;
  width:auto;
  min-width:180px;
  margin-top:10px;
  padding:12px 22px;
  align-items:center;
  justify-content:center;
}


/* v57: schedule control UI */ .spot.inactive {
  opacity:.42;
  filter:grayscale(.35);
  pointer-events:none
}


.grid-inactive .spot {
  cursor:not-allowed
}


.start-badge {
  background:rgba(47,127,208,.14);
  border-color:#2f7fd0;
  color:#d8ecff
}


.btn.danger,
.btn.danger:disabled {
  background:#c62828!important;
  color:#fff!important;
  opacity:1
}


.challenge-ended-message {
  text-align:center;
  font-size:18px;
  font-weight:900;
  color:var(--app-title-strong);
  padding:22px 14px
}


.reception-periods {
  line-height:1.75;
  font-size:13px
}




/* v58: schedule visibility and pre-start navigation lock */ .nav.nav-locked {
  opacity:.42;
  filter:grayscale(.35)
}


.nav.nav-locked button {
  pointer-events:auto;
  cursor:not-allowed
}


.reception-periods .schedule-item {
  transition:opacity .2s ease,filter .2s ease
}


.reception-periods .schedule-item.expired {
  opacity:.38;
  filter:grayscale(.4)
}


.closed-message {
  text-align:center;
  font-size:18px;
  font-weight:900;
  color:var(--app-title-strong)
}


/* v59: login keep */ .keep-login-box {
  display:flex;
  align-items:center;
  gap:8px;
  margin:12px 0;
  padding:10px 12px;
  border:1px solid var(--border, rgba(255,255,255,.18));
  border-radius:12px;
  background:var(--card-bg, rgba(255,255,255,.06));
  color:var(--text, inherit);
  font-size:14px;
  line-height:1.4;
}


.keep-login-box input {
  width:auto;
  min-width:18px;
  height:18px;
  margin:0;
}


.radar-lead b small {
  display:block;
  margin-top:4px;
  font-weight:500;
  line-height:1.45;
}


/* v61: Tomyo Map / Leaflet map screen */ .map-screen .map-lead {
  line-height:1.6;
  margin-bottom:10px
}


.map-screen .map-lead b {
  display:block;
  color:var(--app-title-strong);
  font-size:15px
}


.map-screen .map-lead small {
  display:block;
  color:var(--app-muted);
  font-size:12px;
  margin-top:4px
}


.map-load-btn {
  margin:0 0 10px
}


.tomyo-map {
  width:100%;
  height:52vh;
  min-height:330px;
  max-height:520px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--app-card-border);
  background:var(--app-card);
  box-shadow:0 12px 28px rgba(0,0,0,.18);
  position:relative;
  z-index:1
}


.tomyo-map .leaflet-control-attribution {
  font-size:10px
}


.map-loading {
  display:flex;
  align-items:center;
  justify-content:center;
  height:100%;
  color:var(--app-muted);
  font-weight:700
}


.map-status {
  text-align:center;
  margin:8px 0 10px;
  color:var(--app-muted)
}


.tomyo-map-div-icon,
.tomyo-map-user-icon {
  background:transparent;
  border:none
}


.map-pin {
  width:34px;
  height:34px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:900;
  border:2px solid rgba(255,255,255,.95);
  box-shadow:0 4px 14px rgba(0,0,0,.34);
  color:#073047;
  background:#9ddff5
}


.map-pin.required {
  background:#e60033;
  color:#fff;
  box-shadow:0 0 0 3px rgba(230,0,51,.25),0 4px 14px rgba(0,0,0,.34)
}


.map-pin.done {
  background:var(--map-color-done,#53c27b);
  color:#fff
}


.map-user-pin {
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:28px;
  border-radius:999px;
  background:#111;
  color:#fff;
  border:2px solid #fff;
  font-size:12px;
  font-weight:900;
  box-shadow:0 4px 14px rgba(0,0,0,.35)
}




.map-user-compass {
  position:relative;
  width:64px;
  height:64px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(20,44,88,.92);
  border:3px solid #fff;
  box-shadow:0 4px 16px rgba(0,0,0,.45),0 0 0 4px rgba(46,143,255,.18);
  color:#fff;
  font-weight:900;
  font-size:10px;
  box-sizing:border-box
}


.map-user-compass em {
  position:absolute;
  bottom:7px;
  left:0;
  right:0;
  text-align:center;
  font-style:normal;
  line-height:1;
  text-shadow:0 1px 4px rgba(0,0,0,.7)
}


.map-user-arrow {
  position:absolute;
  left:50%;
  top:50%;
  width:38px;
  height:38px;
  margin-left:-19px;
  margin-top:-19px;
  transform-origin:50% 50%;
  transition:transform .18s linear
}


.map-user-arrow span {
  position:absolute;
  left:50%;
  top:3px;
  width:0;
  height:0;
  margin-left:-8px;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-bottom:24px solid #4db7ff;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.55))
}


.map-user-arrow span:after {
  content:"";
  position:absolute;
  left:-4px;
  top:9px;
  width:8px;
  height:16px;
  background:#4db7ff;
  border-radius:4px
}


.map-user-compass.no-heading .map-user-arrow {
  opacity:.35
}


.map-user-compass.has-heading {
  border-color:#eaf6ff;
  box-shadow:0 4px 16px rgba(0,0,0,.45),0 0 0 5px rgba(77,183,255,.22)
}




.map-list-item .radar-list-icon.done,
.radar-badge.done,
.radar-detail-icon.done {
  background:var(--map-color-done,#53c27b)!important;
  color:#07361a!important;
  border-color:#e9fff0!important
}


.map-list-item .radar-list-icon.normal,
.radar-badge.normal,
.radar-detail-icon.normal {
  background:#9ddff5!important;
  color:#073047!important;
  border-color:#e8fbff!important
}


@media (max-width:380px) {
  .tomyo-map {
    height:48vh;
    min-height:300px
  }
  .map-screen .map-lead b {
    font-size:14px
  }
}

.map-fallback {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:18px;
  color:var(--app-muted);
  font-weight:700;
  background:var(--app-card)
}


/* v63: Leaflet CSS fallback for SPA/PWA environments where CDN CSS is blocked or delayed */ .leaflet-container {
  position:relative;
  overflow:hidden;
  outline:0;
  touch-action:pan-x pan-y;
  background:#ddd;
  font:12px/1.5 "Helvetica Neue",Arial,Helvetica,sans-serif;
}


.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane>svg,
.leaflet-pane>canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
  position:absolute;
  left:0;
  top:0;
}


.leaflet-container img.leaflet-tile,
.leaflet-container img.leaflet-marker-icon,
.leaflet-container img.leaflet-marker-shadow {
  max-width:none!important;
  max-height:none!important;
}


.leaflet-tile {
  filter:inherit;
  visibility:hidden;
  border:0;
}


.leaflet-tile-loaded {
  visibility:inherit;
}


.leaflet-marker-icon,
.leaflet-marker-shadow {
  display:block;
}


.leaflet-container .leaflet-overlay-pane svg {
  max-width:none!important;
  max-height:none!important;
}


.leaflet-control {
  position:relative;
  z-index:800;
  pointer-events:auto;
  float:left;
  clear:both;
}


.leaflet-top,
.leaflet-bottom {
  position:absolute;
  z-index:1000;
  pointer-events:none;
}


.leaflet-top {
  top:0
}


.leaflet-right {
  right:0
}


.leaflet-bottom {
  bottom:0
}


.leaflet-left {
  left:0
}


.leaflet-top .leaflet-control {
  margin-top:10px
}


.leaflet-bottom .leaflet-control {
  margin-bottom:10px
}


.leaflet-left .leaflet-control {
  margin-left:10px
}


.leaflet-right .leaflet-control {
  margin-right:10px;
  float:right;
}


.leaflet-control-zoom a {
  display:block;
  width:30px;
  height:30px;
  line-height:30px;
  text-align:center;
  text-decoration:none;
  background:#fff;
  color:#111;
  border-bottom:1px solid #ccc;
  font-weight:700;
  font-size:18px;
}


.leaflet-control-zoom a:first-child {
  border-radius:4px 4px 0 0
}


.leaflet-control-zoom a:last-child {
  border-radius:0 0 4px 4px;
  border-bottom:0
}


.leaflet-control-attribution {
  background:rgba(255,255,255,.75);
  padding:0 5px;
  color:#333;
}


.leaflet-control-attribution a {
  color:#0078a8;
  text-decoration:none;
}


.leaflet-popup {
  position:absolute;
  text-align:center;
  margin-bottom:20px;
}


.leaflet-popup-content-wrapper {
  padding:1px;
  text-align:left;
  border-radius:12px;
  background:#fff;
  color:#333;
  box-shadow:0 3px 14px rgba(0,0,0,.4);
}


.leaflet-popup-content {
  margin:13px 19px;
  line-height:1.4;
}


.leaflet-popup-tip-container {
  width:40px;
  height:20px;
  position:absolute;
  left:50%;
  margin-left:-20px;
  overflow:hidden;
  pointer-events:none;
}


.leaflet-popup-tip {
  width:17px;
  height:17px;
  padding:1px;
  margin:-10px auto 0;
  transform:rotate(45deg);
  background:#fff;
  box-shadow:0 3px 14px rgba(0,0,0,.4);
}


.tomyo-map .leaflet-map-pane {
  z-index:200
}


.tomyo-map .leaflet-tile-pane {
  z-index:200
}


.tomyo-map .leaflet-overlay-pane {
  z-index:400
}


.tomyo-map .leaflet-marker-pane {
  z-index:600
}


.tomyo-map .leaflet-tooltip-pane {
  z-index:650
}


.tomyo-map .leaflet-popup-pane {
  z-index:700
}


/* v65/v71: map navigation and marker refinements */ .nav {
  grid-template-columns:repeat(4,1fr)
}


.map-screen .map-lead small {
  line-height:1.55
}


.map-status {
  display:none!important
}


.map-pin-wrap {
  position:relative;
  width:52px;
  height:54px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  pointer-events:auto
}


.map-distance-label {
  position:absolute;
  left:50%;
  top:0;
  transform:translateX(-50%);
  padding:2px 5px;
  border-radius:999px;
  background:rgba(16,12,8,.9);
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 2px 8px rgba(0,0,0,.3)
}




.map-pin-wrap .map-pin {
  position:absolute;
  bottom:0;
  left:50%;
  transform:translateX(-50%)
}


.map-user-compass {
  width:42px;
  height:42px;
  font-size:0;
  border-width:2px;
  box-shadow:0 3px 12px rgba(0,0,0,.38),0 0 0 3px rgba(46,143,255,.18)
}


.map-user-compass em {
  display:none!important
}


.map-user-arrow {
  width:30px;
  height:30px;
  margin-left:-15px;
  margin-top:-15px
}


.map-user-arrow span {
  top:2px;
  margin-left:-6px;
  border-left-width:6px;
  border-right-width:6px;
  border-bottom-width:20px
}


.map-user-arrow span:after {
  left:-3px;
  top:8px;
  width:6px;
  height:13px
}


@media (max-width:380px) {
  .nav button {
    font-size:11.5px
  }
  .map-distance-label {
    font-size:9px
  }
}

/* v66: phone-only registration */ .group-phone-list input {
  margin-bottom:8px
}


/* v67: top navigation and disabled stamp menu */ .nav button.disabled {
  opacity:.38;
  filter:grayscale(.35);
  cursor:not-allowed
}


.nav.nav-top {
  margin-top:auto
}


.register-confirm-modal .qr-modal-message b {
  color:var(--app-accent,#e8c870);
  font-size:1.08em
}


.event-notice-image img,
.event-info-image {
  max-width:100%;
  border-radius:16px;
  margin:14px auto;
  display:block
}


.event-info-card {
  text-align:center
}


.admin-disabled-block,
.admin-disabled-row,
.disabled-cell {
  opacity:.45;
  pointer-events:none
}


.muted-badge {
  background:#777!important
}


.map-pin.noqr {
  background:#fff!important;
  color:#222!important;
  border:2px solid #777!important
}


.radar-list-icon.noqr,
.radar-badge.noqr {
  background:#fff!important;
  color:#222!important;
  border:1px solid #777!important
}


.nav button {
  min-width:0
}


/* v71: embed map, marker cursor, and four-button bottom navigation fixes */ .nav {
  grid-template-columns:repeat(4,1fr)!important
}


.nav button {
  width:100%;
  min-width:0
}


.tomyo-map .leaflet-marker-icon,
.tomyo-map-div-icon,
.map-pin-wrap,
.map-pin,
.map-list-item {
  cursor:pointer
}


.map-embed-toolbar {
  padding:10px 12px 8px;
  background:var(--app-bg,#0d0805)
}


.map-embed-toolbar .btn {
  margin:0 0 6px;
  padding:11px 10px
}


.map-embed-toolbar small {
  display:block;
  text-align:center;
  color:var(--app-muted);
  font-size:11px;
  line-height:1.5
}


.map-embed-screen {
  min-height:100%;
  padding:0 0 16px!important;
  background:var(--app-bg,#0d0805)
}


.tomyo-map.tomyo-map-embed {
  height:62vh;
  min-height:340px;
  max-height:none;
  border-radius:0;
  border-left:0;
  border-right:0
}


.map-embed-list-title {
  margin:14px 14px 8px
}


.map-embed-list {
  padding:0 12px 16px
}


@media (max-width:480px) {
  .tomyo-map.tomyo-map-embed {
    height:58vh;
    min-height:300px
  }
  .map-embed-toolbar {
    padding:8px 10px
  }
  .map-embed-toolbar small {
    font-size:10.5px
  }
}

/* v72: PC embed map refinements */ @media (hover:hover) and (pointer:fine) and (min-width:761px) {
  .tomyo-embed-body .map-embed-toolbar {
    display:none!important
  }
  .tomyo-embed-body .tomyo-map.tomyo-map-embed {
    height:78vh!important;
    min-height:520px!important
  }
  .tomyo-embed-body .tomyo-map-user-icon,.tomyo-embed-body .map-user-compass {
    display:none!important
  }
}

@media (pointer:coarse),(max-width:760px) {
  .tomyo-embed-body .tomyo-map.tomyo-map-embed {
    height:58vh!important;
    min-height:300px!important
  }
  .tomyo-embed-body .map-embed-toolbar {
    display:block
  }
}

/* v73: force-hide embed location UI on desktop */ @media (min-width:761px) {
  body.tomyo-embed-body .map-embed-toolbar,   body.tomyo-embed-body #mapLocateBtn {
    display:none!important;
  }
}

.gaiyo {
  text-align:center;
  color:#c8a060;
  font-size:12px;
  letter-spacing:.15em;
  white-space:pre-wrap;
  line-height:1.7;
  margin:6px 0 12px
}


.qr-modal-message h3 {
  margin-bottom:0
}


.sub {
  margin:0
}


.gaiyo {
  color:var(--app-text);
  font-size:13px
}


/* ver07: admin refinements */ /* ver09 admin refinements */ /* ver10: selectable public fonts and GPS check-in */ body.app-font-noto-sans-jp {
  font-family:"Noto Sans JP",sans-serif
}


body.app-font-noto-serif-jp {
  font-family:"Noto Serif JP",serif
}


body.app-font-m-plus-rounded-1c {
  font-family:"M PLUS Rounded 1c",sans-serif
}


body.app-font-dotgothic16 {
  font-family:"DotGothic16",sans-serif
}


#app .title,
#app .roulette-slot,
#app .issued-id,
#app .qr-modal-title,
#app .resume-title,
#app .auth-step-card h3,
#app .stamp-icon,
#app .brush-icon {
  font-family:inherit
}


.gps-checkin-card {
  text-align:center
}


.gps-status {
  margin:12px 0;
  padding:12px;
  border-radius:8px;
  border:1px solid var(--app-card-border);
  background:var(--app-card);
  line-height:1.7
}


.gps-status.in-range {
  border-color:#4a9b5c
}


.gps-status.out-range {
  border-color:#b78435
}


.gps-distance {
  font-size:1.1em;
  font-weight:700
}


.gps-checkin-btn[disabled] {
  opacity:.45;
  filter:grayscale(.25);
  cursor:not-allowed
}


/* ver11: common radius, Font Awesome nav, debug mode, drag/drop */ .nav-icon i {
  font-size:21px;
  line-height:1;
  display:inline-block
}


.debug-mode-badge {
  position:fixed;
  top:8px;
  right:8px;
  z-index:12000;
  background:#b00020;
  color:#fff;
  border:2px solid #fff;
  border-radius:5px;
  padding:5px 9px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  box-shadow:0 2px 10px rgba(0,0,0,.35)
}


.gps-btn-disabled {
  opacity:.45;
  filter:grayscale(.25);
  cursor:not-allowed
}


.gps-staff-help {
  margin-top:4px!important
}


/* ver12 pooled fixes */ /* ver13 */ .spot-row-paused {
  background:#d4d9dc!important
}


.spot-row-private {
  background:#898989!important;
  color:#d4d9dc!important
}


.spot-row-private td,
.spot-row-private a,
.spot-row-private small {
  color:#d4d9dc!important
}


.admin-disabled-block {
  opacity:.5;
  pointer-events:none
}


.spot-icon-detail {
  width:180px;
  height:180px;
  object-fit:cover;
  object-position:center;
  display:block;
  margin:0 auto 12px
}


.spot-icon-list {
  width:96px;
  height:96px;
  object-fit:cover;
  object-position:center;
  display:block;
  margin:0 auto 8px
}


/* ver14 admin and spot image refinements */ .spot-icon-list-default {
  width:56px;
  height:56px;
  margin:0 auto 8px;
  display:flex;
  align-items:center;
  justify-content:center
}


/* ===== Event Stamp Rally Service ver16 ===== */ .remain-badge {
  margin-bottom:30px
}


.clear-rule-line {
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin:8px 0
}


.clear-rule-input {
  width:15%!important;
  min-width:70px!important;
  display:inline-block!important;
  margin:0!important
}


.locked-setting-alert {
  color:#d40000!important;
  font-weight:900!important;
  margin:8px 0 0!important
}


.start-lock-list {
  margin:10px 0 14px 1.4em;
  padding:0
}


.start-lock-list li {
  margin:7px 0
}


.required-spot-card {
  border:2px solid #e60033!important;
  box-shadow:0 0 0 2px rgba(230,0,51,.10)
}


.required-spot-card .must-label {
  background:#e60033!important;
  color:#fff!important
}




.ver16-lock-wrap.admin-setting-locked .setting-row {
  opacity:.5
}


/* ===== Event Stamp Rally Service ver17 ===== */ /* ===== ver18 selected-font consistency ===== */ #app h1,
#app h2,
#app h3,
#app h4,
#app h5,
#app h6,
#app .title,
#app .roulette-slot,
#app .issued-id,
#app .qr-modal-title,
#app .resume-title,
#app .auth-step-card h3,
#app .stamp-icon,
#app .brush-icon,
#app .goshuin {
  font-family:inherit
}


.clear-rule-note {
  margin:4px 0 10px 1em
}


/* ver21: 管理画面から設定できる「使い方」 */ .usage-guide-modal {
  align-items:flex-start;
  overflow-y:auto;
  padding-top:max(20px,env(safe-area-inset-top))
}


.usage-guide-box {
  width:min(94vw,680px);
  margin:auto;
  max-height:none;
  text-align:left
}


.usage-guide-box .qr-modal-title {
  text-align:center
}


.usage-guide-content {
  font-size:14px;
  line-height:1.9;
  color:var(--app-text);
  overflow-wrap:anywhere
}


.usage-guide-content h1,
.usage-guide-content h2,
.usage-guide-content h3,
.usage-guide-content h4 {
  color:var(--app-title-strong);
  line-height:1.45;
  margin:1.2em 0 .55em
}


.usage-guide-content p {
  margin:.65em 0
}


.usage-guide-content ul,
.usage-guide-content ol {
  padding-left:1.5em
}


.usage-guide-content img {
  max-width:100%;
  height:auto
}


.usage-guide-content a {
  color:var(--app-link);
  text-decoration:underline
}


.usage-guide-content table {
  width:100%;
  border-collapse:collapse
}


.usage-guide-content th,
.usage-guide-content td {
  border:1px solid var(--app-card-border);
  padding:7px
}


/* =========================================================
   White theme adjustments - 2026-08-19
   ========================================================= */


/* White theme: unify red gradient buttons to solid red */


/* White theme: unify blue gradient buttons to solid blue */












/* White theme: remove decorative box shadows */


/* =========================================================
   White theme adjustments - additional pass 2026-08-19
   ========================================================= */


































/* =========================================================
   White theme adjustments - final pass for ver22
   ========================================================= */
















/* ===== ver24 common refinements ===== */
.title {
  font-size:1.8em;
}

.btn {
  font-size:1.1em;
}

.qr-modal-message h3 {
  margin-bottom:0;
  font-size:1.5em;
}

.usage-guide-box .qr-modal-title {
  text-align:center;
  font-size:1.8em;
}

.usage-guide-content div.wrap {
  padding:0 0 0 20px;
  margin-bottom:30px;
}

.qrbox {
  aspect-ratio:1 / 1;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.remain-badge {
  display:inline-block;
  margin-top:15px;
  padding:8px 20px;
  border:none;
  border-radius:999px;
  font-size:16px;
  font-weight:900;
  letter-spacing:.08em;
  box-shadow:none;
}

/* ===== ver25 common refinements ===== */
.goshuin-img {
  width:100%;
  max-width:320px;
  aspect-ratio:unset;
  object-fit:contain;
  background:#2e1c0a;
  border:1px solid #c8a030;
  border-radius:8px;
  margin:12px auto;
  display:block;
}

.mission-start-leader-label {
  font-size:14px;
  font-weight:bold;
}

.spot.done small {
  font-weight:bold;
  font-size:1.1em;
  background:#b00020;
  color:#fff462 !important;
  padding:4px 17px;
  border-radius:5px;
}

.map-screen .map-lead small {
  font-weight:bold;
  font-size:1.1em;
  background:#efefef;
  padding:10px 20px;
  border-radius:5px;
}


/* ===== ver26 map layering, route guidance, and pooled refinements ===== */
:root {
  --map-color-required:#e60033;
  --map-color-cin:#9ddff5;
  --map-color-no-checkin:#ffffff;
}
.nav {
  position:fixed;
  z-index:3000 !important;
}
.tomyo-map {
  position:relative;
  z-index:1;
}
.map-pin { background:var(--map-color-cin,#9ddff5); }
.map-pin.required { background:var(--map-color-required,#e60033); }
.map-pin.noqr { background:var(--map-color-no-checkin,#fff) !important; }
.qr-modal-message h3 {
  text-align:center;
}
.gaiyo {
  text-align:left;
}
.route-info-panel {
  margin:10px 0;
  padding:12px 14px;
  background:var(--app-bg2,var(--app-card,#fff));
  border:1px solid var(--app-card-border,#ccc);
  border-radius:10px;
}
.route-info-panel[hidden] { display:none !important; }
.route-destination { display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; }
.route-destination small { font-size:12px; font-weight:700; }
.route-destination b { font-size:1.05em; }
.route-summary { display:flex; gap:12px; align-items:center; margin-top:6px; flex-wrap:wrap; }
.route-back-btn { margin-top:10px; }
.tomyo-walking-route { stroke:#2b72d6; }

.route-provider-note {
  margin-top:6px;
  font-size:11px;
  color:var(--app-muted,var(--app-text,#555));
}
.route-provider-note a { color:inherit; text-decoration:underline; }


/* ver27 */
.nav{width:100%;}
.map-screen.route-active>.map-lead,.map-screen.route-active>.map-load-btn,.map-screen.route-active>.map-embed-toolbar{display:none!important}
.route-action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.route-action-row .btn{min-width:0;margin:0}.map-provider-note{font-size:.75em;margin:6px 2px 12px}.spot-category-label{display:inline-block;width:max-content;padding:2px 8px;border-radius:999px;margin-top:4px}.map-category-filter{display:block;margin:8px 0 14px;font-weight:700}.map-category-filter select{display:block;width:100%;margin-top:5px;padding:10px;font-size:16px}.radar-list-icon.required{background:var(--map-color-required,#e60033)!important}.radar-list-icon.near100{background:var(--map-color-cin,#9ddff5)!important}.radar-list-icon.noqr{background:var(--map-color-no-checkin,#fff)!important}
/* ver29 */
.radar-list-main small{font-size:11px;margin-top:5px}.radar-list-main .spot-category-label{display:inline-block;margin-right:5px;padding:2px 5px;border-radius:0}.map-category-filter{display:flex;align-items:center;gap:10px;margin:8px 0 14px;font-weight:700}.map-category-filter select{display:block;flex:1;width:auto;margin-top:0;padding:10px;font-size:16px}.radar-list-title{text-align:center;font-size:20px}.map-list-item[hidden]{display:none!important}.map-spot-legend{text-align:center;font-size:12px;margin:-4px 0 10px}.map-spot-legend .legend-square{font-size:16px;line-height:1;vertical-align:-1px;margin-left:6px}.map-spot-legend .legend-square:first-child{margin-left:0}@media(max-width:480px){.map-category-filter{align-items:flex-start;flex-wrap:wrap}.map-category-filter select{min-width:0;width:100%}}

/* ver35: configurable map icon text colors */
.map-pin { color:var(--map-text-color-cin,#073047) !important; }
.map-pin.required { color:var(--map-text-color-required,#fff) !important; }
.map-pin.noqr { color:var(--map-text-color-no-checkin,#073047) !important; }
.map-pin.done { color:var(--map-text-color-done,#fff) !important; }
.map-list-item .radar-list-icon.done,.radar-badge.done,.radar-detail-icon.done { color:var(--map-text-color-done,#fff) !important; }