/* 새판 손님 읽기 화면 모양 (둘째 칸) — 가게 화면 · 할인 칸 · 직원 큰 화면 · 편의점 · 버스 · 위치 동의 · 위쪽 칸 · 맨 아래 */

/* 가게 화면 */
.tm-detail { background: var(--tm-surface); border: 1px solid var(--tm-gold-line); border-radius: var(--tm-radius); padding: 14px; min-width: 0; }
.tm-hero { display: block; width: 100%; max-height: 240px; object-fit: cover; border-radius: 14px; margin: 4px 0 10px; }
.tm-d-name { font-size: 24px; margin: 0; word-break: keep-all; overflow-wrap: anywhere; }
.tm-d-local { color: var(--tm-text-weak); overflow-wrap: anywhere; }
.tm-d-walk { font-size: 16px; color: var(--tm-text-weak); }
.tm-route { display: flex; align-items: center; justify-content: center; min-height: 56px; margin-top: 12px; padding: 4px 12px; background: var(--tm-gold); color: #fff; text-decoration: none; border-radius: 12px; font-size: 19px; font-weight: 800; text-align: center; overflow-wrap: anywhere; }
.tm-route-note { color: var(--tm-text-faint); font-size: 13px; text-align: center; margin-top: 4px; overflow-wrap: anywhere; }
.tm-d-h { font-size: 18px; margin: 20px 0 8px; color: var(--tm-brown); border-bottom: 1px solid var(--tm-gold-line); padding-bottom: 4px; overflow-wrap: anywhere; }
.tm-addr { margin: 0; overflow-wrap: anywhere; }
.tm-addr.small { font-size: 14px; color: var(--tm-text-weak); }
.tm-hours { width: 100%; border-collapse: collapse; }
.tm-hours th { text-align: left; width: 4em; padding: 4px 0; color: var(--tm-text-weak); font-weight: 700; }
.tm-hours td { padding: 4px 0; overflow-wrap: anywhere; }
.tm-hours td.off { color: var(--tm-text-faint); }
.tm-menurow { display: flex; gap: 8px; align-items: flex-start; padding: 8px 0; border-bottom: 1px dotted var(--tm-gold-line); }
.tm-menurow .tm-ph { width: 56px; height: 56px; }
.tm-menurow .body { flex: 1 1 auto; min-width: 0; }
.tm-menurow .nm { font-size: 16px; font-weight: 700; overflow-wrap: anywhere; }
.tm-menurow .origin { font-size: 14px; color: var(--tm-text-weak); overflow-wrap: anywhere; }
.tm-menu .tm-rows { gap: 0; }
.tm-like { margin-top: 12px; }
.tm-like-btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; border: 2px solid var(--tm-gold); background: var(--tm-surface); color: var(--tm-gold-deep); border-radius: 12px; font-size: 18px; font-weight: 800; }
.tm-like .done { padding: 12px; border-radius: 12px; background: var(--tm-ok-bg); color: var(--tm-ok); font-weight: 700; text-align: center; }
.tm-like .n { display: block; margin-top: 4px; color: var(--tm-text-faint); font-size: 12.5px; }
.tm-shopbiz { margin-top: 14px; border-top: 1px solid var(--tm-line); padding-top: 8px; }
.tm-shopbiz > summary { cursor: pointer; font-weight: 700; min-height: 36px; }
.tm-shopbiz .r { display: flex; flex-wrap: wrap; gap: 2px 8px; font-size: 14px; }
.tm-shopbiz .k { color: var(--tm-text-faint); min-width: 7em; }
.tm-shopbiz .v { overflow-wrap: anywhere; min-width: 0; }
.tm-shopbiz .note { font-size: 12.5px; color: var(--tm-text-weak); }
.tm-report { margin-top: 20px; min-height: 44px; width: 100%; background: var(--tm-surface); border: 1px solid var(--tm-text-faint); color: var(--tm-text-weak); border-radius: 10px; font-size: 15px; }
.tm-reportbox, .tm-invite { margin: 10px 0; padding: 12px 14px; border: 1px dashed var(--tm-gold-line); border-radius: var(--tm-radius); background: var(--tm-surface); overflow-wrap: anywhere; }
.tm-reportbox .h, .tm-invite .h { font-weight: 800; }
.tm-reportbox .n { font-size: 13px; color: var(--tm-text-faint); }
.tm-busbox, .tm-walkin, .tm-gonow { margin-top: 14px; padding: 12px; border: 1px solid var(--tm-gold-line); border-radius: var(--tm-radius); background: #FFFCF4; overflow-wrap: anywhere; }
.tm-busbox .h, .tm-walkin .h { font-weight: 800; }
.tm-busbox .n, .tm-walkin .warn { font-size: 13px; color: var(--tm-text-weak); }
.tm-gonow .qty { display: flex; align-items: center; justify-content: center; gap: 14px; }
.tm-gonow .qty .n { font-size: 24px; min-width: 2ch; text-align: center; }
.tm-gonow .err { color: var(--tm-sale); font-weight: 700; }
.tm-gonow .hold { color: var(--tm-text-weak); font-size: 14px; }
.tm-shoplink { display: flex; flex-direction: column; width: 100%; margin: 0 0 10px; padding: 8px 12px; border: 1px solid var(--tm-gold-line); border-radius: 12px; background: var(--tm-surface); text-align: left; color: inherit; }
.tm-shoplink b { font-size: 18px; overflow-wrap: anywhere; }
.tm-shoplink small { color: var(--tm-gold-deep); }
.tm-placestop { display: block; margin: 18px auto 6px; padding: 6px 10px; border: 0; background: none; color: var(--tm-text-faint); font-size: 13px; text-decoration: underline; min-height: 40px; }

/* 할인 칸(가게 화면 · 할인 상세) */
.tm-deal { position: relative; border: 2px solid var(--tm-sale); border-radius: 12px; padding: 10px 12px; margin-bottom: 8px; background: var(--tm-sale-bg); min-width: 0; overflow-wrap: anywhere; }
.tm-deal.later { border-style: dashed; background: #FAF8F6; }
.tm-deal.ended { opacity: .6; }
.tm-deal.has-ph { padding-left: 112px; min-height: 112px; }
.tm-deal .ph { position: absolute; left: 10px; top: 10px; width: 92px; height: 92px; border-radius: 10px; overflow: hidden; }
.tm-deal .ph .tm-ph { width: 100%; height: 100%; border: 0; border-radius: 0; }
.tm-deal .top { display: flex; justify-content: space-between; gap: 6px; align-items: center; flex-wrap: wrap; }
.tm-deal .nm { font-size: 18px; font-weight: 800; }
.tm-deal .daily, .tm-deal .ended-note { font-weight: 700; color: var(--tm-sale); font-size: 14px; }
.tm-deal .later-note { color: var(--tm-sale); font-size: 14px; margin-top: 4px; }
.tm-deal .later-note.opens { font-weight: 800; }
.tm-deal .q { min-width: 36px; min-height: 36px; border-radius: 50%; border: 1px solid var(--tm-gold-line); background: #fff; font-weight: 800; }
.tm-deal.has-ph .tm-staff-open { margin-left: -102px; width: calc(100% + 102px); }

/* 직원 큰 화면 */
.tm-staff { position: fixed; inset: 0; z-index: 97; display: flex; flex-direction: column; background: #FFFDF7; color: #1A1A1A; overflow-y: auto; }
.tm-staff .bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 16px; background: #3B2A12; color: #fff; }
.tm-staff .hint { font-size: 15px; font-weight: 700; overflow-wrap: anywhere; min-width: 0; }
.tm-staff .x { flex: none; min-height: 44px; padding: 0 14px; border: 2px solid #fff; border-radius: 10px; background: transparent; color: #fff; font-size: 16px; font-weight: 700; }
.tm-staff .card { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 20px 16px 28px; text-align: center; overflow-wrap: anywhere; }
.tm-staff .title { display: inline-block; padding: 4px 14px; border-radius: 999px; background: #C0392B; color: #fff; font-size: 18px; font-weight: 800; }
.tm-staff .shop { font-size: 22px; font-weight: 700; color: #3B2A12; }
.tm-staff .menu { font-size: 30px; font-weight: 900; line-height: 1.25; word-break: keep-all; }
.tm-staff .k { margin-top: 6px; font-size: 16px; color: #555; }
.tm-staff .price { font-size: 56px; font-weight: 900; line-height: 1.05; color: #C0392B; }
.tm-staff .orig { font-size: 18px; color: #555; }
.tm-staff .row { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; font-size: 21px; font-weight: 800; }
.tm-staff .ended { margin: 18px 0; font-size: 28px; font-weight: 900; color: #777; }
.tm-staff .live { display: inline-flex; align-items: center; gap: 10px; margin-top: 14px; padding: 8px 16px; border-radius: 12px; background: #F1ECE0; font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; }
.tm-staff .dot { width: 14px; height: 14px; border-radius: 50%; background: #27AE60; animation: tm-staff-pulse 1s ease-in-out infinite; }
@keyframes tm-staff-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .25; transform: scale(.7); } }
@media (prefers-reduced-motion: reduce) { .tm-staff .dot { animation: none; } }
.tm-staff .note { max-width: 420px; margin-top: 10px; font-size: 14px; line-height: 1.5; color: #555; }

/* 편의점 · 약국 · 버스 */
.tm-near-swap { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 8px; }
.tm-nearcard { background: var(--tm-surface); border: 1px solid var(--tm-gold-line); border-radius: var(--tm-radius); padding: 12px 14px; margin: 10px 0; min-width: 0; overflow-wrap: anywhere; }
.tm-nearcard.on { border: 2px solid var(--tm-gold); box-shadow: 0 0 0 3px var(--tm-gold-soft); }
.tm-near-hours { color: var(--tm-text-weak); font-size: 14px; margin: 4px 0; overflow-wrap: anywhere; }
.tm-near-hours .k { font-weight: 700; }
.tm-near-acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: stretch; margin-top: 8px; }
.tm-near-acts .tm-route { flex: 1 1 140px; margin: 0; font-size: 17px; min-height: 48px; }
.tm-near-acts .tm-btn { flex: 1 1 120px; }
.tm-1330 { display: block; margin-top: 8px; color: var(--tm-gold-deep); font-weight: 700; }
.tm-toilet { margin: 4px 0 10px; padding: 12px; border: 2px solid var(--tm-gold); border-radius: var(--tm-radius); background: #FFFCF4; overflow-wrap: anywhere; }
.tm-toilet .h { font-weight: 800; font-size: 17px; }
.tm-toilet .warn { color: var(--tm-sale); font-weight: 700; font-size: 14px; }
.tm-toilet-big { margin-top: 8px; padding: 12px; border-radius: 12px; background: #fff; border: 1px solid var(--tm-gold-line); text-align: center; }
.tm-toilet-big .ko { font-size: 26px; font-weight: 900; margin: 6px 0; word-break: keep-all; }
.tm-toilet-big .tr { color: var(--tm-text-weak); }
.tm-nearstop { margin: 10px 0; padding: 10px 12px; border-radius: 12px; background: var(--tm-surface-alt); overflow-wrap: anywhere; }
.tm-needgeo { margin: 10px 0; padding: 14px; border: 2px dashed var(--tm-gold); border-radius: var(--tm-radius); background: var(--tm-surface); overflow-wrap: anywhere; }
.tm-bus-next { margin: 8px 0 4px; padding: 8px 10px; border-radius: 10px; background: var(--tm-surface-alt); }
.tm-bus-next.live { background: var(--tm-ok-bg); }
.tm-bus-next .h { font-weight: 800; font-size: 14px; margin-bottom: 2px; }
.tm-bus-next .r { display: flex; flex-wrap: wrap; gap: 2px 8px; font-size: 15px; overflow-wrap: anywhere; }
.tm-bus-next .rt { font-weight: 800; }
.tm-bus-next .at.soon { color: var(--tm-ok); font-weight: 800; }
.tm-bus-src { margin: 10px 0 4px; color: var(--tm-text-faint); font-size: 12px; text-align: right; overflow-wrap: anywhere; }

/* 위치 동의 · 지역 고르기 */
.tm-geo-why { margin: 0 0 12px; padding-left: 20px; overflow-wrap: anywhere; }
.tm-geo-why li { margin: 4px 0; }
.tm-regionpick { display: block; margin-top: 12px; }
.tm-regionpick .t { display: block; font-weight: 700; margin-bottom: 4px; }
.tm-regionpick select { width: 100%; min-height: 48px; font-size: 16px; border-radius: 10px; border: 1px solid var(--tm-line-strong); background: #fff; }
.tm-regionpick .n { display: block; color: var(--tm-text-faint); margin-top: 4px; }

/* 메뉴 상세 */
.tm-desc, .tm-origin, .tm-eathow { overflow-wrap: anywhere; }
.tm-origin.none, .tm-allergy .warn { color: var(--tm-sale); font-weight: 700; }
.tm-chip.warn { border-color: var(--tm-sale); color: var(--tm-sale); font-weight: 700; }
.tm-allergy .mine { margin-top: 10px; }
.tm-allergy .mine .k { font-weight: 700; }

/* 위쪽 칸 · 첫 방문 · 아이폰 띠 */
.tm-topcards { display: grid; gap: 10px; margin-bottom: 10px; }
.tm-alert, .tm-helper, .tm-install, .tm-inapp { padding: 12px 14px; border: 2px solid var(--tm-gold); border-radius: var(--tm-radius); background: var(--tm-surface); overflow-wrap: anywhere; }
.tm-alert .h, .tm-helper .h, .tm-install .h, .tm-inapp .h { font-weight: 800; color: var(--tm-gold-deep); }
.tm-alert .acts, .tm-install .acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.tm-alert .acts .tm-btn, .tm-install .acts .tm-btn { flex: 1 1 120px; }
.tm-helper .steps, .tm-inapp .steps { margin: 6px 0; padding-left: 20px; }
.tm-intro { position: fixed; inset: 0; z-index: 96; background: rgba(31, 27, 22, .45); display: flex; align-items: flex-end; justify-content: center; padding: 16px; }
.tm-intro .box { background: #fff; border-radius: 18px; padding: 18px; width: 100%; max-width: 480px; box-shadow: 0 8px 30px rgba(0, 0, 0, .25); overflow-wrap: anywhere; }
.tm-intro .step { color: var(--tm-text-faint); font-size: 13px; }
.tm-intro .ico { font-size: 40px; margin: 4px 0; }
.tm-intro .h { font-size: 20px; margin: 4px 0 6px; }
.tm-intro .b { margin: 0 0 14px; color: var(--tm-text-weak); }
.tm-intro .acts { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
.tm-intro .acts .tm-btn { margin-left: auto; }
.tm-iosstrip { position: fixed; left: 12px; right: 48px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); max-width: 560px; z-index: 60; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; padding: 6px 8px; background: var(--tm-surface); border: 2px solid var(--tm-gold); border-radius: 12px; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); }
.tm-iosstrip .tx { flex: 1 1 100%; font-size: 15px; line-height: 1.4; overflow-wrap: anywhere; }
.tm-iosstrip button { min-height: 40px; padding: 0 12px; border-radius: 8px; font-size: 15px; font-weight: 700; }
.tm-iosstrip .go { margin-left: auto; background: var(--tm-gold); color: #fff; border: 0; }
.tm-iosstrip .x { background: transparent; color: var(--tm-text-weak); border: 1px solid var(--tm-line-strong); }

/* 맨 아래 */
.tm-foot { margin: 24px 0 8px; padding-top: 12px; border-top: 1px solid var(--tm-gold-line); color: var(--tm-text-weak); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.tm-installline { display: block; width: 100%; min-height: 44px; margin: 6px 0; border: 1px dashed var(--tm-gold); border-radius: 10px; background: var(--tm-surface); color: var(--tm-gold-deep); font-size: 15px; font-weight: 700; }
.tm-fs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 8px 0; }
.tm-fs .k { font-weight: 700; }
.tm-fs-btn { min-height: 40px; min-width: 56px; padding: 0 10px; border: 1px solid var(--tm-line-strong); border-radius: 8px; background: var(--tm-surface); font-size: 14px; }
.tm-fs-btn.on { border-color: var(--tm-gold); background: var(--tm-gold-soft); font-weight: 700; }
.tm-traffic { font-weight: 700; color: var(--tm-text); margin: 8px 0; }
.tm-biz { margin: 8px 0; font-size: 11.5px; line-height: 1.55; color: var(--tm-text-weak); }
.tm-biz .rows { margin: 0; }
.tm-biz .h { font-weight: 700; margin-right: 6px; color: var(--tm-text); }
.tm-biz .r { display: inline; }
.tm-biz .r + .r::before { content: " · "; color: var(--tm-text-faint); }
.tm-biz .k { color: var(--tm-text-faint); margin-right: 3px; }
.tm-biz .k, .tm-biz .v { white-space: nowrap; }   /* 이름 · 값은 각각 안 쪼개짐(번호 769- / 52… 막음) · 둘 사이에서는 줄 바꿈 — 좁은 화면 · 큰 글자에서 화면 밖으로 안 나감(2026-10-28) */
.tm-biz .note { margin-top: 3px; font-size: 11px; }
.tm-legal-links { margin: 4px 0; text-align: center; font-size: 12px; }
.tm-legal-links a { color: var(--tm-gold-deep); }
.tm-legal-links a.strong { font-weight: 800; }
/* 판 연결 주소 — 작은 한 줄(2026-10-28) */
.tm-editions { margin: 2px 0 6px; text-align: center; font-size: 11.5px; line-height: 1.6; color: var(--tm-text-weak); }
.tm-editions .h { margin-right: 4px; }
.tm-editions .r { white-space: nowrap; }
.tm-editions .r + .r::before { content: " · "; color: var(--tm-text-faint); }
.tm-editions .fl { margin-right: 2px; }
.tm-editions .nm { font-weight: 700; color: var(--tm-text); margin-right: 3px; }
.tm-editions .u { color: var(--tm-gold-deep); font-weight: 700; text-decoration: underline; }
.tm-editions .tag { color: var(--tm-gold-deep); font-weight: 800; }
/* 점검 중 덮개(G-046 · overlays.js maint) — 화면 전체 · 맨 위 */
.tm-maint { position: fixed; inset: 0; z-index: 99; background: rgba(31, 27, 22, .55); display: flex; align-items: center; justify-content: center; padding: 16px; }
.tm-maint .box { background: #fff; border-radius: 18px; padding: 20px 18px; width: 100%; max-width: 440px; box-shadow: 0 8px 30px rgba(0, 0, 0, .25); overflow-wrap: anywhere; text-align: center; }
.tm-maint h2 { margin: 0 0 10px; font-size: 20px; color: var(--tm-gold-deep); }
.tm-maint .msg { margin: 0 0 8px; line-height: 1.6; }
.tm-maint .until { margin: 0 0 14px; font-weight: 700; }
/* 운영자 공지 띠(pub_notice_now · site_look.js) — 본문 맨 위 · 닫기 */
.tm-notices { display: grid; gap: 6px; margin: 0 0 10px; }
.tm-strip.notice { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border-radius: 12px; background: #FFF7E0; border: 1px solid var(--tm-gold-line); overflow-wrap: anywhere; }
.tm-strip.notice .tx { flex: 1; min-width: 0; }
.tm-strip.notice b { display: block; margin-bottom: 2px; }
.tm-strip.notice p { margin: 0; line-height: 1.5; }
.tm-strip-x { flex: none; min-width: 32px; min-height: 32px; border: 0; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; color: var(--tm-text); }
/* 28일 일시 정지 띠(pub_site_status.intake) — 예고는 노랑 · 멈춤은 빨강 */
.tm-strip.intake { margin: 0 0 10px; padding: 10px 12px; border-radius: 12px; background: #FFF4D6; border: 1px solid #E0B44A; font-weight: 700; overflow-wrap: anywhere; }
.tm-strip.intake.stop { background: #FDE8E6; border-color: #C9473B; color: #7A1E16; }
/* 점원 말 고르기 줄(10-18) — 점원이 자기 말을 누르면 그 말로 */
.tm-staff-langs { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; padding: 8px 10px; background: #F1ECE0; }
.tm-staff-langs .sl { min-height: 40px; padding: 0 10px; border: 1.5px solid #CDBF9F; border-radius: 10px; background: #fff; color: #1A1A1A; font-size: 15px; font-weight: 700; }
.tm-staff-langs .sl.on { border-color: #3B2A12; background: #3B2A12; color: #fff; }
/* 💬 텍스트 소통(#/say · 10-18 대표님 스케치) — 위 말 표(2줄 × 5칸) · 아래 사람 표(A 나 · 말 | 받은 글 + 입력(두 줄) | 🎤 ⌫ ↵) */
.tm-talk { display: flex; flex-direction: column; gap: 8px; }
.tm-talk .lead { margin: 0; font-size: 13px; line-height: 1.45; color: var(--tm-text-weak); }
.tm-talk .how { margin: 0; padding: 6px 10px; border: 1px solid var(--tm-line, #E5D9BF); border-radius: 10px; background: #FFFCF4; }
.tm-talk .how summary { min-height: 36px; display: flex; align-items: center; font-size: 14px; font-weight: 800; color: #3B2A12; cursor: pointer; }
.tm-talk .how ol { margin: 4px 0 6px; padding-left: 20px; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.tm-talk .how li { margin: 3px 0; }
.tm-talk .langs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border: 2px solid #3B2A12; border-radius: 12px; overflow: hidden; background: #3B2A12; gap: 1.5px; }
.tm-talk .lg { min-height: 40px; padding: 2px; border: 0; border-radius: 0; background: #FFFDF7; color: #3B2A12; font-size: 13px; font-weight: 800; line-height: 1.15; overflow-wrap: anywhere; }
.tm-talk .lg.on { background: var(--tm-gold); color: #2a1c00; }
.tm-talk .langs .more { display: contents; }
.tm-talk .lgmore { grid-column: 1 / -1; min-height: 34px; border: 0; border-radius: 0; background: #F3E9D2; color: #3B2A12; font-size: 13px; font-weight: 800; }
.tm-talk [dir="rtl"], .tm-talkzoom [dir="rtl"] { text-align: right; unicode-bidi: plaintext; }
.tm-talk .mic.nomic { opacity: .55; font-size: 22px; }
.tm-talk .taxibtn { min-height: 46px; border: 2px solid #F2B705; border-radius: 12px; background: #FFF4C2; color: #3B2A12; font-size: 17px; font-weight: 900; }
.tm-talk .taxibtn[aria-expanded="true"] { background: #F2B705; }
.tm-talk .taxi { padding: 8px; border: 2px solid #F2B705; border-radius: 12px; background: #FFFBEA; }
.tm-talk .taxi[hidden] { display: none; }
.tm-talk .taxi .th { margin: 0 0 6px; font-size: 13px; color: #6b5414; }
.tm-talk .taxi .tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.tm-talk .taxi .tile { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px; min-height: 78px; padding: 6px 4px; border: 1.5px solid #E5C76B; border-radius: 12px; background: #fff; color: var(--tm-text); touch-action: manipulation; }
.tm-talk .taxi .tile .ic { font-size: 28px; line-height: 1.1; }
.tm-talk .taxi .tile .tx { font-size: 12.5px; font-weight: 800; line-height: 1.2; text-align: center; overflow-wrap: anywhere; word-break: keep-all; }
/* ✈ 상황판 단추 줄 · 비회원 몫 · 가는 나라 줄(2026-11-01 해외여행 통역 1단계) */
.tm-talk .boardbar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.tm-talk .boardbar.many { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tm-talk .boardbar.many .taxibtn { min-height: 42px; padding: 2px 4px; font-size: 13.5px; line-height: 1.15; overflow-wrap: anywhere; word-break: keep-all; }
.tm-talk .tripbar { align-self: flex-start; font-weight: 800; }
.tm-talk .quota { padding: 6px 10px; border-radius: 10px; background: #F3E9D2; color: #3B2A12; font-size: 13px; }
.tm-talk .quota[hidden] { display: none; }
.tm-talk .quota.out { border: 2px solid #C62828; background: #FFF1F0; font-size: 14px; }
.tm-talk .quota.out p { margin: 0 0 6px; font-weight: 700; }
.tm-talk .join { min-height: 40px; border-radius: 10px; background: #FEE500; color: #191600; font-weight: 900; }
.tm-travel .tm-trv-cs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.tm-travel .tm-trv-c { display: flex; flex-direction: column; align-items: center; gap: 2px; min-height: 96px; padding: 8px 4px; border: 2px solid #E5C76B; border-radius: 14px; background: #fff; color: var(--tm-text); }
.tm-travel .tm-trv-c.on { border-color: #F2B705; background: #FFF4C2; }
.tm-travel .tm-trv-c .f { font-size: 34px; line-height: 1.1; }
.tm-travel .tm-trv-c b { font-size: 18px; }
.tm-travel .tm-trv-c small { color: var(--tm-text-weak); font-size: 13px; }
.tm-travel .tm-trv-now { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 20px; }
.tm-travel .tm-trv-talk { margin: 8px 0; font-size: 17px; }
.tm-travel .tm-trv-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.tm-travel .tm-trv-tile { display: flex; flex-direction: column; align-items: center; gap: 2px; min-height: 74px; padding: 6px 2px; border: 1.5px solid #E5C76B; border-radius: 12px; background: #fff; color: var(--tm-text); }
.tm-travel .tm-trv-tile .ic { font-size: 26px; line-height: 1.1; }
.tm-travel .tm-trv-tile .tx { font-size: 12.5px; font-weight: 800; text-align: center; overflow-wrap: anywhere; word-break: keep-all; }
.tm-travel .tm-trv-tel { display: flex; flex-wrap: wrap; align-items: center; column-gap: 10px; row-gap: 2px; margin: 6px 0; text-align: left; text-decoration: none; }
.tm-travel .tm-trv-tel .n { min-width: 4.2em; font-size: 22px; font-weight: 900; white-space: nowrap; }
.tm-travel .tm-trv-tel.loc { border-color: #C62828; color: #B71C1C; }
.tm-travel .tm-trv-loc .out { margin: 6px 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.tm-travel .tm-trv-say { display: flex; flex-direction: column; width: 100%; margin: 6px 0; padding: 10px 12px; border: 2px solid #C62828; border-radius: 12px; background: #fff; color: var(--tm-text); text-align: left; }
.tm-travel .tm-trv-say .me { font-size: 14px; color: var(--tm-text-weak); }
.tm-travel .tm-trv-say .they { font-size: 22px; line-height: 1.3; overflow-wrap: anywhere; }
@media (prefers-color-scheme: dark) { .tm-travel .tm-trv-c, .tm-travel .tm-trv-tile, .tm-travel .tm-trv-say { background: var(--tm-surface); } }
.tm-talk .rows { display: flex; flex-direction: column; border: 2.5px solid #3B2A12; border-radius: 14px; overflow: hidden; background: #3B2A12; gap: 2px; }
.tm-talk .rows .none { margin: 0; padding: 18px 12px; background: #FFFDF7; text-align: center; color: var(--tm-text-weak); }
.tm-talk .row { display: grid; grid-template-columns: 58px minmax(0, 1fr) 46px; background: #FFFDF7; }
.tm-talk .tone0 { --tone-c: #C9A227; } .tm-talk .tone1 { --tone-c: #2E7D5B; } .tm-talk .tone2 { --tone-c: #3563B5; } .tm-talk .tone3 { --tone-c: #B5455A; }
.tm-talk .row .left { display: flex; flex-direction: column; border-right: 1.5px solid #E5DCC3; background: var(--tone-c); }
.tm-talk .row .who { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; padding: 4px 2px; border: 0; background: transparent; color: #fff; font-weight: 800; line-height: 1.1; }
.tm-talk .row .out { flex: none; min-height: 34px; padding: 0 2px; border: 0; border-top: 1px solid rgba(255, 255, 255, .35); background: rgba(0, 0, 0, .18); color: #fff; font-size: 11px; font-weight: 800; line-height: 1.1; overflow-wrap: anywhere; }
.tm-talk .row .who .abc { font-size: 18px; font-weight: 900; }
.tm-talk .row .who .me { font-size: 12px; padding: 0 6px; border-radius: 999px; background: rgba(255, 255, 255, .25); }
.tm-talk .row .who .ln { max-width: 100%; font-size: 12px; overflow-wrap: anywhere; text-align: center; }
.tm-talk .row .who .dn { font-size: 10px; opacity: .85; }
.tm-talk .row .mid { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 5px; }
.tm-talk .inbox { display: flex; flex-direction: column; gap: 0; min-height: 2.6em; padding: 3px 8px; border-radius: 8px; background: #FFF3CF; }
.tm-talk .inbox .wait { margin: auto 0; font-size: 13px; color: #8a6d1f; }
.tm-talk .inbox .from { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; color: #8a6d1f; }
.tm-talk .inbox .from .abc { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; border-radius: 6px; background: var(--tone-c); color: #fff; font-size: 14px; font-weight: 900; }
.tm-talk .inbox.own { background: #EEF5EC; }
.tm-talk .abc.blink { animation: tm-talk-blink .5s steps(1, end) 16; }
@keyframes tm-talk-blink { 0% { opacity: 1; box-shadow: 0 0 0 3px #FFD54A; } 50% { opacity: .15; box-shadow: none; } }
@media (prefers-reduced-motion: reduce) { .tm-talk .abc.blink { animation: none; outline: 3px solid #FFD54A; } }
.tm-talk .inbox .said { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; padding: 0; border: 0; background: transparent; text-align: left; color: var(--tm-text); font-size: 18px; font-weight: 900; line-height: 1.28; overflow-wrap: anywhere; word-break: keep-all; cursor: zoom-in; }
.tm-talk .inbox .saidrow { display: flex; align-items: flex-start; gap: 6px; }
.tm-talk .inbox .saidrow .said { flex: 1 1 auto; min-width: 0; }
.tm-talk .inbox .speak { flex: none; width: 40px; min-height: 40px; border: 1.5px solid #E5C76B; border-radius: 10px; background: #fff; font-size: 20px; touch-action: manipulation; }
.tm-talk .inbox .speak.tapme { width: 56px; min-height: 56px; border: 3px solid #FF8A00; background: #FFE08A; font-size: 28px; animation: tm-talk-tap .7s ease-in-out infinite; }
@keyframes tm-talk-tap { 50% { transform: scale(1.12); box-shadow: 0 0 0 6px rgba(255, 138, 0, .45); } }
@media (prefers-reduced-motion: reduce) { .tm-talk .inbox .speak.tapme { animation: none; } }
.tm-talk .readsw { min-height: 42px; border: 2px solid #2E7D5B; border-radius: 12px; background: #E7F5EE; color: #1E5E43; font-size: 15px; font-weight: 900; }
.tm-talk .readsw.off { border-color: #9a9a9a; background: #EFEFEF; color: #6a6a6a; }
.tm-talk .inbox .tn { align-self: flex-start; margin-top: 2px; padding: 0 6px; border-radius: 999px; background: #F1E3B5; font-size: 11px; color: #6b5414; }
.tm-talk .row .in { box-sizing: border-box; width: 100%; height: calc(2 * 1.35em + 14px); min-height: 0; padding: 6px 8px; border: 1.5px solid var(--tone-c); border-radius: 8px; font: inherit; font-size: 17px; line-height: 1.35; resize: none; overflow-y: auto; }
.tm-talk .row .side { display: flex; flex-direction: column; border-left: 1.5px solid #E5DCC3; }
.tm-talk .row .side button { flex: 1 1 0; min-height: 36px; padding: 0; border: 0; border-bottom: 1px solid #E5DCC3; background: #fff; font-size: 18px; touch-action: manipulation; user-select: none; -webkit-user-select: none; }
.tm-talk .row .side .mic { flex: 1.6 1 0; min-height: 48px; font-size: 24px; background: #FFF3CF; }
.tm-talk .row .side .go { border-bottom: 0; background: var(--tone-c); color: #fff; font-weight: 900; }
.tm-talk .row .side .mic.on { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; color: #fff; background: #C0392B !important; }
.tm-talk .row .side .mic.on .mic-go { font-size: 11px; font-weight: 900; line-height: 1.1; }
.tm-talk .row .side .mic.on { animation: tm-mic-pulse 1.1s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .tm-talk .row .side .mic.on { animation: none; } }
/* 두 사람(10-20) — 받은 글 · 내 글 칸을 크게(글자 크게 · 4줄) */
.tm-talk .rows.two .row { grid-template-columns: 58px minmax(0, 1fr) 52px; }
.tm-talk .rows.two .inbox { min-height: 5.2em; padding: 6px 10px; }
.tm-talk .rows.two .inbox .said { -webkit-line-clamp: 4; line-clamp: 4; font-size: 22px; line-height: 1.32; }
.tm-talk .rows.two .row .in { height: calc(4 * 1.35em + 14px); font-size: 19px; }
.tm-talk .rows.two .row .side .mic { flex: 2 1 0; font-size: 28px; }
.tm-talk .row .chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; padding: 6px 8px 8px; border-top: 1px dashed #E5DCC3; }
.tm-talk .row .chips[hidden] { display: none; }
.tm-talk .row .chips .tm-chip { min-height: 40px; font-size: 14px; }
.tm-talk .hist summary { min-height: 40px; display: flex; align-items: center; font-size: 15px; font-weight: 800; color: #3B2A12; cursor: pointer; }
.tm-talk .log { display: flex; flex-direction: column; gap: 6px; max-height: 50vh; overflow-y: auto; overscroll-behavior: contain; padding: 6px; border-radius: 10px; background: #FFFBEF; }
.tm-talk .msg { padding: 6px 10px 8px; border-left: 5px solid var(--tone-c, #C9A227); border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
.tm-talk .mh { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--tm-text-weak); }
.tm-talk .mh .who { font-weight: 800; color: var(--tone-c); }
.tm-talk .mh .rm { margin-left: auto; min-width: 32px; min-height: 32px; border: 0; background: transparent; color: var(--tm-text-weak); font-size: 14px; }
.tm-talk .orig { font-size: 14px; color: #555; overflow-wrap: anywhere; }
.tm-talk .tr { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; width: 100%; margin-top: 4px; padding: 4px 0 0; border: 0; border-top: 1px dashed #E5DCC3; background: transparent; text-align: left; color: var(--tm-text); cursor: zoom-in; }
.tm-talk .tr .tl { font-size: 12px; font-weight: 800; color: #8a6d1f; }
.tm-talk .tr .tt { flex: 1 1 auto; min-width: 0; font-size: 17px; font-weight: 800; line-height: 1.3; overflow-wrap: anywhere; word-break: keep-all; }
.tm-talk .tr .tn { flex: 1 1 100%; font-size: 12px; color: #8a6d1f; }
.tm-talk .foot .sos { flex: 1 1 100%; min-height: 44px; border: 2px solid #C0392B; background: #FDECEA; color: #C0392B; font-size: 16px; font-weight: 900; }
.tm-talk .foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 10px; font-size: 12px; color: var(--tm-text-weak); }
.tm-talkzoom .zoomtext { font-size: 40px; font-weight: 900; line-height: 1.3; word-break: keep-all; overflow-wrap: anywhere; cursor: pointer; }
.tm-geo-age { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 6px; font-weight: 600; cursor: pointer; }
.tm-geo-age input { width: 22px; height: 22px; flex: none; margin: 1px 0 0; }
.tm-geo-age-note { display: block; margin: 0 0 12px; color: var(--tm-text-weak); }
.tm-talk .inapp { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 10px; border: 2px solid #FF8A00; border-radius: 10px; background: #FFF4E0; }
.tm-talk .inapp p { flex: 1 1 200px; margin: 0; font-size: 13px; font-weight: 700; line-height: 1.45; color: #6B3A00; overflow-wrap: anywhere; }
.tm-talk .mic.tapmic { animation: tm-talk-tap .7s ease-in-out infinite; box-shadow: 0 0 0 3px #FF8A00; }
@media (prefers-reduced-motion: reduce) { .tm-talk .mic.tapmic { animation: none; } }
/* 가게 방 메뉴판 넷(2026-10-29) — 📋 상시 · ⭐ 대표 · 🌸 특별 · ⚡ 긴급할인 · 판에서 바로 예약 */
.tm-boards { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 10px; }
.tm-boards .tm-chip { font-size: 15px; padding: 8px 12px; text-decoration: none; }
.tm-boards .tm-chip[aria-current="page"] { background: var(--tm-gold); border-color: var(--tm-gold); color: #fff; }
.tm-menurow .tm-board-resv1 { margin-top: 6px; min-height: 40px; padding: 6px 12px; font-size: 15px; }
.tm-board-resv { margin: 10px 0 4px; }
/* 가게 방 메뉴판 꾸밈(2026-10-29 대표님 「예쁘게」) — 큰 탭 넷 · 카드 메뉴판 */
.tm-boards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.tm-boards .tm-chip { justify-content: center; min-height: 48px; border-radius: 12px; font-weight: 700; border: 1.5px solid var(--tm-gold-line, var(--tm-line)); background: var(--tm-surface); }
.tm-boards .tm-chip[aria-current="page"] { background: linear-gradient(135deg, var(--tm-gold), var(--tm-gold-deep)); box-shadow: 0 2px 8px rgba(176,134,40,.35); }
.tm-boards-wrap { padding: 12px; border-radius: 16px; background: var(--tm-gold-soft); border: 1px solid var(--tm-gold-line, var(--tm-line)); }
.tm-boards-wrap .tm-menurow { background: var(--tm-surface); border: 1px solid var(--tm-line); border-radius: 14px; padding: 12px; margin-bottom: 10px; box-shadow: 0 1px 6px rgba(0,0,0,.05); }
.tm-boards-wrap .tm-menurow .tm-ph { width: 76px; height: 76px; border-radius: 10px; }
.tm-boards-wrap .tm-menurow .nm { font-size: 18px; font-weight: 800; }
.tm-boards-wrap .tm-menurow .tm-price, .tm-boards-wrap .tm-menurow .price { font-size: 19px; color: var(--tm-gold-deep); }
.tm-boards-wrap .tm-menurow .tm-board-resv1 { border: 1.5px solid var(--tm-gold); color: var(--tm-gold-deep); background: var(--tm-surface); border-radius: 999px; font-weight: 700; }
.tm-boards-wrap .tm-deal { border-radius: 14px; }
.tm-boards .tm-chip { white-space: nowrap; gap: 6px; }
.tm-boards .tm-chip .cnt { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--tm-gold-soft); color: var(--tm-gold-deep); font-size: 13px; }
.tm-boards .tm-chip[aria-current="page"] .cnt { background: #fff; }
/* ✈ 해외여행 통역 2단계(2026-11-01) — 💱 원화로 보기 · 📶 인터넷 없이 쓰기 · 🪪 내 여행 카드 · ✍ 내 문장 · 회원이면 더 · 📱 크게 보여 주기 */
.tm-trv-fx .row { display: flex; flex-direction: column; gap: 4px; }
.tm-trv-fx .ask { font-weight: 700; }
.tm-trv-fx .in { display: flex; align-items: center; gap: 6px; }
.tm-trv-fx .in .sign { font-size: 24px; min-width: 1.2em; text-align: center; }
.tm-trv-fx .in input { flex: 1 1 auto; min-width: 0; font-size: 22px; }
.tm-trv-fx .out { margin: 6px 0 2px; font-size: 22px; line-height: 1.3; overflow-wrap: anywhere; }
.tm-trv-fx .out .krw { color: #1B5E20; }
.tm-trv-fx .note { margin: 2px 0 0; }
.tm-talk .tm-trv-fx.small { margin-top: 8px; padding: 8px 10px; border-radius: 10px; background: #F3F8EF; }
.tm-talk .tm-trv-fx.small .out { font-size: 19px; }
.tm-travel .tm-trv-pack .ok { color: #1B5E20; font-weight: 700; }
.tm-travel .tm-trv-pack .bad { color: #B71C1C; font-weight: 700; }
.tm-travel .tm-trv-pack .busy { font-weight: 800; }
.tm-travel .tm-trv-pack .act, .tm-travel .tm-trv-mine .tools { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.tm-travel .tm-trv-card .fld { display: flex; flex-direction: column; gap: 2px; margin: 8px 0; font-weight: 700; font-size: 14px; }
.tm-travel .tm-trv-card .fld .tm-input { font-weight: 400; font-size: 16px; }
.tm-travel .tm-trv-card .al { margin: 8px 0; padding: 6px 8px; border: 1.5px solid #E5C76B; border-radius: 10px; }
.tm-travel .tm-trv-card .al legend { padding: 0 4px; font-weight: 700; font-size: 14px; }
.tm-travel .tm-trv-card .chk { display: flex; align-items: flex-start; gap: 6px; margin: 4px 0; font-size: 14px; }
.tm-travel .tm-trv-card .chk input { flex: none; width: 22px; height: 22px; margin: 0; }
.tm-travel .tm-trv-card .edit summary { cursor: pointer; font-weight: 800; padding: 6px 0; }
.tm-travel .tm-trv-card .show { margin: 6px 0; font-size: 17px; }
.tm-travel .tm-trv-mine .it { margin: 6px 0; }
.tm-travel .tm-trv-mine .tm-trv-say { border-color: #2E7D5B; }
.tm-travel .tm-trv-mine .tm-trv-say .bad { color: #B71C1C; }
.tm-travel .tm-trv-mine .add { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.tm-travel .tm-trv-lock { border: 2px dashed #E5C76B; }
.tm-travel .tm-trv-lock .join { min-height: 44px; border-radius: 10px; background: #FEE500; color: #191600; font-weight: 900; }
.tm-trv-big { position: fixed; inset: 0; z-index: 9000; overflow-y: auto; padding: 56px 16px 24px; background: #FFFDF7; color: #1A1206; }
.tm-trv-big .close { position: fixed; top: 10px; right: 12px; min-height: 40px; }
.tm-trv-big .ln { margin: 0 0 12px; overflow-wrap: anywhere; }
.tm-trv-big .ln p { margin: 0; }
.tm-trv-big .hd { font-size: 20px; font-weight: 900; color: #8A5A00; }
.tm-trv-big .top .hd { font-size: 26px; color: #1A1206; }
.tm-trv-big .they, .tm-trv-big .val { font-size: 28px; line-height: 1.3; font-weight: 800; }
.tm-trv-big .addr { font-size: 24px; }
.tm-trv-big .me { font-size: 14px; color: #6B5A3A; }
.tm-trv-big .ref .hd { font-size: 14px; font-weight: 400; color: #6B5A3A; }
@media (prefers-color-scheme: dark) { .tm-trv-big { background: #14110B; color: #F5EEDC; } .tm-trv-big .top .hd { color: #F5EEDC; } .tm-trv-big .hd { color: #F2B705; } .tm-trv-big .me, .tm-trv-big .ref .hd { color: #CDBF9E; } .tm-talk .tm-trv-fx.small { background: var(--tm-surface); } .tm-trv-fx .out .krw { color: #8FD694; } }