/* Keep — app shell */
:root {
  --ink: #1a2332;
  --ink-soft: #3d4a5c;
  --muted: #6b7789;
  --line: #e4e8ee;
  --paper: #f3f5f8;
  --white: #ffffff;
  --accent: #ff5c4d;
  --accent-deep: #e04436;
  --accent-soft: #ffe8e5;
  --sage: #2f6f5e;
  --sage-soft: #e3f2ed;
  --sidebar: 260px;
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Manrope", system-ui, sans-serif;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --radius: 16px;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { min-height: 100%; }
.sr-only { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
h1, h2, h3, h4 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 560;
  line-height: 1.15;
  letter-spacing: -0.025em;
}
p { margin: 0; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; border: 0; background: none; color: inherit; }
ul { margin: 0; padding: 0; list-style: none; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  font-size: 0.84rem;
  font-weight: 700;
  transition: transform 0.2s var(--ease), background 0.2s, border-color 0.2s, color 0.2s;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary { color: #fff; background: var(--accent); }
.btn-primary:hover { background: var(--accent-deep); }
.btn-secondary { color: var(--ink); background: var(--white); border: 1px solid var(--line); }
.btn-secondary:hover { border-color: var(--ink-soft); }
.btn-sm { min-height: 34px; padding: 0 12px; font-size: 0.78rem; }
.tag {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-deep);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.03em;
}
.muted { color: var(--muted); }

.app {
  display: grid;
  grid-template-columns: var(--sidebar) 1fr;
  min-height: 100vh;
}
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 20px 16px;
  background: var(--white);
  border-right: 1px solid var(--line);
  overflow-y: auto;
}
.side-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px 22px;
  font-family: var(--font-display);
  font-size: 1.35rem;
  font-weight: 650;
  letter-spacing: -0.03em;
}
.logo-mark {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: linear-gradient(145deg, #ff8a7a, var(--accent));
}
.side-nav { display: grid; gap: 4px; }
.side-nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-radius: 12px;
  color: var(--ink-soft);
  font-size: 0.9rem;
  font-weight: 600;
}
.side-nav a:hover { background: var(--paper); color: var(--ink); }
.side-nav a.active {
  background: var(--accent-soft);
  color: var(--accent-deep);
}
.side-section {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}
.side-label {
  padding: 0 12px 10px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.ws-mini { display: grid; gap: 4px; }
.ws-mini a {
  display: grid;
  gap: 2px;
  padding: 11px 12px;
  border-radius: 12px;
  color: var(--ink-soft);
  font-size: 0.82rem;
}
.ws-mini a:hover, .ws-mini a.active {
  background: var(--paper);
  color: var(--ink);
}
.ws-mini strong { font-size: 0.88rem; }
.ws-mini span { color: var(--muted); font-size: 0.72rem; }
.side-foot {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.user-chip { display: flex; align-items: center; gap: 10px; padding: 6px 8px; }
.avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, #ff8a7a, var(--accent-deep));
  font-size: 0.75rem;
  font-weight: 800;
}
.user-chip strong { display: block; font-size: 0.86rem; }
.user-chip span { color: var(--muted); font-size: 0.72rem; }

.main { min-width: 0; display: flex; flex-direction: column; }
.top {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 68px;
  padding: 0 28px;
  background: rgba(255, 255, 255, 0.86);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(12px);
  position: sticky;
  top: 0;
  z-index: 30;
}
.top h1 { font-size: 1.25rem; }
.top-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.content { padding: 28px; }

.stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}
.stat {
  padding: 20px;
  border-radius: var(--radius);
  background: var(--white);
  border: 1px solid var(--line);
}
.stat strong {
  display: block;
  margin-bottom: 4px;
  font-family: var(--font-display);
  font-size: 1.7rem;
  font-weight: 650;
}
.stat span { color: var(--muted); font-size: 0.8rem; }

.panel {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.panel-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
}
.panel-head h2 { font-size: 1.05rem; }
.panel-head .spacer { margin-left: auto; }
.panel-body { padding: 20px; }

.ws-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 16px;
}
.ws-card {
  display: flex;
  flex-direction: column;
  min-height: 230px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--paper);
  transition: transform 0.25s var(--ease), border-color 0.2s, box-shadow 0.25s;
}
.ws-card:hover {
  transform: translateY(-3px);
  border-color: #cfd6e0;
  box-shadow: 0 14px 30px rgba(26, 35, 50, 0.06);
}
.ws-card .cover {
  height: 76px;
  margin: -18px -18px 16px;
  border-radius: 14px 14px 0 0;
  background:
    radial-gradient(circle at 80% 30%, rgba(255, 92, 77, 0.35), transparent 45%),
    linear-gradient(135deg, #1a2332, #3d5a6c);
}
.ws-card .cover,
.workspace-hero,
.template-cover,
.asset-photo { background-size: cover; background-position: center; }
.cover.trip, .workspace-hero.trip, .template-cover.trip { background-image: linear-gradient(90deg,rgba(18,24,32,.62),rgba(18,24,32,.08)),url("../assets/images/lisbon.jpg"); }
.cover.trip-japan, body[data-trip="japan"] .workspace-hero.trip { background-image: linear-gradient(90deg,rgba(18,24,32,.62),rgba(18,24,32,.08)),url("../assets/images/tokyo.jpg"); }
.cover.home, .workspace-hero.home, .template-cover.home { background-image: linear-gradient(90deg,rgba(18,24,32,.58),rgba(18,24,32,.08)),url("../assets/images/kitchen.jpg"); }
.cover.learning, .workspace-hero.learning, .template-cover.learning { background-image: linear-gradient(90deg,rgba(18,24,32,.58),rgba(18,24,32,.08)),url("../assets/images/learning.jpg"); }
.cover.event, .workspace-hero.event, .template-cover.event { background-image: linear-gradient(90deg,rgba(18,24,32,.58),rgba(18,24,32,.08)),url("../assets/images/event.jpg"); }
.cover.meals, .workspace-hero.meals, .template-cover.meals { background-image: linear-gradient(90deg,rgba(18,24,32,.58),rgba(18,24,32,.08)),url("../assets/images/meals.jpg"); }
.cover.business, .workspace-hero.business, .template-cover.business { background-image: linear-gradient(90deg,rgba(18,24,32,.72),rgba(18,24,32,.18)),url("../assets/images/business.jpg"); }
.ws-card .cover.home { background-image:linear-gradient(90deg,rgba(18,24,32,.58),rgba(18,24,32,.08)),url("../assets/images/kitchen.jpg"); }
.ws-card .cover.learning { background-image:linear-gradient(90deg,rgba(18,24,32,.58),rgba(18,24,32,.08)),url("../assets/images/learning.jpg"); }
.ws-card h3 { margin: 10px 0 6px; font-size: 1.2rem; }
.ws-card p { color: var(--muted); font-size: 0.88rem; flex: 1; }
.ws-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0 16px;
  color: var(--muted);
  font-size: 0.74rem;
}
.ws-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.ws-new {
  place-items: center;
  text-align: center;
  border-style: dashed;
  background: transparent;
  color: var(--muted);
  display: grid;
}
.ws-new:hover { color: var(--accent-deep); border-color: var(--accent); }
.ws-new strong { display: block; margin-top: 8px; color: var(--ink); font-size: 1rem; font-family: var(--font-display); }

.two-col {
  display: grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap: 16px;
  margin-top: 16px;
}
.activity li {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  gap: 12px;
  padding: 13px 0;
  border-top: 1px solid var(--line);
  font-size: 0.88rem;
}
.activity li:first-child { border-top: 0; padding-top: 0; }
.dot {
  width: 10px;
  height: 10px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--accent);
}
.activity time { color: var(--muted); font-size: 0.72rem; white-space: nowrap; }

.usage-bar {
  height: 8px;
  margin: 10px 0 6px;
  border-radius: 999px;
  background: var(--paper);
  overflow: hidden;
}
.usage-bar > i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--accent), #ff8a7a);
  font-style: normal;
}
.usage-row { margin-bottom: 18px; }
.usage-row:last-child { margin-bottom: 0; }
.usage-row header {
  display: flex;
  justify-content: space-between;
  font-size: 0.86rem;
  font-weight: 650;
}
.usage-row header span { color: var(--muted); font-weight: 500; }

.meter-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 20px;
}
.meter {
  padding: 22px;
  border-radius: var(--radius);
  background: var(--white);
  border: 1px solid var(--line);
}
.meter h3 { margin-bottom: 4px; font-size: 1rem; }
.meter .big {
  margin: 12px 0 4px;
  font-family: var(--font-display);
  font-size: 2.1rem;
  font-weight: 650;
}
.pack-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.pack {
  padding: 18px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--paper);
}
.pack strong { display: block; margin-bottom: 4px; font-size: 1.05rem; }
.pack p { color: var(--muted); font-size: 0.82rem; margin-bottom: 14px; }

