/* 얼망고 R3 — 껍데기만 바꾼 새 디자인 (2026-10-04 저녁 Rod · June 「본 서버 동작 그대로, 디자인만」)
   이 파일이 지키는 규칙 — 어기면 본 서버와 손맛이 달라진다:
   · 바꾸는 것: 색 · 글자 크기 · 굵기 · 여백 · 모서리 · 가벼운 그림자 · 그림
   · 안 건드리는 것: :active 누름 반응(본 서버 그대로 — 숫자판 눌린 색만 값 조정) · transition · transform · scale ·
     손가락 처리 · 스크롤 · 창 열고 닫기 · 위치를 잡는 설정 · 누르는 칸 크기 · 숫자판 키 높이
   · 무거운 효과 안 씀: 유리 흐림(backdrop-filter) 없음, 그림자는 작고 옅게
   · 예외(June 이 정한 구조 바뀜): 가운데 카메라 창을 아래 창 모양으로(.tp-sh 와 같은 값)
   차례: 0 글꼴 · 1 색 · 2 바탕 부품 · 3 아래 탭 · 4 오늘 · 5 계산기 · 6 메뉴 · 7 내 여행 · 8 안쪽 창 · 9 카메라 창 · 10 알약 한 모양 */

/* ───────── 0. 글꼴 ───────── */
@font-face{font-family:'Archivo';font-style:normal;font-display:swap;font-weight:45 920;
  src:url(https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/packages/pretendard/dist/web/variable/woff2-dynamic-subset/PretendardVariable.subset.91.woff2) format('woff2-variations')}
/* 본문 글꼴은 본 서버 설정 그대로 둔다 — 웹 글꼴(Pretendard)이나 body 글꼴을 덮어쓰면 창이 0.2초쯤 늦게 열렸다 (10/4 측정: 덮어쓰기 620ms · 그대로 480ms · 본 서버 420ms) */
body{letter-spacing:-.01em;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}

/* ───────── 1. 색 ─────────
   바닥(--ink) 옅은 회색 · 카드(--ink-2) 흰색 · --ink-3 은 눌림 · 안쪽 채움(본 서버 :active 가 쓰므로 흰색과 확실히 다르게)
   --r3-cell 흰 카드 안 정보 칸(아주 옅게) · 파랑 하나 + 망고 노랑(가장 중요한 단추) */
:root{
  --ink:#0D1015; --ink-2:#171B24; --ink-3:#262C39; --line:#323947;
  --text:#EEF1F6; --text-dim:#AEB5C4; --text-faint:#8F97A9;
  --warn:#6F9BFF; --warn-bg:rgba(111,155,255,.14); --warn-rgb:111,155,255;
  --good:#4FBF95; --good-bg:#0F2621;
  --btn:#FFC53D; --btn-ink:#1B2B5E;
  --r3-fill:#2F62D8; --r3-fill-ink:#FFFFFF;
  --r3-soft:rgba(111,155,255,.26); --r3-soft-ink:#9DBBFF;
  --r3-cell:#1F2430; --r3-track:#232937; --r3-chip:#222836;
  --r3-sh:0 1px 2px rgba(0,0,0,.35), 0 6px 16px -10px rgba(0,0,0,.6);
  --r3-chip-sh:0 1px 2px rgba(0,0,0,.4);
  --r:20px; --r-in:14px; --tab-h:72px;
}
html[data-theme="light"]{
  --ink:#EEF0F5; --ink-2:#FFFFFF; --ink-3:#E4E8F0; --line:#E2E6EE;
  --text:#14171F; --text-dim:#454C5C; --text-faint:#5F6678;
  --warn:#2457C9; --warn-bg:#E3EAFA; --warn-rgb:36,87,201;
  --good:#1B7F4B; --good-bg:#E6F4EC;
  --btn:#FFC53D; --btn-ink:#1B2B5E;
  --r3-fill:#2457C9; --r3-fill-ink:#FFFFFF;
  --r3-soft:#D3E0F8; --r3-soft-ink:#1F4FBF;
  --r3-cell:#F3F4F8; --r3-track:#DCE1EA; --r3-chip:#FFFFFF;
  --r3-sh:0 1px 2px rgba(20,30,60,.06), 0 6px 18px -12px rgba(20,30,60,.22);
  --r3-chip-sh:0 1px 3px rgba(20,30,60,.16);
}
.r2i{width:1em;height:1em;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.14em}
.r2i.fill{fill:currentColor;stroke-width:1.2}
/* 숫자판 눌린 색 — 본 서버처럼 눌렀을 때 확실히 보이게(규칙은 본 서버 것 그대로, 값만) */
.key:active{background:var(--ink-3)}
html[data-theme="light"] .key:active{background:#DCE2EC}

/* ───────── 2. 바탕 부품 ───────── */
.app, .sheet{background:var(--ink)}
.w, .cs-card, .tp-card, .tp-stay, .tp-idea, .tp-ring, .tp-lk, .book-card, .fundcard, .don, .shop, .sk-card, .dl-card,
.near-card, .cat, .fx, .dk, .wx, .hub, .ac-card, .hs-card, .ov-cal, .ov-day, .tp-my, .bk-card, .dc-hotel,
.spanel, .cpn-box, .gcell, .offbox, .td-line, .ts-pk, #rowPrice, .mres-i, .pl-r, .bkl, .am-cost{
  border-color:transparent; box-shadow:var(--r3-sh)}
.sheet-title{font-size:17px;font-weight:700;letter-spacing:-.02em}
.sheet-dock{background:var(--ink);border-top-color:transparent}
.sheet.root .sheet-top{display:flex;align-items:center;gap:10px;padding:14px 20px 6px}
.sheet.root .sheet-top > .sheet-close{display:none}
.sheet.root .sheet-title{flex:1;text-align:left;font-size:26px;font-weight:800;letter-spacing:-.04em}
.cta{border-radius:16px;font-weight:700}
.cta[disabled]{background:var(--ink-3);color:var(--text-faint)}
.go, html[data-theme="light"] .go{background:var(--btn);border-color:var(--btn);color:var(--btn-ink);font-weight:700}
/* 보조 단추 — 테두리 없이 옅은 파랑 채움 + 파란 글자 */
.cta.sub2, .cta-ghost, .cta-ghost2, .tp-shbtn, .tp-nx button, .tp-tmx, .bk4 button, .pl-res button, .pl-more button, .xf-menu button, .pl-ov-f button,
.shot-b:not(.go), .ask-b:not(.go):not(.danger), .dl-card button:not(.cp), .nt-link, .tp-calt, .tp-mbtn, .dc-pl, #dcFl, #dcAdd, #dcEdT, #dcPgEd, #ptEd:not(.on),
#tpPlP, #tpPlPick, #tpDateNew, .tp-newlink, .sheet-goto, .tp-calh button, .det-tel, #tpMB{
  background:var(--r3-soft) !important;border-color:transparent !important;color:var(--r3-soft-ink) !important}
