.journey-share-dialog{width:min(700px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:0;border:1px solid var(--line);border-radius:26px;background:var(--paper);color:var(--ink);box-shadow:var(--shadow);overflow:auto}
.journey-share-dialog::backdrop{background:#061e3688;backdrop-filter:blur(5px)}
.journey-share-dialog header{position:sticky;top:0;z-index:2;display:flex;align-items:start;justify-content:space-between;gap:16px;background:var(--paper);padding:24px;border-bottom:1px solid var(--line)}
.journey-share-dialog h2{font:700 29px/1.1 'Bricolage Grotesque',sans-serif;margin:8px 0}.journey-share-dialog header small{font-size:10px;letter-spacing:.12em;color:var(--muted)}
.journey-share-body{padding:22px 24px;line-height:1.6}.journey-share-body>p{color:var(--muted);font-size:13px}.journey-share-dialog button,.journey-share-dialog a,.arrival-share-shortcut{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 15px;border:1px solid var(--line);border-radius:14px;background:var(--cream);color:var(--ink);font:600 13px 'DM Sans',sans-serif;text-decoration:none;cursor:pointer}
.journey-share-dialog header button{width:44px;flex-shrink:0;padding:10px}.journey-share-dialog .ui-icon,.arrival-share-shortcut .ui-icon{width:21px;height:21px;flex-shrink:0}
.journey-share-dialog button:focus-visible,.journey-share-dialog a:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.journey-share-dialog button:disabled{opacity:.55;cursor:wait}
.share-private{padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--cream)}.share-private h3{font:700 23px 'Bricolage Grotesque',sans-serif;margin:12px 0}.share-private p,.share-note{font-size:12px;color:var(--muted)}
.share-route{display:flex;align-items:center;gap:12px;padding:16px;border-radius:18px;background:var(--blue-soft);flex-wrap:wrap}.share-route strong{font-size:20px}.share-route span{font-size:13px;flex:1;min-width:160px}
.share-consent{display:flex;gap:12px;align-items:flex-start;margin:20px 0;font-size:14px}.share-consent input{width:22px;height:22px;flex-shrink:0;accent-color:var(--blue)}.share-private label{display:grid;gap:6px;font-size:12px}.share-private input{width:100%;min-width:0;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--paper);color:var(--ink)}
.share-actions{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.journey-share-dialog .share-stop{border-color:#bc574c;color:#bc574c}.journey-share-dialog [data-start-share],.journey-share-dialog .share-main-link{background:var(--blue);color:white;border-color:var(--blue);width:100%}
.shared-trip-map{height:340px;border-radius:18px;overflow:hidden;background:var(--cream)}.journey-share-indicator{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:500;display:flex;gap:8px;align-items:center;border:1px solid var(--line);background:var(--paper);color:var(--ink);box-shadow:var(--shadow);border-radius:16px;min-height:48px;padding:10px 18px;font-size:12px;max-width:calc(100% - 120px)}.journey-share-indicator .ui-icon{width:18px;height:18px}.journey-share-indicator[hidden]{display:none}.arrival-share-shortcut{font-size:12px;background:transparent;margin-top:6px}
@media(max-width:520px){.journey-share-dialog header{padding:19px}.journey-share-body{padding:18px}.shared-trip-map{height:300px}.journey-share-indicator{left:12px;transform:none;max-width:calc(100% - 96px);bottom:18px}.share-actions>*{flex:1}}

/* The live card follows the demo, with real readings and explicit stale states. */
.journey-share-dialog{scrollbar-width:thin;overscroll-behavior:contain}
.journey-share-dialog header{background:linear-gradient(120deg,var(--blue-soft),var(--paper));align-items:center}
.journey-share-dialog header h2{font-size:clamp(23px,5vw,30px);letter-spacing:-.035em}
.journey-share-body>p:first-child{margin-top:0}
.share-welcome{text-align:center;padding:30px 24px}
.share-welcome>svg,.share-success-icon>svg{width:32px;height:32px;color:var(--blue)}
.share-how{display:grid;gap:10px;margin:20px 0;color:var(--muted);font-size:13px}
.share-how span{display:flex;align-items:center;gap:10px}
.share-how svg{width:20px;height:20px;color:var(--blue)}
.share-consent{padding:16px;background:var(--blue-soft);border:1px solid var(--line);border-radius:16px;font-size:13px}
.share-consent input{margin:2px 0 0}
.share-success-icon{display:grid;place-items:center;width:54px;height:54px;border:1px solid var(--line);background:var(--paper);border-radius:18px}
.share-actions{display:grid;grid-template-columns:1fr;gap:10px}
.journey-share-dialog .share-whatsapp{background:var(--blue);border-color:var(--blue);color:#fff;min-height:48px}
.share-link-details{font-size:12px;margin:16px 0}
.share-link-details summary{min-height:44px;cursor:pointer;display:flex;align-items:center;text-decoration:underline;text-underline-offset:3px;color:var(--muted)}
.share-link-details input{font-size:12px}
.journey-share-dialog .share-stop{width:100%;background:transparent}
.shared-trip-card{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--paper)}
.shared-trip-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px}
.shared-trip-heading>div:first-child{min-width:0}
.shared-line-pill{display:inline-block;background:var(--blue);color:white;border-radius:9px;padding:5px 10px;font-size:16px;font-weight:700}
.shared-trip-heading h3{font-size:12px;color:var(--muted);font-weight:500;line-height:1.5;margin:8px 0 0;overflow-wrap:anywhere}
.shared-trip-eta{text-align:right;flex:0 0 auto;max-width:47%}
.shared-trip-eta strong{font:700 clamp(21px,5vw,30px)/1.1 'Bricolage Grotesque',sans-serif;color:var(--blue)}
.shared-trip-eta small{display:block;font-size:10px;color:var(--muted);line-height:1.5;margin-top:5px}
.shared-map-wrap{position:relative}
.shared-map-wrap .shared-trip-map{height:clamp(240px,39dvh,400px);border-radius:0}
.journey-share-dialog .shared-map-fit{position:absolute;left:12px;bottom:12px;width:44px;height:44px;padding:10px;background:var(--paper);box-shadow:0 3px 15px #102d3f25;border-radius:50%}
.shared-map-key{display:flex;flex-wrap:wrap;gap:16px;padding:12px 20px;border-bottom:1px solid var(--line);font-size:10px;color:var(--muted)}
.shared-map-key span{display:flex;align-items:center;gap:6px}
.shared-map-key i{width:9px;height:9px;border-radius:50%;background:#0b54be;border:1px solid #fff}
.shared-map-key .share-bus-key{background:#087e76;border-radius:3px}
.shared-map-key .share-stop-key{background:#df7446}
.shared-trip-details{padding:16px 20px}
.shared-live-state{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:600;color:var(--teal);margin-bottom:16px}
.shared-live-state>i{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px #0b8e7b15}
.shared-live-state.is-paused{color:var(--muted)}
.shared-step{display:flex;align-items:center;gap:12px;margin-top:16px}
.shared-step>i{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:11px;background:var(--blue-soft);color:var(--blue)}
.shared-step svg{width:19px;height:19px}
.shared-step small{display:block;font-size:9px;font-weight:700;letter-spacing:.1em;color:var(--muted)}
.shared-step strong{display:block;margin-top:3px;font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.shared-progress{margin-top:20px}
.shared-progress progress{width:100%;height:6px;border:0;border-radius:5px;overflow:hidden;accent-color:var(--blue)}
.shared-progress progress::-webkit-progress-bar{background:var(--line)}
.shared-progress progress::-webkit-progress-value{background:var(--blue);border-radius:5px}
.shared-progress small{display:block;margin-top:6px;color:var(--muted);font-size:11px}
.shared-trip-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0}
.shared-trip-footer>p{font-size:11px;color:var(--muted);line-height:1.6;margin:0}
.shared-trip-footer button{flex-shrink:0;font-size:11px}
.journey-share-dialog [data-share-status]:empty{display:none}
.journey-share-dialog .maplibregl-ctrl-attrib a{display:inline;min-height:0;padding:0;border:0;border-radius:0;background:none;color:inherit;font:inherit;text-decoration:none}
.journey-share-dialog .maplibregl-ctrl-group button{display:block;width:32px;height:32px;min-height:0;padding:0;border:0;border-radius:0;background:transparent}
.journey-share-dialog .maplibregl-ctrl-attrib-button{width:24px;height:24px;min-height:0;padding:0;border:0;border-radius:50%}
:root[data-theme=dark] .shared-trip-eta strong,:root[data-theme=dark] .share-how svg,:root[data-theme=dark] .share-welcome>svg,:root[data-theme=dark] .share-success-icon>svg{color:var(--night-link)}
:root[data-theme=dark] .shared-step>i{background:var(--night-selected);color:var(--night-link)}
.travel-sheet .travel-share-action{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:100%;gap:8px;min-height:44px;padding:8px 12px;margin:8px 0 0;border:1px solid var(--travel-line);border-radius:13px;background:var(--travel-paper);color:var(--travel-ink);font:600 12px 'DM Sans',sans-serif}
.travel-share-action svg{width:18px;height:18px}
.travel-share-action:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.travel-sheet[data-stage=compact] .travel-share-action{display:none}
body.travel-active .journey-share-indicator{top:calc(78px + env(safe-area-inset-top));bottom:auto;left:12px;transform:none;max-width:calc(100% - 24px)}
@media(max-width:520px){.shared-trip-heading{padding:16px}.shared-map-key{padding:12px 16px;gap:12px}.shared-trip-details{padding:14px 16px}.share-welcome{padding:24px 16px}.journey-share-body{padding:16px}.shared-trip-eta strong{font-size:24px}.journey-share-dialog{border-radius:22px}.shared-trip-footer{align-items:flex-start}}