.asset-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 18px;
}
.search {
  flex: 1;
  min-width: 200px;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--white);
}
.asset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 12px;
}
.asset {
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--white);
  overflow: hidden;
  transition: transform 0.2s var(--ease), border-color 0.2s;
}
.asset:hover {
  transform: translateY(-2px);
  border-color: #cfd6e0;
}
.asset-thumb {
  aspect-ratio: 4/3;
  display: grid;
  place-items: center;
  color: #fff;
  background:
    radial-gradient(circle at 70% 30%, rgba(255, 255, 255, 0.15), transparent 50%),
    linear-gradient(145deg, #3d4a5c, #1a2332);
  font-weight: 800;
  font-size: 0.8rem;
  letter-spacing: 0.06em;
}
.asset-meta { padding: 12px; }
.asset-meta strong { display: block; font-size: 0.84rem; margin-bottom: 4px; }
.asset-meta span { color: var(--muted); font-size: 0.72rem; }

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.field label {
  display: block;
  margin-bottom: 6px;
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--muted);
}
.field input, .field select, .field textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--paper);
  color: var(--ink);
}
.field textarea { min-height: 110px; resize: vertical; }
.field.full { grid-column: 1 / -1; }
.swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.swatch {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
}
.swatch.active { outline: 2px solid var(--accent); outline-offset: 2px; }
.toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-top: 1px solid var(--line);
}
.toggle {
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: #d5dbe4;
  position: relative;
  flex: 0 0 auto;
}
.toggle.on { background: var(--accent); }
.toggle i {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  transition: transform 0.2s var(--ease);
  font-style: normal;
}
.toggle.on i { transform: translateX(20px); }
.memory-chip {
  display: inline-flex;
  margin: 0 6px 6px 0;
  padding: 6px 11px;
  border-radius: 999px;
  background: var(--paper);
  border: 1px solid var(--line);
  font-size: 0.76rem;
  font-weight: 600;
}

.workspace {
  display: grid;
  grid-template-columns: 230px 1fr 300px;
  min-height: 100vh;
  overflow: visible;
  background: var(--paper);
}
.workspace-focus { grid-template-columns:230px minmax(0,1fr); }
.workspace-focus .ws-center { grid-column:2; }
.mobile-workspace-head { display:none; }
.workspace-hero {
  min-height: 154px;
  margin: -20px -20px 20px;
  padding: 24px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  color: #fff;
}
.workspace-hero h2 { font-size: clamp(1.45rem,3vw,2.2rem); margin-bottom: 4px; }
.workspace-hero p { color: rgba(255,255,255,.82); }
.hero-tools { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.hero-tools .btn-secondary { background:rgba(255,255,255,.9); }
.pane-shell { max-width:1100px; margin:0 auto; }
.view-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:14px; }
.view-card { grid-column:span 4; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; }
.view-card.wide { grid-column:span 8; }
.view-card.full { grid-column:1/-1; }
.view-card header { padding:14px 16px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:10px; }
.view-card header h3 { font-size:1rem; }
.view-card header span:last-child { margin-left:auto; }
.view-card-body { padding:16px; }
.compare { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.compare > article { padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--paper); }
.compare h3 { margin-bottom:6px; }
.compare p { color:var(--muted); font-size:.8rem; }
.compare li { position:relative; padding:6px 0 0 14px; font-size:.78rem; }
.compare li::before { content:""; position:absolute; left:0; top:12px; width:6px; height:6px; border-radius:50%; background:var(--accent); }
.progress-line { height:8px; border-radius:99px; background:var(--paper); overflow:hidden; margin-top:8px; }
.progress-line i { height:100%; display:block; background:var(--accent); border-radius:99px; }
.metric { font-family:var(--font-display); font-size:1.8rem; }
.subtle { color:var(--muted); font-size:.78rem; }

