/* ═══════════════════════════════════════════════════════════════════════
   트립킷 — 영수증 · 가계부 원장
   종이(면)가 색을 갖고, 도장(표시)이 상태를 갖는다. 먹 하나, 도장 둘.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  /* 종이 */
  --paper:#ffffff;          /* 페이지 · 개요 · 전체 */
  --thermal:#fbfcfe;        /* 감열지 · 일정 */
  --paper-blue:#e6eef8;     /* 장소 */
  --paper-grey:#eef2f6;     /* 인원 */
  --paper-2:#eef3f9;        /* 눌린 종이 / 입력 배경 */
  --paper-deep:#d9e4f0;     /* 스텁 뒤 */
  /* 먹 */
  --ink:#1f2933;
  --ink-2:#556270;          /* thermal 위 5.6:1 */
  --ink-3:#66717d;          /* placeholder, thermal 위 4.6:1 */
  --rule:#c5d1de;
  --rule-soft:#dde6ef;
  /* 도장 */
  --vermilion:#1f6fe5;      /* white 5.6:1 · thermal 5.2:1 */
  --vermilion-soft:#e3edfc;
  --blue:#a86a00;           /* white 6.1:1 */
  --blue-soft:#fff3cc;
  /* 기타 */
  --bg:#e9f0f7;
  --card:var(--paper);
  --text:var(--ink);
  --muted:var(--ink-2);
  --line:var(--rule);
  --primary:var(--vermilion);
  --danger:var(--vermilion);
  --focus:var(--vermilion);
  --shadow:0 1px 2px rgba(28,27,25,.06), 0 6px 16px rgba(28,27,25,.08);
  --shadow-lift:0 2px 4px rgba(28,27,25,.08), 0 14px 32px rgba(28,27,25,.12);
  --radius:2px;
  --radius-slip:4px;
  /* 폰트 */
  --font:"IBM Plex Sans KR", -apple-system, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  --mono:ui-monospace, "SF Mono", Menlo, Consolas, "Roboto Mono", monospace;
  /* 간격 */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px;
  --nav-h:64px;
  --header-h:52px;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --stamp-ease:cubic-bezier(.05,.9,.2,1);
  --fs-body:15px;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font);
  font-size:var(--fs-body);
  line-height:1.55;
  background:var(--bg);
  color:var(--text);
  font-feature-settings:"tnum" 1;
  scrollbar-color:var(--rule) transparent;
  scrollbar-width:thin;
}
::selection{ background:var(--vermilion); color:var(--paper); }
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-thumb{ background:var(--rule); border-radius:0; }
::-webkit-scrollbar-track{ background:transparent; }
:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; }
a{ color:var(--blue); text-underline-offset:3px; text-decoration-thickness:1px; }
b, strong{ font-weight:700; }

