:root {
  --ink: #0f172a;
  --muted: #64748b;
  --line: #e2e8f0;
  --canvas: #f8fafc;
  --surface: #fff;
  --subtle: #f1f5f9;
  --blue: #2563eb;
  --blue-dark: #1e3a8a;
  --green: #047857;
  --green-bg: #ecfdf5;
  --amber: #b45309;
  --amber-bg: #fffbeb;
  --red: #be123c;
  --red-bg: #fff1f2;
  --shadow: 0 12px 24px -16px rgba(15, 23, 42, .22);
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--canvas); font: 14px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.mono, time, .amount, .eyebrow, .chip { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }

.app-shell { min-height: 100vh; }
.topbar { position: sticky; z-index: 20; top: 0; height: 68px; padding: 0 28px; background: rgba(255,255,255,.94); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.brand { display: flex; align-items: center; gap: 10px; font-weight: 750; letter-spacing: -.025em; font-size: 18px; }
.brand-mark { display: grid; place-items: center; height: 30px; width: 30px; border-radius: 8px; color: white; background: var(--ink); font-size: 16px; }
.trip-picker { display:flex; align-items:center; gap:6px; }.trip-select { min-width: 285px; padding: 7px 10px; border: 1px solid var(--line); background: var(--subtle); border-radius: 7px; text-align: left; }
.trip-select strong, .trip-select small { display: block; }
.trip-select small { color: var(--muted); margin-top: 1px; font-size: 11px; }
.trip-tabs { display:flex; flex:1; align-items:center; gap:6px; min-width:0; overflow-x:auto; padding:3px 0; }.trip-tab { flex:0 0 auto; max-width:180px; padding:7px 11px; border:1px solid transparent; border-radius:7px; color:#475569; background:transparent; text-align:left; }.trip-tab:hover { background:var(--subtle); color:var(--ink); }.trip-tab.active { border-color:#bfdbfe; background:#eff6ff; color:var(--blue-dark); }.trip-tab strong,.trip-tab small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.trip-tab strong { font-size:12px; }.trip-tab small { margin-top:1px; color:var(--muted); font-size:10px; }
.add-trip-button { display:grid; place-items:center; width:34px; height:34px; padding:0; border:1px solid var(--ink); border-radius:7px; color:white; background:var(--ink); font-size:23px; font-weight:400; line-height:1; }.add-trip-button:hover{background:#273449}
.topbar-left, .topbar-actions, .inline { display: flex; align-items: center; gap: 10px; }
.avatar { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: #fff; background: linear-gradient(135deg, #475569, #0f172a); font-size: 11px; font-weight: 700; }

.body-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr); }
.sidebar { position: sticky; top: 68px; height: calc(100vh - 68px); padding: 22px 14px; background: var(--surface); border-right: 1px solid var(--line); display: flex; flex-direction: column; }
.side-label { padding: 0 10px 12px; color: var(--muted); font: 700 10px/1.4 "SFMono-Regular", Consolas, monospace; text-transform: uppercase; letter-spacing: .08em; }
.nav { display: grid; gap: 3px; }
.nav button { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 10px; border: 0; border-radius: 7px; color: #475569; background: transparent; text-align: left; }
.nav button:hover { background: var(--subtle); color: var(--ink); }
.nav button.active { color: #fff; background: var(--ink); font-weight: 650; }
.nav-count { min-width: 20px; padding: 1px 5px; border-radius: 999px; background: var(--red-bg); color: var(--red); text-align: center; font-size: 11px; }
.active .nav-count { background: rgba(255,255,255,.18); color: white; }
.sidebar-health { margin-top: auto; padding: 13px; border: 1px solid #dbeafe; border-radius: 9px; background: #f8fbff; }
.sidebar-health header { display:flex; justify-content:space-between; font-size:12px; font-weight:700; }
.progress { overflow: hidden; height: 6px; margin: 10px 0; border-radius: 9px; background: #e5e7eb; }
.progress > i { display: block; height: 100%; border-radius: inherit; background: var(--blue); }
.sidebar-health p { margin: 0 0 10px; color: var(--muted); font-size: 12px; }

.main { width: min(1500px, 100%); padding: 28px; }
.page { display: none; }
.page.active { display: block; }
.hero { padding: 24px; border: 1px solid #dbeafe; border-radius: 12px; background: linear-gradient(115deg, #eff6ff, #f8fbff 62%, #eef2ff); }
.hero-top, .section-head, .card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.hero h1 { margin: 7px 0 4px; font-size: clamp(26px, 3vw, 36px); line-height: 1.15; letter-spacing: -.04em; }
.hero p { margin: 0; color: #475569; }
.eyebrow { color: var(--blue-dark); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.hero-actions, .button-row { display: flex; flex-wrap: wrap; gap: 8px; }
.audit-summary { display: flex; align-items: center; gap: 12px; margin-top: 20px; padding: 14px; border: 1px solid #dbeafe; border-radius: 8px; background: rgba(255,255,255,.8); }
.audit-icon { display:grid; place-items:center; flex:0 0 auto; width:34px; height:34px; color:var(--blue-dark); background:#dbeafe; border-radius:8px; font-size:17px; }
.audit-summary strong, .audit-summary span { display:block; }
.audit-summary span { color:var(--muted); font-size:12px; }

.metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 18px 0 28px; }
.card { border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow); }
.metric { min-height: 154px; padding: 16px; }
.metric h3 { margin: 12px 0 6px; font-size: 25px; letter-spacing: -.035em; }
.metric h3 em { margin-left:4px; color:var(--muted); font-size:11px; font-style:normal; letter-spacing:0; }
.metric p { margin: 0; color: var(--muted); font-size: 12px; }
.metric .split { display: flex; gap: 5px; height: 6px; margin: 13px 0 9px; overflow: hidden; border-radius: 10px; }
.split i { display:block; border-radius:5px; background:var(--ink); }.split i:nth-child(2){background:var(--blue)}.split i:nth-child(3){background:#93c5fd}
.section-head { margin: 0 0 12px; }
.section-head h2 { margin: 3px 0 0; font-size: 23px; letter-spacing: -.03em; }
.workspace-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }
.timeline { display: grid; gap: 12px; }
.day-card { padding: 18px; }.day-card.has-conflict { border-color:#fda4af; box-shadow:inset 4px 0 0 var(--red),var(--shadow); }
.day-card > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:14px; border-bottom:1px solid var(--line); }
.day-title { display:flex; gap:10px; align-items:center; }.day-number { min-width:48px; padding:5px; background:#e0e7ff; color:var(--blue-dark); text-align:center; font:700 10px/1.3 "SFMono-Regular", Consolas, monospace; border-radius:4px; }.date-badge { display:grid; gap:2px; min-width:112px; padding:7px 8px; border-radius:6px; color:var(--blue-dark); background:#dbeafe; font-family:"SFMono-Regular",Consolas,monospace; }.date-badge time { font-size:12px; font-weight:700; }.date-badge small { color:#4059aa !important; font-size:10px !important; }
.day-title h3 { margin:0; font-size:14px; }.day-title small { color:var(--muted); font:11px "SFMono-Regular", Consolas, monospace; }.status-stack { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }.itinerary-conflict { display:inline-flex; align-items:center; width:max-content; padding:3px 6px; border:1px solid #fecdd3; border-radius:4px; color:var(--red); background:var(--red-bg); font:700 10px "SFMono-Regular",Consolas,monospace; }
.item-row { display:grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items:center; gap:11px; margin-top:12px; padding:11px; border-radius:8px; background:var(--subtle); }
.item-icon { display:grid; place-items:center; width:36px;height:36px; border-radius:8px; background:#fff; font-size:17px; }
.item-row strong, .item-row small { display:block; }.item-row small { margin-top:2px; color:var(--muted); font-size:11px; }.item-time { text-align:right; font:600 12px "SFMono-Regular", Consolas, monospace; }.item-time small{font-weight:400}
.item-time small.itinerary-cancellation { margin-top:5px; color:#b45309; font-weight:700; }
.side-stack { display: grid; gap: 14px; }.side-card { padding: 16px; }.side-card h3 { margin:0 0 13px; font-size:14px; }.voucher { margin-top:8px; padding:10px; border-radius:7px; background:var(--subtle); }.voucher strong,.voucher small{display:block}.voucher small{color:var(--muted);font-size:11px;margin-top:3px}

.btn { padding: 8px 12px; border: 1px solid var(--line); border-radius: 6px; color: var(--ink); background: white; font-size: 12px; font-weight: 650; }
.btn:hover { background: var(--subtle); }.btn:disabled { cursor:not-allowed; opacity:.45; }.btn.primary { color:#fff; border-color:var(--ink); background:var(--ink); }.btn.primary:hover{background:#273449}.btn.danger { color:var(--red); border-color:#fecdd3; background:#fff; }.btn.small { padding:6px 9px; font-size:11px; }
.chip { display:inline-flex; align-items:center; gap:4px; width:max-content; padding:3px 6px; border:1px solid; border-radius:4px; font-size:10px; font-weight:700; letter-spacing:.02em; }.chip.confirmed{background:var(--green-bg);border-color:#a7f3d0;color:var(--green)}.chip.tentative{background:var(--amber-bg);border-color:#fde68a;color:var(--amber)}.chip.critical,.chip.open{background:var(--red-bg);border-color:#fecdd3;color:var(--red)}.chip.resolved{background:#eff6ff;border-color:#bfdbfe;color:var(--blue-dark)}

.data-card { padding: 18px; }.filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }.filter { padding:7px 10px; border:1px solid var(--line); border-radius:6px; background:white; color:var(--muted); font-size:12px; }.filter.active {border-color:var(--ink); background:var(--ink); color:white}.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse}.table th{padding:9px 10px;color:var(--muted);font:700 10px/1.3 "SFMono-Regular",Consolas,monospace;text-transform:uppercase;letter-spacing:.06em;text-align:left;border-bottom:1px solid var(--line)}.table td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle}.table tr:last-child td{border:0}.table small{color:var(--muted);display:block;margin-top:2px}.empty{padding:28px;text-align:center;color:var(--muted)}
.table small.cancellation-deadline { margin-top:5px; color:#b45309; font-weight:700; }
.view-toggle { display:flex; padding:2px; border-radius:7px; background:var(--subtle); }.view-toggle .filter { border:0; }.calendar-view { overflow:auto; padding:16px; border:1px solid var(--line); border-radius:10px; background:white; box-shadow:var(--shadow); }.calendar-toolbar { display:flex; align-items:center; justify-content:center; gap:12px; margin:0 0 14px; }.calendar-toolbar h3 { min-width:180px; margin:0; text-align:center; font-size:16px; }.calendar-weekdays,.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(125px,1fr)); min-width:875px; }.calendar-weekdays span { padding:7px 8px; color:var(--muted); font:700 10px "SFMono-Regular",Consolas,monospace; text-transform:uppercase; }.calendar-day { min-height:120px; padding:7px; border-top:1px solid var(--line); border-left:1px solid var(--line); }.calendar-day:nth-child(7n) { border-right:1px solid var(--line); }.calendar-day:nth-last-child(-n+7) { border-bottom:1px solid var(--line); }.calendar-day > time { display:block; margin-bottom:5px; font:700 11px "SFMono-Regular",Consolas,monospace; }.calendar-day.outside-month { background:#f8fafc; }.calendar-day.outside-month > time { color:#94a3b8; }.calendar-items { display:grid; gap:4px; }.calendar-item { overflow:hidden; padding:4px 5px; border:0; border-radius:4px; color:var(--ink); background:#e0e7ff; text-align:left; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }.calendar-item.confirmed { background:#dcfce7; color:#166534; }.calendar-item.tentative { background:#fef3c7; color:#92400e; }.calendar-item.checkin { background:#dbeafe; color:#1d4ed8; }.calendar-item.checkout { background:#ffedd5; color:#b45309; }.calendar-item.has-conflict { border:1px solid var(--red); background:var(--red-bg); color:var(--red); font-weight:700; }.calendar-items small { color:var(--muted); font-size:10px; }.calendar-more { padding:3px 5px; border:0; border-radius:4px; color:var(--blue-dark); background:#eff6ff; text-align:left; font-size:10px; font-weight:700; cursor:pointer; }.calendar-more:hover { background:#dbeafe; }.calendar-day-detail { display:grid; gap:8px; }.calendar-day-detail .voucher { margin:0; }.calendar-day-detail .inline { align-items:center; }.day-detail-cancellation { color:#b45309 !important; font-weight:700; }
.selection-box { width:16px; height:16px; margin:0; accent-color:var(--blue); vertical-align:middle; }.table tr.selected-row td { background:#f8fbff; }
.issue-list { display:grid; gap:10px; }.issue { padding:15px; border:1px solid var(--line); border-left:4px solid var(--amber); border-radius:8px; background:white; }.issue.critical { border-left-color:var(--red); }.issue.resolved { border-left-color:var(--blue); opacity:.76; }.issue h3{margin:6px 0 3px;font-size:14px}.issue p{margin:0;color:var(--muted);font-size:12px}.issue footer{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:11px}.issue-evidence{font:11px "SFMono-Regular",Consolas,monospace;color:#475569}
.issue p .conflict-party { color:var(--ink); font-weight:750; }
.settings-grid { display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:16px; }.form-card{padding:18px}.form-card h3{margin:0 0 14px}.field{display:grid;gap:5px;margin:0 0 13px}.field label{color:#475569;font-size:12px;font-weight:600}.field input,.field select,.field textarea{width:100%;padding:9px 10px;border:1px solid #cbd5e1;border-radius:6px;background:white;color:var(--ink)}.field textarea{min-height:84px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid rgba(37,99,235,.14);border-color:var(--blue)}.member{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid var(--line)}.member:first-of-type{border-top:0}.member small{display:block;color:var(--muted);margin-top:2px}
.trip-delete-note { margin:14px 0 10px; padding-top:14px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.date-correction { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 13px; padding:10px; border:1px solid #bfdbfe; border-radius:7px; background:#eff6ff; }.date-correction strong,.date-correction small{display:block}.date-correction strong{font-size:12px}.date-correction small{margin-top:2px;color:var(--muted);font:11px "SFMono-Regular",Consolas,monospace}
.fx-card { margin-bottom:16px; }.fx-caption { margin:4px 0 0; color:var(--muted); font-size:12px; }.fx-rates { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:10px; margin:14px 0; }.fx-rate { display:flex; align-items:center; gap:7px; padding:9px; border:1px solid var(--line); border-radius:7px; background:var(--subtle); color:var(--muted); font-size:11px; }.fx-rate input,.fx-currency-input { min-width:0; width:75px; padding:6px; border:1px solid #cbd5e1; border-radius:5px; background:white; color:var(--ink); }.fx-rate strong { color:var(--ink); font:700 11px "SFMono-Regular",Consolas,monospace; }
.map-view { overflow:hidden; padding:16px; }.map-toolbar { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }.map-toolbar h3 { margin:3px 0 0; font-size:17px; }.map-toolbar p,.map-note { margin:4px 0 0; color:var(--muted); font-size:12px; }.itinerary-map { height:420px; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#e2e8f0; }.map-stops { display:flex; flex-wrap:wrap; gap:8px; margin-top:13px; }.map-stop { display:flex; align-items:center; gap:7px; min-width:190px; padding:8px 10px; border:1px solid var(--line); border-radius:7px; background:var(--subtle); }.map-stop b { display:grid; flex:0 0 21px; place-items:center; width:21px; height:21px; border-radius:50%; color:white; background:#64748b; font:700 10px "SFMono-Regular",Consolas,monospace; }.map-stop.mapped b { background:var(--blue); }.map-stop strong,.map-stop small { display:block; }.map-stop strong { max-width:205px; overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }.map-stop small { margin-top:2px; color:var(--muted); font-size:10px; }.map-note { margin-top:12px; font-size:10px; }

.modal-backdrop { position:fixed; z-index:50; inset:0; display:none; align-items:center; justify-content:center; padding:18px; background:rgba(15,23,42,.45); backdrop-filter:blur(3px); }.modal-backdrop.open{display:flex}.modal{width:min(620px,100%);max-height:calc(100vh - 36px);overflow:auto;padding:20px;border-radius:12px;background:white;box-shadow:0 24px 64px rgba(15,23,42,.25)}.modal header{display:flex;justify-content:space-between;gap:12px;align-items:start;margin-bottom:16px}.modal h2{margin:0;font-size:20px}.modal p{margin:3px 0 0;color:var(--muted);font-size:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.span-2{grid-column:span 2}.modal footer{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}
.confirmation-message { display:flex; align-items:flex-start; gap:10px; padding:12px; border:1px solid #fecdd3; border-radius:8px; background:var(--red-bg); }.confirmation-message > span { display:grid; flex:0 0 21px; place-items:center; width:21px; height:21px; border-radius:50%; color:white; background:var(--red); font-weight:800; }.confirmation-message p { margin:1px 0 0; color:#881337; font-size:13px; line-height:1.45; }
.import-preview-summary { display:grid; gap:8px; margin-bottom:12px; }.import-preview-table { max-height:360px; border:1px solid var(--line); border-radius:7px; }.import-preview-table .table { min-width:560px; }.import-preview-table td { padding:9px 10px; }.import-preview-table small { max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.preview-more { margin:8px 0 0; color:var(--muted); font-size:11px; text-align:center; }
.trip-list { display:grid; gap:8px; }.trip-option { display:flex; justify-content:space-between; align-items:center; width:100%; padding:12px; border:1px solid var(--line); border-radius:8px; color:var(--ink); background:white; text-align:left; }.trip-option:hover,.trip-option.selected { border-color:#93c5fd; background:#eff6ff; }.trip-option strong,.trip-option small{display:block}.trip-option small{margin-top:2px;color:var(--muted);font-size:11px}.trip-option > span:last-child{color:var(--blue-dark);font:700 10px "SFMono-Regular",Consolas,monospace;text-transform:uppercase}
.toast{position:fixed;z-index:60;right:22px;bottom:22px;padding:11px 14px;border-radius:7px;background:var(--ink);color:white;box-shadow:var(--shadow);font-size:12px;transform:translateY(90px);opacity:0;transition:.2s}.toast.show{transform:translateY(0);opacity:1}
.clean-start { min-height:100vh; background:linear-gradient(135deg,#f8fafc 0%,#eef2ff 100%); }.clean-start-bar { display:flex; align-items:center; height:64px; padding:0 36px; border-bottom:1px solid rgba(203,213,225,.8); background:rgba(255,255,255,.76); }.clean-start-main { display:grid; justify-items:center; max-width:620px; margin:0 auto; padding:18vh 24px 80px; text-align:center; }.clean-start-main h1 { max-width:520px; margin:8px 0 10px; font-size:36px; letter-spacing:-.05em; }.clean-start-main p { max-width:510px; margin:0; color:var(--muted); font-size:15px; line-height:1.55; }.clean-start-action { margin:24px 0 12px; padding:11px 16px; font-size:14px; }.clean-start-main small { color:var(--muted); font-size:11px; }

@media (max-width: 980px) { .body-grid{grid-template-columns:1fr}.sidebar{position:static;height:auto;padding:10px 16px;flex-direction:row;align-items:center;overflow:auto}.side-label,.sidebar-health{display:none}.nav{display:flex}.nav button{white-space:nowrap}.main{padding:20px}.workspace-grid{grid-template-columns:1fr}.topbar{padding:0 18px}.topbar-actions .btn:not(.primary),.avatar+div{display:none}.trip-select{min-width:0}.metrics{grid-template-columns:1fr 1fr}.settings-grid{grid-template-columns:1fr} }
@media (max-width: 620px) { .topbar{height:auto;min-height:62px;padding:10px 14px}.brand span{display:none}.topbar-left{flex:1}.trip-select{width:100%}.body-grid{margin-top:0}.main{padding:14px}.hero{padding:17px}.hero-top{display:block}.hero-actions{margin-top:14px}.metrics{grid-template-columns:1fr}.section-head{display:block}.section-head .btn{margin-top:10px}.item-row{grid-template-columns:32px minmax(0,1fr)}.item-icon{width:32px;height:32px}.item-time{grid-column:2;text-align:left}.day-card{padding:14px}.day-card>header{align-items:flex-start}.form-grid{grid-template-columns:1fr}.span-2{grid-column:span 1}.table{min-width:650px}.audit-summary{align-items:flex-start} }