.map-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); min-height:560px; }
.trip-map { position:relative; min-height:560px; overflow:hidden; background:#dce7df; }
.trip-map::before {
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(28deg,transparent 46%,rgba(255,255,255,.82) 47% 50%,transparent 51%),
    linear-gradient(118deg,transparent 35%,rgba(255,255,255,.72) 36% 39%,transparent 40%),
    repeating-linear-gradient(8deg,transparent 0 34px,rgba(255,255,255,.5) 35px 38px),
    repeating-linear-gradient(92deg,transparent 0 52px,rgba(255,255,255,.42) 53px 56px);
  opacity:.9;
}
.trip-map::after { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 90% 12%,rgba(118,175,196,.65) 0 18%,transparent 19%),radial-gradient(ellipse at 8% 90%,rgba(118,175,196,.45) 0 14%,transparent 15%); }
.map-route { position:absolute; z-index:2; inset:17% 14% 16% 12%; border:4px dashed var(--accent); border-left-color:transparent; border-bottom-color:transparent; border-radius:42% 55% 36% 60%; transform:rotate(-8deg); opacity:.88; }
.map-pin { position:absolute; z-index:4; width:34px; height:34px; border-radius:50% 50% 50% 8px; transform:rotate(-45deg); display:grid; place-items:center; color:#fff; background:var(--accent); box-shadow:0 8px 20px rgba(26,35,50,.22); border:3px solid #fff; }
.map-pin span { transform:rotate(45deg); font-size:.7rem; font-weight:800; }
.map-pin.p1 { left:18%; top:61%; }.map-pin.p2 { left:36%; top:39%; }.map-pin.p3 { left:58%; top:25%; }.map-pin.p4 { left:73%; top:50%; }.map-pin.p5 { left:47%; top:71%; }
.map-controls { position:absolute; z-index:5; right:14px; top:14px; display:grid; gap:5px; }
.map-controls button { width:38px; height:38px; background:#fff; border:1px solid var(--line); border-radius:10px; font-weight:800; box-shadow:0 5px 14px rgba(26,35,50,.1); }
.map-legend { position:absolute; z-index:5; left:14px; bottom:14px; max-width:260px; padding:12px 14px; border-radius:12px; background:rgba(255,255,255,.94); box-shadow:0 8px 24px rgba(26,35,50,.12); font-size:.76rem; }
.map-sidebar { background:#fff; border-left:1px solid var(--line); overflow:auto; }
.map-day { padding:16px; border-bottom:1px solid var(--line); }
.map-day.active { box-shadow:inset 4px 0 var(--accent); background:var(--accent-soft); }
.map-day h3 { font-size:1rem; margin:4px 0 8px; }
.place-row { display:grid; grid-template-columns:28px 1fr auto; gap:8px; align-items:center; padding:7px 0; font-size:.78rem; }
.place-num { width:24px; height:24px; border-radius:50%; background:var(--ink); color:#fff; display:grid; place-items:center; font-size:.68rem; font-weight:800; }
.warning { margin:10px 0 0; padding:9px 10px; border-left:3px solid var(--accent); background:#fff; font-size:.74rem; }

.catalog-tabs { display:flex; gap:6px; padding:5px; width:max-content; background:var(--paper); border-radius:999px; margin-bottom:20px; }
.catalog-tabs button { padding:9px 17px; border-radius:999px; font-weight:700; font-size:.82rem; }
.catalog-tabs button.active { background:#fff; box-shadow:0 3px 12px rgba(26,35,50,.08); color:var(--accent-deep); }
.catalog-pane { display:none; }.catalog-pane.active { display:block; }
.template-catalog { display:grid; grid-template-columns:repeat(auto-fill,minmax(285px,1fr)); gap:16px; }
.template-card { background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; }
.template-cover { min-height:132px; padding:16px; display:flex; align-items:flex-end; color:#fff; }
.template-cover .tag { background:rgba(255,255,255,.9); }
.template-content { padding:18px; display:flex; flex-direction:column; flex:1; }
.template-content h2 { font-size:1.25rem; margin-bottom:7px; }
.template-content > p { color:var(--muted); font-size:.84rem; margin-bottom:14px; }
.feature-list { display:grid; gap:7px; margin-bottom:16px; }
.feature-list li { padding-left:17px; position:relative; font-size:.78rem; color:var(--ink-soft); }
.feature-list li::before { content:""; position:absolute; left:0; top:.55em; width:6px; height:6px; border-radius:50%; background:var(--accent); }
.template-foot { margin-top:auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.template-price { margin-right:auto; font-size:.76rem; font-weight:700; }
.lane-banner { padding:22px; margin-bottom:18px; color:#fff; border-radius:16px; background:var(--ink); display:flex; gap:20px; align-items:center; }
.lane-banner p { color:rgba(255,255,255,.7); max-width:70ch; font-size:.86rem; }
.lane-banner .btn { margin-left:auto; flex:0 0 auto; }
.board { display:grid; grid-template-columns:repeat(4,minmax(190px,1fr)); gap:12px; overflow-x:auto; }
.board-col { padding:12px; border-radius:14px; background:var(--paper); min-height:220px; }
.board-col h4 { font-family:var(--font-body); font-size:.74rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:10px; }
.task-card { padding:11px; border-radius:11px; background:#fff; border:1px solid var(--line); margin-bottom:8px; font-size:.78rem; }
.meal-week { display:grid; grid-template-columns:repeat(7,minmax(120px,1fr)); gap:8px; overflow-x:auto; }
.meal-day { min-height:180px; padding:12px; background:var(--paper); border-radius:12px; }
.meal-day h4 { font-family:var(--font-body); font-size:.72rem; text-transform:uppercase; color:var(--muted); margin-bottom:9px; }
.meal-card { padding:10px; border-radius:10px; background:#fff; border:1px solid var(--line); font-size:.76rem; margin-bottom:7px; }
.seat-plan { display:grid; grid-template-columns:repeat(5,54px); gap:10px; place-content:center; min-height:260px; }
.seat { width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--paper);border:1px solid var(--line);font-size:.68rem;text-align:center; }
.seat.table { grid-column:2/5; width:auto; border-radius:30px; background:var(--ink); color:#fff; }
.intelligence { display:flex; gap:4px; padding:4px; border:1px solid var(--line); background:#fff; border-radius:999px; }
.intelligence button { padding:5px 9px; border-radius:999px; font-size:.68rem; font-weight:700; color:var(--muted); }
.intelligence button.active { background:var(--ink); color:#fff; }
.credit-estimate { padding:5px 10px; border-radius:999px; background:var(--paper); font-size:.7rem; color:var(--muted); }
.ws-rail {
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--white);
  border-right: 1px solid var(--line);
  overflow: hidden;
}
.ws-rail-head {
  padding: 18px 16px;
  border-bottom: 1px solid var(--line);
}
.ws-rail-head a {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 650;
}
.ws-rail-head a:hover { color: var(--ink); }
.ws-rail-head h1 { font-size: 1.2rem; margin-bottom: 4px; }
.ws-tabs {
  display: grid;
  gap: 2px;
  padding: 12px;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
  align-content: start;
  grid-auto-rows: max-content;
}
.ws-tabs button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 12px;
  border-radius: 12px;
  color: var(--ink-soft);
  font-size: 0.86rem;
  font-weight: 650;
  text-align: left;
}
.ws-tabs button:hover, .ws-tabs button.active {
  background: var(--accent-soft);
  color: var(--accent-deep);
}
.ws-rail-foot {
  flex: 0 0 auto;
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-top: 1px solid var(--line);
  background: var(--white);
}
.ws-center {
  display: block;
  min-width: 0;
}
.ws-topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 60px;
  padding: 0 18px;
  background: rgba(255, 255, 255, 0.9);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px);
}
.ws-topbar .status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--sage-soft);
  color: var(--sage);
  font-size: 0.76rem;
  font-weight: 700;
}
.ws-topbar .status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  animation: pulse 1.8s ease-in-out infinite;
  font-style: normal;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}
.ws-pane {
  display: none;
  overflow: visible;
  padding: 20px;
}
.ws-pane.active { display: block; animation: fadePane 0.3s var(--ease); }
@keyframes fadePane {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

.chat {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 760px;
  margin: 0 auto;
}
.msg {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 12px;
  max-width: 90%;
}
.msg.user {
  margin-left: auto;
  grid-template-columns: 1fr 38px;
}
.msg .who {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.7rem;
  font-weight: 800;
  color: #fff;
  background: var(--ink);
}
.msg.user .who { background: var(--accent); order: 2; }
.msg .bubble {
  padding: 13px 15px;
  border-radius: 16px;
  background: var(--white);
  border: 1px solid var(--line);
  font-size: 0.92rem;
}
.msg.user .bubble {
  background: var(--accent-soft);
  border-color: transparent;
}
.msg .bubble strong {
  display: block;
  margin-bottom: 4px;
  font-size: 0.72rem;
  color: var(--muted);
  font-family: var(--font-body);
  font-weight: 700;
}
.msg .bubble time {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.7rem;
}
.composer {
  display: flex;
  gap: 10px;
  padding: 14px 18px;
  background: var(--white);
  border-top: 1px solid var(--line);
}
.composer input {
  flex: 1;
  min-height: 46px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--muted);
}

.file-list { display: grid; gap: 8px; max-width: 760px; margin: 0 auto; }
.file-row {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--white);
  border: 1px solid var(--line);
}
.file-ico {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--sage-soft);
  color: var(--sage);
  font-size: 0.68rem;
  font-weight: 800;
  font-style: normal;
}
.file-row strong { display: block; font-size: 0.9rem; }
.file-row span { color: var(--muted); font-size: 0.74rem; }
.note-card {
  max-width: 760px;
  margin: 0 auto 12px;
  padding: 18px;
  border-radius: 14px;
  background: var(--white);
  border: 1px solid var(--line);
  border-left: 4px solid var(--accent);
}
.note-card h3 { margin-bottom: 6px; font-size: 1.05rem; }
.note-card p { color: var(--muted); font-size: 0.9rem; }
.day-plan { max-width: 760px; margin: 0 auto; display: grid; gap: 10px; }
.day {
  padding: 18px;
  border-radius: 14px;
  background: var(--white);
  border: 1px solid var(--line);
}
.day header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.day h3 { font-size: 1.05rem; }
.day li {
  position: relative;
  padding: 6px 0 6px 16px;
  font-size: 0.9rem;
  color: var(--ink-soft);
}
.day li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent);
}

.ws-context {
  display: flex;
  flex-direction: column;
  background: var(--white);
  border-left: 1px solid var(--line);
  overflow: hidden;
}
.ctx-head {
  padding: 18px 16px;
  border-bottom: 1px solid var(--line);
}
.ctx-head h2 { font-size: 1.05rem; margin-bottom: 4px; }
.ctx-body { padding: 16px; overflow-y: auto; flex: 1; }
.ctx-block { margin-bottom: 22px; }
.ctx-block h3 {
  margin-bottom: 10px;
  color: var(--muted);
  font-family: var(--font-body);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.change {
  padding: 10px 0;
  border-top: 1px solid var(--line);
  font-size: 0.84rem;
}
.change:first-of-type { border-top: 0; padding-top: 0; }
.change time { display: block; color: var(--muted); font-size: 0.7rem; margin-top: 4px; }

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: none;
  place-items: center;
  background: rgba(26, 35, 50, 0.4);
  padding: 20px;
}
.modal-backdrop.open { display: grid; }
.modal {
  width: min(100%, 440px);
  padding: 26px;
  border-radius: 18px;
  background: var(--white);
  box-shadow: 0 24px 60px rgba(26, 35, 50, 0.18);
  animation: fadePane 0.3s var(--ease);
}
.modal h2 { margin-bottom: 8px; font-size: 1.4rem; }
.modal p { color: var(--muted); font-size: 0.92rem; margin-bottom: 18px; }
.modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 8px; }
.toast {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 120;
  display: none;
  padding: 12px 16px;
  border-radius: 12px;
  color: #fff;
  background: var(--ink);
  box-shadow: 0 12px 32px rgba(26, 35, 50, 0.18);
  font-size: 0.86rem;
  font-weight: 650;
}
.toast.show { display: block; animation: fadePane 0.3s var(--ease); }

.mobile-nav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 80;
  background: var(--white);
  border-top: 1px solid var(--line);
  padding: 8px;
}
.mobile-nav a {
  flex: 1;
  text-align: center;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 700;
  padding: 8px 4px;
}
.mobile-nav a.active { color: var(--accent-deep); }

@media (max-width: 1100px) {
  .workspace { grid-template-columns: 200px 1fr; }
  .ws-context { display: none; }
  .stats, .meter-grid, .pack-grid { grid-template-columns: 1fr 1fr; }
  .two-col, .form-grid { grid-template-columns: 1fr; }
}
.ws-tabs button::before {
  content:"";
  width:18px;
  flex:0 0 18px;
  color:var(--muted);
  font-size:.82rem;
  text-align:center;
}
.ws-tabs button[data-view="overview"]::before { content:"⌂"; }
.ws-tabs button[data-view="map"]::before { content:"⌖"; }
.ws-tabs button[data-view="timeline"]::before { content:"≋"; }
.ws-tabs button[data-view="board"]::before { content:"▦"; }
.ws-tabs button[data-view="calendar"]::before { content:"□"; }
.ws-tabs button[data-view="comparison"]::before { content:"⇄"; }
.ws-tabs button[data-view="gallery"]::before { content:"▧"; }
.ws-tabs button[data-view="budget"]::before { content:"¤"; }
.ws-tabs button[data-view="checklist"]::before { content:"✓"; }
.ws-tabs button[data-view="files"]::before { content:"▤"; }
.ws-tabs button[data-view="practice"]::before { content:"◇"; }
.ws-tabs button[data-view="chat"]::before { content:"✦"; }
.ws-tabs button[data-view="records"]::before { content:"☷"; }
.ws-tabs button[data-view="settings"]::before { content:"⚙"; }
.ws-tabs button small { display:block; margin-left:auto; color:var(--muted); font-size:.62rem; font-weight:600; }
.ws-tabs button.active small { color:currentColor; opacity:.68; }
@media (max-width: 820px) {
  .app { grid-template-columns: 1fr; }
  .sidebar { display: none; }
  .mobile-nav { display: flex; }
  .content { padding: 18px 16px 88px; }
  .top { padding: 0 16px; }
  .stats, .meter-grid, .pack-grid { grid-template-columns: 1fr; }
  .workspace { grid-template-columns: 1fr; height: auto; min-height: 100vh; }
  .workspace,.ws-center,.ws-pane,.pane-shell,.view-grid,.view-card { width:100%; max-width:100%; min-width:0; }
  .ws-pane { overflow-x:hidden; padding:14px; }
  .ws-tabs { display: flex; overflow-x: auto; }
  .ws-tabs button { white-space: nowrap; }
  .ws-topbar { flex-wrap:wrap; padding:10px 14px; }
  .ws-topbar .top-actions { width:100%; margin-left:0 !important; flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px; }
  .workspace-hero { flex-direction:column; align-items:flex-start; overflow:hidden; }
  .hero-tools { justify-content:flex-start; max-width:100%; }
  .view-card { min-width:0; }
  .view-card-body { overflow:hidden; }
  .view-card h2,.view-card p { max-width:calc(100vw - 74px) !important; white-space:normal !important; overflow-wrap:anywhere; }
  .view-card-body > * { max-width:calc(100vw - 74px); }
  .view-grid { display:block; }
  .view-card,.view-card.wide { display:block; width:100%; margin-bottom:14px; }
  .map-layout { grid-template-columns:1fr; }
  .compare { grid-template-columns:1fr; }
  .trip-map { min-height:420px; }
  .map-sidebar { border-left:0; border-top:1px solid var(--line); }
  .workspace-hero { min-height:132px; }
  .workspace-hero p { display:none; }
  .lane-banner { align-items:flex-start; flex-direction:column; }
  .lane-banner .btn { margin-left:0; }
}