.num, .day-pill, .stat-card__value, .badge--done, .settlement-tx__main b, .exchange-result,
.landing__code, .receipt__code, .day-meta-label, .all-schedule-day-title, .settlement-breakdown,
#budgetSummary b, #exchangeRateText, .person-budget-input, .num-comma, #budgetTotal, #budgetAmount, #exchangeInput,
.stat-card__label, .receipt__brand{
  font-family:var(--mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:0;
}

.ico{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; flex:none; }

/* ── 헤더: 얇은 종이 띠 ────────────────────────────────────────────── */
.header{
  position:sticky; top:0; z-index:10;
  background:var(--paper);
  color:var(--ink);
  border-bottom:1px solid var(--rule);
  padding-top:env(safe-area-inset-top, 0);
}
.header__inner{
  max-width:1500px; margin:0 auto;
  min-height:var(--header-h);
  padding:6px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.brand{ flex:1 1 auto; min-width:0; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.brand__title{ font-size:17px; font-weight:700; letter-spacing:-0.01em; line-height:1.2; }
.brand__sub{ font-size:12px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
#saveIndicator{ font-size:11px; color:var(--blue); transition:opacity .4s var(--ease-out); }
#saveIndicator.is-error{ color:var(--vermilion); }
#saveIndicator.fade{ opacity:0; }

.header__actions{ display:flex; align-items:center; gap:4px; flex:none; }
.btn--me{
  font-family:var(--font); font-weight:700;
  border:1.5px solid var(--ink); border-radius:var(--radius);
  padding:0 10px; height:34px; min-width:44px; max-width:36vw;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  background:var(--paper); color:var(--ink);
}
.btn--me:hover{ background:var(--paper-2); }
.btn--icon-only{ width:44px; height:44px; padding:0; border-radius:var(--radius); }
.btn--icon-only .btn-label{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.btn--icon-only .ico{ width:22px; height:22px; }

/* ── 컨테이너 ───────────────────────────────────────────────────────── */
.container{
  max-width:1500px; margin:0 auto; padding:0 12px;
  padding-bottom:calc(var(--nav-h) + 16px + env(safe-area-inset-bottom, 0));
}
.card{ background:transparent; padding:0; }
.panel{ display:none; margin-top:12px; }
.panel--active{ display:block; }

/* 각 탭의 종이 — 색은 면에 커밋한다 */
#panel-itinerary{ --paper-tab:var(--thermal); }
#panel-places{ --paper-tab:var(--paper-blue); }
#panel-people{ --paper-tab:var(--paper-grey); }
#panel-overview, #panel-allSchedule{ --paper-tab:var(--paper); }
.panel::before{
  content:""; position:fixed; inset:0; z-index:-1;
  background:var(--paper-tab, var(--paper));
}
body.is-landing .panel::before{ display:none; }

/* ── 하단 탭바: 절취선 띠 ───────────────────────────────────────────── */
.bottom-nav{
  position:fixed; bottom:0; left:0; right:0; z-index:100;
  background:var(--paper);
  border-top:1.5px dashed var(--rule);
  display:flex;
  height:calc(var(--nav-h) + env(safe-area-inset-bottom, 0));
  padding-bottom:env(safe-area-inset-bottom, 0);
}
.bnav-item{
  flex:1; position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  border:0; background:none; cursor:pointer;
  color:var(--ink-2); font-family:var(--font);
  padding:6px 0 4px; min-height:44px;
  -webkit-tap-highlight-color:transparent;
}
.bnav-item + .bnav-item::before{
  content:""; position:absolute; left:0; top:12px; bottom:12px;
  border-left:1.5px dashed var(--rule-soft);
}
.bnav-icon{ display:block; line-height:0; }
.bnav-label{ font-size:12px; font-weight:500; line-height:1.2; }
.bnav-item--active{ color:var(--ink); }
.bnav-item--active .bnav-label{ font-weight:700; }
.bnav-item--active .bnav-label::after{
  content:""; display:block; margin:3px auto 0;
  width:6px; height:6px; border-radius:50%;
  background:var(--vermilion);
}
.bnav-item:hover{ color:var(--ink); }

/* ── 섹션(영수증 기둥) ──────────────────────────────────────────────── */
.box{
  background:var(--paper);
  border:1px solid var(--rule-soft);
  border-radius:var(--radius);
  padding:16px;
  margin-bottom:12px;
}
.box:last-child{ margin-bottom:0; }
.h2{
  margin:0 0 16px;
  font-size:15px; font-weight:700;
  letter-spacing:-0.01em; text-transform:none;
  color:var(--ink);
  padding-bottom:10px;
  border-bottom:1.5px solid var(--ink);
}
.h2--emoji{ }
.box__head{ margin-bottom:6px; }
.box__head .h2{ margin:0; border:0; padding:0; }
.preview-header{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; padding-bottom:8px; border-bottom:1.5px dashed var(--rule); }
.preview-header .h2{ margin:0; border:0; padding:0; }
.section-label{ font-weight:700; letter-spacing:.08em; font-size:12px; text-transform:uppercase; }
.divider{ height:0; border-top:1.5px dashed var(--rule); margin:14px 0; }

.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }
.grid2-left{ min-width:0; }
.panel > .grid2{ margin-bottom:12px; }
.grid--plan{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.1fr); gap:16px; align-items:start; }
.grid--places{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.plan-left, .plan-right{ min-width:0; }
.all-schedule-layout{ display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start; }

@media (max-width:860px){
  .grid2, .grid--plan, .grid--places, .all-schedule-layout{ grid-template-columns:1fr; }
}

/* ── 텍스트 유틸 ────────────────────────────────────────────────────── */
.small{ font-size:13px; }
.muted{ color:var(--ink-2); }
.hint{ font-size:12px; color:var(--ink-2); margin-top:6px; line-height:1.5; }
.hint--days{ min-height:18px; margin:0 0 8px; }
.hint-empty{ color:var(--ink-2); font-size:13px; }
.hint-empty__icon{ display:none; }
.row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.row--space{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.row--gen{ margin-top:14px; }
.row--wrap{ gap:8px; }
.inline{ display:flex; align-items:center; gap:8px; }
.inline + .inline{ margin-top:8px; }
.inline--wrap{ flex-wrap:wrap; }
.inline input, .inline select{ flex:1; min-width:0; }
.inline input[type="checkbox"], .inline input[type="radio"]{ flex:none; width:auto; }
.grow{ flex:1 1 120px; min-width:100px; }
.grow-2{ flex:2 1 100px; min-width:90px; }
.grow-3{ flex:3 1 120px; min-width:110px; }
.sel--cat{ flex:none !important; width:auto !important; min-width:88px; }
.sel--dir{ flex:none !important; width:auto !important; min-width:128px; }
.exchange-result{ min-width:80px; font-weight:700; }
.export-status{ color:var(--vermilion); display:none; }
.summary{ font-size:13px; }
.pill{ display:inline-block; padding:2px 8px; border:1px solid var(--rule); border-radius:var(--radius); font-size:12px; }

/* ── 폼 ────────────────────────────────────────────────────────────── */
.formRow{ margin-bottom:16px; }
.formRow:last-child{ margin-bottom:0; }
.formRow--2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.formRow--2 .formRow{ margin-bottom:0; }
.formGrid{ display:grid; grid-template-columns:1fr 1fr; gap:10px 12px; margin-bottom:10px; }
.formGrid .formRow{ margin-bottom:0; }
.formRow--full{ grid-column:1 / -1; }
@media (max-width:480px){ .formGrid{ grid-template-columns:1fr; } }
label{
  display:block; font-size:13px; font-weight:600; color:var(--ink);
  margin-bottom:6px; letter-spacing:0;
}
input, select, textarea{
  width:100%;
  font-family:var(--font); font-size:16px; line-height:1.4;
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:6px;
  padding:10px 12px;
  min-height:44px;
  caret-color:var(--vermilion);
  transition:border-color .15s var(--ease-out), box-shadow .15s var(--ease-out), background-color .15s var(--ease-out);
  -webkit-appearance:none; appearance:none;
}
select{
  padding-right:34px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231c1b19' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");
  background-repeat:no-repeat; background-position:right 10px center; background-size:18px;
}
textarea{ resize:vertical; min-height:80px; }
input::placeholder, textarea::placeholder{ color:var(--ink-3); }
input:hover, select:hover, textarea:hover{ border-color:var(--ink-2); }
input:focus, select:focus, textarea:focus{ outline:none; border-color:var(--vermilion); box-shadow:0 0 0 3px var(--vermilion-soft); }
input:focus-visible, select:focus-visible, textarea:focus-visible{ outline:none; }
input:read-only:not([type="date"]){ background:var(--paper-2); color:var(--ink-2); cursor:default; border-style:dashed; }
input:disabled, select:disabled, button:disabled{ opacity:.55; cursor:not-allowed; text-decoration:line-through; }
input[type="date"]{ font-family:var(--mono); }
.receipt input, .receipt select, .receipt textarea,
#panel-places input, #panel-places select,
#panel-people input{ background:transparent; }

/* ── 버튼 ──────────────────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  font-family:var(--font); font-size:14px; font-weight:700; line-height:1;
  color:var(--paper); background:var(--ink);
  border:1.5px solid var(--ink); border-radius:var(--radius);
  padding:0 14px; min-height:44px; height:44px;
  cursor:pointer; white-space:nowrap;
  transition:background-color .15s var(--ease-out), color .15s var(--ease-out), transform .15s var(--ease-out);
  -webkit-tap-highlight-color:transparent;
}
.btn .ico{ width:16px; height:16px; }
.btn:hover{ background:var(--ink-2); border-color:var(--ink-2); }
.btn:active{ transform:translateY(1px); }
.btn--primary{ background:var(--vermilion); border-color:var(--vermilion); }
.btn--primary:hover{ background:#1758b8; border-color:#1758b8; }
.btn--outline{ background:transparent; color:var(--ink); border-color:var(--ink); }
.btn--outline:hover{ background:var(--paper-2); border-color:var(--ink); color:var(--ink); }
.btn--ghost{ background:transparent; color:var(--ink); border-color:transparent; }
.btn--ghost:hover{ background:var(--paper-2); border-color:transparent; }
.btn--danger{ background:transparent; color:var(--vermilion); border-color:var(--rule); }
.btn--danger:hover{ background:var(--vermilion-soft); border-color:var(--vermilion); color:var(--vermilion); }
.btn--sm{ font-size:13px; padding:0 10px; min-height:36px; height:36px; }
.btn--icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; padding:0; border:0; background:transparent;
  color:var(--ink-2); cursor:pointer; border-radius:var(--radius);
}
.btn--icon:hover{ background:var(--paper-2); color:var(--ink); }
.iconBtn{
  width:36px; height:36px; padding:0; flex:none;
  font-family:var(--mono); font-style:italic; font-weight:700;
}
.linkBtn{ color:var(--blue) !important; text-underline-offset:3px; }
.fileLabel{ display:inline-block; }
#importFile{ display:none; }

/* ── 뱃지·도장 ─────────────────────────────────────────────────────── */
.badge{
  display:inline-flex; align-items:center; gap:4px;
  font-size:12px; font-weight:500; line-height:1.2;
  padding:3px 7px;
  border:1px solid var(--rule); border-radius:var(--radius);
  color:var(--ink-2); background:transparent;
  white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis;
}
.badge--muted{ }
.badge--dim{ border-style:dotted; color:var(--ink-3); }
.badge--warn{ border-color:var(--vermilion); color:var(--vermilion); }
.badge--cat{ border:0; padding-left:0; padding-right:0; color:var(--ink-2); }
.badge--done{ color:var(--ink); border-color:var(--ink); font-weight:700; }
.badge--active{ background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }
/* 대기 도장: 점선 청색 */
.item:not(.item--done) .item__meta .badge--muted:first-child{
  color:var(--blue); border:1.5px dotted var(--blue); font-weight:700; letter-spacing:.06em;
}
/* 완료 도장: 주홍, 이중선, -6° */
.stamp,
.item--done .item__meta .badge--done:first-child{
  font-family:var(--font);
  color:var(--vermilion);
  border:1.5px solid var(--vermilion);
  outline:1.5px solid var(--vermilion); outline-offset:2px;
  border-radius:3px;
  padding:2px 8px;
  font-size:13px; font-weight:700; letter-spacing:.14em;
  transform:rotate(-6deg);
  transform-origin:center;
  animation:stamp-hit .22s var(--stamp-ease) both;
  will-change:transform;
}
@keyframes stamp-hit{
  0%{ transform:scale(1.6) rotate(-9deg); opacity:.2; }
  85%{ transform:scale(.97) rotate(-5deg); opacity:1; }
  100%{ transform:scale(1) rotate(-6deg); opacity:1; }
}

/* ── 리스트 아이템 = 명세 줄 ────────────────────────────────────────── */
.list{ display:flex; flex-direction:column; }
.item{
  position:relative;
  display:flex; align-items:flex-start; gap:10px;
  padding:12px 2px;
  border-bottom:1.5px dashed var(--rule);
  background:transparent;
}
.item:last-child{ border-bottom:0; }
.item:hover{ background:rgba(28,27,25,.025); }
.item[data-cat]{ }
.item[data-cat="맛집"], .item[data-cat="관광"], .item[data-cat="카페"], .item[data-cat="쇼핑"],
.item[data-cat="교통"], .item[data-cat="숙소"], .item[data-cat="기타"]{ }
.item__left{ flex:1; min-width:0; }
.item__title{ font-size:15px; font-weight:700; line-height:1.4; word-break:keep-all; overflow-wrap:anywhere; }
.item__meta{ display:flex; flex-wrap:wrap; gap:4px 6px; margin-top:6px; align-items:center; }
.item__meta--spread{ }
.item__meta--spread .badge{ }
.item__actions{ display:flex; gap:4px; flex:none; flex-wrap:wrap; justify-content:flex-end; align-self:center; }
.item__actions .btn{ min-height:36px; height:36px; font-size:13px; padding:0 10px; }
.item--done .item__title{ text-decoration:line-through; text-decoration-thickness:1.5px; color:var(--ink-2); }
.item--done{ color:var(--ink-2); }
.item--dragging{ opacity:.4; }
.item--dragover{
  background:repeating-linear-gradient(-45deg, transparent 0 6px, var(--rule-soft) 6px 7px);
  outline:1.5px dashed var(--ink); outline-offset:-1px;
}
.item-num{
  flex:none; width:24px;
  font-family:var(--mono); font-size:13px; color:var(--ink-2);
  padding-top:3px; text-align:right;
}
.drag-handle{
  flex:none; width:16px; height:22px; margin-top:2px;
  font-size:0; cursor:grab; color:var(--ink-3);
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 22'><circle cx='5' cy='5' r='1.6'/><circle cx='11' cy='5' r='1.6'/><circle cx='5' cy='11' r='1.6'/><circle cx='11' cy='11' r='1.6'/><circle cx='5' cy='17' r='1.6'/><circle cx='11' cy='17' r='1.6'/></svg>") center / contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 22'><circle cx='5' cy='5' r='1.6'/><circle cx='11' cy='5' r='1.6'/><circle cx='5' cy='11' r='1.6'/><circle cx='11' cy='11' r='1.6'/><circle cx='5' cy='17' r='1.6'/><circle cx='11' cy='17' r='1.6'/></svg>") center / contain no-repeat;
}
.drag-handle:active{ cursor:grabbing; color:var(--ink); }
.done-group-header{
  margin-top:10px; padding:8px 2px;
  font-size:12px; font-weight:700; letter-spacing:.08em; color:var(--ink-2);
  border-top:1.5px dashed var(--rule); cursor:pointer;
}
.done-group-header:hover{ color:var(--ink); }
.assignee-edit-panel{ display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; padding:8px; border:1.5px dashed var(--rule); }
.assignee-edit-panel .badge{ cursor:pointer; min-height:32px; }
.rec-extra{ font-size:12px; color:var(--ink-2); }

/* 장부 줄(예산): 이름 | 카테고리 | 금액 우측 */
.list--ledger .item{ align-items:center; }
.list--ledger .item__title{ font-size:14px; }
.list--ledger .badge--done{ font-family:var(--mono); border:0; padding:0; font-size:14px; margin-left:auto; }

/* 장소 */
#placesList .item{ flex-direction:column; align-items:stretch; }
#placesList .item__left{ width:100%; }
#placesList .item__actions{ align-self:flex-start; margin-top:8px; }
.place-add-panel{ display:flex; gap:6px; align-items:center; padding:8px 0 4px; }
.place-day-select{ flex:1; }

/* 준비 체크리스트 */
.todo-filter{ display:flex; gap:6px; flex-wrap:wrap; margin:10px 0 4px; }
.todo-filter:empty{ display:none; }
.filter-pill{
  font-family:var(--font); font-size:13px; font-weight:500;
  padding:0 10px; min-height:34px; cursor:pointer;
  background:transparent; color:var(--ink-2);
  border:1px solid var(--rule); border-radius:var(--radius);
}
.filter-pill:hover{ color:var(--ink); border-color:var(--ink); }
.filter-pill--active{ background:var(--ink); color:var(--paper); border-color:var(--ink); font-weight:700; }
.todo-cat-header{
  margin-top:12px; padding:6px 2px 2px;
  font-size:12px; letter-spacing:.06em; color:var(--ink-2);
  display:flex; gap:6px; align-items:baseline;
}
.todo-cat-header b{ color:var(--ink); }
.todo-cat-header .muted{ font-family:var(--mono); margin-left:auto; }

/* 통계(합계 블록) */
.stat-cards{ display:grid; grid-template-columns:repeat(4, 1fr); gap:0; border-top:1.5px solid var(--ink); margin-top:4px; }
.stat-card{
  padding:10px 4px 6px; text-align:center; cursor:default;
  border-right:1.5px dashed var(--rule);
}
.stat-card:last-child{ border-right:0; }
.stat-card[role="button"]{ cursor:pointer; }
.stat-card:hover, .stat-card--dday:hover{ background:var(--paper-2); }
.stat-card--dday{ }
.stat-card__value{ font-size:20px; font-weight:700; color:var(--ink); line-height:1.1; }
#statDday .stat-card__value{ color:var(--vermilion); }
#statPeople .stat-card__value, #statDays .stat-card__value, #statItems .stat-card__value{ }
.stat-card__label{ font-size:11px; color:var(--ink-2); margin-top:4px; letter-spacing:.1em; text-transform:uppercase; }

/* 예산 요약 · 인원별 지출 */
#budgetSummary{ line-height:1.8; }
.budget-used-bar{ height:6px; background:var(--paper-2); border:1px solid var(--rule-soft); margin:6px 0 2px; overflow:hidden; }
.budget-used-bar__fill{ height:100%; background:var(--ink); }
.budget-payer-row{ display:flex; align-items:center; gap:10px; margin:10px 0 6px; }
.budget-payer-row .small{ flex:none; color:var(--ink-2); }
.budget-payer-select{ flex:1; }
.budget-assignee-row{ margin-bottom:8px; }
.budget-assignee-head{ display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.budget-assignee-head .small{ color:var(--ink-2); }
.budget-assignee-head .hint{ margin:0; flex:1; }
.budget-assignee-all{
  font-family:var(--font); font-size:12px; font-weight:700;
  background:transparent; border:1px solid var(--rule); border-radius:var(--radius);
  color:var(--ink); padding:0 10px; min-height:32px; cursor:pointer;
}
.budget-assignee-all:hover{ border-color:var(--ink); }
.budget-assignee-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.budget-assignee-chip{
  font-family:var(--font); font-size:13px; font-weight:500;
  background:transparent; color:var(--ink-2);
  border:1.5px dotted var(--rule); border-radius:var(--radius);
  padding:0 12px; min-height:36px; cursor:pointer;
}
.budget-assignee-chip:hover{ color:var(--ink); border-color:var(--ink); }
.budget-assignee-chip.is-on{ background:var(--vermilion); color:var(--paper); border:1.5px solid var(--vermilion); font-weight:700; }
.inline-add-person{ display:flex; align-items:center; gap:8px; margin-top:8px; flex-wrap:wrap; }
.inline-add-person .small{ color:var(--ink-2); }
.inline-add-person input{ flex:1; min-width:120px; }
.inline-add-person .btn{ flex:none; }

/* 정산 = 원장 줄 */
.me-summary{ padding:10px 12px; margin:6px 0 10px; border:1.5px dashed var(--ink); background:var(--paper); }
.me-summary__line{ font-size:13px; margin-top:4px; }
.me-summary__line b{ font-family:var(--mono); }
.settlement-tx{ border-bottom:1.5px dashed var(--rule); }
.settlement-tx:last-child{ border-bottom:0; }
.settlement-tx__main{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 2px; cursor:pointer; min-height:44px;
}
.settlement-tx__main > span{ flex:1; min-width:0; font-size:14px; }
.settlement-tx__main b{ font-family:var(--mono); }
.settlement-tx__actions{ display:flex; gap:4px; flex:none; align-items:center; }
.settlement-tx__toggle{ width:36px; padding:0; background:transparent; color:var(--ink-2); border-color:transparent; }
.settlement-tx__toggle .ico{ width:18px; height:18px; }
.settlement-tx__toggle:hover{ background:var(--paper-2); border-color:transparent; color:var(--ink); }
.settlement-pair__check{ }
.settlement-tx--done .settlement-tx__main > span{ color:var(--ink-2); text-decoration:line-through; text-decoration-thickness:1.5px; }
.settlement-tx--done .settlement-tx__main::after{
  content:"완료";
  order:1;
  flex:none;
  color:var(--vermilion);
  border:1.5px solid var(--vermilion);
  outline:1.5px solid var(--vermilion); outline-offset:2px;
  border-radius:3px; padding:1px 7px;
  font-size:12px; font-weight:700; letter-spacing:.14em;
  transform:rotate(-6deg);
  animation:stamp-hit .22s var(--stamp-ease) both;
  margin-right:6px;
}
.settlement-tx--done .settlement-tx__actions{ order:2; }
.settlement-breakdown{ margin:0 0 10px 12px; padding:8px 10px; border-left:1.5px dashed var(--rule); font-size:12px; }
.settlement-breakdown__line{ display:flex; justify-content:space-between; gap:8px; padding:3px 0; color:var(--ink-2); flex-wrap:wrap; }
.settlement-breakdown__line > span{ flex:1; min-width:0; word-break:break-word; }
.settlement-breakdown__line--offset{ color:var(--vermilion); }
.settlement-breakdown__total{ margin-top:6px; padding-top:6px; border-top:1.5px solid var(--ink); font-weight:700; text-align:right; color:var(--ink); }
.settlement-breakdown__netting{ font-size:11px; color:var(--ink-2); padding:2px 0 2px 8px; font-weight:400; text-align:left; }

/* 환율 */
.exchange-widget{ }
.exchange-widget .row--space{ margin-bottom:6px; }

/* 숙소 요약(개요) */
.accom-summary-day, .accom-edit-day{ font-family:var(--mono); font-size:13px; color:var(--ink-2); flex:none; width:96px; padding-top:12px; }
.accom-summary-item, .accom-edit-item{ display:flex; gap:10px; align-items:flex-start; padding:6px 0; border-bottom:1.5px dashed var(--rule-soft); }
.accom-summary-item:last-child, .accom-edit-item:last-child{ border-bottom:0; }
.accom-edit-fields{ flex:1; display:grid; grid-template-columns:1.4fr 1fr; gap:8px; min-width:0; }
.accom-edit-fields input{ min-width:0; }
@media (max-width:480px){
  .accom-edit-item{ flex-direction:column; gap:2px; }
  .accom-edit-day{ width:auto; padding-top:0; }
  .accom-edit-fields{ width:100%; grid-template-columns:1fr; }
}

/* 첫째 날 미리보기 */
.preview-list{ display:flex; flex-direction:column; }
.preview-item{ display:flex; justify-content:space-between; gap:10px; padding:8px 2px; border-bottom:1.5px dashed var(--rule-soft); font-size:14px; }
.preview-item:last-child{ border-bottom:0; }
.preview-item__title{ font-weight:500; min-width:0; overflow-wrap:anywhere; }
.preview-item__assignee{ font-size:12px; color:var(--ink-2); flex:none; }

/* ── 일정 탭: 스텁 + 영수증 ───────────────────────────────────────── */
.day-picker-bar{ margin-bottom:0; }
.day-pills{
  --fade-l:0px; --fade-r:0px;
  display:flex; gap:6px; overflow-x:auto; scroll-behavior:smooth;
  scrollbar-width:none; padding:8px 2px 0;
  cursor:grab; user-select:none;
  -webkit-mask:linear-gradient(90deg, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%);
  mask:linear-gradient(90deg, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%);
}
.day-pills.is-dragging{ cursor:grabbing; scroll-behavior:auto; }
.day-pills.has-left{ --fade-l:28px; }
.day-pills.has-right{ --fade-r:28px; }
.day-pills::-webkit-scrollbar{ display:none; }
.day-pill{
  flex:none;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;
  min-width:78px; min-height:52px; padding:8px 12px 6px;
  background:var(--paper-deep);
  color:var(--ink-2);
  border:1px solid var(--rule); border-bottom:0;
  border-top:1.5px dashed var(--rule);
  border-radius:var(--radius) var(--radius) 0 0;
  cursor:pointer; font-family:var(--mono); font-size:13px;
  transition:background-color .15s var(--ease-out), color .15s var(--ease-out);
  -webkit-tap-highlight-color:transparent;
}
.day-pill:hover{ background:var(--paper-2); color:var(--ink); }
.day-pill:active{ background:var(--paper-2); }
.day-pill--active{
  background:var(--paper); color:var(--ink);
  border-color:var(--rule); border-top-style:dashed;
  min-height:60px; margin-top:-8px;
  box-shadow:0 -2px 6px rgba(28,27,25,.06);
}
.day-pill__title{ font-weight:700; letter-spacing:.08em; text-transform:uppercase; line-height:1.2; }
.day-pill__date{ font-size:12px; line-height:1.2; }
.day-pill--active .day-pill__title{ font-size:15px; }
.day-meta-label{ font-size:12px; color:var(--ink-2); text-align:right; padding:4px 2px 0; }

/* 영수증 본체: 찢긴 윗단 */
.receipt{
  position:relative;
  background:var(--paper);
  margin-top:10px;
  padding:14px 12px 20px;
  box-shadow:var(--shadow);
}
.receipt::before{
  content:""; position:absolute; left:0; right:0; top:-8px; height:8px;
  background:var(--paper);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8' preserveAspectRatio='none'><path d='M0 8 L8 0 L16 8 Z'/></svg>") left bottom / 16px 8px repeat-x;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8' preserveAspectRatio='none'><path d='M0 8 L8 0 L16 8 Z'/></svg>") left bottom / 16px 8px repeat-x;
}
.receipt .box{ border:0; padding:12px 4px; margin:0; border-bottom:1.5px dashed var(--rule); background:transparent; }
.receipt .box:last-of-type{ border-bottom:0; }
.receipt__head{ text-align:center; padding:4px 0 12px; border-bottom:1.5px solid var(--ink); }
.receipt__brand{ font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink); }
.receipt__lines{ padding-bottom:4px; }
.receipt__lines .h2{ text-align:center; border-bottom:0; padding-bottom:0; margin-bottom:6px; }
.receipt__foot{ padding-top:14px; margin-top:6px; border-top:1.5px solid var(--ink); text-align:center; }
.barcode{
  height:38px; margin:4px auto 6px; max-width:280px;
  background:repeating-linear-gradient(90deg,
    var(--ink) 0 2px, transparent 2px 4px,
    var(--ink) 4px 5px, transparent 5px 8px,
    var(--ink) 8px 11px, transparent 11px 13px,
    var(--ink) 13px 14px, transparent 14px 17px,
    var(--ink) 17px 19px, transparent 19px 20px,
    var(--ink) 20px 21px, transparent 21px 25px);
}
.receipt__code{ font-size:12px; letter-spacing:.22em; color:var(--ink); }

.accom-box{ }
.accom-box__head{ margin-bottom:4px; }
.accom-actions{ display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.people-bar-label{ font-size:12px; font-weight:500; color:var(--ink-2); margin:12px 4px 6px; }
.people-bar{ display:flex; flex-wrap:wrap; gap:6px; padding:0 4px 12px; border-bottom:1.5px dashed var(--rule); }
.people-bar:empty{ display:none; }
.people-bar .badge{ cursor:pointer; min-height:36px; padding:0 12px; font-size:13px; }
.people-bar .badge:hover{ border-color:var(--ink); color:var(--ink); }
.people-bar .badge--active{ background:var(--vermilion); border-color:var(--vermilion); color:var(--paper); }

.accordion-toggle{
  width:100%; display:flex; align-items:center; justify-content:space-between;
  background:transparent; border:0; padding:4px 0; min-height:44px;
  cursor:pointer; color:var(--ink); font-family:var(--font);
}
.accordion-toggle:hover .h2-text{ color:var(--ink); }
.accordion-toggle .h2-text{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.accordion-toggle .h2-text::before{ content:"+ "; }
.accordion-arrow{ display:inline-flex; color:var(--ink-2); transition:transform .2s var(--ease-out); }
.accordion-arrow[data-open="1"]{ transform:rotate(180deg); }
.accordion-body{ margin-top:8px; }

/* 뒷면(지도) */
.backside{
  position:relative;
  background:var(--paper);
  padding:12px; margin-top:16px;
  border-top:1.5px solid var(--rule);
}
.backside__label{
  font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-2); margin-bottom:8px;
}
.backside .box{ background:transparent; border:0; padding:0 0 12px; }
.map-search-box{ }
.map-layout{ }
.mapBox{ position:relative; width:100%; height:420px; background:var(--paper-deep); border:1px solid var(--rule); overflow:hidden; }
#mapCanvas, #placesMapCanvas{ width:100%; height:100%; }
.mapBox #mapRouteFrame{ position:absolute; inset:0; }
#panel-places .plan-right > .mapBox{ }
.map-actions{ margin-top:8px; }
.map-actions .small{ color:var(--ink-2); min-width:0; overflow-wrap:anywhere; }
.plan-right > .row{ }
.detailMapBox{ margin-top:10px; height:320px; border:1px solid var(--rule); background:var(--paper-deep); }
.detailMapBox iframe{ width:100%; height:100%; border:0; }
.pac-container{
  font-family:var(--font); border:1px solid var(--ink); border-radius:0; box-shadow:var(--shadow);
  background:var(--paper); z-index:600;
}

@media (min-width:861px){
  /* 왼쪽 열(영수증)이 길어도 페이지 스크롤이 생기지 않도록: 그리드를 뷰포트에 맞추고 왼쪽만 내부 스크롤 */
  .grid--plan{ align-items:start; height:calc(100dvh - var(--header-h) - var(--nav-h) - 36px - env(safe-area-inset-bottom, 0)); }
  .plan-left{ height:100%; overflow-y:auto; padding-right:4px; scrollbar-width:thin; }
  .backside{ margin-top:0; height:auto; }
  .mapBox{ height:min(520px, calc(100dvh - 380px)); }
}
@media (max-width:860px){
  .mapBox{ height:320px; }
}

/* ── 전체 일정 ─────────────────────────────────────────────────────── */
.all-schedule-list{ margin-top:8px; }
.all-schedule-actions{ display:flex; gap:6px; margin-bottom:10px; }
.all-schedule-day{ border-top:1.5px solid var(--ink); }
.all-schedule-day-header{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 2px; cursor:pointer; min-height:44px;
}
.all-schedule-day-header:hover{ background:rgba(28,27,25,.025); }
.all-schedule-day-title{ font-weight:700; font-size:13px; letter-spacing:.06em; }
.all-schedule-toggle{
  width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:0; color:var(--ink-2); cursor:pointer;
}
.all-schedule-toggle .ico{ transition:transform .2s var(--ease-out); }
.all-schedule-day.is-collapsed .all-schedule-toggle .ico{ transform:rotate(-90deg); }
.all-schedule-day-body{ padding:0 0 8px; }
.all-schedule-day.is-collapsed .all-schedule-day-body{ display:none; }
.all-schedule-row{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:8px 2px 8px 14px; border-bottom:1.5px dashed var(--rule-soft); font-size:14px;
}
.all-schedule-row:last-child{ border-bottom:0; }
.all-schedule-row .small{ color:var(--ink-2); }
.all-schedule-detail{ font-size:14px; line-height:1.6; }
.all-schedule-detail .small{ color:var(--ink-2); }

/* ── 인원 ──────────────────────────────────────────────────────────── */
.person-card{ align-items:center; }
.person-avatar{
  flex:none; width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:17px;
  color:var(--vermilion) !important;
  background:transparent !important;
  border:1.5px solid var(--vermilion);
  border-radius:3px;
}
.person-budget-input{ width:110px !important; min-height:36px; padding:4px 2px; font-size:16px; }

/* ── 모달 = 종이 쪽지 ─────────────────────────────────────────────── */
.modal-overlay{
  position:fixed; inset:0; z-index:400;
  background:rgba(28,27,25,.45);
  display:flex; align-items:flex-end; justify-content:center;
  padding:16px;
}
.modal{
  width:100%; max-width:440px;
  background:var(--paper);
  border:1.5px dashed var(--ink);
  outline:6px solid var(--paper);
  box-shadow:var(--shadow-lift);
  padding:16px;
  max-height:calc(100vh - 32px); overflow:auto;
}
.me-modal{ }
.modal__header{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.modal__header .h2{ margin:0; border:0; padding:0; font-size:16px; letter-spacing:-0.01em; text-transform:none; }
.modal__lead{ margin:0 0 12px; }
.modal__body{ }
.modal__footer{ display:flex; justify-content:flex-end; margin-top:12px; padding-top:12px; border-top:1.5px dashed var(--rule); }
.me-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.me-chips:empty{ display:none; }
.me-chips:empty + .me-new{ margin-top:0; }
.me-chip{
  font-family:var(--font); font-size:14px; font-weight:500;
  background:transparent; color:var(--ink);
  border:1.5px dotted var(--ink-2); border-radius:var(--radius);
  padding:0 14px; min-height:44px; cursor:pointer;
}
.me-chip:hover{ border-style:solid; border-color:var(--ink); }
.me-chip--active{ background:var(--vermilion); border:1.5px solid var(--vermilion); color:var(--paper); font-weight:700; }
.me-new{ display:flex; gap:8px; align-items:center; }
.me-new input{ flex:1; }
.me-new .btn{ flex:none; }
.me-budget{ margin-top:12px; }
.me-budget input{ }
@media (min-width:600px){
  .modal-overlay{ align-items:center; }
}

/* ── 토스트 = 작은 쪽지 ───────────────────────────────────────────── */
.toast-container{
  position:fixed; left:50%; bottom:calc(var(--nav-h) + 12px + env(safe-area-inset-bottom, 0));
  transform:translateX(-50%); z-index:600;
  display:flex; flex-direction:column; gap:8px; align-items:center;
  width:min(92vw, 420px); pointer-events:none;
}
.toast{
  pointer-events:auto;
  padding:10px 16px;
  background:var(--paper); color:var(--ink);
  border:1.5px dashed var(--ink);
  outline:4px solid var(--paper);
  box-shadow:var(--shadow-lift);
  font-size:14px; font-weight:500;
  max-width:100%;
  animation:toastIn .2s var(--ease-out) both;
}
.toast--info{ }
.toast--success{ border-style:solid; border-color:var(--vermilion); color:var(--vermilion); font-weight:700; }
.toast--error{ border-style:solid; border-color:var(--vermilion); color:var(--vermilion); }
.toast--out{ animation:toastOut .2s var(--ease-out) forwards; }
@keyframes toastIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:translateY(0); } }
@keyframes toastOut{ to{ opacity:0; transform:translateY(8px); } }
.toast--confirm{ width:100%; padding:14px 16px; }
.toast__confirm-msg{ white-space:pre-line; margin-bottom:10px; }
.toast__confirm-btns{ display:flex; gap:6px; justify-content:flex-end; }
.toast__confirm-btn{
  font-family:var(--font); font-size:14px; font-weight:700;
  min-height:40px; padding:0 14px; cursor:pointer; border-radius:var(--radius);
  border:1.5px solid var(--ink); background:transparent; color:var(--ink);
}
.toast__confirm-btn:hover{ background:var(--paper-2); }
.toast__confirm-btn--cancel{ }
.toast__confirm-btn--ok{ background:var(--ink); color:var(--paper); }
.toast__confirm-btn--ok:hover{ background:var(--ink-2); border-color:var(--ink-2); }

/* ── 빈 상태: 다음 행동 하나 ──────────────────────────────────────── */
.empty-state{ text-align:center; padding:28px 12px; color:var(--ink-2); }
.empty-state__icon{ display:inline-flex; color:var(--ink-3); margin-bottom:8px; }
.empty-state__icon svg{ width:28px; height:28px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.empty-state__title{ font-size:15px; font-weight:700; color:var(--ink); }
.empty-state__sub{ font-size:13px; margin-top:4px; }
.empty-state__cta{ margin-top:14px; }

/* ── 업데이트 배너 · 당겨서 새로고침 · 로딩 ───────────────────────── */
.update-banner{
  position:sticky; top:calc(var(--header-h) + env(safe-area-inset-top, 0)); z-index:9;
  background:var(--ink); color:var(--paper);
  display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap;
  padding:8px 12px; font-size:13px;
}
.update-banner.hidden{ display:none; }
.update-banner .btn--sm{ background:var(--paper); color:var(--ink); border-color:var(--paper); }
.update-banner .btn--outline{ background:transparent; color:var(--paper); border-color:rgba(255,255,255,.5); }

.pull-refresh-indicator{
  position:fixed; top:calc(env(safe-area-inset-top, 0) + var(--header-h) + 6px); left:50%;
  transform:translateX(-50%);
  background:var(--paper); border:1.5px dashed var(--ink);
  padding:6px 12px; font-size:12px; display:flex; gap:6px; align-items:center;
  opacity:0; z-index:9; pointer-events:none;
  transition:opacity .15s var(--ease-out);
}
.pull-refresh-indicator.visible{ opacity:1; }
.pull-refresh-indicator.releasing .pull-refresh-icon{ color:var(--vermilion); }
.pull-refresh-indicator.refreshing .pull-refresh-icon{ animation:spin .6s linear infinite; }
.pull-refresh-icon{ font-family:var(--mono); font-size:14px; }
@keyframes spin{ to{ transform:rotate(360deg); } }

#loadingOverlay{
  position:fixed; inset:0; z-index:700;
  background:rgba(255,255,255,.88);
  display:flex; align-items:center; justify-content:center;
}
#loadingOverlay.hidden{ display:none; }
.loadingBox{ display:flex; flex-direction:column; align-items:center; gap:10px; font-size:13px; color:var(--ink-2); letter-spacing:.06em; }
.loadingSpinner{
  width:28px; height:28px; border:2px solid var(--rule); border-top-color:var(--vermilion);
  border-radius:50%; animation:spin .8s linear infinite;
}

/* ── 랜딩: 조용한 흰 종이 ─────────────────────────────────────────── */
body.is-landing .header, body.is-landing .bottom-nav, body.is-landing .container,
body.is-landing #updateBanner, body.is-landing #pullRefreshIndicator{ display:none !important; }
body.is-landing{ overflow:hidden; }
.landing{
  position:fixed; inset:0; z-index:500;
  display:block;
  background:var(--ground, var(--paper));
  padding:0 0 env(safe-area-inset-bottom, 0);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.landing.hidden{ display:none; }
.landing__card{
  width:100%; max-width:420px;
  display:flex; flex-direction:column; gap:14px;
}
.landing__brand{ text-align:center; margin-bottom:12px; }
.landing__logo{ display:inline-flex; color:var(--ink); margin-bottom:8px; }
.landing__logo svg{ width:44px; height:44px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.landing__logo img{ width:56px; height:56px; border-radius:14px; box-shadow:0 6px 18px rgba(31,111,229,.25); }
.landing__title{ margin:0; font-size:30px; font-weight:700; letter-spacing:-0.02em; line-height:1.1; }
.landing__tagline{ margin:8px 0 0; font-size:14px; color:var(--ink-2); }
.landing__new{
  height:56px; font-size:16px; letter-spacing:.04em;
  border:2px solid var(--vermilion); outline:2px solid var(--vermilion); outline-offset:3px;
  background:var(--vermilion); color:var(--paper); border-radius:3px;
}
.landing__new:hover{ background:#1758b8; border-color:#1758b8; outline-color:#1758b8; }
.landing__new:active{ transform:translateY(1px); }
.landing__new:focus-visible{ outline-offset:5px; }
.landing__divider{ display:flex; align-items:center; gap:10px; color:var(--ink-3); font-size:12px; letter-spacing:.1em; margin:4px 0; }
.landing__divider::before, .landing__divider::after{ content:""; flex:1; border-top:1.5px dashed var(--rule); }
.landing__label{ margin:0 0 -6px; }
.landing__code-row{ display:flex; gap:8px; align-items:center; }
.landing__code{
  flex:1; font-size:18px; letter-spacing:.2em; text-transform:uppercase;
  padding:8px 2px; min-height:48px;
}
.landing__code-row .btn{ flex:none; height:48px; min-width:64px; }
.landing__recent{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  width:100%; padding:12px 14px; margin-top:4px; min-height:48px;
  background:transparent; border:1.5px dashed var(--rule); border-radius:var(--radius);
  font-family:var(--font); font-size:14px; color:var(--ink); cursor:pointer; text-align:left;
}
.landing__recent:hover{ border-color:var(--ink); }
.landing__recent.hidden{ display:none; }
.landing__recent-label{ font-size:12px; color:var(--ink-2); flex:none; }
.landing__recent-name{ flex:1; font-weight:700; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.landing__recent-arrow{ font-family:var(--mono); color:var(--vermilion); }
.landing__form{ display:none; flex-direction:column; gap:2px; }
.landing__card.is-creating .landing__step1{ display:none; }
.landing__card.is-creating .landing__form{ display:flex; }
.landing__form-title{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding-bottom:8px; margin-bottom:8px; border-bottom:1.5px dashed var(--rule); }
.landing__form .formRow input{ background:transparent; }
.landing__req{ color:var(--vermilion); }
.landing__opt{ color:var(--ink-3); font-weight:400; }
.landing__form-actions{ display:flex; gap:8px; margin-top:8px; }
.landing__form-actions .btn--outline{ flex:none; height:56px; padding:0 18px; }
.landing__form-actions .landing__new{ flex:1; }

/* ── 인쇄 ─────────────────────────────────────────────────────────── */
@media print{
  .header, .bottom-nav, .export-box, .update-banner,
  #panel-overview, #panel-itinerary, #panel-places, #panel-people,
  .all-schedule-actions, .all-schedule-toggle, .detailMapBox,
  .btn, #btnPrintSchedule, .panel::before{ display:none !important; }
  #panel-allSchedule{ display:block !important; }
  .all-schedule-layout{ grid-template-columns:1fr !important; }
  .all-schedule-day.is-collapsed .all-schedule-day-body{ display:block !important; }
  .all-schedule-day{ break-inside:avoid; margin-bottom:8px; }
  .container{ max-width:100% !important; padding:0 !important; }
  .box{ border:0 !important; }
}

/* ── 모바일 ────────────────────────────────────────────────────────── */
@media (max-width:480px){
  .header__inner{ padding:6px 10px; gap:6px; }
  .brand{ flex-direction:column; gap:0; align-items:flex-start; }
  .btn--me{ max-width:26vw; font-size:13px; padding:0 8px; }
  .header__actions .btn--danger{ padding:0 8px; font-size:12px; }
  .btn--icon-only{ width:40px; }
  .box{ padding:14px 12px; }
  .receipt{ padding:12px 10px 18px; }
  .item__actions{ flex-direction:column; align-items:stretch; }
  .item__actions .btn{ width:100%; }
  #placesList .item__actions{ flex-direction:row; }
  .stat-cards{ grid-template-columns:repeat(4, 1fr); }
  .stat-card__value{ font-size:18px; }
  .mapBox{ height:280px; }
  .detailMapBox{ height:260px; }
  .day-pill{ min-width:70px; padding:8px 10px 6px; }
}

/* ── 모션 절제 ─────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .stamp, .item--done .item__meta .badge--done:first-child, .settlement-tx--done .settlement-tx__main::after{ animation:none; }
}

/* ── 팔레트: 단톡방(6) 색 — 하늘색 바닥 위 흰 영수증, 액션 블루 하나로 활성 상태 통일 ── */
:root{
  --ground:#e9f0f7;          /* 페이지 바닥 (하늘) */
  --paper-tab-1:#f3f7fc;     /* 개요·전체 */
  --paper-tab-2:#eef3f9;     /* 인원 */
  --paper-tab-3:#e9f0f7;     /* 일정 (영수증이 흰색으로 뜸) */
  --paper-tab-4:#e6eef8;     /* 장소 */
  --on-accent:#ffffff;
}
body{ background:var(--ground); }
/* 모든 탭 같은 바닥색 */
#panel-overview, #panel-allSchedule, #panel-people, #panel-itinerary, #panel-places{ --paper-tab:var(--ground); }
.header{ background:var(--paper-tab-1); }
.receipt{ background:var(--paper); }
.day-pill--active{ background:var(--vermilion); color:var(--on-accent); border-color:var(--vermilion); }
.day-pill--active .day-pill__date{ color:var(--on-accent); opacity:.85; }
.stat-card--dday{ background:var(--vermilion); }
#statDday .stat-card__value, .stat-card--dday .stat-card__label{ color:var(--on-accent); }

/* ── 다크 모드: 밤 이동용. 종이 → 어두운 종이, 잉크 → 밝은 잉크, 액션 블루는 밝게 ── */
html[data-theme="dark"]{
  --paper:#171a1f; --thermal:#1c2026; --paper-blue:#1a2230; --paper-grey:#1b1f26;
  --paper-2:#232830; --paper-deep:#2b313b;
  --ink:#eef1f5; --ink-2:#aab3bf; --ink-3:#8b95a3;
  --rule:#3a424d; --rule-soft:#2c333c;
  --vermilion:#6ea8ff; --vermilion-soft:#1e2c44; --blue:#f0b64a; --blue-soft:#3a2f12;
  --ground:#0f1216; --paper-tab-1:#141820; --paper-tab-2:#141820; --paper-tab-3:#0f1216; --paper-tab-4:#121a24;
  --on-accent:#0f1216;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 16px rgba(0,0,0,.45);
  --shadow-lift:0 2px 4px rgba(0,0,0,.5), 0 14px 32px rgba(0,0,0,.55);
  color-scheme:dark;
}
html[data-theme="dark"] .bottom-nav{ background:var(--paper); }
html[data-theme="dark"] .btn--primary, html[data-theme="dark"] .landing__new{ color:var(--on-accent); }
html[data-theme="dark"] .btn--primary:hover, html[data-theme="dark"] .landing__new:hover{ background:#8cbbff; border-color:#8cbbff; outline-color:#8cbbff; }
html[data-theme="dark"] .mapBox{ filter:brightness(.92) contrast(1.05); }
html[data-theme="dark"] ::selection{ background:var(--vermilion); color:var(--on-accent); }
@media (prefers-color-scheme: dark){
  html:not([data-theme="light"]) { color-scheme:dark; }
}
.btn--theme .ico-sun{ display:none; }
html[data-theme="dark"] .btn--theme .ico-sun{ display:block; }
html[data-theme="dark"] .btn--theme .ico-moon{ display:none; }
#btnTheme{ display:none; }

/* ── 숙소: 구간(체크인~체크아웃) 입력 + 파생 목록 ───────────────────────── */
.stay-form{ display:grid; gap:8px; margin:10px 0 12px; }
.stay-form .formRow--2{ margin:0; }
.stay-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1.5px dashed var(--rule-soft); }
.stay-row:last-child{ border-bottom:0; }
.stay-row__main{ min-width:0; flex:1; }
.stay-row__name{ font-weight:700; }
.stay-row__dates{ font-family:var(--mono); font-size:13px; color:var(--ink-2); margin-top:2px; }
.stay-row__note{ font-size:13px; color:var(--ink-2); margin-top:2px; }
.stay-row__gap{ font-size:12px; color:var(--blue); font-family:var(--mono); padding:6px 0; }
.stay-perday{ margin-top:12px; border-top:1.5px dashed var(--rule-soft); padding-top:8px; }
.stay-perday > summary{ cursor:pointer; font-size:12px; color:var(--ink-2); list-style:none; display:flex; align-items:center; gap:6px; min-height:32px; }
.stay-perday > summary::-webkit-details-marker{ display:none; }
.stay-perday > summary::before{ content:"▸"; font-size:11px; }
.stay-perday[open] > summary::before{ content:"▾"; }

/* ── 인원 이름 인라인 수정 · 장소 수정 패널 ─────────────────────────── */
.person-name-input{ font-weight:700; font-size:15px; padding:6px 10px; min-height:38px; max-width:260px; }
.place-edit-panel{ width:100%; margin-top:10px; padding-top:10px; border-top:1.5px dashed var(--rule-soft); }
.place-edit-panel .formRow{ margin-bottom:10px; }

/* ── 카드 안 소제목 (인원별 지출·정산·환율·포함 인원 등) ─────────────── */
.subhead{ font-size:14px; font-weight:700; color:var(--ink); margin:18px 0 8px; letter-spacing:-0.01em; }
.subhead--inline{ margin:0; }
#budgetSettlement > .subhead:first-child{ margin-top:8px; }

/* ── 예산 관리: 구역 경계를 분명하게 ─────────────────────────────────── */
/* 구역 사이는 실선, 구역 안 행은 연한 실선. 소제목은 밑줄로 구역의 시작을 표시 */
.divider{ border-top:1px solid var(--rule); margin:18px 0; }
.subhead:not(.subhead--inline){ padding-bottom:6px; border-bottom:1px solid var(--rule); margin-top:22px; }
#budgetPersonFields{ padding:12px 0 4px; }
#budgetList{ margin-top:12px; border-top:1px solid var(--rule); }
#budgetList .item{ padding:12px 4px; border-bottom:1px solid var(--rule-soft); }
#budgetList .item:last-child{ border-bottom:0; } /* 바로 뒤 .divider가 경계 역할 */
#budgetList .item__title{ font-size:15px; }
#budgetList .hint{ padding:12px 4px; }
#budgetSummary{ margin-top:14px; padding:12px 14px; border:1px solid var(--rule); border-radius:6px; }
#budgetSummary .budget-used-bar{ margin:8px 0 6px; }
#budgetSettlement .item, .settlement-tx{ border-bottom:1px solid var(--rule-soft); }
.settlement-tx__main{ padding:12px 4px; }
.me-summary{ margin-top:10px; }
.exchange-widget{ padding-top:2px; }

/* 예산 항목 추가 버튼: 결제자·포함 인원까지 채운 뒤 누르는 마지막 단계 */
.budget-add-row{ display:flex; justify-content:flex-end; margin:6px 0 4px; }
@media (max-width:480px){ .budget-add-row .btn{ width:100%; } }

/* ── 랜딩: 소개 페이지 ────────────────────────────────────────────── */
.landing__page{ max-width:1080px; margin:0 auto; padding:0 20px 56px; word-break:keep-all; overflow-wrap:anywhere; }
.landing__bar{ display:flex; align-items:center; gap:10px; padding:16px 0 4px; }
.landing__bar .landing__logo{ margin:0; }
.landing__bar .landing__logo img{ width:32px; height:32px; border-radius:8px; box-shadow:none; }
.landing__bar .landing__title{ font-size:18px; font-weight:700; }
.landing__hero{ display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:start; padding:36px 0 40px; }
.landing__hero-copy{ display:flex; flex-direction:column; gap:14px; }
.landing__h1{ margin:0; font-size:clamp(30px, 4.6vw, 50px); line-height:1.12; letter-spacing:-0.02em; font-weight:700; text-wrap:balance; }
.landing__hero .landing__tagline{ margin:-4px 0 6px; font-size:17px; }
.landing__hero .landing__card{ background:var(--paper); border:1px solid var(--rule); border-radius:12px; padding:18px; }
/* 명세 예시 */
.landing__receipt{ margin:28px 0 0; justify-self:center; width:100%; max-width:480px; background:var(--paper); border:1px solid var(--rule); padding:22px 24px; font-family:var(--mono); font-size:14px; position:relative; }
.landing__receipt::before{ content:""; position:absolute; left:0; right:0; top:-8px; height:8px; background:linear-gradient(135deg, transparent 50%, var(--paper) 50%) 0 0/16px 8px repeat-x, linear-gradient(225deg, transparent 50%, var(--paper) 50%) 8px 0/16px 8px repeat-x; }
.lr__head{ text-align:center; letter-spacing:.18em; font-size:12px; color:var(--ink-2); padding-bottom:10px; border-bottom:1.5px solid var(--ink); margin-bottom:10px; }
.lr__row{ display:grid; grid-template-columns:52px 1fr auto; gap:10px; padding:8px 0; border-bottom:1px dashed var(--rule); position:relative; }
.lr__n{ color:var(--ink-2); } .lr__r{ text-align:right; color:var(--ink-2); }
.lr__row--stamp::after{ content:"완료"; position:absolute; right:120px; top:3px; transform:rotate(-8deg); border:2px double var(--vermilion); color:var(--vermilion); font-weight:700; font-size:12px; padding:1px 6px; letter-spacing:.2em; font-family:var(--font); }
.lr__tot{ display:flex; justify-content:space-between; padding:10px 0 0; margin-top:6px; border-top:1.5px solid var(--ink); font-weight:500; }
.lr__tot + .lr__tot{ border-top:0; padding-top:2px; margin-top:0; }
.lr__bar{ margin:14px auto 4px; height:34px; width:70%; background:repeating-linear-gradient(90deg, var(--ink) 0 2px, transparent 2px 4px, var(--ink) 4px 5px, transparent 5px 8px); }
.lr__code{ text-align:center; font-size:11px; letter-spacing:.2em; color:var(--ink-2); }
/* 섹션 공통 */
.landing__sec{ padding:40px 0; border-top:1px solid var(--rule-soft); }
.landing__h2{ margin:0 0 8px; font-size:clamp(22px, 2.6vw, 28px); letter-spacing:-0.015em; text-wrap:balance; border:0; padding:0; text-transform:none; }
.landing__sub{ margin:0 0 22px; color:var(--ink-2); max-width:72ch; }
.landing__shots{ display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; }
.landing__shot{ margin:0; background:var(--paper); border:1px solid var(--rule); border-radius:12px; overflow:hidden; }
.landing__shot img{ width:100%; height:auto; aspect-ratio:390/844; object-fit:cover; object-position:top; border-bottom:1px solid var(--rule-soft); display:block; }
.landing__shot figcaption{ padding:12px 14px; font-size:14px; }
.landing__shot figcaption b{ display:block; margin-bottom:2px; }
.landing__shot figcaption span{ color:var(--ink-2); font-size:13px; }
.landing__seams{ display:grid; grid-template-columns:repeat(5, 1fr); border:1px solid var(--rule); background:var(--paper); }
.landing__seam{ padding:18px 16px; border-right:1px dashed var(--rule); }
.landing__seam:last-child{ border-right:0; }
.ls__k{ font-family:var(--mono); font-size:12px; color:var(--ink-2); letter-spacing:.12em; margin-bottom:6px; }
.landing__seam b{ display:block; font-size:16px; margin-bottom:4px; }
.landing__seam p{ margin:0; font-size:13.5px; color:var(--ink-2); }
.landing__steps{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; }
.landing__step{ background:var(--paper); border:1px solid var(--rule); padding:18px; }
.lstep__n{ font-family:var(--mono); color:var(--vermilion); font-size:13px; }
.landing__step b{ display:block; font-size:16px; margin:6px 0 4px; }
.landing__step p{ margin:0; color:var(--ink-2); font-size:14px; }
.landing__faq{ display:grid; gap:10px; max-width:720px; }
.landing__faq details{ background:var(--paper); border:1px solid var(--rule); border-radius:10px; padding:0 16px; }
.landing__faq summary{ cursor:pointer; padding:14px 0; font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:12px; }
.landing__faq summary::-webkit-details-marker{ display:none; }
.landing__faq summary::after{ content:"+"; color:var(--ink-3); }
.landing__faq details[open] summary::after{ content:"–"; }
.landing__faq p{ margin:0 0 14px; color:var(--ink-2); font-size:15px; }
.landing__foot{ border-top:1px solid var(--rule); padding:22px 0 0; font-size:13px; color:var(--ink-2); display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center; }
.landing__mark{ width:24px; height:24px; border-radius:6px; vertical-align:middle; margin-right:8px; }
@media (max-width:820px){
  .landing__hero{ grid-template-columns:1fr; gap:22px; padding:20px 0 28px; }
  .landing__receipt{ max-width:none; }
  .landing__shots, .landing__steps{ grid-template-columns:1fr; }
  .landing__seams{ grid-template-columns:1fr; }
  .landing__seam{ border-right:0; border-bottom:1px dashed var(--rule); }
  .landing__seam:last-child{ border-bottom:0; }
  .landing__sec{ padding:32px 0; }
}

/* 새 여행 입력 중: 소개 섹션·명세 예시·헤드라인 숨기고 폼만 (이전의 "입력 페이지" 느낌) */
.landing.is-creating .landing__sec, .landing.is-creating .landing__foot, .landing.is-creating .landing__receipt,
.landing.is-creating .landing__h1, .landing.is-creating .landing__hero .landing__tagline{ display:none; }
.landing.is-creating .landing__hero{ grid-template-columns:1fr; justify-items:center; padding-top:16px; }
.landing.is-creating .landing__hero-copy{ width:100%; max-width:440px; }
.stay-match{ margin-top:-2px; }
.stay-match--ok{ color:var(--vermilion); }
.stay-row__addr{ color:var(--ink-2); }
.stay-row__warn{ color:var(--blue); }