/* 흰 보조 단추 — 바닥 위 아래 줄 */
#bookAdd, #tpDockShare, #shLink, .me-out .btns a:not(.kakao){background:var(--ink-2) !important;border-color:transparent !important;color:var(--text) !important;box-shadow:var(--r3-sh)}
.dl-card .cp, button.cp{background:var(--r3-fill) !important;color:var(--r3-fill-ink) !important;border-color:transparent !important}
.cta-fund, html[data-theme="light"] .cta-fund{background:var(--good);border-color:var(--good);color:#fff}

/* ───────── 3. 아래 탭 — 떠 있는 둥근 막대 (흐림 효과 없음) ───────── */
.tabbar, html[data-theme="light"] .tabbar{
  height:62px;margin:0 14px calc(10px + env(safe-area-inset-bottom, 0px));padding:0;border-radius:22px;
  background:var(--ink-2);border:0;box-shadow:0 8px 28px -10px rgba(20,30,60,.3);align-items:center;overflow:visible}
html:not([data-theme="light"]) .tabbar{box-shadow:0 8px 28px -10px rgba(0,0,0,.7)}
.tb{justify-content:center;gap:3px;padding:0;font-size:11px;font-weight:600;color:var(--text-faint);height:100%}
html[data-theme="light"] .tb:not(.on){color:var(--text-faint)}
.tb svg{width:23px;height:23px}
.tb.on, html[data-theme="light"] .tb.on{color:var(--warn);font-weight:700}
.tb-cam{overflow:visible}
.cam-k{width:54px;height:54px;border-radius:19px;background:var(--r3-fill);margin-top:-14px;box-shadow:0 6px 14px -6px rgba(var(--warn-rgb),.45)}
html:not([data-theme="light"]) .cam-k{box-shadow:0 6px 14px -6px rgba(0,0,0,.6)}
.tb .cam-k svg{stroke:var(--r3-fill-ink);width:27px;height:27px}
.tabbar.ears-on .cam-k{background:var(--r3-fill)}

/* ───────── 4. 오늘 ───────── */
#todaySheet .sheet-top{display:none}
#todaySheet{padding-top:0}
#todaySheet .sheet-scroll{padding-left:0;padding-right:0}
#todayList{padding:0}
.r2-hero{position:relative;height:calc(min(204px, 27vh) + env(safe-area-inset-top, 0px));padding-top:env(safe-area-inset-top, 0px);
  border-radius:0 0 26px 26px;overflow:hidden;background:var(--ink-3);color:#fff;display:flex;flex-direction:column}
.r2-hero-bg{position:absolute;inset:0;background:center 34%/cover no-repeat}
.r2-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,16,30,.42) 0%,rgba(10,16,30,.05) 36%,rgba(10,16,30,.66) 100%);pointer-events:none}
.r2-hero > :not(.r2-hero-bg){position:relative;z-index:1}
.r2-hero-top{display:flex;align-items:center;justify-content:space-between;padding:12px 18px 0}
.r2-brand{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:700}
.r2-brand img{width:26px;height:26px;object-fit:contain}
.r2-hero .wg-chg{margin:0;display:flex;align-items:center;gap:4px;height:34px;padding:0 11px 0 14px;font-size:14px;font-weight:600;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3)}
.r2-hero .w-wx{margin:auto 20px 52px;padding:0;min-height:0;background:none;border:0;box-shadow:none;color:#fff;border-radius:0;overflow:visible}
.r2-date{font-size:13px;font-weight:500;opacity:.92}
.r2-hl{font-size:26px;font-weight:800;letter-spacing:-.04em;line-height:1.15;margin-top:2px;text-shadow:0 2px 16px rgba(0,0,0,.25)}
.r2-wx{display:flex;align-items:center;gap:8px;margin-top:5px;white-space:nowrap}
.r2-wxi{width:30px;height:30px;flex:none;margin-right:-2px}
.r2-hero .w-wx .w-big{font-size:22px;font-weight:700;line-height:1;margin:0;letter-spacing:-.03em}
.r2-hero .w-wx .w-sub{font-size:13.5px;line-height:1.3;color:rgba(255,255,255,.95);margin:0;overflow:hidden;text-overflow:ellipsis}
.r2-hero .w-wx .sk{background:rgba(255,255,255,.28)}
.wg-tc{margin:10px 16px 0}
.wg{gap:10px;margin:0 16px 18px;position:relative;z-index:2}
.r2-hero + .wg, .r2-hero + .wg-tc[hidden] + .wg{margin-top:-40px}
.w{border-radius:var(--r);padding:15px;min-height:124px;background:var(--ink-2)}
.w-lab{font-size:13px;font-weight:600;color:var(--text-faint);gap:5px}
.w-lab .r2i{font-size:15px}
.w-lab .more{display:inline-flex;align-items:center;gap:2px;font-weight:600}
.w-sub{font-size:12.5px}
/* 환율 */
.w-fx.full{border-radius:22px;padding:14px 16px}
.w-fx .w-lab .more{color:var(--warn)}
.r2-fx-main{display:flex;align-items:baseline;gap:8px;margin-top:2px}
.w-fx .wf-big{font-size:34px;font-weight:800;margin:0;letter-spacing:-.04em}
.w-fx .wf-big small{font-size:34px;font-weight:800;color:inherit;margin-left:0}
.w-fx .wf-who{font-size:14px;color:var(--text-dim);font-weight:600;margin:0}
.r2-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.r2-chips > span{background:var(--r3-cell);border-radius:var(--r-in);padding:8px 10px 7px;min-width:0}
.r2-chips small{display:block;font-size:12px;color:var(--text-faint);font-weight:600}
.r2-chips b{display:block;font-size:16px;font-weight:700;margin-top:2px;white-space:nowrap;letter-spacing:-.03em}
/* 소식 */
.w-nt{padding:13px 16px 2px}
.w-nt .w-lab{font-size:17px;font-weight:700;color:var(--text);letter-spacing:-.03em;margin-bottom:2px}
.w-nt .w-lab .more{font-size:13px;color:var(--text-faint)}
.wn-r{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;padding:9px 0}
.wn-k, .wn-k.kw{grid-column:1;background:none;padding:0;border-radius:0;font-size:12px;font-weight:600;color:var(--text-faint)}
.wn-k.kw{color:var(--warn)}
.wn-t{grid-column:1;font-size:15px;font-weight:600;margin-top:2px}
.wn-c{grid-column:2;grid-row:1 / span 2;align-self:center;color:var(--text-faint);font-size:16px}
/* 내 여행 — 날짜 없을 때 탑승권 */
.w-trip.r2-pass{flex-direction:row;align-items:center;gap:12px;background:var(--r3-fill);color:var(--r3-fill-ink);padding:15px 18px;overflow:hidden;box-shadow:none}
.w-trip.r2-pass::before, .w-trip.r2-pass::after{content:"";position:absolute;right:120px;width:22px;height:22px;border-radius:50%;background:var(--ink)}
.w-trip.r2-pass::before{top:-11px} .w-trip.r2-pass::after{bottom:-11px}
.r2-pass-l{flex:1;min-width:0;display:block;padding-right:22px;position:relative}
.r2-pass-l::after{content:"";position:absolute;right:0;top:-4px;bottom:-4px;border-left:2px dashed currentColor;opacity:.35}
.w-trip.r2-pass .w-lab{color:inherit;opacity:.8;font-size:12px}
.w-trip.r2-pass .wt-t{display:block;color:inherit;font-size:17px;font-weight:700;letter-spacing:-.03em;line-height:1.35;margin-top:3px}
.w-trip.r2-pass .wt-go{height:44px;padding:0 15px;border-radius:999px;gap:6px;font-size:15px;background:var(--btn);color:var(--btn-ink)}
.wt-go .r2i{font-size:17px}
/* 내 여행 — 날짜가 있을 때 */
.wt-big{font-size:22px;font-weight:800;letter-spacing:-.03em}
.wt-dd{border-radius:999px;padding:5px 11px;background:var(--btn);color:var(--btn-ink)}
.wt-sum{background:var(--r3-cell);border:0;border-radius:16px;padding:10px 4px 9px;margin:12px 0 10px}
.wt-d{background:var(--r3-cell);border-color:transparent}
.wt-it{border-radius:var(--r-in)}
/* 지갑 — 흰 카드, 단추만 옅은 파랑 */
.w-money.full{flex-direction:row;align-items:center;gap:12px;padding:16px 16px 16px 18px}
.r2-wm-l{flex:1;min-width:0;display:block}
.w-money .w-lab, .w-money .w-sub{color:var(--text-dim)}
.w-money .w-big{font-size:30px;font-weight:800;margin-top:2px}
.w-money .w-big small{font-size:16px;color:var(--text-dim);margin-left:3px}
.w-money .wm-bar{background:var(--r3-cell);margin-top:8px}
.w-money .wm-bar i, .w-money .wm-bar i.mid{background:var(--r3-fill)} .w-money .wm-bar i.low{background:#E4736B}
.r2-wm-a{display:flex;flex-direction:column;gap:6px;flex:none}
.r2-wm-a > span{height:36px;padding:0 12px;border-radius:12px;background:var(--r3-soft);color:var(--r3-soft-ink);display:flex;align-items:center;gap:5px;font-size:13px;font-weight:700;white-space:nowrap}
/* 한마디 — 오늘 탭에서 색 있는 칸 하나 */
.w-vi{background:var(--warn-bg);border-color:rgba(var(--warn-rgb),.22) !important;box-shadow:none !important}   /* 파란 테두리를 칸 가장자리에 · 회색 그림자 없음 — 테두리 아래로 회색이 비쳤다 (10/5 June) */
.w-vi .w-lab, .w-vi .w-lab .more{color:var(--warn)}
.wv-v, html[data-theme="light"] .wv-v{font-size:18px;font-weight:700;color:var(--warn);letter-spacing:-.02em;margin-top:10px}
.wv-f{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;margin-top:auto}
.w-vi .say{flex:none;width:36px;height:36px;border-radius:50%;padding:0;background:var(--r3-fill);color:var(--r3-fill-ink);display:flex;align-items:center;justify-content:center;font-size:0;border:0}
.w-vi .say .r2i{font-size:15px}
.wc-ring b{font-size:24px;font-weight:800;letter-spacing:-.03em}
.wc-ring b small{font-size:15px;color:var(--text-faint);font-weight:600}
.wc-ring svg circle:last-child{stroke:var(--warn)}
/* 찜 — 가로 한 줄 */
.w-lk.full{flex-direction:row;align-items:center;gap:14px;padding:13px 15px}
.w-lk .wl-heart{flex:none;width:44px;height:44px;border-radius:14px;background:rgba(224,65,95,.12);color:#E0415F;display:flex;align-items:center;justify-content:center;font-size:22px;margin:0}
.r2-lk-t{flex:1;min-width:0;display:block}
.r2-lk-t b{font-size:15px;font-weight:700}
.w-lk .wl-faces{margin:0;flex:none}
/* 가볼 만한 곳 */
.w.full.w-spot{min-height:200px;border-radius:var(--r)}
.w-spot .w-lab{top:14px;left:16px;right:16px;font-size:13px}
.ws-in{padding:16px}
.ws-in b{font-size:20px;font-weight:700;letter-spacing:-.03em}

/* ───────── 5. 계산기 — 크기 · 자리는 본 서버 그대로, 색 · 모서리만 ───────── */
.rate-bar, html[data-theme="light"] .rate-bar{background:none}
.rate-value{font-size:clamp(11.5px,3.4vw,13.5px);letter-spacing:-.02em}
.rate-toggle, html[data-theme="light"] .rate-toggle{background:var(--r3-track);border-color:transparent;border-radius:14px}
.rate-toggle .rt-ind, html[data-theme="light"] .rt-ind{background:var(--ink-2);border-radius:10px;box-shadow:var(--r3-chip-sh)}
.rate-toggle button[aria-pressed="true"], html[data-theme="light"] .rate-toggle button[aria-pressed="true"]{color:var(--warn)}
.me-av i{background:var(--ink-2);box-shadow:var(--r3-chip-sh)}
.amounts{background:var(--ink-2);border-radius:24px;box-shadow:var(--r3-sh);margin-left:16px;margin-right:16px;padding:4px}
.field{border-radius:20px;border-color:transparent}
.field[aria-selected="true"]{background:var(--r3-cell);border-color:transparent}
.field-label{font-weight:600;letter-spacing:0;text-transform:none}
.field-num{letter-spacing:-.04em}
.field-num.ghost{font-size:clamp(16px,5vw,21px);letter-spacing:-.035em}
.quick button{border-color:transparent;border-radius:999px;background:var(--r3-chip);box-shadow:var(--r3-chip-sh);font-weight:700;color:var(--text-dim)}
.quickrow .go{border-radius:999px}
.eyebrow{letter-spacing:0;text-transform:none}
.bill{border-radius:10px}
.chip{background-image:linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2))}
.chip-krw{color:rgba(255,255,255,.92)}
.alert{border-radius:16px;border-color:transparent}
.actbar, html[data-theme="light"] .actbar{border-radius:14px;background:var(--ink-2);border-color:transparent;box-shadow:var(--r3-sh)}
.act, html[data-theme="light"] .act{color:var(--text)}
.dock{border-top-color:transparent;background:none}
.key, html[data-theme="light"] .key{border-color:transparent;border-radius:16px;background:var(--ink-2);box-shadow:var(--r3-chip-sh)}
.key.util{background:var(--ink-2);color:var(--text-dim)}
html:not([data-theme="light"]) .key.util{background:#20252F}
.key.op{background:var(--warn-bg)}

/* ───────── 6. 메뉴 ───────── */
#hubSheet .sheet-scroll{display:flex;flex-direction:column;padding-left:16px;padding-right:16px}
#hubSheet .sheet-scroll > *{flex:none}
#dealBar{order:0}
#hubSheet .msearch{order:1;margin:6px 0 12px}
#hubSheet #menuPanel{order:1}
#hubSheet #menuResults{order:3}
#hubSheet #hubList{order:4}
.msearch input, html[data-theme="light"] .msearch input{height:52px;padding:0 64px 0 44px;border:0;border-radius:18px;background:var(--ink-2);box-shadow:var(--r3-sh)}
.msearch > svg, html[data-theme="light"] .msearch > svg{left:16px;stroke:var(--warn)}
.dl-strip{width:100%;display:flex;align-items:center;gap:12px;border:0;border-radius:var(--r);background:var(--btn);color:var(--btn-ink);padding:14px 16px;margin:0 0 12px;min-height:56px;font-family:inherit;text-align:left}
.dl-strip img{width:26px;height:26px}
.dl-strip .dl-t{flex:1;min-width:0;font-size:13.5px;font-weight:600;line-height:1.4;color:inherit;white-space:normal}
.dl-strip .dl-t b{display:block;font-size:15px;font-weight:800;color:inherit}
.dl-strip .dl-c{color:inherit;font-size:18px;font-weight:700}
.hub-sec-t, .hsec-t{font-size:19px;font-weight:700;letter-spacing:-.03em;margin:0 4px 10px}
.hgrid + .hub-sec-t, .hg-soon + .hub-sec-t{margin-top:26px}
.hgrid{gap:10px}
.hg{border-radius:18px;padding:12px;gap:12px;min-height:68px;border-color:transparent;background:var(--ink-2);box-shadow:var(--r3-sh)}
.hg-ico, html[data-theme="light"] .hg-ico{background:none;box-shadow:none}
.hg-name{font-size:15px;font-weight:700;letter-spacing:-.02em}
.hg-desc{font-size:12px;color:var(--text-faint)}
.hg-app, html[data-theme="light"] .hg-app{box-shadow:none;border-radius:13px}
/* 맛집 · 여행지 사진 칸 */
.hg.ph{height:116px;align-items:flex-end;padding:0;border:0;background:var(--ink-3) center/cover no-repeat;color:#fff;position:relative;overflow:hidden;box-shadow:none}
.hg.ph::after{content:"";position:absolute;inset:-1px;background:linear-gradient(180deg,rgba(10,16,30,0) 35%,rgba(10,16,30,.74))}
.hg.ph .hg-ico{display:none}
.hg.ph .hg-body{position:relative;z-index:1;padding:0 14px 12px}
.hg.ph .hg-name{font-size:18px;color:#fff}
.hg.ph .hg-desc{font-size:12.5px;color:rgba(255,255,255,.9)}
/* 나머지 여덟 칸 — 한 카드에 네 칸씩 · 선 아이콘 */
#hubGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 0;position:relative;padding-bottom:8px}
#hubGrid::before{content:"";position:absolute;left:0;right:0;top:126px;bottom:0;background:var(--ink-2);border-radius:22px;box-shadow:var(--r3-sh)}
#hubGrid .hg.ph{grid-column:span 2;order:-1}
#hubGrid .hg.ph[data-id="food"]{order:-2;margin-right:5px}
#hubGrid .hg.ph[data-id="tour"]{margin-left:5px}
#hubGrid .hg:not(.ph){position:relative;z-index:1;flex-direction:column;align-items:center;gap:6px;padding:14px 2px 8px;min-height:0;background:none;box-shadow:none;border-radius:16px}
#hubGrid .hg:not(.ph) .hg-body{align-items:center}
#hubGrid .hg:not(.ph) .hg-name{font-size:12.5px;font-weight:600;text-align:center;overflow:visible}
#hubGrid .hg:not(.ph) .hg-desc{display:none}
#hubGrid .hg[data-id="deal"]{display:none}
#hubGrid .hg[data-id="help"]{order:9}
#hubGrid .hg[data-id="help"] .hg-name{color:#C9304F}
html:not([data-theme="light"]) #hubGrid .hg[data-id="help"] .hg-name{color:#FF8FA3}
#hubGrid .hg .hg-ico.ln{width:50px;height:50px;border-radius:16px;background:var(--b);color:var(--c);display:flex;align-items:center;justify-content:center}
#hubGrid .hg .hg-ico.ln svg{width:28px;height:28px}
html:not([data-theme="light"]) #hubGrid .hg .hg-ico.ln{background:color-mix(in srgb, var(--c) 24%, transparent);color:color-mix(in srgb, var(--c) 70%, #fff)}

/* ───────── 7. 내 여행 ───────── */
#tpScroll{padding-left:16px;padding-right:16px}
.tp-tk{border-radius:var(--r);background:var(--r3-fill);color:var(--r3-fill-ink)}
.tp-seg{background:var(--r3-track);border-radius:18px;padding:5px;border-color:transparent}
.tp-seg button{border-radius:13px}
.tp-seg button.on{background:var(--ink-2);color:var(--text);box-shadow:var(--r3-chip-sh)}
.tp-nd{border-color:transparent;border-radius:14px}
.tp-nd.on{background:var(--r3-fill);color:var(--r3-fill-ink)}
.tp-hero{border-radius:var(--r)}
.tp-sw{background:none;border:0;box-shadow:none;padding-left:0;padding-right:0}
.tp-card{border-radius:16px;background:var(--ink-2)}
.tp-card::before, .tp-card + .tp-card::before{content:none}   /* 카드끼리 붙을 때 본 서버 구분선(왼쪽 짧은 선)이 남던 것 (10/8) */
/* 본 서버는 배경 없는 줄이라 오른쪽 여백 0 — 카드가 되니 사진 · 체크 동그라미가 카드 밖으로 나갔다(갤럭시 360) (10/8 Sarah) */
.tp-card{padding-right:14px}
.tp-slot .tp-card + .tp-card{margin-top:8px}
/* 고친 일정 빛나는 테두리 — 본 서버는 시간선 옆 카드(::before) 자리에 맞춰 left 12 · right -10 이었다. 여기선 칸 자체가 카드라 칸에 딱 맞게 (10/4 June) */
.tp-card.flash:after{top:0;right:0;bottom:0;left:0;border-radius:16px}
.tp-need{border-radius:var(--r);border-color:transparent;background:var(--ink-2)}
.cs-bn{border-radius:var(--r);border-color:transparent;box-shadow:var(--r3-sh)}
.sheet.root .tp-dock{background:var(--ink);box-shadow:none}
/* 지갑 — 흰 카드 */
.wal:not(.fund), html[data-theme="light"] .wal:not(.fund){background:var(--ink-2);color:var(--text);border-color:transparent;border-radius:var(--r);box-shadow:var(--r3-sh)}
/* 본 서버 밝은 화면은 파란 카드라 글자를 전부 흰색으로 둔다(html[data-theme=light] .wal ...) — 흰 카드에선 같은 세기로 다시 덮어야 글자가 보인다 */
.wal:not(.fund) .wal-cap, .wal:not(.fund) .wal-num span, .wal:not(.fund) .wal-row-t, .wal:not(.fund) .wal-note,
html[data-theme="light"] .wal:not(.fund) .wal-cap, html[data-theme="light"] .wal:not(.fund) .wal-row-t, html[data-theme="light"] .wal:not(.fund) .wal-note{color:var(--text-dim)}
.wal:not(.fund) .wal-num, html[data-theme="light"] .wal:not(.fund) .wal-num{color:var(--text)}
html[data-theme="light"] .wal:not(.fund) .wal-num.minus{color:#D9534A}
html[data-theme="light"] .wal:not(.fund) .wal-krw{color:var(--warn)}
html[data-theme="light"] .wal:not(.fund) .wal-foot, html[data-theme="light"] .wal:not(.fund) .wal-gear{color:var(--text-faint)}
.wal:not(.fund) .wal-bar, html[data-theme="light"] .wal:not(.fund) .wal-bar{background:var(--r3-track)}
html[data-theme="light"] .wal:not(.fund) .wal-btn{color:var(--r3-soft-ink);background:var(--r3-soft);border-color:transparent}
.wal:not(.fund) #budBtnAdd{background:var(--r3-fill);border-color:var(--r3-fill);color:#fff}
html[data-theme="light"] .wal.fund, .wal.fund{background:linear-gradient(160deg,#1B7F4B 0%,#166A3F 100%)}
#bookShot{background:var(--btn);border-color:var(--btn);color:var(--btn-ink)}
.book-card, .fundcard, .don{border-radius:var(--r)}
.book-item{border-radius:var(--r-in)}
.tp-ring{border-radius:var(--r)}
.tp-ck{border-radius:16px;border-color:transparent;box-shadow:var(--r3-chip-sh)}
.tp-pc{border-radius:16px}
.tp-lk{border-radius:16px}

/* ───────── 8. 안쪽 창 ───────── */
/* 가게 목록 */
.sbox{border-color:transparent;background:var(--ink-2);box-shadow:var(--r3-sh);border-radius:16px}
.shop{border-radius:18px;background:var(--ink-2)}
.shop-name{font-weight:700;letter-spacing:-.02em}
.shop-count b, .det-rate b, .near-sub b{color:var(--warn)}
/* 가게 상세 — 위 정보는 흰 머리(화면 폭 가득) — 아래 내용은 곧은 선 밑으로 지나간다 */
.det-head{background:var(--ink-2);border-bottom:0;box-shadow:0 1px 0 var(--line)}
.det-acts .det-map{background:var(--r3-fill);color:var(--r3-fill-ink);border-color:transparent}
.det-like{border-color:transparent;background:var(--r3-cell)}
.det-info{background:var(--ink-2);border-radius:var(--r);box-shadow:var(--r3-sh)}
.det-mapbox{border-color:transparent;border-radius:var(--r);box-shadow:var(--r3-sh);overflow:hidden}
.near-card{border-radius:16px;box-shadow:var(--r3-chip-sh)}
/* 공지 · 질문 · 비상 연락망 · 여행지 — 흰 카드 */
.nt-page{background:var(--ink-2);border-radius:22px;margin:10px 16px 16px;padding:6px 18px;box-shadow:var(--r3-sh)}
.nt-item:last-child{border-bottom:0}
.fq{background:var(--ink-2);border:0;border-radius:18px;margin:0 0 8px;padding:0 16px;box-shadow:var(--r3-sh)}
.hitem, .hitem.urgent{background:var(--ink-2);border-color:transparent;box-shadow:var(--r3-sh);border-radius:20px}
.hgo{background:#1B7F4B;border-color:#1B7F4B}
.hgo .mi{filter:brightness(0) invert(1)}
.ts-of{background:var(--ink-2);border:0;box-shadow:var(--r3-sh);border-radius:20px}
.ts-or{border-top-color:var(--line)}
.ov-mn{background:var(--ink-2);border:0;border-radius:20px;box-shadow:var(--r3-sh)}
#shLogin{background:var(--ink-2);border:0;box-shadow:var(--r3-sh);border-radius:18px}
.tour-t{text-shadow:0 1px 8px rgba(0,0,0,.75), 0 0 2px rgba(0,0,0,.5)}
#tourTabs, .cs-seg, .am-sw, .seg, .me-li .seg, #bkOk, #bkCP, .ug-tabs{background:var(--r3-track) !important;border-color:transparent !important}
#tourTabs button.on, .am-sw button.on, .seg span.on, .me-li .seg span.on, #bkOk button.on, #bkCP button.on, .cs-seg button.on{background:var(--ink-2) !important;color:var(--text) !important;box-shadow:var(--r3-chip-sh) !important}
/* 달력 한 벌 — 첫날 · 끝날 파랑 알약 끝, 사이 옅은 파랑 */
.ov-g .wd.sun, .ov-g .wd.sat{color:var(--text-faint)}
.ov-g .c{line-height:34px;color:var(--text);font-weight:600}
.ov-g .c.sun{color:var(--text)}
/* 여행 기간은 본 서버처럼 전부 진한 파랑 — .st · .en 은 주마다 줄 끝 모서리라 색을 따로 주면 장박에서 18 · 24일이 출발 · 끝 날처럼 보였다 */
.ov-g .c.in{background:var(--r3-fill);color:var(--r3-fill-ink);font-weight:700}
.ov-g .c.st{border-radius:99px 0 0 99px}.ov-g .c.en{border-radius:0 99px 99px 0}.ov-g .c.st.en{border-radius:99px}
.tp-cal .c.in{background:var(--r3-soft);color:var(--r3-soft-ink)}
.tp-cal .c.s, .tp-cal .c.e{background:var(--r3-fill);color:var(--r3-fill-ink)}
.tp-cal .c.s{border-radius:99px 0 0 99px}.tp-cal .c.e{border-radius:0 99px 99px 0}
.tp-cal .c.s.e, .tp-cal .c.s:not(.e):last-child, .tp-cal .c.e:nth-child(7n+1), .tp-cal .c.s:nth-child(7n){border-radius:99px}
.tp-cal .c small{display:none}
/* 내 정보 */
.me-hero{margin:8px 16px 0;width:calc(100% - 32px);padding:18px;border-radius:24px;background:var(--ink-2);box-shadow:var(--r3-sh)}
.me-hero .av, .me-hero .av.mg, html[data-theme="dark"] .me-hero .av.mg{width:60px;height:60px;background:var(--r3-soft);color:var(--r3-soft-ink)}
.me-hero .tx b{font-size:19px;font-weight:800;letter-spacing:-.03em}
.me-hero .tx .pv{background:var(--r3-soft);color:var(--r3-soft-ink)}
.me-out{background:none;padding:12px 16px 4px}
.me-out .btns a{height:50px;border-radius:16px}
.me-out-note{color:var(--text-faint);margin:10px 4px 0}
.me-sec{margin:22px 16px 0}
.me-sec h4{font-size:15px;font-weight:800;letter-spacing:-.02em;color:var(--text);margin:0 6px 10px}
.me-card{background:var(--ink-2);border-radius:22px;box-shadow:var(--r3-sh)}
.me-li{min-height:62px;padding:10px 16px;gap:14px;border-top-color:var(--line)}
.me-li i, html[data-theme="dark"] .me-li i{width:38px;height:38px;border-radius:13px;background:var(--r3-soft);color:var(--r3-soft-ink);align-items:center;justify-content:center}
.me-li i svg{width:20px;height:20px}
.me-li .t{font-size:16px;font-weight:600}
.me-li .t small{font-size:12.5px;color:var(--text-faint);margin-top:2px}
.me-li.trip .cc{width:46px;height:46px;border-radius:15px;background:var(--r3-fill)}
.me-li .badge, html[data-theme="dark"] .me-li .badge{background:var(--r3-soft);color:var(--r3-soft-ink)}
.me-li.rs i, .me-li[data-me="reset"] i, .me-li[data-me="out"] i, .me-li[data-me="out2"] i{background:rgba(224,65,95,.12);color:#D2405B}
.pt-li .ph{border-radius:16px}
.pt-li .st{background:var(--r3-soft);color:var(--r3-soft-ink)}
/* 글자 대비 */
.drv-lab{color:#5F6678}.drv-lab small{color:#6B7280}
.tp-sl2-add b, .ov-sl{color:color-mix(in srgb, var(--sc) 58%, var(--text))}
.pl-vi{color:var(--warn)}
.say{background:var(--r3-fill);color:var(--r3-fill-ink)}
.chip-btn.ph-urg{color:#C8453B}
html:not([data-theme="light"]) .chip-btn.ph-urg{color:#F59A91}
.bk-dadd{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.25}

/* ───────── 9. 카메라 창 — 아래 창(.tp-sh)과 같은 모양 · 같은 움직임 값 (June 승인한 구조 바뀜) ───────── */
.ears-dim, html[data-theme="light"] .ears-dim{background:rgba(6,9,12,.5);-webkit-backdrop-filter:none;backdrop-filter:none;transition:opacity .25s}
.ears{top:auto;bottom:0;padding:12px 16px calc(var(--tab-h) + env(safe-area-inset-bottom, 0px) + 30px);background:var(--ink);color:var(--text);
  border-radius:22px 22px 0 0;pointer-events:auto;transform:translateY(105%);transition:transform .32s cubic-bezier(.32,.72,0,1)}
.ears.on{transform:none}
.ears::before{content:"";width:38px;height:5px;border-radius:9px;background:var(--line);margin:-3px auto 14px;flex:none}
@media (prefers-reduced-motion: reduce){ .ears{transition:none} }
.ear-how, .dial-ring{display:none}
.eh-hist, .ears.on .eh-hist{top:30px;right:16px;z-index:3;height:34px;padding:0 12px;border-radius:999px;background:var(--r3-soft);color:var(--r3-soft-ink);font-size:13.5px;font-weight:700;opacity:1}
.ear-row{display:flex;flex-direction:column;gap:10px;height:auto}
.ear-row::before{content:"무엇을 찍을까요";font-size:19px;font-weight:800;letter-spacing:-.03em;margin:2px 4px 6px}
.a-tr{order:1}.a-rc{order:2}.a-box{order:3}
.arm, .ears.on .arm{position:static;width:auto;height:auto;transform:none;transition:none;display:block}
.ear, .ears.on .ear{position:static;margin:0;width:100%;display:grid;grid-template-columns:56px minmax(0,1fr) 16px;column-gap:14px;align-items:center;padding:14px;border-radius:22px;
  background:var(--ink-2);border:0;color:var(--text);box-shadow:var(--r3-sh);text-align:left;transform:none;opacity:1;transition:none}
.ear::after{content:"›";grid-column:3;grid-row:1 / 3;font-size:20px;color:var(--text-faint)}
.ear-o, html[data-theme="light"] .ear-o{grid-row:1 / 3;width:56px;height:56px;border-radius:18px;background:var(--r3-soft);box-shadow:none}
.a-rc .ear-o, html[data-theme="light"] .a-rc .ear-o{background:rgba(255,197,61,.24)}
.ear img{width:64%}
.ear b{grid-column:2;align-self:end;font-size:17.5px;font-weight:700;margin:0;letter-spacing:-.02em;color:var(--text);white-space:normal}
.ear em{grid-column:2;align-self:start;font-size:13px;line-height:1.45;color:var(--text-dim);margin:2px 0 0;white-space:normal;word-break:keep-all}
.a-box .ear, .ears.on .a-box .ear{padding:10px 14px;grid-template-columns:40px minmax(0,1fr) auto 16px;grid-template-rows:auto}
html[data-theme="light"] .a-box .ear-o, .a-box .ear-o{width:40px;height:40px;border-radius:13px}
.a-box .ear-o, .a-box .ear b, .a-box .ear em, .a-box .ear::after{grid-row:1;align-self:center;margin:0}
.a-box .ear b{font-size:15.5px}
.a-box .ear em{grid-column:3;font-size:13px;white-space:nowrap}
.a-box .ear::after{grid-column:4}
.a-rc .ear, .a-tr .ear, .a-box .ear{--s:auto}
.tabbar.ears-on{z-index:19}
.tabbar.ears-on, html[data-theme="light"] .tabbar.ears-on{background:var(--ink-2)}
.tabbar.ears-on .tb, html[data-theme="light"] .tabbar.ears-on .tb:not(.on){color:var(--text-faint)}
html[data-theme="light"] .tabbar.ears-on .tb.on, .tabbar.ears-on .tb.on{color:var(--warn)}

/* ───────── 10. 알약 한 모양 ─────────
   안 고른 것: 흰 알약 + 작은 그림자 / 흰 카드 · 찾기 창 안에서는 옅은 회색 / 고른 것: 파랑 채움 + 흰 글자 */
.tp-chip:not(.on), .tp-nd:not(.on):not(.in), .chip-btn:not([aria-pressed="true"]), .phrase:not([aria-pressed="true"]), .sort:not([aria-pressed="true"]), .unit:not([aria-pressed="true"]),
.sh-opt:not(.on), .tp-fl-d:not(.on), .tp-fl-t:not(.on), .bk-chips button:not(.on), .cs-ad:not(.on), .tp-tmw:not(.on), .tp-day:not(.on), .mp-list button, .tp-pc, .ppl-st{
  background:var(--r3-chip) !important;color:var(--text) !important;border-color:transparent !important;box-shadow:var(--r3-chip-sh) !important}
.me-card .tp-chip:not(.on), .tp-card .tp-chip:not(.on), .spanel .phrase:not([aria-pressed="true"]), .spanel .chip-btn:not([aria-pressed="true"]), #menuPanel .phrase:not([aria-pressed="true"]){
  background:var(--r3-cell) !important;box-shadow:none !important}
.chip-btn[aria-pressed="true"]:not(.ph-urg), .tp-chip.on, .tp-fl-d.on, .tp-fl-t.on, .pl-more button.on, .bk-chips button.on, .unit[aria-pressed="true"], .tab[aria-pressed="true"],
.phrase[aria-pressed="true"], .sort.now[aria-pressed="true"], .tp-nx button.on, .tp-tmw.on, .sh-opt.on, html[data-theme="dark"] .sh-opt.on, .hint-btn[aria-pressed="true"], .cs-ad.on{
  background:var(--r3-fill) !important;border-color:transparent !important;color:var(--r3-fill-ink) !important;box-shadow:none !important}
.tp-tmw.on *, .tp-chip.on *{color:var(--r3-fill-ink) !important;-webkit-text-fill-color:var(--r3-fill-ink)}
.mp-list button b{color:inherit}
.mp-list button i:not(.h){color:#fff}   /* 순서 숫자는 지도 핀처럼 흰 글자 */
.tp-ac.on, .tp-sg.on{border-color:var(--warn);box-shadow:0 0 0 3px rgba(var(--warn-rgb),.2)}
/* 옆으로 미는 줄 — 알약 그림자가 줄 경계에서 잘리지 않게 위아래 여유(자리는 그대로) */
.tp-hs, #tpSlots, #tpDaySel, #bkDs, .quick, .near-strip, #catTabs, .tp-pre-row, #tpSug, .mp-days, .wt-days, .tp-ideas-row{padding-top:4px !important;padding-bottom:8px !important;margin-top:-4px !important;margin-bottom:-8px !important}

/* 11. 검수에서 나온 것 (r3 첫 검수) */
:root{--r3-chipin:#2A3140}
html[data-theme="light"]{--r3-chipin:#E8EBF2}
.me-card .tp-chip:not(.on), .tp-card .tp-chip:not(.on), .spanel .phrase:not([aria-pressed="true"]), .spanel .chip-btn:not([aria-pressed="true"]), #menuPanel .phrase:not([aria-pressed="true"]){background:var(--r3-chipin) !important}
.det-like{background:var(--r3-soft);color:var(--r3-soft-ink)}
#priceScroll{padding-top:6px}/* 계산기 보이는 양을 본 서버와 맞춤 — 금액 카드 안 여백 · 아래 탭 차지 높이를 줄여 담기 판이 떠도 금액 단추가 본 서버만큼 보이게 */
.amounts{padding:2px}
.tabbar, html[data-theme="light"] .tabbar{height:60px;margin-bottom:calc(6px + env(safe-area-inset-bottom, 0px))}
/* ═════════ 12. 메뉴 · 가게 목록 · 가게 상세 — 아까 시험장 모양으로 (10/4 저녁) ═════════ */
/* 가게 종류 줄 오른쪽 흐림 — 같은 바닥색으로 녹게(투명 끝을 검정으로 섞어 회색 띠처럼 보이던 것) */
.catwrap::after{background:linear-gradient(to left, var(--ink) 15%, rgba(13,16,21,0))}
html[data-theme="light"] .catwrap::after{background:linear-gradient(to left, var(--ink) 15%, rgba(238,240,245,0))}
/* 정렬 알약 — 고른 것은 파랑 채움, 안 고른 것은 흰 알약 (고른 게 글자만 남던 것) */
.sort:not(.now)[aria-pressed="true"], .sort.now[aria-pressed="true"]{background:var(--r3-fill) !important;color:var(--r3-fill-ink) !important;border-color:transparent !important}
/* 가게 상세 — 위 정보는 흰 카드, 단추 셋은 한 줄 가득. 아래 내용은 카드 뒤로 들어가 둥근 모서리를 따라 가려진다 */
#detSheet .sheet-top{position:relative;z-index:4;background:var(--ink)}
.det-head{position:relative;z-index:3;margin:4px 16px 0;padding:14px 16px;border:0;border-radius:24px;background:var(--ink-2);box-shadow:var(--r3-sh), 0 -26px 0 0 var(--ink)}
.det-row{flex-direction:column;align-items:stretch;gap:10px}
.det-sub{font-size:15px;line-height:1.55;color:var(--text-dim)}
.det-rate{font-size:14px;margin-top:4px}
.det-acts{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:stretch;width:100%;margin:0}
.det-like{width:44px;height:44px;border:0;border-radius:14px;font-size:0}
.det-like::before{content:"";width:22px;height:22px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 017-2.6A4 4 0 0119 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 017-2.6A4 4 0 0119 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E") center/contain no-repeat}
.det-like.on{color:#E0415F;background:rgba(224,65,95,.12)}
.det-like.on::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 017-2.6A4 4 0 0119 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 20s-7-4.4-7-10a4 4 0 017-2.6A4 4 0 0119 10c0 5.6-7 10-7 10z'/%3E%3C/svg%3E")}
.det-acts .det-tel, .det-acts .det-map{height:44px;border:0;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;padding:0 8px}
#detScroll{margin-top:calc(-1 * var(--dh, 0px));padding:calc(var(--dh, 0px) + 10px) 16px 24px}
.det-line{padding:8px 0;gap:12px}
.det-line + .det-line{border-top:1px solid var(--line)}
.det-k{font-size:13px;min-width:34px}
.det-info{padding:6px 16px}
.det-mapbox{margin-top:10px}
/* 지도 창 「지도에 없는 일정」 장소 넣기 — 흰 칸 안 흰 단추가 안 보여 다른 작은 보조 단추처럼 옅은 파랑 */
.mp-list .mp-none-r button, html[data-theme="dark"] .mp-list .mp-none-r button{background:var(--r3-soft);border-color:transparent;color:var(--r3-soft-ink);box-shadow:none}
/* ── 10/4 밤 June 폰 확인에서 나온 것 ── */
/* 카페 · 해산물 줄 오른쪽 흐림 판 — 알약 줄 위아래 여유(scroll-row) 때문에 판이 알약 아래 10px 를 못 덮어 선처럼 보였다 */
.catwrap::after{top:-4px;bottom:0}
/* 인기순 · 거리순 — 본 서버는 글자 단추(좌우 여백 0)라 알약을 입히면 글자에 꽉 낀다 */
.sort:not(.now){padding:7px 14px}
.sort:not(.now) + .sort:not(.now){margin-left:0}   /* 인기순 · 거리순은 한 묶음(사이 6px), 영업 중은 지금처럼 따로 (10/4 June) */
/* 1일차 · 2일차 알약 — 지도에 붙지 않게 */
.mp-days{margin-bottom:0 !important;padding-bottom:12px !important}
/* 창 위 손잡이 — 회색 바닥 위에서도 보이게 (본 서버 흰 바닥 #DEE3EF 와 같은 대비) */
.tp-grab, .ears::before{background:#4A5262}
html[data-theme="light"] .tp-grab, html[data-theme="light"] .ears::before{background:#C5CBD6}
/* 투어 가격 칸(공식 입장료 · 마이리얼트립) — 고른 칸은 본 서버처럼 파란 테두리, 글자는 그대로 읽히게 */
.tp-pch{background:var(--ink-2);border-color:transparent;box-shadow:var(--r3-chip-sh)}
.tp-pch.on, html[data-theme="dark"] .tp-pch.on{background:var(--ink-2);border-color:var(--r3-fill);box-shadow:none}
/* 일정 날짜 줄 왼쪽 달력 · 지도 아이콘 — 위아래 여유까지 바닥색으로 덮어 밀린 날짜칸이 비치지 않게 */
.tp-days.hasov .tp-ov::before{content:"";display:block;position:absolute;z-index:-1;left:-16px;right:-10px;top:-6px;bottom:-10px;width:auto;height:auto;margin:0;border-radius:0;opacity:1;transform:none;background:var(--ink)}
.tp-days.hasov .tp-ov.tp-mp::before{left:0}
/* 준비 탭 자동 줄(숙소 주소 등) — 긴 주소가 칸 밖으로 넘쳤다. 본 서버 뜻대로 한 줄 말줄임이 되게 폭을 묶는다 */
.tp-ck.auto .tp-ck-b{flex:1;min-width:0}
.tp-ck.auto .tt{min-width:0;overflow:hidden}
/* ───────── 떠 있는 아래 탭 (10/4 밤 June: 아침 시험장처럼 탭 뒤로 페이지가 보이게) ─────────
   오늘 · 메뉴 · 내 여행(.sheet.root 셋)만 화면 맨 아래까지 이어지고 탭(z 15)이 그 위에 뜬다. 계산기는 sheet 가 아니라 그대로.
   탭 자리 = 높이 60 + 아래 6 + 홈 인디케이터 → 맨 끝 칸이 탭 위로 다 올라오게 그만큼 아래 여백.
   아래 줄(공유 · 일정 추가 / 가계부 · 영수증)이 떠 있으면 그 줄이 탭 바로 위에 붙고, 목록 여백은 본 서버 값 그대로(빈 스크롤 안 생기게) */
.sheet.root{bottom:0;z-index:14}
.sheet.root .sheet-scroll{padding-bottom:calc(82px + env(safe-area-inset-bottom, 0px))}
.sheet.root .sheet-dock{margin-bottom:calc(66px + env(safe-area-inset-bottom, 0px))}
#bookSheet:has(> .sheet-dock:not([hidden])) .sheet-scroll{padding-bottom:16px}
/* 지도 「장소 넣기」 찾기 단추 — 흰 알약 규칙(.mp-list button)에 덮여 흰색이었다. 일정 추가처럼 파랑 */
.mp-list .pl-row .pl-go{background:var(--r3-fill) !important;color:var(--r3-fill-ink) !important;box-shadow:none !important}
/* 거스름돈 가격 · 낸 돈 — 안 누른 칸은 테두리 없는 흰 카드, 누른 칸만 파란 테두리. 가격 칸은 위 흰 카드 규칙(#rowPrice)이 더 세서 눌러도 테두리가 안 생겼다 (10/4 June) */
#rowPaid{box-shadow:var(--r3-sh)}
#rowPrice:not([aria-selected="true"]), #rowPaid:not([aria-selected="true"]){border-color:transparent}
#rowPrice[aria-selected="true"], #rowPaid[aria-selected="true"]{border-color:var(--warn)}
/* 다크: 공금에 단추 — 밝은 민트 바탕에 흰 글씨라 안 읽혔다 → 진한 글씨 (10/8 Sarah) */
html:not([data-theme="light"]) .cta-fund, html:not([data-theme="light"]) .sheet-dock .cta.cta-fund{color:#06291B !important}
/* 다크: 공유 그림 자리(그리는 중) 흰 칸이 눈부셨다 — 그림이 뜨기 전 바탕만 어둡게 (10/8 Sarah) */
html:not([data-theme="light"]) .sh-prev{background:var(--ink-2)}

/* 오늘 탭 오른쪽 위 — 도시 알약 + 프로필 (10/8 June). 사진 위라 프로필 동그라미도 알약처럼 반투명 */
.r2-hero-r{display:flex;align-items:center;gap:8px}
.r2-hero .r2-me{width:36px;height:36px}
.r2-hero .r2-me i{width:34px;height:34px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);box-shadow:none;color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.r2-hero .r2-me i.mg{background:rgba(255,255,255,.85)}
/* 메뉴 — 제휴 띠와 검색칸 사이가 넓었다(18px) → 10px, 검색칸 아래(사진 칸까지 14px)보다 조금 좁게 (10/8 June) */
#hubSheet #dealBar .dl-strip{margin-bottom:4px}

/* ───────── 12. 간격 규칙 (2026-10-19 June: 「같은 칸끼리는 같은 여백 — 쓸데없이 넓지도, 딱 붙지도 않게」) ─────────
   큰 칸 ↔ 큰 칸 12 · 같은 줄 목록(가게 · 가계부 · 준비) 8 · 알약/탭 줄 → 바로 아래 칸 12 · 칸 제목 → 내용 8 · 큰 묶음 ↔ 큰 묶음 24
   양옆은 지금 큰 탭 16 · 아래 창/목록 창 18 (한 화면 안에서는 같음 — 68곳을 한 번에 맞춰야 해서 따로)
   새 화면은 이 숫자만 쓴다. 바꾼 뒤 검사: node tools/qa/gap.mjs(붙음) · node tools/qa/measure.mjs(간격 표) */
:root{--sp-card:12px;--sp-row:8px;--sp-chip:12px;--sp-title:8px;--sp-sec:24px}
.wg{gap:var(--sp-card)}
.tour-c{margin-bottom:var(--sp-card)}
.book-card{margin-bottom:var(--sp-row)}
.tp-ck{margin-bottom:var(--sp-row)}
/* 맛집 · 마사지 목록 — 알약 줄(.catrow)은 아래 자리를 0 으로 당겨 둔다(11절 「옆으로 미는 줄」) → 검색칸에 4px 로 붙어 있었다 */
#catTabs{margin-bottom:0 !important}
