.mobile-shell{min-height:100vh;padding-bottom:88px}.appbar{height:70px;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:rgba(251,248,242,.94);backdrop-filter:blur(14px);z-index:3}.appbar .brand{font-size:18px}.appbar .brand-mark{width:32px;height:32px;font-size:18px;border-radius:10px}.avatar{width:34px;height:34px;border-radius:50%;border:0;background:#f1e8d9;color:#18383a;font-weight:700}.content{max-width:680px;margin:auto;padding:18px 20px}.content h1{font-size:48px;line-height:1.08;letter-spacing:-2px;margin:18px 0}.lead{color:#89908a;font-size:15px;line-height:1.8}.search-bar{height:48px;border:1px solid #eee8de;border-radius:14px;background:#fffdf9;display:flex;align-items:center;gap:10px;padding:0 15px;color:#e46f4f;margin:24px 0;font-size:22px}.search-bar span{font-size:14px;color:#89908a}.search-bar input{border:0;outline:0;background:transparent;min-width:0;flex:1;font-size:14px}.hero-image{height:290px;border-radius:22px;background:url('https://images.unsplash.com/photo-1500534623283-312aade485b7?w=1200&q=85') center/cover;position:relative;margin:22px 0 36px}.hero-image span{position:absolute;bottom:18px;left:18px;color:#fff;font-size:30px;font-weight:700}.section-head{margin:34px 0 16px}.section-head h2{font-size:25px}.section-head button{border:0;background:transparent;color:#e46f4f;font-size:13px}.section-head span{font-size:13px;color:#89908a}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card{border-radius:16px}.card-image{height:150px}.card-body{padding:14px}.card h3{font-size:17px;margin-bottom:6px}.card p{font-size:12px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tag{font-size:10px;margin-top:10px}.bottom-nav{position:fixed;z-index:4;bottom:0;left:0;right:0;height:78px;background:rgba(255,253,249,.96);border-top:1px solid #eee8de;display:flex;justify-content:space-around;padding-bottom:env(safe-area-inset-bottom);backdrop-filter:blur(16px)}.nav-item{position:relative;flex:1;border:0;background:transparent;color:#9ba29c;font-size:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.nav-item.active{color:#e46f4f;font-weight:700}.nav-icon{font-size:23px;line-height:1}.nav-item b{position:absolute;top:12px;margin-left:22px;background:#e46f4f;color:#fff;border-radius:99px;font-size:9px;min-width:15px;height:15px;display:grid;place-items:center}.chips{display:flex;gap:8px;overflow:auto;padding-bottom:4px}.chip{border:1px solid #eee8de;background:transparent;color:#89908a;border-radius:99px;padding:8px 13px;white-space:nowrap;font-size:12px}.chip.active{background:#18383a;border-color:#18383a;color:#fff}.spot-row,.trip-row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #eee8de;cursor:pointer}.row-image{width:92px;height:78px;border-radius:13px;background:center/cover;flex:0 0 auto}.row-copy{min-width:0;flex:1}.row-copy h3{font-size:17px;margin:0 0 5px}.row-copy p{font-size:12px;color:#89908a;line-height:1.5;margin:0}.chevron{color:#a5aca6;font-size:24px}.guide-row{display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid #eee8de}.guide-row h3{font-size:15px;margin:0 0 5px}.guide-row p{font-size:12px;color:#89908a;margin:0;line-height:1.5}.guide-row>div{flex:1}.guide-num,.trip-index{font-family:Georgia,serif;color:#e46f4f;font-size:18px}.trip-summary{display:flex;justify-content:space-between;align-items:center;background:#18383a;color:white;padding:20px;border-radius:18px;margin:25px 0 10px}.trip-summary div{display:flex;flex-direction:column;gap:7px}.trip-summary strong{font-size:22px}.trip-time{color:#b6c4be;font-size:12px}.trip-row{position:relative}.trip-row .row-image{width:76px;height:62px}.remove{border:0;background:transparent;color:#a5aca6;font-size:24px}.primary.full{width:100%;margin-top:24px}.empty{text-align:center;padding:80px 20px;color:#89908a}.empty span{display:block;font-size:58px;color:#e46f4f;margin-bottom:14px}.empty h3{color:#182a2d;margin:0 0 8px}.empty p{font-size:13px}.profile-card{background:#18383a;border-radius:20px;color:#fff;padding:24px;display:flex;align-items:center;gap:14px}.profile-avatar{width:58px;height:58px;border-radius:50%;background:#e6a887;color:#18383a;display:grid;place-items:center;font-size:22px;font-weight:700}.profile-card h2{margin:0 0 5px;font-size:21px}.profile-card p{margin:0;color:#b6c4be;font-size:12px}.profile-stats{display:flex;justify-content:space-around;text-align:center;padding:24px 0;border-bottom:1px solid #eee8de}.profile-stats div{display:flex;flex-direction:column;gap:5px}.profile-stats strong{font-size:24px}.profile-stats span{font-size:11px;color:#89908a}.menu{background:#fffdf9;border:1px solid #eee8de;border-radius:16px;overflow:hidden}.menu button{width:100%;text-align:left;padding:18px;border:0;border-bottom:1px solid #eee8de;background:transparent;color:#182a2d;font-size:14px;display:flex;justify-content:space-between}.menu button:last-child{border-bottom:0}.menu span{color:#a5aca6;font-size:22px}.drawer{position:fixed;inset:0;background:rgba(24,42,45,.35);display:flex;align-items:flex-end;justify-content:center;z-index:10}.drawer-panel{background:#fbf8f2;width:min(680px,100%);max-height:88vh;border-radius:24px 24px 0 0;padding:22px 20px 30px;overflow:auto}.drawer-panel img{width:100%;height:250px;object-fit:cover;border-radius:17px}.drawer-panel h2{font-size:32px;margin:14px 0 8px}.drawer-panel p{font-size:14px;line-height:1.8;color:#89908a}.close{float:right;position:relative;z-index:1;background:#f1e8d9;border:0;width:34px;height:34px;border-radius:50%;font-size:20px}.drawer-actions{display:flex;gap:10px}.drawer-actions button{flex:1}.toast{position:fixed;left:50%;bottom:100px;transform:translateX(-50%);background:#18383a;color:#fff;padding:12px 17px;border-radius:99px;z-index:20;font-size:13px;white-space:nowrap}@media(min-width:761px){.content{max-width:860px}.bottom-nav{max-width:680px;left:50%;right:auto;transform:translateX(-50%);width:100%;border:1px solid #eee8de;border-radius:22px 22px 0 0}.appbar{padding-left:max(20px,calc((100vw - 860px)/2));padding-right:max(20px,calc((100vw - 860px)/2))}}
