:root { color-scheme: light dark; --line:#8883; --accent:#2b6cb0; --muted:#8a8a8a; }
* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, sans-serif; margin: 0; line-height: 1.5; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
header.top { padding: .6rem 1rem; border-bottom: 1px solid var(--line); display: flex; gap: 1rem; align-items: baseline; }
main { max-width: 920px; margin: 0 auto; padding: 1rem; }
.muted { color: var(--muted); }
.small { font-size: .85rem; }
.row { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.spacer { flex: 1; }
.card { border: 1px solid var(--line); border-radius: 10px; padding: .8rem 1rem; margin: .5rem 0; }
button, .btn { font: inherit; padding: .3rem .6rem; border: 1px solid var(--line); border-radius: 7px; background: transparent; cursor: pointer; color: inherit; }
button:hover, .btn:hover { border-color: var(--accent); }
.btn-primary { background: var(--accent); color: #fff; border-color: var(--accent); }
.btn-primary:hover { text-decoration: none; }
.add-btn { border-style: dashed; width: 100%; text-align: left; color: var(--muted); }

/* badges */
.badge { font-size: .72rem; padding: .05rem .45rem; border-radius: 999px; border: 1px solid var(--line); white-space: nowrap; }
.badge-idea { color:#8a6d00; border-color:#d4b64a88; }
.badge-booked { color:#1a6b1a; border-color:#4caf5088; }
.badge-confirmed { color:#fff; background:#2e7d32; border-color:#2e7d32; }
.badge-cancelled { color:#b00; text-decoration: line-through; border-color:#e5737388; }
.type-tag { font-size:.7rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); border:1px solid var(--line); border-radius:5px; padding:0 .3rem; }

/* itinerary */
.leg { margin: 1.2rem 0; }
.leg-head { display:flex; align-items:baseline; gap:.6rem; border-bottom:2px solid var(--line); padding-bottom:.2rem; }
.day { margin: .6rem 0; }
.day-head { font-weight: 600; color: var(--accent); margin: .6rem 0 .2rem; }
.event { display:flex; gap:.6rem; padding:.4rem .2rem; border-bottom:1px solid var(--line); }
.event-time { min-width: 68px; font-variant-numeric: tabular-nums; font-size:.85rem; }
.event-body { flex: 1; min-width: 0; }
.event-title { display:flex; gap:.4rem; align-items:baseline; flex-wrap:wrap; }
.event-actions { display:flex; gap:.2rem; align-items:flex-start; }
.event-actions button { padding:.1rem .4rem; }
.links a { margin-right:.7rem; }
.addslot { margin:.5rem 0; }

/* forms */
.field { display:block; margin:.4rem 0; position:relative; }
.field > span { display:block; font-size:.8rem; color:var(--muted); }
.field input, .field select, .field textarea { width:100%; padding:.35rem .5rem; border:1px solid var(--line); border-radius:7px; background:transparent; color:inherit; font:inherit; }
.field input[type=checkbox] { width:auto; }
.inline-form { border:1px solid var(--accent); border-radius:10px; padding:.7rem; margin:.4rem 0; }
.form-actions { display:flex; gap:.5rem; margin-top:.5rem; }
.err { color:#c00; font-size:.8rem; }

/* share box */
.sharebox { background:#2b6cb00f; border:1px solid var(--accent); border-radius:10px; padding:.6rem .8rem; margin:.6rem 0; }
.sharebox input { width:100%; padding:.35rem .5rem; border:1px solid var(--line); border-radius:7px; background:transparent; color:inherit; font:inherit; }

/* today (mobile-first, big targets) */
.today-nav { display:flex; align-items:center; gap:.5rem; margin:.5rem 0 1rem; }
.today-nav .btn { padding:.5rem .8rem; }
.today-nav .today-date { flex:1; text-align:center; font-weight:600; font-size:1.05rem; }
.today-section-label { font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:1rem 0 .3rem; }
.tcard { border:1px solid var(--line); border-left:4px solid var(--accent); border-radius:10px; padding:.7rem .9rem; margin:.5rem 0; }
.tcard .t-time { font-weight:700; font-variant-numeric:tabular-nums; }
.tcard .t-title { font-size:1.1rem; font-weight:600; }
.tcard.status-confirmed { border-left-color:#2e7d32; }
.tcard.status-idea { border-left-color:#d4b64a; }
.tcard.status-cancelled { border-left-color:#e57373; opacity:.6; }
.tcard .t-links { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.5rem; }
.nav-btn { display:inline-block; padding:.45rem .8rem; border:1px solid var(--accent); border-radius:8px; }
.ticket-btn { display:inline-block; padding:.45rem .8rem; border:1px solid var(--line); border-radius:8px; background:#2b6cb00f; }

@media (max-width: 620px) {
  .event { flex-wrap: wrap; }
  .event-time { min-width: 0; width: 100%; }
}

/* concurrency: conflict banner + live-change banner */
.conflict-banner { background:#cc7a0018; border:1px solid #cc7a00; color:#a85b00; border-radius:8px; padding:.5rem .7rem; margin-bottom:.6rem; font-size:.9rem; }
.change-banner { position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:.6rem; background:var(--accent); color:#fff; padding:.5rem .8rem; border-radius:0 0 8px 8px; margin:-1rem -1rem 1rem; }
.change-banner[hidden] { display:none; }
.change-banner button { background:#fff; color:var(--accent); border-color:#fff; }

/* address autocomplete dropdown */
.geo-results { position:absolute; left:0; right:0; top:100%; z-index:30; margin:.15rem 0 0; padding:0; list-style:none; background:Canvas; color:CanvasText; border:1px solid var(--line); border-radius:8px; max-height:240px; overflow:auto; box-shadow:0 6px 20px #0003; }
.geo-results li { padding:.4rem .6rem; cursor:pointer; font-size:.88rem; }
.geo-results li:hover, .geo-results li.active { background:var(--accent); color:#fff; }

/* Claude place lookup */
.lookup-bar { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; margin:.2rem 0 .5rem; }
.lookup-result { flex-basis:100%; font-size:.85rem; }
.lookup-result .found { background:#2e7d3218; border:1px solid #2e7d3266; border-radius:8px; padding:.4rem .6rem; }
.lookup-result .found a { margin:0 .1rem; }