/* The look of 継ぎ目 ― 六面の避難棟: override design tokens only (see css/theme.css for the list). Start from a kit theme (data-theme in
   index.html and game.json "theme": dark-industrial | paper-light | retro-crt) and change what is yours. */
[data-theme="dark-industrial"] {
  /* --gf-accent: #d98a2b;  --gf-accent-ink: #1a1206;  --gf-radius: 4px;  --gf-font: 'Noto Sans JP', sans-serif; */
}

/* 継ぎ目: the next-room line under the goal, the incoming-call chip, the map */
.ts-next { margin-top: 6px; padding: 6px 10px; border-left: 3px solid #ffb020; background: rgba(10, 14, 16, 0.78); color: #f3ead6; font-size: 14px; line-height: 1.45; border-radius: 4px; max-width: var(--gf-hud-w, 360px); }
.ts-next.hidden { display: none; }
.ts-chip { position: fixed; left: 50%; bottom: calc(214px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 30; display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 16px; border: 1px solid #2fbf8a; border-radius: 24px; background: rgba(8, 20, 18, 0.9); color: #e8f5ee; font-size: 15px; white-space: nowrap; cursor: pointer; }
.ts-chip.hidden { display: none; }
.ts-chip b { color: #ffd27a; font-weight: 700; }
.ts-chip-dot { width: 10px; height: 10px; border-radius: 50%; background: #2fbf8a; /* pair-ok */ animation: ts-blink 1s infinite; }
@keyframes ts-blink { 50% { opacity: 0.25; } }
body.touch .ts-chip { bottom: calc(214px + env(safe-area-inset-bottom)); }
@media (max-height: 420px) { .ts-chip, body.touch .ts-chip { bottom: auto; top: calc(50% + 72px); } }
.ts-map-wrap { color: var(--gf-ink, #e6e6e6); overflow-x: auto; }
.ts-map { width: 100%; min-width: 700px; height: auto; display: block; }   /* phones scroll it sideways: the room names stay readable */
.ts-map-floor { fill: #9fb4ae; font-size: 14px; }
.ts-map-room { fill: #1c2a28; stroke: #6fa79a; stroke-width: 2; }
.ts-map-room.here { fill: #234a3e; stroke: #8ef0c8; stroke-width: 3; }
.ts-map-room.goal { stroke: #ffb020; stroke-width: 3; stroke-dasharray: 6 4; }
.ts-map-unknown { fill: none; stroke: #3a4442; stroke-width: 1.5; stroke-dasharray: 4 4; }
.ts-map-q { fill: #9aa6a3; font-size: 16px; text-anchor: middle; }
.ts-map-no { fill: #f0f0e8; font-size: 22px; font-weight: 700; text-anchor: middle; }
.ts-map-name { fill: #cfd8d4; font-size: 13px; text-anchor: middle; }
.ts-map-me { fill: #8ef0c8; }
.ts-map-link { stroke: #ffb020; stroke-width: 2.5; fill: none; opacity: 0.8; }
.ts-map-info { margin: 0 0 8px; line-height: 1.6; }
.ts-map-note { margin: 8px 0 0; font-size: 13px; opacity: 0.85; line-height: 1.6; }
.ts-map-key { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; padding: 0; margin: 8px 0 0; font-size: 13px; }
.ts-map-key i { display: inline-block; width: 14px; height: 14px; margin-right: 6px; vertical-align: -2px; border: 2px solid; }
.ts-map-key .k-here { border-color: #8ef0c8; background: #234a3e; /* pair-ok */ }
.ts-map-key .k-goal { border-color: #ffb020; border-style: dashed; }
.ts-map-key .k-link { border: none; height: 3px; background: #ffb020; /* pair-ok */ vertical-align: 3px; }
/* the title breaks only at its spaces (継ぎ目 ― / 六面の避難棟), never inside a word */
#title h1 { word-break: keep-all; line-break: strict; }
/* the loader line sits on the title photo: give it its own dark plate */
#boot-status { color: #f2f7f4; background: rgba(6, 10, 9, 0.72); padding: 2px 10px; border-radius: 4px; }