.tip-mount {
  --tip-navy: #12284c;
  --tip-blue: #176bdb;
  --tip-blue-dark: #1057b8;
  --tip-coral: #ff7058;
  --tip-sky: #eaf5ff;
  --tip-line: #dce6f2;
  --tip-text: #18243a;
  --tip-muted: #68758b;
  --tip-bg: #f5f8fc;
  --tip-white: #fff;
  --tip-green: #16825d;
  --tip-red: #d74848;
  color: var(--tip-text);
  font-family: Pretendard, "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  min-height: 720px;
  background: var(--tip-bg);
  border: 1px solid var(--tip-line);
  border-radius: 24px;
  overflow: hidden;
}
.tip-mount * { box-sizing: border-box; }
.tip-mount button, .tip-mount input, .tip-mount select, .tip-mount textarea { font: inherit; }
.tip-mount button { cursor: pointer; }
.tip-shell { max-width: 1180px; margin: 0 auto; padding: 0 28px 52px; }
.tip-topbar { background: rgba(255,255,255,.94); border-bottom: 1px solid var(--tip-line); }
.tip-topbar-inner { max-width: 1180px; height: 76px; margin: 0 auto; padding: 0 28px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.tip-brand { display:flex; align-items:center; gap:11px; color:var(--tip-navy); font-weight:850; font-size:1.12rem; letter-spacing:-.02em; }
.tip-brand-mark { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; color:#fff; background:var(--tip-blue); font-size:20px; box-shadow:0 8px 18px rgba(23,107,219,.2); }
.tip-main-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; padding:44px 0 26px; }
.tip-eyebrow { color:var(--tip-blue); font-size:.82rem; font-weight:800; letter-spacing:.08em; margin:0 0 6px; }
.tip-title { margin:0; color:var(--tip-navy); font-size:clamp(1.65rem, 4vw, 2.35rem); line-height:1.2; letter-spacing:-.04em; }
.tip-subtitle { margin:8px 0 0; color:var(--tip-muted); }
.tip-button { min-height:46px; border:0; border-radius:13px; padding:0 18px; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:750; transition:background .15s, transform .15s, box-shadow .15s; }
.tip-button:hover { transform:translateY(-1px); }
.tip-button:focus-visible, .tip-icon-button:focus-visible, .tip-tab:focus-visible { outline:3px solid rgba(23,107,219,.25); outline-offset:2px; }
.tip-button-primary { background:var(--tip-blue); color:#fff; box-shadow:0 9px 18px rgba(23,107,219,.18); }
.tip-button-primary:hover { background:var(--tip-blue-dark); }
.tip-button-secondary { background:#fff; color:var(--tip-navy); border:1px solid var(--tip-line); }
.tip-button-danger { background:#fff1f1; color:var(--tip-red); }
.tip-button-small { min-height:38px; padding:0 13px; border-radius:10px; font-size:.88rem; }
.tip-empty { background:#fff; border:1px solid var(--tip-line); border-radius:22px; min-height:460px; display:grid; grid-template-columns:minmax(260px, 400px) minmax(260px, 1fr); align-items:center; padding:42px 7%; box-shadow:0 15px 40px rgba(37,67,110,.06); }
.tip-empty img { width:min(100%, 330px); aspect-ratio:1; object-fit:cover; border-radius:50%; justify-self:center; }
.tip-empty-copy h2 { margin:0 0 10px; font-size:1.55rem; color:var(--tip-navy); letter-spacing:-.03em; }
.tip-empty-copy p { margin:0 0 22px; color:var(--tip-muted); max-width:420px; }
.tip-trip-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px; }
.tip-trip-card { position:relative; border:1px solid var(--tip-line); border-radius:19px; padding:22px; background:#fff; box-shadow:0 8px 24px rgba(29,57,96,.05); transition:transform .18s, box-shadow .18s, border-color .18s; }
.tip-trip-card:hover { transform:translateY(-3px); border-color:#bdd6f2; box-shadow:0 16px 32px rgba(29,57,96,.09); }
.tip-card-click { appearance:none; width:100%; padding:0; border:0; text-align:left; background:transparent; color:inherit; }
.tip-card-top { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:24px; }
.tip-destination-chip { display:inline-flex; align-items:center; gap:6px; color:var(--tip-blue); font-weight:750; font-size:.84rem; background:var(--tip-sky); border-radius:999px; padding:6px 10px; }
.tip-card-arrow { color:#96a6bb; font-size:1.25rem; }
.tip-trip-card h2 { margin:0 0 8px; color:var(--tip-navy); font-size:1.25rem; line-height:1.35; letter-spacing:-.025em; }
.tip-card-date { margin:0; color:var(--tip-muted); font-size:.9rem; }
.tip-card-stats { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:20px 0 0; padding-top:18px; border-top:1px solid #edf1f6; }
.tip-card-stat span { display:block; color:var(--tip-muted); font-size:.76rem; }
.tip-card-stat strong { color:var(--tip-text); font-size:.95rem; }
.tip-card-note { margin:14px 0 0; color:var(--tip-muted); font-size:.86rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tip-back { appearance:none; border:0; background:transparent; color:var(--tip-muted); font-weight:700; padding:0; display:inline-flex; gap:7px; align-items:center; margin:28px 0 14px; }
.tip-detail-hero { background:linear-gradient(130deg, #10284e 0%, #145dba 70%, #2781dc 100%); color:#fff; border-radius:22px; padding:28px 30px; box-shadow:0 16px 34px rgba(18,40,76,.16); }
.tip-hero-top { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; }
.tip-detail-hero h1 { margin:0; font-size:clamp(1.65rem,4vw,2.25rem); line-height:1.25; letter-spacing:-.04em; color:#fff; }
.tip-hero-meta { margin:7px 0 0; color:rgba(255,255,255,.78); }
.tip-actions { display:flex; gap:8px; flex-wrap:wrap; }
.tip-hero-action { min-height:38px; padding:0 13px; border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.12); color:#fff; border-radius:11px; font-size:.86rem; font-weight:700; }
.tip-budget-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin-top:28px; background:rgba(255,255,255,.16); border-radius:14px; overflow:hidden; }
.tip-budget-cell { padding:16px; background:rgba(6,30,66,.24); }
.tip-budget-cell span { display:block; color:rgba(255,255,255,.68); font-size:.78rem; margin-bottom:3px; }
.tip-budget-cell strong { font-size:1rem; color:#fff; }
.tip-budget-cell .tip-over { color:#ffd3cc; }
.tip-tabs { display:flex; gap:6px; margin:24px 0 18px; padding:5px; background:#e9eef5; border-radius:14px; width:max-content; }
.tip-tab { min-height:40px; border:0; border-radius:10px; padding:0 18px; color:var(--tip-muted); background:transparent; font-weight:750; }
.tip-tab[aria-selected="true"] { color:var(--tip-navy); background:#fff; box-shadow:0 3px 10px rgba(31,54,85,.08); }
.tip-day-list { display:grid; gap:16px; }
.tip-day { border:1px solid var(--tip-line); border-radius:19px; background:#fff; overflow:hidden; }
.tip-day-head { padding:19px 20px; display:flex; align-items:center; justify-content:space-between; gap:14px; border-bottom:1px solid #edf1f6; }
.tip-day-title { display:flex; align-items:center; gap:12px; }
.tip-day-badge { width:58px; min-height:48px; display:grid; place-items:center; border-radius:12px; background:var(--tip-navy); color:#fff; font-weight:850; font-size:.83rem; }
.tip-day-head h2 { margin:0; color:var(--tip-navy); font-size:1.06rem; }
.tip-day-head p { margin:2px 0 0; color:var(--tip-muted); font-size:.82rem; }
.tip-day-cost { font-size:.88rem; color:var(--tip-muted); text-align:right; }
.tip-day-cost strong { display:block; color:var(--tip-text); }
.tip-schedule-list { padding:5px 20px; }
.tip-schedule { display:grid; grid-template-columns:68px 12px minmax(0,1fr) auto; gap:12px; padding:16px 0; align-items:start; border-bottom:1px solid #edf1f6; }
.tip-schedule:last-child { border-bottom:0; }
.tip-time { color:var(--tip-navy); font-weight:800; font-variant-numeric:tabular-nums; }
.tip-timeline-dot { width:9px; height:9px; border-radius:50%; background:var(--tip-coral); margin-top:7px; box-shadow:0 0 0 4px #fff0ed; }
.tip-schedule h3 { margin:0; font-size:1rem; color:var(--tip-text); }
.tip-schedule-place { color:var(--tip-muted); font-size:.84rem; margin-top:2px; }
.tip-schedule-meta { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; align-items:center; }
.tip-category { border-radius:999px; padding:3px 8px; background:var(--tip-sky); color:var(--tip-blue-dark); font-size:.74rem; font-weight:700; }
.tip-cost { font-size:.8rem; font-weight:700; color:var(--tip-green); }
.tip-schedule-note { color:var(--tip-muted); font-size:.8rem; width:100%; }
.tip-row-actions { display:flex; gap:4px; }
.tip-icon-button { width:34px; height:34px; border:1px solid var(--tip-line); background:#fff; color:var(--tip-muted); border-radius:9px; display:grid; place-items:center; font-size:.88rem; }
.tip-icon-button:hover { color:var(--tip-blue); border-color:#b8d3f2; }
.tip-empty-day { padding:24px 20px; display:flex; align-items:center; justify-content:space-between; gap:18px; color:var(--tip-muted); }
.tip-overview { display:grid; gap:16px; }
.tip-overview-day { border:1px solid var(--tip-line); background:#fff; border-radius:17px; padding:20px; }
.tip-overview-day h2 { margin:0 0 14px; color:var(--tip-navy); font-size:1rem; display:flex; gap:9px; align-items:baseline; }
.tip-overview-day h2 span { color:var(--tip-muted); font-size:.82rem; font-weight:500; }
.tip-overview-row { display:grid; grid-template-columns:64px 1fr auto; gap:12px; padding:9px 0; border-top:1px solid #edf1f6; font-size:.9rem; }
.tip-overview-row:first-of-type { border-top:0; }
.tip-overview-row time { font-weight:750; color:var(--tip-blue); }
.tip-overview-empty { color:var(--tip-muted); font-size:.9rem; margin:0; }
.tip-cost-panel { display:grid; grid-template-columns:1.3fr .7fr; gap:18px; }
.tip-cost-card { background:#fff; border:1px solid var(--tip-line); border-radius:18px; padding:22px; }
.tip-cost-card h2 { margin:0 0 18px; color:var(--tip-navy); font-size:1.08rem; }
.tip-cost-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:12px 0; border-bottom:1px solid #edf1f6; }
.tip-cost-row:last-child { border-bottom:0; }
.tip-cost-row span { color:var(--tip-muted); }
.tip-cost-row strong { color:var(--tip-navy); }
.tip-progress-track { height:10px; background:#e8eef6; border-radius:999px; overflow:hidden; margin:15px 0 8px; }
.tip-progress-bar { height:100%; background:var(--tip-blue); border-radius:inherit; }
.tip-progress-bar.is-over { background:var(--tip-coral); }
.tip-progress-label { color:var(--tip-muted); font-size:.82rem; }
.tip-note-card { margin-top:18px; padding:18px 20px; border-radius:16px; background:#eef6ff; color:#38516f; }
.tip-dialog { width:min(620px, calc(100vw - 28px)); max-height:min(88vh, 820px); border:0; border-radius:20px; padding:0; box-shadow:0 24px 80px rgba(10,27,53,.25); color:var(--tip-text); }
.tip-dialog::backdrop { background:rgba(12,27,51,.54); backdrop-filter:blur(3px); }
.tip-dialog-head { padding:22px 24px 15px; display:flex; align-items:center; justify-content:space-between; gap:14px; border-bottom:1px solid var(--tip-line); }
.tip-dialog-head h2 { margin:0; color:var(--tip-navy); font-size:1.25rem; }
.tip-dialog-close { appearance:none; border:0; background:#edf2f7; color:var(--tip-muted); width:36px; height:36px; border-radius:10px; font-size:1.15rem; }
.tip-form { padding:22px 24px 24px; overflow:auto; max-height:calc(88vh - 76px); }
.tip-field-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.tip-field { display:grid; gap:7px; margin-bottom:16px; }
.tip-field label { color:var(--tip-navy); font-size:.87rem; font-weight:750; }
.tip-field small { color:var(--tip-muted); font-size:.76rem; }
.tip-field input, .tip-field select, .tip-field textarea { width:100%; min-height:45px; border:1px solid #ced9e7; border-radius:11px; padding:10px 12px; color:var(--tip-text); background:#fff; }
.tip-field textarea { min-height:84px; resize:vertical; }
.tip-field input:focus, .tip-field select:focus, .tip-field textarea:focus { outline:3px solid rgba(23,107,219,.13); border-color:var(--tip-blue); }
.tip-error { min-height:21px; margin:-4px 0 12px; color:var(--tip-red); font-size:.84rem; font-weight:650; }
.tip-form-actions { display:flex; justify-content:flex-end; gap:9px; padding-top:5px; }
.tip-visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.tip-toast { position:fixed; z-index:100000; left:50%; bottom:24px; transform:translate(-50%, 20px); background:var(--tip-navy); color:#fff; border-radius:12px; padding:11px 17px; opacity:0; pointer-events:none; transition:opacity .2s, transform .2s; box-shadow:0 10px 30px rgba(0,0,0,.18); }
.tip-toast.is-visible { opacity:1; transform:translate(-50%, 0); }
@media (max-width: 860px) {
  .tip-trip-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tip-budget-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tip-cost-panel { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
  .tip-mount { border-radius:0; border-left:0; border-right:0; min-height:100vh; }
  .tip-shell, .tip-topbar-inner { padding-left:16px; padding-right:16px; }
  .tip-topbar-inner { height:64px; }
  .tip-main-head { align-items:stretch; flex-direction:column; padding:28px 0 20px; }
  .tip-main-head .tip-button { width:100%; }
  .tip-empty { grid-template-columns:1fr; text-align:center; padding:28px 20px 34px; min-height:0; }
  .tip-empty img { width:210px; }
  .tip-empty-copy p { margin-left:auto; margin-right:auto; }
  .tip-trip-grid { grid-template-columns:1fr; }
  .tip-detail-hero { padding:23px 19px; border-radius:18px; }
  .tip-hero-top { flex-direction:column; }
  .tip-actions { width:100%; }
  .tip-hero-action { flex:1; }
  .tip-budget-grid { grid-template-columns:1fr 1fr; }
  .tip-budget-cell { padding:13px; }
  .tip-tabs { width:100%; overflow:auto; }
  .tip-tab { flex:1; padding:0 12px; white-space:nowrap; }
  .tip-day-head { align-items:flex-start; }
  .tip-day-title { align-items:flex-start; }
  .tip-day-cost { display:none; }
  .tip-schedule-list { padding:4px 15px; }
  .tip-schedule { grid-template-columns:54px 10px minmax(0,1fr); gap:9px; }
  .tip-row-actions { grid-column:3; margin-top:8px; }
  .tip-empty-day { flex-direction:column; align-items:stretch; text-align:center; }
  .tip-empty-day .tip-button { width:100%; }
  .tip-overview-row { grid-template-columns:54px 1fr; }
  .tip-overview-row strong { grid-column:2; font-size:.82rem; color:var(--tip-green); }
  .tip-field-grid { grid-template-columns:1fr; gap:0; }
  .tip-form-actions { flex-direction:column-reverse; }
  .tip-form-actions .tip-button { width:100%; }
}
@media (prefers-reduced-motion: reduce) {
  .tip-mount *, .tip-mount *::before, .tip-mount *::after { scroll-behavior:auto!important; transition:none!important; }
}