/* Colours, type sizes and control shapes follow the CRM's own, so the page sits naturally inside it. */
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/inter-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --gray-25:#fcfdfd;--gray-50:#f9fafb;--gray-100:#f2f4f7;--gray-200:#eaecf0;--gray-300:#d0d5dd;--gray-400:#98a2b3;--gray-500:#667085;--gray-600:#475467;--gray-700:#344054;--gray-800:#1d2939;--gray-900:#101828;
  --primary-25:#f5f8ff;--primary-50:#eff4ff;--primary-100:#d1e0ff;--primary-200:#b2ccff;--primary-400:#528bff;--primary-600:#155eef;--primary-700:#004eeb;--primary-800:#0040c1;
  --success-25:#f6fef9;--success-50:#ecfdf3;--success-100:#d1fadf;--success-200:#a6f4c5;--success-700:#027a48;--success-800:#05603a;
  --warning-50:#fffaeb;--warning-100:#fef0c7;--warning-200:#fedf89;--warning-400:#fdb022;--warning-800:#93370d;
  --error-50:#fef3f2;--error-100:#fee4e2;--error-200:#ffcdca;--error-700:#b42318;
  --shadow-xs:0 1px 2px rgba(16,24,40,.05);
  --shadow-md:0 1px 3px rgba(16,24,40,.1),0 1px 2px rgba(16,24,40,.06);
  --shadow-lg:0 12px 16px -4px rgba(16,24,40,.08),0 4px 6px -2px rgba(16,24,40,.03);
  --map-bg:#f8f9fb;
  --ring:0 0 0 4px var(--primary-100);
  --font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  --bar-height:56px;--answer:352px;--days:300px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--gray-700);font:13px/18px var(--font);-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:default}
:focus-visible{outline:2px solid var(--primary-600);outline-offset:1px}
h2,h3,p,ol,ul{margin:0;padding:0}
ol,ul{list-style:none}
.app{height:100vh;display:flex;flex-direction:column}
.muted{color:var(--gray-500)}
.section-title{color:var(--gray-500);font-size:11px;line-height:16px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}

/* controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 12px;border:1px solid var(--gray-300);border-radius:8px;background:#fff;color:var(--gray-700);font-weight:500;box-shadow:var(--shadow-xs);transition:background .12s;white-space:nowrap}
.btn:hover:not(:disabled){background:var(--gray-50)}
.btn:disabled{color:var(--gray-400);box-shadow:none}
.btn:disabled svg{opacity:.55}
.btn.primary{border-color:var(--primary-600);background:var(--primary-600);color:#fff}
.btn.primary:hover:not(:disabled){border-color:var(--primary-700);background:var(--primary-700)}
.btn.icon{width:36px;padding:0}
.btn-group{display:inline-flex;box-shadow:var(--shadow-xs);border-radius:8px}
.btn-group .btn{box-shadow:none}
.btn-group .btn:first-child{border-radius:8px 0 0 8px}
.btn-group .btn:last-child{margin-left:-1px;border-radius:0 8px 8px 0}
.link{padding:0;border:0;background:none;color:var(--primary-700);font-weight:500;text-align:left}
.link:hover{color:var(--primary-800);text-decoration:underline}
.field label{display:block;margin-bottom:6px;color:var(--gray-700);font-weight:500}
.field input,.select select{width:100%;height:36px;padding:0 10px;border:1px solid var(--gray-300);border-radius:8px;background:#fff;color:var(--gray-900);box-shadow:var(--shadow-xs);outline:0;transition:border-color .12s,box-shadow .12s}
.field-hint{margin-top:6px;color:var(--gray-500);font-size:12px;line-height:17px}
.field input:focus,.select select:focus{border-color:var(--primary-400);box-shadow:var(--shadow-xs),var(--ring)}
.select{position:relative;display:block}
.select select{appearance:none;-webkit-appearance:none;padding-right:32px;cursor:pointer}
.select .chevron{position:absolute;right:10px;top:10px;color:var(--gray-500);pointer-events:none}
.segmented{display:inline-flex;padding:2px;border-radius:8px;background:var(--gray-100)}
.segmented button{height:32px;padding:0 12px;border:0;border-radius:6px;background:none;color:var(--gray-600);font-weight:500;transition:background .12s,color .12s}
.segmented button:hover{color:var(--gray-900)}
.segmented button.on{background:#fff;color:var(--gray-900);box-shadow:var(--shadow-md)}
.pill{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border-radius:99px;font-size:12px;line-height:18px;font-weight:500;white-space:nowrap}
.pill.ok{background:var(--success-50);color:var(--success-700)}
.pill.best{padding:3px 8px;background:var(--success-700);color:#fff}
.pill.mid{background:var(--warning-50);color:var(--warning-800)}
.pill.no{background:var(--error-50);color:var(--error-700)}
.pill.blocked{background:var(--gray-100);color:var(--gray-700)}

/* route colours, the same on avatars and on the map */
.c0{--c:#444ce7}.c1{--c:#c11dd8}.c2{--c:#e31b54}.c3{--c:#0e9384}.c4{--c:#e04f16}.c5{--c:#4f7a21}.cn{--c:#667085}
.avatar{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;font-size:10px;line-height:1;font-weight:600}
.avatar.big{width:32px;height:32px;font-size:12px}
.avatar.a0{background:#e0e7ff;color:#3538cd}
.avatar.a1{background:#fbe8ff;color:#9f1ab1}
.avatar.a2{background:#ffe4e8;color:#c01048}
.avatar.a3{background:#ccfbef;color:#107569}
.avatar.a4{background:#ffead5;color:#c4320a}
.avatar.a5{background:#e6f4d7;color:#4f7a21}
.avatar.more{background:var(--gray-100);color:var(--gray-600)}
.avatars{display:inline-flex}
.avatars .avatar{box-shadow:0 0 0 2px #fff}
.avatars .avatar{font-size:9.5px}
.avatars .avatar+.avatar{margin-left:-3px}
.chips{display:flex;align-items:center;gap:4px}
.chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border:0;border-radius:99px;background:none;color:var(--gray-600);font-weight:500;transition:background .12s}
.chip:has(.avatar){padding:0 4px}
.chip:hover{background:var(--gray-100)}
.chip.active{background:var(--primary-50);color:var(--primary-700);box-shadow:inset 0 0 0 1px var(--primary-200)}
.chip.active:has(.avatar){padding-right:10px}
.one-route{display:inline-flex;align-items:center;height:32px;padding:0 10px;border-radius:99px;background:var(--gray-100);color:var(--gray-700);font-size:12px;font-weight:500;white-space:nowrap}
#rep-pick .select{min-width:180px}

/* top bar */
.bar{position:relative;z-index:30;flex:none;height:var(--bar-height);display:flex;align-items:center;gap:12px;padding:0 12px 0 16px;background:#fff;border-bottom:1px solid var(--gray-200)}
.brand{display:flex;align-items:center;gap:10px;flex:none;width:calc(var(--answer) - 28px);min-width:0}
.brand-mark{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:8px;background:var(--gray-900);color:#fff}
.brand b{color:var(--gray-900);font-size:14px;line-height:20px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search{position:relative;flex:1;max-width:520px;min-width:0}
.search>svg{position:absolute;left:12px;top:12px;color:var(--gray-500);pointer-events:none}
#place{width:100%;height:40px;padding:0 36px;border:1px solid var(--gray-300);border-radius:8px;background:#fff;color:var(--gray-900);font-size:14px;font-weight:500;box-shadow:var(--shadow-xs);outline:0;transition:border-color .12s,box-shadow .12s}
#place::placeholder{color:var(--gray-500);font-weight:400}
#place:focus{border-color:var(--primary-400);box-shadow:var(--shadow-xs),var(--ring)}
.search-key{position:absolute;right:10px;top:10px;min-width:20px;height:20px;display:grid;place-items:center;border:1px solid var(--gray-200);border-radius:5px;background:var(--gray-50);color:var(--gray-500);font:500 11px/1 var(--font);pointer-events:none}
#place:focus~.search-key,#place:not(:placeholder-shown)~.search-key{display:none}
.clear{position:absolute;right:6px;top:6px;width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:6px;background:none;color:var(--gray-500)}
.clear:hover{background:var(--gray-100);color:var(--gray-900)}
.suggestions{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:40;padding:4px;background:#fff;border:1px solid var(--gray-200);border-radius:8px;box-shadow:var(--shadow-lg);max-height:360px;overflow:auto}
.suggestion{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:9px 10px;border-radius:6px;cursor:pointer}
.suggestion:hover,.suggestion.active{background:var(--gray-100)}
.suggestion b{color:var(--gray-900);font-weight:600}
.suggestion span{color:var(--gray-500);font-size:12px}
.suggestion-msg{padding:10px;color:var(--gray-600)}
.bar-side{display:flex;align-items:center;gap:8px;margin-left:auto}
.menu{position:relative}
.popover{position:absolute;top:calc(100% + 8px);right:0;z-index:40;width:280px;display:flex;flex-direction:column;gap:14px;padding:16px;background:#fff;border:1px solid var(--gray-200);border-radius:8px;box-shadow:var(--shadow-lg)}

/* loading, errors, first use */
.state{display:flex;flex-direction:column;align-items:center;gap:20px;margin:15vh auto 0;padding:24px;width:min(520px,calc(100% - 32px));color:var(--gray-600);text-align:center}
.state.error{border:1px solid var(--gray-200);border-radius:12px;color:var(--gray-700)}
.state.error .skeleton{display:none}
.skeleton{display:flex;flex-direction:column;gap:10px;width:100%}
.skeleton i{height:40px;border-radius:8px;background:linear-gradient(90deg,var(--gray-100),var(--gray-50),var(--gray-100));background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.skeleton i:nth-child(2){height:88px}
@keyframes shimmer{to{background-position:-200% 0}}
.setup{width:calc(100% - 32px);max-width:480px;margin:10vh auto 0}
.setup h2,.dialog h2{margin-bottom:4px;color:var(--gray-900);font-size:18px;line-height:28px;font-weight:600;letter-spacing:-.01em}
.setup>p,.dialog>p{color:var(--gray-600);font-size:14px;line-height:20px}
.choices{display:flex;flex-direction:column;gap:8px;margin:20px 0 16px}
.choice{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--gray-300);border-radius:8px;color:var(--gray-900);font-size:14px;font-weight:500;cursor:pointer;transition:background .12s,border-color .12s}
.choice:hover{background:var(--gray-50)}
.choice:has(input:checked){border-color:var(--primary-600);background:var(--primary-25);box-shadow:inset 0 0 0 1px var(--primary-600)}
.choice input{flex:none;width:16px;height:16px;margin:0;accent-color:var(--primary-600)}
.choice-text{min-width:0}
.advanced summary{display:flex;align-items:center;gap:6px;width:max-content;color:var(--gray-600);font-weight:500;cursor:pointer;list-style:none}
.advanced summary::-webkit-details-marker{display:none}
.advanced summary .chevron{transform:rotate(-90deg);transition:transform .12s}
.advanced[open] summary .chevron{transform:none}
.fields{display:flex;flex-direction:column;gap:14px;margin-top:14px}
.form-msg:not(:empty){margin-top:12px;color:var(--error-700);font-weight:500}
.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
.dialog{width:min(600px,calc(100vw - 32px));max-height:calc(100vh - 48px);padding:24px;border:0;border-radius:12px;box-shadow:var(--shadow-lg);color:var(--gray-700)}
.dialog::backdrop{background:rgba(16,24,40,.6)}
.dialog table{width:100%;margin:16px 0;border-collapse:collapse}
.dialog td{padding:10px 12px 10px 0;border-top:1px solid var(--gray-200);vertical-align:top}
.dialog td:first-child{width:1%;white-space:nowrap}
.dialog .small{margin-top:8px;color:var(--gray-600)}

/* the three panes */
.shell{flex:1;min-height:0;display:grid;grid-template-columns:var(--answer) minmax(0,1fr) var(--days)}
.shell.is-week{grid-template-columns:var(--answer) minmax(0,1fr)}
.shell.is-week .map-pane,.shell.is-week .days{display:none}
.pane{min-width:0;min-height:0;overflow:auto}
.answer{display:flex;flex-direction:column;border-right:1px solid var(--gray-200)}
.days{padding:16px;border-left:1px solid var(--gray-200)}
.stale{margin:12px 16px 0;padding:8px 12px;border-radius:8px;background:var(--error-50);color:var(--error-700);font-weight:500}

/* the answer */
.hero{padding:20px 20px 18px}
.hero-in{animation:rise .2s ease-out}
@keyframes rise{from{opacity:0;transform:translateY(3px)}}
.hero-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:22px}
.overline{display:inline-flex;align-items:center;gap:6px;color:var(--gray-900);font-size:12px;line-height:17px;font-weight:600}
.overline svg{color:var(--success-700)}
.hero-time{margin-top:14px;color:var(--gray-900);font-size:48px;line-height:52px;font-weight:600;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.hero-day{margin-top:2px;color:var(--gray-600);font-size:15px;line-height:22px}
.hero-day::first-letter{text-transform:uppercase}
.hero-who{display:flex;align-items:center;gap:10px;margin-top:16px}
.hero-name{display:block;color:var(--gray-900);font-size:14px;line-height:20px;font-weight:500}
.hero-also{display:block;color:var(--gray-500)}
.hero-why{display:flex;gap:8px;margin-top:14px;color:var(--gray-800);font-size:14px;line-height:20px}
.hero-why svg{flex:none;margin-top:3px}
.hero-why.ok svg{color:var(--success-700)}
.hero-why.mid svg{color:#b54708}
.hero-why.no svg{color:var(--error-700)}
.hero-why+.hero-also{margin-top:6px}
.who-title{margin-top:14px;color:var(--gray-500);font-size:12px;line-height:17px;font-weight:500}
.who-rows{margin:4px 0 0;padding:0;list-style:none}
.who-rows li{display:flex;align-items:center;gap:8px;min-height:30px}
.who-name{min-width:0;overflow:hidden;color:var(--gray-800);font-size:13px;line-height:18px;text-overflow:ellipsis;white-space:nowrap}
.who-fit{flex:none;margin-left:auto;color:var(--success-700);font-size:12px;font-variant-numeric:tabular-nums}
.who-fit.mid{color:#b54708}
.hero .section-title{margin-top:20px;padding-top:16px;border-top:1px solid var(--gray-200)}
.route{display:flex;flex-direction:column;margin-top:12px}
.route.wide-times .stop{grid-template-columns:22px 62px minmax(0,1fr)}
.stop{position:relative;display:grid;grid-template-columns:22px 44px minmax(0,1fr);gap:8px;align-items:start;padding-bottom:12px}
.stop::after{content:"";position:absolute;left:10px;top:24px;bottom:2px;width:2px;background:var(--gray-200)}
.route>li:last-child::after{display:none}
.route>li:last-child{padding-bottom:0}
.stop-n{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--c,var(--gray-500));color:#fff;font-size:11px;line-height:1;font-weight:600}
.stop time{padding-top:2px;color:var(--gray-500);font-variant-numeric:tabular-nums;white-space:nowrap}
.stop div{min-width:0;padding-top:2px}
.stop b{display:block;color:var(--gray-800);font-weight:500;overflow-wrap:anywhere}
.stop span:not(.stop-n){display:block;color:var(--gray-500);font-size:12px;line-height:17px}
.stop b::first-letter,.stop span::first-letter{text-transform:uppercase}
.stop.prospect .stop-n{background:var(--primary-600);box-shadow:0 0 0 3px var(--primary-100)}
.stop.prospect .stop-n::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff}
.stop.prospect time,.stop.prospect b{color:var(--primary-700);font-weight:600}
.stop.prospect span:not(.stop-n){color:var(--gray-600)}
.leg{position:relative;display:flex;align-items:center;gap:6px;padding:0 0 12px 30px;color:var(--gray-500);font-size:12px;line-height:17px}
.leg::before{content:"";position:absolute;left:10px;top:-2px;bottom:2px;width:2px;background:repeating-linear-gradient(var(--primary-400) 0 3px,transparent 3px 6px)}
.leg svg{flex:none}
.others{padding:0 20px 16px}
.hero:not([hidden])+.others:not(:empty){padding-top:16px;border-top:1px solid var(--gray-200)}
.others h2{padding-top:20px;color:var(--gray-900);font-size:15px;line-height:22px;font-weight:600}
.others h2+.muted{margin-top:6px}
.cards-title{color:var(--gray-500);font-size:11px;line-height:16px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.cards+.cards-title{margin-top:14px}
.cards{display:flex;flex-direction:column;margin:6px -8px 0}
.card{display:flex;flex-direction:column;gap:1px;width:100%;padding:7px 8px;border:0;border-radius:8px;background:none;text-align:left;transition:background .12s}
.card:hover{background:var(--gray-50)}
.card-top{display:flex;align-items:center;gap:8px;min-width:0;min-height:24px}
.card-time{color:var(--gray-900);font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.card-day{color:var(--gray-600);white-space:nowrap}
.card-day::first-letter{text-transform:uppercase}
.card-faces{display:inline-flex;margin-left:auto}
.card-why{color:var(--gray-500);font-size:12px;line-height:17px}
.start{padding-top:24px}
.start h2{padding:0;color:var(--gray-900);font-size:22px;line-height:28px;font-weight:600;letter-spacing:-.02em}
.start>p{margin-top:6px;color:var(--gray-600);font-size:14px;line-height:20px}
.start .section-title{margin-top:24px}
.start-routes{display:flex;flex-direction:column;gap:12px;margin:12px 0 20px}
.start-route{display:flex;gap:10px;align-items:flex-start}
.start-route b{display:block;color:var(--gray-900);font-weight:500}
.start-route span:not(.avatar){display:block;color:var(--gray-500);font-size:12px;line-height:17px}
.start .muted{margin:12px 0 20px}
#sources{margin-top:auto;padding:12px 20px 14px;border-top:1px solid var(--gray-200)}
.sources-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sources-head .link{font-size:12px;line-height:16px}
.sources ul{max-height:132px;margin:8px 0 0;padding:0;overflow:auto;list-style:none}
.sources li+li{margin-top:8px}
.source-name{display:block;color:var(--gray-900);font-size:13px;line-height:18px;font-weight:500;overflow-wrap:anywhere}
.source-who{display:block;color:var(--gray-500);font-size:12px;line-height:17px;font-weight:400}
#notes:not(:empty){padding:12px 20px 16px;border-top:1px solid var(--gray-200)}
.notes{color:var(--gray-600);font-size:12px;line-height:17px}
.notes summary{display:flex;align-items:flex-start;gap:8px;cursor:pointer;list-style:none}
.notes summary::-webkit-details-marker{display:none}
.notes summary svg{flex:none;width:14px;height:14px;margin-top:1px}
.notes summary>svg:first-child{color:#b54708}
.notes summary .chevron{margin-left:auto;transition:transform .12s}
.notes[open] summary .chevron{transform:rotate(180deg)}
.note-first{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.notes[open] .note-first{display:block}
.notes[open] .note-more{display:none}
.note-more{flex:none;padding:0 6px;border-radius:99px;background:var(--gray-100);font-weight:600}
.note-text{margin-top:8px;padding-left:22px}

/* the map */
.map-pane{position:relative;overflow:hidden;background:var(--map-bg)}
#map-gl{position:absolute;inset:0}
#map-dots{position:absolute;inset:0}
.map-layer{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.map-layer svg{display:block}
.map-stop{pointer-events:auto}
.moving .map-pulse{display:none}
.maplibregl-ctrl-attrib{background:rgba(255,255,255,.75)!important;font:10px/14px var(--font)!important}
.maplibregl-ctrl-group{border-radius:8px!important;box-shadow:var(--shadow-md)!important}
.map-casing{stroke:#fff;stroke-width:6;stroke-linecap:round;opacity:.9}
.map-empty{position:absolute;inset:0;display:grid;place-items:center;padding:24px;color:var(--gray-500);text-align:center}
.map-route{stroke:var(--c);stroke-width:3;stroke-linecap:round}
.map-route.faint{stroke-width:2;opacity:.35}
.map-leg{stroke:var(--primary-600);stroke-width:2;stroke-dasharray:5 5;stroke-linecap:round}
.map-faint{fill:var(--c);opacity:.35}
.map-stop circle{fill:var(--c);stroke:#fff;stroke-width:2}
.map-stop text{fill:#fff;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.map-chip{filter:drop-shadow(0 1px 2px rgba(16,24,40,.12))}
.map-chip rect{fill:#fff;stroke:var(--gray-200)}
.map-chip text{fill:var(--gray-800);font-size:11px;font-weight:600}
.map-pulse{fill:var(--primary-400);transform-box:fill-box;transform-origin:center;animation:pulse 2.6s ease-out infinite}
@keyframes pulse{from{opacity:.45;transform:scale(.6)}to{opacity:0;transform:scale(1.9)}}
.map-halo{fill:var(--primary-600);opacity:.14}
.map-pin{fill:var(--primary-600);stroke:#fff;stroke-width:2.5}
.map-label,.map-town{paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round}
.map-label{fill:var(--gray-800);font-size:12px;font-weight:500}
.map-label.me{fill:var(--primary-700);font-size:13px;font-weight:600}
.map-town{fill:var(--gray-500);font-size:11px}
.map-town.big{fill:var(--gray-600);font-size:12px;font-weight:500}

/* days and times */
.days-head{margin-bottom:10px}
.days-head b{display:block;color:var(--gray-900);font-size:14px;line-height:20px;font-weight:600}
.days-head b::first-letter{text-transform:uppercase}
.days-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.days-grid>span:not(.tile){padding-bottom:4px;color:var(--gray-500);font-size:11px;line-height:16px;text-align:center;text-transform:uppercase}
.tile{position:relative;display:grid;place-items:center;aspect-ratio:1;padding:0;border:0;border-radius:8px;background:var(--gray-100);color:var(--gray-900);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;transition:background .12s}
.tile:hover{background:var(--gray-200)}
.tile.off{background:none;color:var(--gray-400);font-weight:400}
.tile i{position:absolute;bottom:4px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%}
.tile.good i{background:var(--success-700)}
.tile.empty i{background:var(--success-200)}
.tile.tight i{background:var(--warning-400)}
.tile.visits i{background:var(--gray-400)}
.tile.none{background:none;color:var(--gray-500);box-shadow:inset 0 0 0 1px var(--gray-200)}
.tile.today{font-weight:700;box-shadow:inset 0 0 0 1.5px var(--gray-400)}
.tile.selected{background:var(--primary-600);color:#fff;box-shadow:none}
.tile.selected i{background:#fff}
.days-key{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:10px;color:var(--gray-500);font-size:11px;line-height:16px}
.days-key span{display:inline-flex;align-items:center;gap:5px}
.tile-dot{width:6px;height:6px;border-radius:50%}
.tile-dot.good{background:var(--success-700)}
.tile-dot.empty{background:var(--success-200)}
.tile-dot.tight{background:var(--warning-400)}
#times{margin-top:18px;padding-top:16px;border-top:1px solid var(--gray-200)}
#times .section-title::first-letter{text-transform:uppercase}
#times .muted{margin-top:10px}
.times{display:flex;flex-direction:column;gap:4px;margin-top:10px}
.time{display:flex;align-items:center;gap:8px;width:100%;min-height:38px;padding:0 10px;border:1px solid var(--gray-200);border-radius:8px;background:#fff;color:var(--gray-900);text-align:left;transition:background .12s,border-color .12s}
.time:hover{border-color:var(--gray-300);background:var(--gray-50)}
.time b{display:inline-flex;align-items:center;gap:4px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.time .star{display:inline-flex;color:var(--success-700)}
.time .star svg{width:12px;height:12px}
.time-dot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--success-700)}
.time.empty .time-dot{background:var(--success-200)}
.time.mid .time-dot{background:var(--warning-400)}
.time.no{border-color:transparent;background:none;color:var(--gray-500)}
.time.no b{font-weight:400}
.time.no .time-dot{background:var(--error-200)}
.time-who{display:inline-flex;margin-left:auto}
.time-hint{flex:none;min-width:38px;color:var(--gray-500);font-size:12px;text-align:right}
.time.picked{border-color:var(--primary-600);background:var(--primary-50);box-shadow:inset 0 0 0 1px var(--primary-600)}
.time.picked b{color:var(--primary-700)}
.time-visit{display:flex;align-items:center;gap:8px;min-height:34px;padding:0 10px;border-radius:8px;background:var(--gray-50);color:var(--gray-700)}
.time-visit b{font-weight:600;font-variant-numeric:tabular-nums}
.time-visit span:not(.avatars):not(.avatar){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.time-visit .avatars{margin-left:auto}

/* the week, in place of the map and the list */
.week{display:flex;flex-direction:column;overflow:hidden}
.week-head{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:10px 16px;border-bottom:1px solid var(--gray-200)}
.pager{display:flex;align-items:center;gap:8px;min-width:0}
.range{margin-left:6px;color:var(--gray-900);font-size:14px;line-height:20px;font-weight:600}
.range::first-letter{text-transform:uppercase}
.legend{display:flex;flex:1;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:4px 14px;color:var(--gray-600);font-size:12px;line-height:17px}
.legend>span{display:inline-flex;align-items:center;gap:6px}
.legend .link{font-size:12px;white-space:nowrap}
.swatch{width:10px;height:10px;border-radius:3px}
.swatch.ok{background:var(--success-200)}
.swatch.mid{background:var(--warning-100);box-shadow:inset 2px 0 0 var(--warning-400)}
.swatch.no{background:var(--error-100)}
.swatch.blocked,.cell.blocked{background:repeating-linear-gradient(135deg,var(--gray-100),var(--gray-100) 4px,var(--gray-50) 4px,var(--gray-50) 8px)}
.calendar{flex:1;min-height:0;overflow:auto}
.grid{display:grid;grid-template-columns:64px repeat(var(--days,6),minmax(0,1fr))}
.day-head{position:sticky;top:0;z-index:10;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;background:#fff;border-bottom:1px solid var(--gray-200)}
.day-head span{color:var(--gray-500);font-size:11px;line-height:16px;font-weight:500}
.day-head span::first-letter{text-transform:uppercase}
.day-head b{display:grid;place-items:center;min-width:28px;height:28px;border-radius:50%;color:var(--gray-900);font-size:15px;line-height:1;font-weight:600}
.day-head.today span{color:var(--primary-700)}
.day-head.today b{background:var(--primary-600);color:#fff}
.day-head.jump,.cell.jump{box-shadow:inset 1px 0 0 var(--gray-300)}
.row-label{padding:0 8px;color:var(--gray-500);font-size:11px;line-height:16px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.row-label.hour{border-top:1px solid var(--gray-100)}
.cell{display:flex;flex-direction:column;min-width:0;min-height:28px;padding:0 3px;border-left:1px solid var(--gray-100);background:#fff}
.cell.hour{border-top:1px solid var(--gray-100)}
.cell.off{background:var(--gray-25)}
.cell.busy{background:var(--gray-100)}
.slot{position:relative;flex:1;display:flex;align-items:center;gap:4px;width:100%;min-height:28px;padding:0 6px;border:0;font-size:12px;line-height:17px;font-weight:500;font-variant-numeric:tabular-nums;text-align:left;white-space:nowrap;overflow:hidden;transition:background .1s}
.slot.first{margin-top:2px;border-top-left-radius:6px;border-top-right-radius:6px}
.slot.last{margin-bottom:2px;border-bottom-left-radius:6px;border-bottom-right-radius:6px}
.slot-time{display:inline-flex;align-items:center;gap:3px;flex:none}
.slot-faces{flex:none;display:inline-flex;margin-left:auto}
.slot-faces+.slot-hint{margin-left:4px}
.slot .avatar{width:18px;height:18px;font-size:8.5px}
.slot .avatars .avatar+.avatar{margin-left:1px}
.slot-hint{flex:none;margin-left:auto;font-size:11px;font-weight:400}
.quiet{opacity:0;transition:opacity .1s}
.slot:hover .quiet,.slot:focus-visible .quiet{opacity:1}
.star{display:inline-flex}
.star svg{width:12px;height:12px}
.slot.ok{background:var(--success-100);color:var(--success-800)}
.slot.ok:hover{background:var(--success-200)}
.slot.empty{background:var(--success-25);color:var(--success-700);font-weight:400}
.slot.empty:hover{background:var(--success-50)}
.slot.best{background:var(--success-700);color:#fff;font-weight:600;box-shadow:var(--shadow-md)}
.slot.best:hover{background:var(--success-800)}
.slot.mid{background:var(--warning-100);color:var(--warning-800);box-shadow:inset 3px 0 0 var(--warning-400)}
.slot.mid:hover{background:var(--warning-200)}
.slot.no{background:var(--error-50);color:var(--error-700);font-weight:400}
.slot.no:hover{background:var(--error-100)}
.slot.picked{z-index:2;outline:2px solid var(--primary-600);outline-offset:0;border-radius:6px}
.visit{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0;min-height:26px;margin:2px 0;padding:2px 8px;border-radius:6px;background:var(--primary-50);box-shadow:inset 3px 0 0 var(--primary-600);color:var(--primary-800);font-size:12px;line-height:16px}
.visit.more{min-height:10px;margin-top:0;padding:0;border-top-left-radius:0;border-top-right-radius:0}
.visit.continues{margin-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}
.visit.unlocated{background:var(--gray-100);box-shadow:inset 3px 0 0 var(--gray-400);color:var(--gray-700)}
.visit-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.visit-line b{font-weight:600;font-variant-numeric:tabular-nums}
.visit-who{color:var(--gray-600);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.tip{position:fixed;z-index:60;max-width:300px;padding:6px 10px;border-radius:6px;background:var(--gray-900);color:#fff;font-size:12px;line-height:17px;font-weight:500;box-shadow:var(--shadow-lg);pointer-events:none}
.foot{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:2px 14px;min-height:28px;padding:4px 16px;border-top:1px solid var(--gray-200);color:var(--gray-500);font-size:11px;line-height:16px}
.foot a{color:inherit;text-decoration:none}
.foot a:hover{color:var(--gray-700);text-decoration:underline}
.foot-status{margin-right:auto}
.bar[hidden]~.foot,.state:not([hidden])~.foot,.setup:not([hidden])~.foot{margin-top:auto}

@media(max-width:1240px){
  :root{--answer:312px;--days:272px}
  .brand b{display:none}
  .brand{width:auto}
}
@media(max-width:960px){
  .app{height:auto;min-height:100vh}
  .bar{position:sticky;top:0;flex-wrap:wrap;height:auto;padding:8px 12px}
  .search{flex:1 1 100%;max-width:none;order:-1}
  .brand,#view-toggle{display:none}
  .bar-side{width:100%;justify-content:space-between}
  #place{height:44px;font-size:16px}
  .search>svg{top:14px}
  .clear{top:8px}
  .search-key{display:none}
  .shell,.shell.is-week{display:flex;flex-direction:column;flex:none}
  .pane{overflow:visible}
  .answer{border-right:0}
  .map-pane{flex:none;height:280px;border-block:1px solid var(--gray-200);overflow:hidden}
  .days{border-left:0}
  .time{min-height:44px}
  .hero-time{font-size:44px;line-height:48px}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}

/* legal pages and server notices */
.legal{max-width:760px;margin:0 auto;padding:32px 20px 64px;font-size:14px;line-height:1.6}
.legal h1{font-size:24px;line-height:32px;color:var(--gray-900);font-weight:600;margin:0 0 6px}
.legal h2{font-size:16px;line-height:24px;color:var(--gray-900);font-weight:600;margin:28px 0 8px}
.legal p{margin:0 0 10px}
.legal ul{padding-left:20px}
.legal .date{color:var(--gray-500);font-size:13px;margin:0 0 20px}
.legal table{border-collapse:collapse;width:100%;font-size:13.5px;margin:10px 0}
.legal th,.legal td{border:1px solid var(--gray-200);padding:7px 9px;text-align:left;vertical-align:top}
.legal th{background:var(--gray-50)}
.notice{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}
.notice main{background:#fff;border-radius:12px;box-shadow:var(--shadow-md);padding:32px;max-width:460px}
.notice h1{font-size:18px;line-height:28px;font-weight:600;margin:0 0 8px;color:var(--gray-900)}
.notice p{margin:0;color:var(--gray-700)}