@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#24262b;background:#fff;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #a696ff;outline-offset:4px}header{height:94px;display:flex;align-items:center;padding:0 42px;gap:30px;border-bottom:1px solid #eaeaea}.brand{text-decoration:none;color:#25252b;font-family:Manrope,sans-serif;font-size:29px;font-weight:800;letter-spacing:-1.4px;display:flex;align-items:center}.period{color:#6350dd}.logo{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin-right:10px;border-radius:12px;background:#6250df;color:#fff;font-size:30px;letter-spacing:-4px;padding-right:4px}.logo span{font-size:21px}.header-note{font-size:14px;color:#7b7b83;flex:1}.plain{background:none;border:0;font-size:14px}.plain span{margin-left:10px}.demo{font-size:11px;letter-spacing:1.2px;background:#f0edff;color:#6354aa;padding:9px 12px;border-radius:6px}main{display:grid;grid-template-columns:465px 1fr;min-height:calc(100vh - 94px)}.panel{padding:36px 36px 20px;z-index:1;background:white;box-shadow:7px 0 24px #27232a05}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:#7967c5}h1{font-family:Manrope,sans-serif;font-size:38px;line-height:1.18;letter-spacing:-1.6px;margin:15px 0}.intro{font-size:14px;line-height:1.65;color:#767780;margin:0 0 25px}.purpose{display:flex;align-items:center;gap:12px;border:1px solid #c3b8f8;background:#f6f4ff;border-radius:12px;padding:14px;margin-bottom:20px}.purpose>span:last-child{margin-left:auto;color:#6550d5}.walk{font-size:28px;color:#6650db;width:32px}.purpose strong{font-size:15px}.purpose small{display:block;font-size:12px;margin-top:4px;color:#797384}.locations{border:1px solid #dedee5;border-radius:12px;padding:0 14px}.locations label{display:flex;align-items:center;gap:15px}.locations label+label{border-top:1px solid #ededf0}.locations input{border:0;outline:none;width:100%;padding:17px 0;background:transparent;font-size:14px;color:#33323b}.locations:focus-within{border-color:#6b52d9}.origin-dot{width:10px;height:10px;border:3px solid #6c55dd;border-radius:50%;flex-shrink:0}.destination-dot{width:9px;height:9px;background:#303037;flex-shrink:0}.route-meta{display:flex;justify-content:space-between;color:#8a8991;font-size:11px;margin:10px 0 25px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}h2{font-family:Manrope,sans-serif;font-size:17px;margin:0}.section-title>span{font-size:12px;color:#8b8890}.person{width:100%;display:flex;align-items:center;text-align:left;gap:12px;background:white;border:1px solid #e7e7eb;border-radius:12px;padding:12px;margin-bottom:9px}.person.selected{border:1.5px solid #7058df;background:#faf9ff;padding:11.5px}.avatar{height:43px;width:43px;border-radius:50%;background:#e9e0f6;color:#725499;display:grid;place-items:center;font-weight:600;font-size:17px}.person:nth-child(2) .avatar{background:#dde9e6;color:#557b72}.person:nth-child(3) .avatar{background:#f4e7d8;color:#9c7447}.person-info{flex:1}.person-info strong{font-size:15px}.person-info small{display:block;color:#7c7b84;font-size:12px;margin-top:5px}.time{text-align:right;font-size:14px;font-weight:600}.time small{display:block;font-size:11px;color:#8d8994;font-weight:400;margin-top:5px}.expectation{display:flex;gap:10px;align-items:center;margin:17px 0;color:#7c7886}.expectation>span{font-size:25px;color:#7563b6}.expectation p{font-size:12px;line-height:1.6;margin:0}.expectation strong{font-weight:400}.primary{display:flex;align-items:center;justify-content:space-between;background:#6450dc;color:#fff;border:0;width:100%;border-radius:10px;padding:17px 20px;font-weight:600;font-size:15px}.primary:hover{background:#5240c4}.primary span{font-size:20px}.fine{text-align:center;font-size:11px;color:#94919b;margin:12px 0 0}.map{position:relative;overflow:hidden;min-height:750px;background:#edeee9}.city{position:absolute;width:100%;height:100%;inset:0}.map-top{position:absolute;top:25px;left:28px;right:28px;display:flex;justify-content:space-between;align-items:center;gap:10px}.map-location{padding:13px 17px;background:white;border-radius:9px;box-shadow:0 3px 15px #35332d09;font-size:14px}.map-demo{font-size:12px;color:#73796e;background:#ffffffb8;padding:7px 10px;border-radius:5px}.pin{position:absolute;display:flex;flex-direction:column;align-items:center;background:none;border:0;transform:translate(-50%,-50%)}.pin>span{display:grid;place-items:center;width:46px;height:46px;background:white;border:3px solid white;border-radius:50%;box-shadow:0 4px 12px #302a3e25;font-size:18px;font-weight:700}.pin small{white-space:nowrap;font-size:12px;background:#fff;padding:6px 11px;border-radius:6px;margin-top:8px;box-shadow:0 3px 10px #302a3e0c}.maya{left:65%;top:51%}.maya>span{background:#dfd2f2;color:#725499}.jordan{left:78%;top:28%}.jordan>span{background:#d2e1db;color:#557b72}.alex{left:31%;top:77%}.alex>span{background:#f0dfc7;color:#9c7447}.companion.active>span{outline:4px solid #8e79e547}.companion.active small{background:#6550d9;color:white}.you{left:56%;top:63%}.you>span{height:21px;width:21px;background:#6653dc;box-shadow:0 0 0 12px #6553dc20}.destination{left:39.5%;top:41%}.destination>span{background:#292931;color:white;width:32px;height:32px;font-size:19px;border:2px solid white}.map-bottom{position:absolute;bottom:28px;left:30px;right:30px;display:flex;justify-content:space-between;align-items:end;gap:20px}.together{font-family:Manrope,sans-serif;font-weight:800;font-size:43px;letter-spacing:-3px;color:#625684;display:flex;gap:15px;align-items:center}.together span{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:400;letter-spacing:0;line-height:1.6;color:#777581}.together strong{font-weight:500;color:#55545d}.map-key{font-size:11px;color:#777581;background:#ffffffbf;padding:9px;border-radius:6px}.map-key i{display:inline-block;width:15px;height:3px;background:#6653dc;vertical-align:middle;margin-right:5px}dialog{border:0;border-radius:20px;padding:35px;max-width:480px;width:calc(100% - 32px);box-shadow:0 30px 100px #19122d40}dialog::backdrop{background:#24213466;backdrop-filter:blur(4px)}dialog h2{font-size:26px;margin:16px 0}dialog p{font-size:16px;line-height:1.6;color:#717079}.close{float:right;border:0;background:none;font-size:25px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}.status-icon{width:65px;height:65px;border-radius:50%;background:#eeebff;color:#6550dc;font-size:32px;display:grid;place-items:center;margin:25px 0}.status-title{font-size:28px;line-height:1.3}.status-text{line-height:1.7;color:#77737f;font-size:15px}.summary{padding:20px;background:#f6f5fb;border-radius:12px;margin:25px 0;font-size:15px;line-height:1.8;overflow-wrap:anywhere}.secondary{width:100%;padding:14px;background:white;border:1px solid #dedbe9;border-radius:10px;margin-top:10px;color:#5d5377;font-size:14px}@media(min-width:1500px){main{grid-template-columns:510px 1fr}.panel{padding:40px 50px}}@media(max-width:950px){header{padding:0 24px;gap:20px}.header-note{display:none}.brand{margin-right:auto}main{grid-template-columns:400px 1fr}.panel{padding:30px 25px}.map-bottom .map-key{display:none}.together{font-size:32px}.together span{font-size:12px}.map-top{left:15px;right:15px}.map-demo{display:none}}@media(max-width:680px){header{height:75px;padding:0 20px}.brand{font-size:24px}.logo{width:32px;height:32px}.plain{font-size:12px}.demo{display:none}main{display:flex;flex-direction:column}.map{order:-1;height:300px;min-height:300px}.map-top{top:15px}.map-location{font-size:12px;padding:9px 12px}.map-bottom{display:none}.panel{padding:27px 24px;box-shadow:none;border-radius:23px 23px 0 0;margin-top:-18px}h1{font-size:32px}h1 br{display:none}.intro br{display:none}.intro{margin-bottom:20px}.pin>span{width:35px;height:35px;font-size:14px}.pin small{font-size:11px;padding:4px 7px}.maya{left:67%;top:55%}.jordan{left:81%;top:26%}.alex{left:24%;top:66%}.destination{top:37%}.you{top:67%}.eyebrow{font-size:10px}.route-meta{font-size:11px}}