/* Trip Planner MVP */
.text-action {
  padding: 6px 0;
  color: var(--accent-deep);
  font-size: .78rem;
  font-weight: 750;
  text-align: left;
}
.stay-summary { display:flex; align-items:center; gap:14px; }
.stay-summary h2 { font-size:1.2rem; margin-bottom:3px; }
.stay-marker {
  width:46px; height:46px; flex:0 0 46px; display:grid; place-items:center;
  border-radius:14px; color:#fff; background:var(--ink); font-size:1.15rem;
}
.action-list { display:grid; gap:8px; }
.action-list > button {
  display:grid; grid-template-columns:30px 1fr auto; gap:10px; align-items:center;
  width:100%; padding:11px; border:1px solid var(--line); border-radius:12px;
  background:var(--paper); text-align:left;
}
.action-list > button > span {
  width:26px; height:26px; display:grid; place-items:center; border-radius:50%;
  color:#fff; background:var(--ink); font-size:.72rem; font-weight:800;
}
.action-list strong,.action-list small { display:block; }
.action-list small { margin-top:2px; color:var(--muted); }
.action-list b { color:var(--accent-deep); font-size:.74rem; white-space:nowrap; }
.suggestion-card {
  display:grid; grid-template-columns:1fr auto; gap:18px; align-items:center;
  margin-bottom:14px; padding:18px; border:1px solid #ffc8c1; border-left:5px solid var(--accent);
  border-radius:14px; background:#fff;
}
.suggestion-card h3 { margin:8px 0 5px; font-size:1.14rem; }
.suggestion-card p { max-width:72ch; color:var(--muted); font-size:.82rem; }
.suggested-items { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.suggested-items span { padding:5px 9px; border:1px solid var(--line); border-radius:999px; font-size:.7rem; background:var(--paper); }
.suggestion-actions { display:grid; gap:7px; min-width:170px; }
.suggestion-actions select {
  min-height:36px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:#fff; font-size:.75rem;
}
.trip-board { display:grid; grid-template-columns:repeat(4,minmax(230px,1fr)); gap:12px; overflow-x:auto; padding-bottom:8px; }
.trip-column { min-height:380px; padding:12px; border:1px solid var(--line); border-radius:14px; background:#edf0f4; }
.trip-column > header { display:flex; justify-content:space-between; gap:8px; align-items:center; margin-bottom:10px; }
.trip-column h3 { font-size:1rem; margin-top:2px; }
.eyebrow { color:var(--muted); font-size:.62rem; font-weight:800; letter-spacing:.08em; }
.count { min-width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#fff; color:var(--muted); font-size:.68rem; font-weight:800; }
.place-card { margin-bottom:8px; padding:12px; border:1px solid var(--line); border-radius:11px; background:#fff; box-shadow:0 4px 10px rgba(26,35,50,.03); cursor:grab; }
.place-card:active { cursor:grabbing; }
.place-card.dragging { opacity:.5; transform:rotate(1deg); }
.place-card h4 { margin:5px 0 3px; font-family:var(--font-display); font-size:.95rem; }
.place-card p { color:var(--muted); font-size:.72rem; }
.place-card footer { display:flex; justify-content:space-between; align-items:center; margin-top:10px; padding-top:8px; border-top:1px solid var(--line); font-size:.68rem; font-weight:700; }
.place-type { color:var(--accent-deep); font-size:.62rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.column-add { width:100%; padding:9px; color:var(--muted); border:1px dashed #c7ced8; border-radius:10px; font-size:.72rem; font-weight:700; }
.empty-column { min-height:128px; display:grid; place-content:center; padding:20px; color:var(--muted); text-align:center; }
.empty-column p { margin-top:3px; font-size:.72rem; }
.drag-note { margin-top:8px; color:var(--muted); font-size:.68rem; }
.place-map .stay-pin { width:42px; height:42px; background:var(--ink); border-radius:14px; transform:none; }
.place-map .stay-pin span { transform:none; font-size:1rem; }
.place-map .p-stay { left:45%; top:47%; }
.record-table { width:100%; overflow-x:auto; }
.record-head,.record-row { display:grid; grid-template-columns:1.4fr .8fr 1.2fr 1fr .8fr; gap:12px; align-items:center; min-width:720px; }
.record-head { padding:10px 16px; color:var(--muted); background:var(--paper); border-bottom:1px solid var(--line); font-size:.66rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.record-row { width:100%; padding:13px 16px; border-bottom:1px solid var(--line); text-align:left; font-size:.78rem; }
.record-row:hover { background:#fafbfc; }
.record-row:last-child { border-bottom:0; }
.record-row .needs-input { color:var(--accent-deep); font-weight:700; }
.budget-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px; }
.budget-summary article { padding:16px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.budget-summary span,.budget-summary strong { display:block; }
.budget-summary span { color:var(--muted); font-size:.7rem; }
.budget-summary strong { margin-top:3px; font:560 1.35rem/1.2 var(--font-display); }
.check-items li::before { display:none; }
.setup-shell { padding-bottom:30px; }
.setup-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; }
.setup-heading h2 { margin:8px 0 4px; font-size:1.65rem; }
.setup-heading p { color:var(--muted); }
.setup-section { display:grid; grid-template-columns:210px 1fr; gap:24px; margin-bottom:12px; padding:20px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.setup-section h3 { font-size:1.05rem; }
.setup-content { min-width:0; }
.header-image-editor {
  min-height:150px; margin-bottom:16px; padding:16px; display:flex; align-items:flex-end; justify-content:space-between; gap:12px;
  color:#fff; border-radius:14px; background-size:cover; background-position:center;
}
.header-image-editor.trip { background-image:linear-gradient(90deg,rgba(18,24,32,.68),rgba(18,24,32,.08)),url("../assets/images/lisbon.jpg"); }
body[data-trip="japan"] .header-image-editor.trip { background-image:linear-gradient(90deg,rgba(18,24,32,.68),rgba(18,24,32,.08)),url("../assets/images/tokyo.jpg"); }
.header-image-editor.learning { background-image:linear-gradient(90deg,rgba(18,24,32,.68),rgba(18,24,32,.08)),url("../assets/images/learning.jpg"); }
.header-image-editor.home { background-image:linear-gradient(90deg,rgba(18,24,32,.68),rgba(18,24,32,.08)),url("../assets/images/kitchen.jpg"); }
.header-image-editor.event { background-image:linear-gradient(90deg,rgba(18,24,32,.68),rgba(18,24,32,.08)),url("../assets/images/event.jpg"); }
.header-image-editor.meals { background-image:linear-gradient(90deg,rgba(18,24,32,.68),rgba(18,24,32,.08)),url("../assets/images/meals.jpg"); }
.header-image-editor.business { background-image:linear-gradient(90deg,rgba(18,24,32,.72),rgba(18,24,32,.1)),url("../assets/images/business.jpg"); }
.header-image-editor > span { font-weight:750; }
.modal-wide { width:min(100%,620px); }

/* Customer-facing Trip Planner */
.trip-shell { max-width:1180px; }
.narrow-shell { max-width:820px; margin:0 auto; }
.page-heading {
  display:flex; align-items:flex-end; justify-content:space-between; gap:18px;
  margin:2px 0 20px;
}
.page-heading h2 { margin:5px 0 4px; font-size:clamp(1.8rem,3vw,2.55rem); }
.page-heading p { color:var(--muted); }
.page-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.overview-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(220px,.7fr); gap:14px; }
.overview-main,.overview-side { display:grid; gap:14px; align-content:start; }
.trip-legs {
  display:grid; grid-template-columns:minmax(230px,1fr) auto minmax(230px,1fr); gap:10px; align-items:stretch;
  margin-bottom:14px;
}
.trip-leg {
  display:grid; grid-template-columns:34px 1fr auto; gap:11px; align-items:center;
  padding:14px; border:1px solid var(--line); border-radius:15px; background:#fff;
}
.trip-leg.active { border-color:#ffc2ba; background:#fff9f8; }
.leg-number {
  width:32px; height:32px; display:grid; place-items:center; border-radius:50%;
  color:#fff; background:var(--ink); font-weight:800;
}
.trip-leg h3 { margin:3px 0 2px; font-size:1rem; }
.trip-leg p,.trip-leg small { color:var(--muted); font-size:.66rem; }
.leg-state { color:var(--muted); font-size:.65rem; font-weight:700; white-space:nowrap; }
.leg-transfer { display:grid; place-content:center; padding:5px 10px; color:var(--muted); text-align:center; }
.leg-transfer span,.leg-transfer strong { display:block; }
.leg-transfer span { font-size:.6rem; }
.leg-transfer strong { margin-top:3px; font-size:.68rem; }
.day-trip-note {
  grid-column:1/-1; display:flex; align-items:center; gap:12px; padding:9px 14px;
  border:1px dashed #cbd1d9; border-radius:12px; background:#f8f9fa;
}
.day-trip-note > span { color:var(--accent-deep); font-size:.6rem; font-weight:800; letter-spacing:.08em; }
.day-trip-note small { margin-left:auto; color:var(--muted); }
.assistant-nudge {
  display:grid; grid-template-columns:40px 1fr auto; gap:13px; align-items:center;
  padding:16px; border:1px solid var(--line); border-radius:15px; background:#fff;
}
.assistant-nudge h3 { margin:4px 0; font-size:1rem; }
.assistant-nudge p { color:var(--muted); font-size:.72rem; }
.trip-next { display:grid; grid-template-columns:52px 1fr; gap:16px; align-items:center; }
.trip-next h2 { margin-bottom:5px; font-size:1.28rem; }
.trip-next p { color:var(--muted); }
.next-date {
  width:50px; height:58px; display:grid; place-content:center; border-radius:13px;
  color:#fff; background:var(--accent); text-align:center; font:650 1.25rem/1 var(--font-display);
}
.next-date small { margin-top:4px; font:800 .6rem/1 var(--font-body); letter-spacing:.08em; }
.mini-stat { padding:18px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.mini-stat > span,.mini-stat > strong,.mini-stat > small { display:block; }
.mini-stat > span { color:var(--muted); font-size:.7rem; font-weight:700; }
.mini-stat > strong { margin:6px 0 2px; font:560 1.25rem/1.2 var(--font-display); }
.mini-stat > small { color:var(--muted); }
.mini-stat.needs-attention { border-left:4px solid var(--accent); }
.keep-suggestion {
  display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:14px; align-items:center;
  margin-bottom:18px; padding:16px 18px; border:1px solid #ffc8c1; border-radius:15px;
  background:linear-gradient(100deg,#fff7f5,#fff);
}
.keep-suggestion-mark {
  width:40px; height:40px; display:grid; place-items:center; border-radius:13px;
  color:#fff; background:var(--ink); font-weight:800;
}
.keep-suggestion h3 { margin:4px 0; font-size:1.08rem; }
.keep-suggestion p { max-width:76ch; color:var(--muted); font-size:.8rem; }
.keep-suggestion[hidden] { display:none !important; }
.nav-divider { display:block; height:1px; margin:7px 12px; background:var(--line); }
.date-strip {
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(92px,1fr); gap:7px;
  margin-bottom:16px; overflow-x:auto; padding:2px 2px 7px; scrollbar-width:thin;
}
.date-strip button {
  min-width:78px; min-height:108px; display:grid; place-items:center; align-content:center; gap:2px;
  padding:8px 5px; border:1px solid var(--line); border-radius:13px; background:#fff;
  color:var(--muted); transition:border-color .18s ease,background .18s ease,transform .18s ease;
}
.date-strip button:hover { border-color:#bbc2cb; transform:translateY(-1px); }
.date-strip button.active { border-color:var(--ink); color:var(--ink); background:#f6f3ee; box-shadow:inset 0 -3px var(--accent); }
.date-strip span { font-size:.58rem; font-weight:800; letter-spacing:.08em; }
.date-strip em {
  margin-bottom:3px; color:var(--muted); font-style:normal; font-size:.54rem; font-weight:800;
  letter-spacing:.06em; text-transform:uppercase;
}
.date-strip button[data-city="lisbon"] em::before,.date-strip button[data-city="sintra"] em::before,.date-strip button[data-city="porto"] em::before,
.date-strip button[data-city="tokyo"] em::before,.date-strip button[data-city="hakone"] em::before {
  content:""; width:6px; height:6px; display:inline-block; margin-right:4px; border-radius:50%; background:#ff6258;
}
.date-strip button[data-city="hakone"] em::before { background:#89908a; }
.date-strip button[data-city="sintra"] em::before { background:#89908a; }
.date-strip button[data-city="porto"] em::before { background:#252d3d; }
.date-strip strong { font:650 1.35rem/1 var(--font-display); }
.date-strip small { max-width:100%; font-size:.55rem; line-height:1.25; white-space:normal; overflow-wrap:anywhere; text-align:center; }
.plan-legend {
  display:flex; gap:18px; align-items:center; margin:-5px 0 12px; color:var(--muted); font-size:.66rem;
}
.plan-legend span { display:flex; align-items:center; gap:6px; }
.city-dot { width:8px; height:8px; display:inline-block; border-radius:50%; background:#ff6258; }
.city-dot.hakone { background:#89908a; }
.city-dot.sintra { background:#89908a; }
.city-dot.porto { background:#252d3d; }
.selected-day,.unplanned-row {
  padding:17px; border:1px solid var(--line); border-radius:15px; background:#fff;
}
.selected-day { margin-bottom:13px; }
.selected-day > header,.unplanned-row > header {
  display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:13px;
}
.selected-day h3,.unplanned-row h3 { margin-top:4px; font-size:1.08rem; }
.day-base { margin-top:4px; color:var(--muted); font-size:.68rem; }
.inline-actions { display:flex; gap:10px; align-items:center; }
.selected-day .place-card.proposed { border-color:#e6b8b1; background:#fffaf9; }
.unplanned-row { background:#f8f7f4; }
.unplanned-row .day-track { max-width:none; width:100%; }
.day-lanes { display:grid; gap:10px; }
.day-lane {
  display:grid; grid-template-columns:180px minmax(0,1fr); gap:14px;
  min-width:0; padding:12px; border:1px solid var(--line); border-radius:15px; background:#fff;
}
.day-lane > header { padding:7px 8px; border-right:1px solid var(--line); }
.day-lane > header h3 { margin:4px 0; font-size:1rem; }
.day-lane > header small { color:var(--muted); font-size:.7rem; }
.idea-lane { background:#fff8f6; border-color:#ffd6d0; }
.day-track {
  display:flex; gap:10px; min-width:0; padding:1px 2px 3px;
  overflow-x:auto; scroll-snap-type:x proximity; scrollbar-width:thin; scrollbar-color:#c9ced6 transparent;
}
.day-track .place-card {
  width:210px; min-width:210px; margin:0; scroll-snap-align:start;
}
.draft-track { padding:8px; border-radius:12px; background:#f7f8fa; }
.lane-add,.open-time {
  width:180px; min-width:180px; min-height:116px; display:grid; place-content:center; gap:6px;
  padding:14px; border:1px dashed #c8ced7; border-radius:11px; color:var(--muted);
  background:transparent; text-align:center; font-size:.72rem; font-weight:700; scroll-snap-align:start;
}
.lane-add span { color:var(--accent); font-size:1.25rem; }
.lane-add.wide { width:260px; min-width:260px; }
.open-time { border-style:solid; background:#fff; }
.open-time span { color:var(--muted); font-size:.68rem; font-weight:500; }
.place-card footer button {
  width:28px; height:28px; margin-left:auto; border-radius:8px; color:var(--muted); font-weight:800;
}
.place-card footer button:hover { color:var(--ink); background:#eceff2; }
.map-name {
  position:absolute; z-index:2; color:#5f6e66; font-size:.62rem; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase; text-shadow:0 1px rgba(255,255,255,.9);
}
.map-name.alfama { left:58%; top:42%; }
.map-name.baixa { left:39%; top:45%; }
.map-name.graca { left:60%; top:27%; }
.map-name.belem { left:10%; top:57%; }
.map-name.river { right:13%; bottom:16%; color:#56798a; letter-spacing:.18em; transform:rotate(-8deg); }
.map-pin.p-stay { left:60%; top:52%; }
.map-pin.p1 { left:45%; top:52%; }
.map-pin.p2 { left:77%; top:42%; }
.map-pin.p3 { left:66%; top:35%; }
.map-pin.p4 { left:19%; top:62%; }
.map-pin.p5 { left:40%; top:66%; }
.map-pin.p6 { left:62%; top:48%; }
.map-pin.p7 { left:16%; top:67%; }
.map-pin.p8 { left:28%; top:52%; }
.place-map .map-pin { cursor:pointer; }
.place-map .map-pin:focus-visible { outline:3px solid #fff; box-shadow:0 0 0 5px var(--ink); }
.nav-divider + button { margin-top:1px; }
.mobile-trip-nav { display:none; }
.mobile-more-sheet { width:min(100%,430px); }
.mobile-more-links { display:grid; gap:4px; margin:14px 0 18px; }
.mobile-more-links > button {
  width:100%; display:grid; grid-template-columns:32px 1fr; gap:10px; align-items:center;
  padding:11px 8px; border-bottom:1px solid var(--line); color:var(--ink); text-align:left; font-size:1rem;
}
.mobile-more-links strong,.mobile-more-links small { display:block; }
.mobile-more-links strong { font-size:.78rem; }
.mobile-more-links small { margin-top:2px; color:var(--muted); font-size:.64rem; }
.city-tabs {
  display:flex; gap:7px; margin-bottom:10px; overflow-x:auto; scrollbar-width:none;
}
.city-tabs button {
  min-width:160px; padding:9px 13px; border:1px solid var(--line); border-radius:12px;
  background:#fff; text-align:left; font-size:.74rem; font-weight:750;
}
.city-tabs button span { display:block; margin-top:2px; color:var(--muted); font-size:.58rem; font-weight:500; }
.city-tabs button.active { border-color:var(--ink); box-shadow:inset 0 -3px var(--accent); }
.checklist-stack { display:grid; gap:14px; }
.checklist-list { border:1px solid var(--line); border-radius:15px; background:#fff; overflow:hidden; }
.checklist-list > header {
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 17px 12px; border-bottom:1px solid var(--line);
}
.checklist-list h3 { margin-top:3px; font-size:1.08rem; border-radius:5px; }
.checklist-list h3:focus { outline:2px solid var(--accent); outline-offset:3px; }
.checklist-list > header > button { width:30px; height:30px; color:var(--muted); }
.checklist-list .check-items { padding:5px 17px; }
.checklist-list .check-items li { display:flex; gap:10px; align-items:center; padding:9px 0; border-bottom:1px solid #edf0f3; }
.checklist-list .check-items li span { flex:1; min-width:0; }
.check-items .item-remove { width:24px; height:24px; border:0; border-radius:7px; color:var(--muted); font-size:1rem; line-height:1; opacity:0; transition:opacity .15s var(--ease); }
.check-items li:hover .item-remove,.check-items .item-remove:focus-visible { opacity:1; }
.check-items .item-remove:hover { color:#b44237; background:#fbeae8; }
.checklist-list .check-items li:last-child { border-bottom:0; }
.checklist-list .check-items li button {
  width:22px; height:22px; display:grid; place-items:center; border:1px solid #bfc6cf; border-radius:6px; color:var(--muted);
}
.checklist-list .check-items li.done span { color:var(--muted); text-decoration:line-through; }
.checklist-list .check-items li.done button { color:#fff; background:var(--ink); border-color:var(--ink); }
.checklist-add { display:flex; gap:8px; align-items:center; padding:11px 17px; border-top:1px solid var(--line); color:var(--accent); background:#fbfbfc; }
.checklist-add input { flex:1; min-width:0; border:0; background:transparent; font-size:.72rem; }
.checklist-add input:focus { outline:0; }
.history-shell { max-width:900px; }
.history-filter { margin-bottom:12px; }
.assistant-history { display:grid; gap:10px; }
.history-item {
  display:grid; grid-template-columns:38px 1fr auto; gap:13px; align-items:center;
  padding:15px; border:1px solid var(--line); border-radius:14px; background:#fff;
}
.history-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:#eef1f4; font-weight:800; }
.history-item.confirmed .history-icon { color:#fff; background:var(--ink); }
.history-item h3 { margin:4px 0; font-size:1rem; }
.history-item p,.history-item small { color:var(--muted); font-size:.68rem; }
.history-item small button { color:var(--accent-deep); font-weight:750; }
.stay-editor { margin-bottom:12px; padding:14px; border:1px solid var(--line); border-radius:14px; background:#f9fafb; }
.stay-editor > header { display:flex; align-items:center; gap:10px; margin-bottom:13px; }
.stay-editor > header div { flex:1; }
.stay-editor > header strong,.stay-editor > header small { display:block; }
.stay-editor > header small { margin-top:2px; color:var(--muted); }
.assistant-launcher {
  position:fixed; z-index:75; right:22px; bottom:22px; display:grid; grid-template-columns:36px 1fr auto; gap:10px; align-items:center;
  min-width:272px; padding:9px 12px; border:1px solid #d5d9df; border-radius:16px; background:#fff;
  box-shadow:0 12px 36px rgba(26,31,38,.18); text-align:left;
}
.assistant-launcher > span {
  width:36px; height:36px; display:grid; place-items:center; border-radius:11px; color:#fff; background:var(--ink); font-weight:800;
}
.assistant-launcher strong,.assistant-launcher small { display:block; }
.assistant-launcher strong { font-size:.75rem; }
.assistant-launcher small { margin-top:2px; color:var(--muted); font-size:.6rem; }
.assistant-launcher b { color:var(--muted); font-size:.58rem; font-weight:600; }
.assistant-modal { width:min(100%,680px); max-height:min(820px,calc(100vh - 32px)); overflow-y:auto; padding:0; background:#fff; animation:none; }
.assistant-modal-head {
  position:sticky; z-index:2; top:0; display:grid; grid-template-columns:40px 1fr 30px; gap:12px; align-items:center;
  padding:17px 19px; border-bottom:1px solid var(--line); background:#fff;
}
.assistant-modal-head h2 { margin:3px 0; font-size:1.25rem; }
.assistant-modal-head p { color:var(--muted); font-size:.65rem; }
.assistant-modal-head > button { width:30px; height:30px; color:var(--muted); font-size:1.2rem; }
.assistant-quick { display:flex; gap:6px; padding:12px 18px; overflow-x:auto; border-bottom:1px solid var(--line); scrollbar-width:none; }
.assistant-quick button { padding:7px 10px; border:1px solid var(--line); border-radius:999px; white-space:nowrap; font-size:.64rem; font-weight:700; }
.assistant-thread { display:grid; gap:10px; padding:16px 18px 8px; }
.assistant-user-example { justify-self:end; max-width:76%; padding:10px 12px; border-radius:13px 13px 3px 13px; background:#eef1f4; }
.assistant-user-example strong { font-size:.6rem; }
.assistant-user-example p { margin-top:3px; font-size:.74rem; }
.assistant-result-card { padding:15px; border:1px solid #ffc2ba; border-radius:14px; background:#fff9f8; }
.result-source { display:flex; justify-content:space-between; gap:12px; color:var(--accent-deep); font-size:.58rem; font-weight:800; }
.result-source small { color:var(--muted); font-weight:500; }
.assistant-result-card h3 { margin:8px 0 3px; font-size:1.08rem; }
.assistant-result-card > p { color:var(--muted); font-size:.7rem; }
.assistant-result-card dl { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin:12px 0; }
.assistant-result-card dl div { padding:9px; border:1px solid var(--line); border-radius:9px; background:#fff; }
.assistant-result-card dt { color:var(--muted); font-size:.55rem; }
.assistant-result-card dd { margin-top:3px; font-size:.67rem; font-weight:750; }
.assistant-composer {
  position:sticky; bottom:0; display:grid; grid-template-columns:32px 1fr 36px; gap:7px; align-items:center;
  margin:8px 18px; padding:7px; border:1px solid #bfc6cf; border-radius:14px; background:#fff; box-shadow:0 8px 24px rgba(26,31,38,.1);
}
.assistant-composer input { min-width:0; border:0; background:transparent; font-size:.72rem; }
.assistant-composer input:focus { outline:0; }
.assistant-send { width:34px; height:34px; border-radius:10px; color:#fff; background:var(--accent); font-weight:800; }
.assistant-history-link { display:block; margin:0 auto 14px; color:var(--accent-deep); font-size:.65rem; font-weight:750; }
.assistant-empty { padding:28px 20px; text-align:center; }
.assistant-empty strong { display:block; font:560 1.08rem/1.2 var(--font-display); }
.assistant-empty p { max-width:48ch; margin:7px auto 0; color:var(--muted); font-size:.7rem; }
.compact-action-modal,.place-detail-modal { width:min(100%,460px); }
.place-detail-when { margin:0 0 12px; color:var(--ink); font-size:.78rem; font-weight:700; }
.place-detail-note-field { display:grid; gap:6px; margin:0 0 14px; }
.place-detail-note-field > span { color:var(--muted); font-size:.66rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.place-detail-note-field textarea {
  width:100%; min-height:96px; padding:10px 12px; border:1px solid var(--line); border-radius:12px;
  background:#fff; color:var(--ink); font:500 .8rem/1.35 var(--font-ui, system-ui); resize:vertical;
}
.day-track .place-card.dragging { cursor:grabbing; }
.compact-action-modal > p,.place-detail-modal > p { margin:6px 0 14px; color:var(--muted); }
.action-list { display:grid; margin:10px 0 18px; border:1px solid var(--line); border-radius:13px; overflow:hidden; }
.action-list button {
  display:flex; justify-content:space-between; gap:16px; padding:13px 14px;
  border-bottom:1px solid var(--line); text-align:left; font-size:.75rem; font-weight:700;
}
.action-list button:last-child { border-bottom:0; }
.action-list button:hover { background:#f7f8f9; }
.action-list .danger-action { color:#b44237; }
.detail-map-thumb {
  min-height:125px; display:grid; place-content:center; gap:5px; margin:14px 0;
  border-radius:13px; color:#31463e; background:
    linear-gradient(28deg,transparent 47%,rgba(255,255,255,.72) 48% 52%,transparent 53%),
    linear-gradient(90deg,#dbe7df 49%,#c6dbe5 50%);
  text-align:center;
}
.detail-map-thumb span { font-size:1.6rem; }
.customer-map-layout { grid-template-rows:minmax(0,1fr); height:clamp(560px,calc(100vh - 290px),720px); min-height:0; overflow:hidden; }
.customer-map-layout .trip-map { min-height:0; }
.stay-card { display:flex; align-items:center; gap:10px; max-width:250px; }
.stay-marker.small { width:34px; height:34px; flex-basis:34px; border-radius:10px; }
.stay-card span:not(.stay-marker) { color:var(--muted); }
.place-list { min-height:0; overflow:auto; }
.place-list-head { display:flex; align-items:center; justify-content:space-between; padding:16px; border-bottom:1px solid var(--line); }
.place-list-head button { width:30px; height:30px; border-radius:9px; background:var(--accent-soft); color:var(--accent-deep); font-weight:800; }
.place-list-item {
  width:100%; display:grid; grid-template-columns:30px 1fr auto; gap:10px; align-items:center;
  padding:13px 16px; border-bottom:1px solid var(--line); text-align:left;
}
.place-list-item:hover,.place-list-item.active { background:#fff8f6; }
.place-list-item strong,.place-list-item small { display:block; }
.place-list-item small { margin-top:2px; color:var(--muted); }
.place-list-item b { color:var(--muted); font-size:1.1rem; }
.place-list-item.needs { color:var(--accent-deep); }
.list-toolbar { display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line); }
.filter-pills { display:flex; gap:5px; overflow-x:auto; scrollbar-width:none; }
.filter-pills::-webkit-scrollbar { display:none; }
.filter-pills button { padding:7px 11px; border-radius:999px; white-space:nowrap; font-size:.7rem; font-weight:700; }
.filter-pills button.active { color:var(--accent-deep); background:var(--accent-soft); }
.compact-search { margin-left:auto; width:200px; min-height:34px; padding:0 12px; border:1px solid var(--line); border-radius:999px; background:var(--paper); }
.checklist-card { max-width:none; }
.chat-shell { min-height:calc(100vh - 100px); display:flex; flex-direction:column; }
.chat-shell .chat { width:100%; margin:0; }
.chat-result { display:block; margin-top:10px; color:var(--accent-deep); font-size:.75rem; font-weight:750; }
.chat-composer { display:flex; gap:8px; margin-top:auto; padding-top:20px; }
.chat-composer input { flex:1; min-width:0; padding:0 15px; border:1px solid var(--line); border-radius:999px; background:#fff; }
@media(max-width:820px) {
  .workspace-focus { display:block; width:100%; max-width:100%; min-height:100dvh; height:auto; overflow-x:hidden; overflow-y:visible; }
  .workspace-focus .ws-rail { display:none; }
  .workspace-focus .ws-center { display:block; width:100%; max-width:100%; min-width:0; overflow:visible; }
  .workspace-focus .ws-topbar { display:none; }
  .mobile-workspace-head {
    position:sticky; top:0; z-index:40;
    display:grid; grid-template-columns:26px minmax(0,1fr); gap:9px; align-items:center;
    width:100%; max-width:100%; padding:10px 14px; overflow:hidden; background:rgba(255,255,255,.96);
    border-bottom:1px solid var(--line); backdrop-filter:blur(10px);
  }
  .mobile-workspace-head > a { font-size:1.1rem; color:var(--muted); }
  .mobile-workspace-head > div { min-width:0; }
  .mobile-workspace-head strong,.mobile-workspace-head div span { display:block; }
  .mobile-workspace-head strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:560 1rem/1.15 var(--font-display); }
  .mobile-workspace-head div span { margin-top:2px; color:var(--muted); font-size:.65rem; }
  .mobile-add {
    width:36px; height:36px; border-radius:11px; background:var(--ink); color:#fff; font-size:1.15rem;
  }
  .workspace-focus .ws-pane { width:100%; max-width:100%; min-width:0; padding:14px 14px calc(98px + env(safe-area-inset-bottom)); overflow-x:hidden; overflow-y:visible; }
  .workspace-focus .workspace-hero { margin:-14px -14px 14px; }
  .page-heading { align-items:flex-start; flex-direction:column; margin-bottom:14px; }
  .page-actions { width:100%; justify-content:flex-start; }
  .overview-layout { grid-template-columns:1fr; }
  .trip-legs { grid-template-columns:1fr; }
  .leg-transfer { display:flex; justify-content:center; gap:8px; padding:2px 0; }
  .leg-transfer strong { margin:0; }
  .day-trip-note { grid-column:auto; align-items:flex-start; flex-wrap:wrap; }
  .day-trip-note small { width:100%; margin-left:0; }
  .assistant-nudge { grid-template-columns:36px 1fr; }
  .assistant-nudge .btn { grid-column:1/-1; }
  .overview-side { grid-template-columns:1fr 1fr; }
  .mini-stat.needs-attention { grid-column:1/-1; }
  .keep-suggestion { grid-template-columns:36px 1fr; align-items:start; }
  .keep-suggestion-mark { width:34px; height:34px; }
  .keep-suggestion .suggestion-actions { grid-column:1/-1; display:flex; flex-direction:row; width:100%; min-width:0; }
  .keep-suggestion .suggestion-actions .btn { flex:1; min-width:0; padding:0 9px; }
  .workspace-focus .view-card header { flex-wrap:wrap; }
  .date-strip {
    display:flex; gap:7px; margin-right:-14px; padding-right:14px; scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  .date-strip::-webkit-scrollbar { display:none; }
  .date-strip button { min-width:72px; scroll-snap-align:start; }
  .date-strip button { min-width:88px; }
  .plan-legend { margin-right:-14px; padding-right:14px; overflow-x:auto; white-space:nowrap; scrollbar-width:none; }
  .selected-day,.unplanned-row { padding:13px; }
  .selected-day > header,.unplanned-row > header { align-items:flex-start; }
  .unplanned-row > header { flex-direction:column; }
  .inline-actions { width:100%; justify-content:space-between; }
  .day-track { margin-right:-12px; padding-right:12px; scrollbar-width:none; }
  .day-track::-webkit-scrollbar { display:none; }
  .day-track .place-card { width:76vw; min-width:240px; max-width:290px; }
  .lane-add,.open-time { width:66vw; min-width:220px; }
  .customer-map-layout { grid-template-columns:1fr; grid-template-rows:auto auto; height:auto; min-height:0; overflow:visible; }
  .customer-map-layout .trip-map { min-height:380px; }
  .place-list { max-height:none; }
  .list-toolbar { align-items:stretch; flex-direction:column; }
  .compact-search { width:100%; margin:0; }
  .record-table { overflow-x:auto; }
  .chat-shell { min-height:calc(100vh - 150px); }
  .suggestion-card,.setup-section { grid-template-columns:1fr; }
  .suggestion-actions { min-width:0; }
  .budget-summary { grid-template-columns:1fr 1fr; }
  .setup-heading { align-items:flex-start; flex-direction:column; }
  .trip-board { grid-template-columns:repeat(4,250px); }
  .ws-rail-foot { display:none; }
  .mobile-trip-nav {
    position:fixed; z-index:80; left:0; right:0; bottom:0; display:grid; grid-template-columns:repeat(5,1fr);
    min-height:66px; padding:6px 6px max(6px,env(safe-area-inset-bottom)); border-top:1px solid var(--line);
    background:rgba(255,255,255,.96); box-shadow:0 -7px 22px rgba(26,31,38,.08); backdrop-filter:blur(12px);
  }
  .mobile-trip-nav button {
    min-width:0; display:grid; place-items:center; align-content:center; gap:4px; border-radius:12px;
    color:var(--muted); font-size:1.2rem; min-height:54px;
  }
  .mobile-trip-nav button span { font-size:.78rem; font-weight:750; letter-spacing:0; }
  .mobile-trip-nav button.active { color:var(--accent-deep); background:var(--accent-soft); }
  .mobile-more-sheet {
    position:absolute; left:8px; right:8px; bottom:8px; width:auto; max-height:calc(100vh - 28px);
    overflow-y:auto; border-radius:20px;
  }
  .modal-backdrop:has(.mobile-more-sheet) { align-items:flex-end; padding:0; }
  .assistant-launcher {
    right:14px; bottom:78px; min-width:0; width:46px; height:46px; display:grid; grid-template-columns:1fr;
    padding:5px; border-radius:15px;
  }
  .assistant-launcher > span { width:36px; height:36px; margin:auto; }
  .assistant-launcher > div,.assistant-launcher > b { display:none; }
  .assistant-modal {
    position:absolute; left:7px; right:7px; bottom:7px; width:auto; max-height:calc(100vh - 14px); border-radius:20px;
  }
  .modal-backdrop:has(.assistant-modal) { align-items:flex-end; padding:0; }
  .assistant-modal-head { grid-template-columns:36px 1fr 30px; padding:14px; }
  .assistant-result-card dl { grid-template-columns:1fr 1fr; }
  .assistant-user-example { max-width:90%; }
  .assistant-composer { margin:8px 12px; }
  .history-item { grid-template-columns:34px 1fr; align-items:start; }
  .history-item > .btn,.history-item > .text-action { grid-column:2; justify-self:start; }
  .checklist-list > header { padding:13px; }
  .checklist-list .check-items,.checklist-add { padding-left:13px; padding-right:13px; }
  .stay-editor > header { align-items:flex-start; flex-wrap:wrap; }
  .stay-editor > header .tag { margin-left:42px; }
}

/* Live map (MapLibre) */
.trip-map.map-live::before,.trip-map.map-live::after { display:none; }
.map-live { background:#e8ecef; }
#trip-vector-map { position:absolute; inset:0; z-index:1; font-family:var(--font-body); }
.map-live .map-legend { z-index:5; }
.map-transit-key {
  position:absolute; z-index:5; top:12px; right:12px; display:flex; align-items:center; gap:10px;
  padding:8px 10px; border:1px solid rgba(26,35,50,.12); border-radius:10px;
  background:rgba(255,255,255,.94); box-shadow:0 5px 18px rgba(26,35,50,.1);
  color:var(--ink-soft); font-size:.65rem; font-weight:700;
}
.map-transit-key span { display:flex; align-items:center; gap:5px; white-space:nowrap; }
.map-transit-key i { width:18px; height:3px; display:inline-block; border-radius:4px; background:#687386; }
.map-transit-key i.metro { height:4px; background:#9b59b6; }
.map-transit-key small { color:var(--muted); font-size:.6rem; font-weight:600; }
.lmark {
  width:32px; height:32px; display:grid; place-items:center; border-radius:50% 50% 50% 8px;
  color:#fff; background:var(--accent); border:3px solid #fff; font-size:.72rem; font-weight:800;
  box-shadow:0 8px 20px rgba(26,35,50,.28);
}
.lmark-stay { border-radius:11px; background:var(--ink); font-size:.95rem; }
.maplibregl-popup-content { padding:12px 16px; border-radius:12px; font-family:var(--font-body); font-size:.78rem; box-shadow:0 8px 28px rgba(26,35,50,.18); }
.maplibregl-popup-close-button { padding:4px 7px; font-size:1.1rem; }
.lpop-name { font-family:var(--font-display); font-size:.95rem; }
.lpop-meta { color:var(--muted); }
.lpop-open { margin-top:7px; padding:0; border:0; background:none; color:var(--accent-deep); font-weight:750; font-size:.74rem; cursor:pointer; }
@media (max-width:700px) {
  .map-transit-key { left:46px; right:8px; justify-content:center; flex-wrap:wrap; gap:5px 9px; }
}

/* Derived budget bar */
.budget-bar { display:flex; height:10px; margin-bottom:14px; border-radius:99px; border:1px solid var(--line); background:#fff; overflow:hidden; }
.budget-bar i { display:block; height:100%; transition:width .4s var(--ease); }
#budget-bar-paid { background:var(--ink); }
#budget-bar-expected { background:var(--accent); opacity:.75; }

/* Empty states and drop targets */
.empty-note { margin:0; padding:18px 16px; color:var(--muted); font-size:.78rem; }
.selected-day.drop-target,.unplanned-row.drop-target { outline:2px dashed var(--accent); outline-offset:4px; border-radius:14px; }
.record-row[hidden],.history-item[hidden] { display:none; }

/* Keep dogfood mobile usability */
@media (max-width: 820px) {
  html, body { width:100%; max-width:100%; overflow-x:hidden; }
  .workspace, .workspace-focus { width:100%; max-width:100%; }
  .pane-shell, .trip-shell, .narrow-shell { width:100%; max-width:100%; min-width:0; }

  .mobile-trip-nav { z-index:90; }
  .date-strip button {
    min-width:78px; min-height:78px; padding:10px 8px;
    -webkit-tap-highlight-color: transparent;
  }
  .date-strip button strong { font-size:1.45rem; }

  .selected-day > header, .unplanned-row > header { gap:8px; }
  .day-track { gap:8px; padding-bottom:6px; -webkit-overflow-scrolling:touch; }
  .day-track .place-card {
    width:min(82vw, 300px); min-width:min(82vw, 300px); max-width:300px;
  }
  .place-card footer button {
    width:36px; height:36px; font-size:1.05rem;
  }

  /* Places / budget: card stack instead of wide spreadsheet */
  #places-table .record-head,
  #budget-table .record-head { display:none; }
  #places-table, #budget-table {
    display:grid; gap:8px; overflow:visible; min-width:0;
  }
  #places-table .record-row,
  #budget-table .record-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "name when"
      "type type"
      "area area"
      "cost cost";
    gap:3px 10px;
    min-width:0; width:100%;
    margin:0; padding:14px;
    border:1px solid var(--line); border-radius:14px; border-bottom:1px solid var(--line);
    background:#fff; box-shadow:none;
  }
  #places-table .record-row strong,
  #budget-table .record-row strong { grid-area:name; font-size:.92rem; line-height:1.25; }
  #places-table .record-row > span:nth-of-type(1),
  #budget-table .record-row > span:nth-of-type(1) { grid-area:type; color:var(--muted); font-size:.72rem; }
  #places-table .record-row > span:nth-of-type(2),
  #budget-table .record-row > span:nth-of-type(2) { grid-area:area; color:var(--muted); font-size:.72rem; }
  #places-table .record-row > span:nth-of-type(3),
  #budget-table .record-row > span:nth-of-type(3) {
    grid-area:when; justify-self:end; align-self:start;
    color:var(--accent-deep); font-size:.72rem; font-weight:750; text-align:right;
  }
  #places-table .record-row > span:nth-of-type(4),
  #budget-table .record-row > span:nth-of-type(4) { grid-area:cost; color:var(--muted); font-size:.72rem; }

  .list-toolbar .filter-pills { width:100%; overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; }
  .list-toolbar .filter-pills button { flex:0 0 auto; min-height:36px; padding:0 12px; }

  .customer-map-layout {
    display:grid; grid-template-columns:1fr; grid-template-rows:auto auto;
    height:auto !important; min-height:0; overflow:visible !important;
  }
  .customer-map-layout .trip-map,
  .customer-map-layout .map-live {
    position:relative; height:48dvh; min-height:280px; max-height:420px;
  }
  .map-sidebar.place-list { max-height:none; border-top:1px solid var(--line); }

  .modal-backdrop { padding:10px; align-items:flex-end; }
  .modal, .modal-wide, .place-detail-modal, .compact-action-modal {
    width:100% !important; max-width:100% !important;
    max-height:calc(100dvh - 18px); overflow-y:auto;
    margin:0; border-radius:18px 18px 12px 12px;
  }
  .place-detail-note-field textarea { font-size:16px; }
  .checklist-add input, .compact-search { font-size:16px; }
  .checklist-list .check-items li > button {
    width:34px; height:34px; font-size:1rem;
  }
  .checklist-list .item-remove { width:34px; height:34px; }
  .page-heading h2 { font-size:1.45rem; }
  .page-heading p { font-size:.84rem; }
  .mobile-workspace-head div span { font-size:.74rem; }
  .mobile-workspace-head strong { font-size:1.08rem; }
  .tag { font-size:.72rem; }
  .eyebrow { font-size:.68rem; }
  .place-type { font-size:.68rem; }
  .place-card h4 { font-size:1rem; }
  .place-card p { font-size:.8rem; }
  .record-row strong { font-size:1rem !important; }
  #places-table .record-row > span,
  #budget-table .record-row > span { font-size:.8rem !important; }
  .checklist-list h3 { font-size:1.05rem; }
  .check-items li span { font-size:.92rem; }
  .btn-sm { min-height:40px; font-size:.82rem; padding:0 14px; }
  .workspace-hero.trip { padding:18px 16px; min-height:0; }
  .workspace-hero.trip h2 { font-size:1.6rem; }
  .hero-tools { width:100%; display:flex; gap:8px; }
  .hero-tools .btn { flex:1; min-height:40px; }
  .overview-side { grid-template-columns:1fr; }
  .plan-legend { white-space:normal; display:grid; gap:6px; }
  .file-list, .file-row { min-width:0; }
  .btn, .text-action, .mobile-trip-nav button { -webkit-tap-highlight-color: transparent; }
}

@media (max-width: 420px) {
  .day-track .place-card { width:84vw; min-width:84vw; }
  .mobile-trip-nav button span { font-size:.74rem; }
}
/* Keep notes page */

/* Keep notes page */
.notes-stack { display:grid; gap:12px; }
.note-card {
  padding:14px; border:1px solid var(--line); border-radius:15px; background:#fff;
}
.note-card > header { display:flex; gap:8px; align-items:center; margin-bottom:10px; }
.note-card .note-title {
  flex:1; min-width:0; border:0; background:transparent;
  font:560 1.05rem/1.2 var(--font-display); color:var(--ink);
}
.note-card .note-delete {
  width:34px; height:34px; border-radius:10px; color:var(--muted); font-size:1.2rem;
}
.note-card .note-delete:hover { background:#f3f5f8; color:var(--ink); }
.note-card .note-body {
  width:100%; min-height:120px; padding:10px 12px; border:1px solid var(--line); border-radius:12px;
  background:#fafbfc; color:var(--ink); font:500 .86rem/1.45 var(--font-body); resize:vertical;
}
@media (max-width:820px) {
  .note-card .note-title, .note-card .note-body { font-size:16px; }
  .ws-tabs button[data-view="notes"]::before { content:"✎"; }
}
