@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700;900&display=swap');

:root { --coral:#f35d3d; --ink:#20211e; --cream:#f7f2e8; --paper:#fffdf8; --mint:#b7d4c5; --line:rgba(32,33,30,.13); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'DM Sans','Noto Sans SC',sans-serif; }
button,input,textarea,select { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
.noise { position:fixed; inset:0; opacity:.035; pointer-events:none; z-index:20; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.topbar { height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,5vw,76px); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; background:rgba(255,253,248,.9); backdrop-filter:blur(16px); }
.brand { display:flex; align-items:center; gap:10px; color:var(--ink); text-decoration:none; font-weight:900; font-size:18px; }
.brand-mark { display:grid; place-items:center; width:36px; height:36px; background:var(--coral); color:white; border-radius:50% 45% 50% 44%; transform:rotate(-5deg); }
.desktop-nav { display:flex; gap:38px; height:100%; }
.desktop-nav a { display:grid; place-items:center; position:relative; text-decoration:none; color:#77766f; font-size:14px; font-weight:600; }
.desktop-nav a.active { color:var(--ink); }
.desktop-nav a.active:after { content:""; position:absolute; height:3px; border-radius:4px; background:var(--coral); bottom:0; left:3px; right:3px; }
.header-actions { display:flex; align-items:center; gap:10px; }
.icon-button,.avatar { border:0; background:#eee9df; width:38px; height:38px; border-radius:50%; font-size:22px; }
.avatar { background:#24332e; color:white; font-size:14px; font-weight:700; }
.share-button,.primary-button,.ghost-button,.dark-button { border:0; border-radius:99px; padding:12px 19px; font-weight:700; transition:.2s ease; }
.share-button { background:var(--ink); color:white; }
.share-button:hover,.dark-button:hover { transform:translateY(-2px); background:#000; }
.hero { min-height:620px; padding:clamp(55px,8vw,100px) clamp(24px,7vw,104px); display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:8vw; overflow:hidden; background:var(--cream); }
.hero-copy { position:relative; z-index:2; }
.eyebrow,.sync-status { display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; }
.eyebrow { border:1px solid var(--line); padding:7px 12px; border-radius:99px; background:rgba(255,255,255,.55); }
.live-dot { display:inline-block; width:8px; height:8px; border-radius:50%; background:#57a47d; box-shadow:0 0 0 5px rgba(87,164,125,.13); animation:pulse 2s infinite; }
@keyframes pulse { 50% { box-shadow:0 0 0 8px rgba(87,164,125,0); } }
.hero h1 { font-size:clamp(52px,6.4vw,92px); letter-spacing:-.07em; line-height:.98; margin:24px 0; font-weight:900; }
.hero h1 em { color:var(--coral); font-style:normal; position:relative; display:inline-block; }
.hero h1 em:after { content:""; position:absolute; height:9px; left:3px; right:-8px; bottom:-7px; background:url("data:image/svg+xml,%3Csvg width='300' height='9' viewBox='0 0 300 9' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6C82 0 191 10 298 3' stroke='%23f35d3d' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100%; }
.hero-copy>p { color:#6d6b63; max-width:470px; font-size:17px; line-height:1.8; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin:32px 0 38px; }
.primary-button { color:white; background:var(--coral); box-shadow:0 8px 24px rgba(243,93,61,.22); }
.primary-button:hover { transform:translateY(-2px) rotate(-1deg); background:#df492b; }
.ghost-button { background:transparent; color:var(--ink); border:1px solid var(--line); }
.ghost-button:hover { background:white; }
.friend-row { display:flex; align-items:center; gap:14px; }
.friend-row p { font-size:13px; color:#77766f; }
.friend-row strong { color:var(--ink); }
.avatar-stack { display:flex; }
.avatar-stack img,.avatar-stack span { width:34px; height:34px; border-radius:50%; object-fit:cover; border:3px solid var(--cream); margin-left:-9px; }
.avatar-stack img:first-child { margin-left:0; }
.avatar-stack span { display:grid; place-items:center; background:var(--ink); color:white; font-size:10px; }
.hero-visual { position:relative; min-height:480px; display:grid; place-items:center; }
.sun-shape { position:absolute; width:min(42vw,540px); height:min(42vw,540px); border-radius:48% 52% 45% 55%; background:#f7b95d; transform:rotate(7deg); }
.feature-card { width:min(37vw,470px); background:white; padding:12px; border-radius:8px; transform:rotate(2.6deg); box-shadow:0 28px 65px rgba(37,34,29,.22); z-index:2; position:relative; }
.feature-card>img { width:100%; height:345px; object-fit:cover; display:block; border-radius:3px; }
.feature-empty-art { width:100%; height:345px; border:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; border-radius:3px; color:#8a6f57; background:radial-gradient(circle at 25% 25%,rgba(255,255,255,.6) 0 3px,transparent 4px),linear-gradient(135deg,#f4dcc0,#e9c596); background-size:23px 23px,100% 100%; transition:filter .2s,transform .2s; }.feature-empty-art:hover { filter:brightness(.97); }.feature-empty-art:active { transform:scale(.99); }.feature-empty-art:focus-visible { outline:3px solid var(--coral); outline-offset:3px; }.feature-empty-art span { display:grid; place-items:center; width:62px; height:62px; border:2px solid rgba(99,71,45,.35); border-radius:50%; font-size:35px; font-weight:300; }.feature-empty-art small { letter-spacing:.16em; font-size:9px; font-weight:800; }
.feature-badge { position:absolute; top:26px; left:-20px; background:var(--coral); color:white; padding:9px 14px; font-size:12px; font-weight:700; transform:rotate(-7deg); box-shadow:3px 5px 0 rgba(45,37,31,.14); }
.feature-info { display:flex; justify-content:space-between; align-items:end; padding:16px 10px 8px; }
.feature-info span { font-size:11px; color:#8a8981; }
.feature-info h2 { margin:4px 0 0; font-size:23px; }
.rating { font-size:20px; font-weight:800; }.rating span { color:#f5b748; font-size:18px; }
.scribble { position:absolute; z-index:3; color:white; font-weight:900; font-size:34px; font-style:italic; right:0; top:12%; transform:rotate(12deg); text-shadow:2px 2px 0 var(--coral); }
.floating-note { position:absolute; display:flex; align-items:center; gap:10px; z-index:4; left:0; bottom:9%; background:white; border-radius:7px; padding:12px 16px; box-shadow:0 10px 30px rgba(0,0,0,.13); transform:rotate(-4deg); }
.floating-note>span { font-size:22px; }.floating-note b,.floating-note small { display:block; }.floating-note b { font-size:13px; }.floating-note small { color:#888; margin-top:2px; }
.feed-section { padding:90px clamp(24px,7vw,104px) 110px; }
.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:30px; }
.section-kicker { color:var(--coral); letter-spacing:.18em; font-size:10px; font-weight:800; }
.section-heading h2,.map-strip h2 { margin:7px 0 0; font-size:clamp(30px,4vw,48px); letter-spacing:-.045em; }
.sync-status { color:#78766e; font-size:12px; }.sync-status .live-dot { width:6px; height:6px; }
.user-identity { margin-left:5px; padding:4px 7px; border-radius:99px; background:#e8efe9; color:#2f6650; font-size:9px; font-weight:800; letter-spacing:.04em; }
.filters { display:flex; gap:8px; overflow:auto; padding-bottom:8px; margin-bottom:28px; scrollbar-width:none; }
.filter-chip { white-space:nowrap; border:1px solid var(--line); background:white; border-radius:99px; padding:9px 15px; color:#77766f; font-size:13px; }
.filter-chip.active { background:var(--ink); color:white; border-color:var(--ink); }
.feed-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.checkin-card { min-width:0; animation:cardIn .45s ease both; }
@keyframes cardIn { from { opacity:0; transform:translateY(16px); } }
.photo-wrap { height:290px; overflow:hidden; border-radius:8px; position:relative; background:#ebe6dd; }
.photo-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.checkin-card:hover .photo-wrap img { transform:scale(1.035); }
.category-tag { position:absolute; left:12px; top:12px; padding:6px 10px; border-radius:99px; background:rgba(255,255,255,.9); backdrop-filter:blur(6px); font-size:11px; font-weight:700; }
.like-button { position:absolute; right:12px; top:12px; border:0; width:35px; height:35px; border-radius:50%; background:rgba(255,255,255,.88); font-size:17px; }
.like-button.liked { background:var(--coral); color:white; }
.card-meta { display:flex; align-items:center; gap:9px; color:#87857e; font-size:11px; margin:15px 2px 8px; }
.card-meta img,.initial-avatar { width:25px; height:25px; object-fit:cover; border-radius:50%; display:grid; place-items:center; background:var(--mint); color:#29443a; font-size:10px; font-weight:800; }
.card-meta time { margin-left:auto; }
.card-title-row { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.card-title-row h3 { margin:0; font-size:21px; letter-spacing:-.02em; }.card-title-row .rating { font-size:14px; white-space:nowrap; }
.checkin-card>p { color:#6f6d66; font-size:13px; line-height:1.65; margin:8px 0; min-height:43px; }
.location { color:#9b9991; font-size:11px; }
.card-actions { display:flex; gap:7px; margin-top:13px; }.card-actions button { border:1px solid var(--line); border-radius:99px; padding:6px 11px; background:white; color:#716e67; font-size:10px; font-weight:700; }.card-actions button:hover { border-color:#aaa49a; background:#f7f3ea; }.card-actions .delete-checkin { color:#c64b35; border-color:rgba(198,75,53,.22); }.card-actions .delete-checkin:hover { background:#fff1ed; border-color:#e59a89; }
.comment-entry-button { margin-top:12px; border:0; background:transparent; padding:0; color:#4f7566; font-size:11px; font-weight:700; }.comment-entry-button:hover { color:#244c3c; }
.empty-state { padding:70px 20px; text-align:center; background:var(--cream); color:#777; border-radius:10px; }
.map-strip { margin:0 clamp(24px,7vw,104px) 100px; padding:55px; background:var(--mint); border-radius:10px; display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:45px; overflow:hidden; }
.map-strip .section-kicker { color:#27604a; }.map-strip p { color:#4f665d; }.dark-button { color:white; background:var(--ink); margin-top:14px; }
.mini-map { min-height:330px; background:#dce9e0; border-radius:50% 42% 47% 44%; position:relative; overflow:hidden; transform:rotate(-2deg); }
.road { position:absolute; background:#f7f2e8; border:1px solid #bed1c4; }.road-a { width:130%; height:36px; left:-15%; top:45%; transform:rotate(14deg); }.road-b { width:35px; height:130%; left:52%; top:-15%; transform:rotate(-18deg); }.road-c { width:100%; height:22px; left:0; top:20%; transform:rotate(-9deg); }
.pin { position:absolute; z-index:2; display:grid; place-items:center; width:48px; height:48px; background:white; border-radius:50% 50% 50% 4px; box-shadow:0 7px 16px rgba(41,77,62,.18); transform:rotate(-45deg); font-size:20px; }.pin::first-letter { transform:rotate(45deg); }.pin-a { left:19%; top:34%; }.pin-b { left:62%; top:17%; }.pin-c { left:68%; top:62%; }.pin-d { left:39%; top:70%; }
.map-label { position:absolute; left:20px; bottom:18px; background:var(--ink); color:white; padding:8px 12px; border-radius:5px; font-size:11px; }
.mobile-nav { display:none; }
dialog { border:0; border-radius:14px; padding:0; width:min(92vw,520px); background:var(--paper); box-shadow:0 28px 90px rgba(0,0,0,.28); }
dialog::backdrop { background:rgba(30,29,25,.58); backdrop-filter:blur(5px); }
dialog form { padding:36px; position:relative; } dialog h2 { margin:7px 0 2px; font-size:32px; }.dialog-subtitle { margin:0 0 25px; color:#85837b; font-size:13px; }
.dialog-close { position:absolute; right:18px; top:16px; border:0; background:transparent; font-size:25px; color:#777; }
label { display:block; font-size:12px; font-weight:700; margin-top:16px; }
input,textarea,select { width:100%; border:1px solid var(--line); background:white; border-radius:7px; padding:12px; outline:none; margin-top:7px; color:var(--ink); }
input:focus,textarea:focus,select:focus { border-color:var(--coral); box-shadow:0 0 0 3px rgba(243,93,61,.1); }
textarea { min-height:82px; resize:vertical; }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.submit-button { width:100%; margin-top:23px; }
.location-picker { display:flex; gap:8px; align-items:stretch; }.location-picker input { margin-top:7px; }.location-picker button { flex:0 0 auto; border:0; border-radius:7px; padding:0 13px; margin-top:7px; background:#e7efe9; color:#27604a; font-size:12px; font-weight:700; }
.photo-uploader { margin-top:7px; position:relative; }.photo-upload-trigger { min-height:105px; margin:0; border:1px dashed #c9c4ba; border-radius:9px; background:#fbf8f1; display:flex; align-items:center; justify-content:center; gap:12px; padding:18px; cursor:pointer; color:#625f58; transition:.2s; }.photo-upload-trigger:hover { border-color:var(--coral); background:#fff7f3; }.upload-icon { display:grid; place-items:center; width:39px; height:39px; border-radius:50%; background:#fbe3dc; color:var(--coral); font-size:20px; }.photo-upload-trigger b,.photo-upload-trigger small { display:block; }.photo-upload-trigger b { font-size:13px; }.photo-upload-trigger small { color:#99958d; font-size:10px; font-weight:400; margin-top:4px; }.photo-preview { position:relative; height:210px; overflow:hidden; border-radius:9px; background:#eee9df; }.photo-preview img { width:100%; height:100%; object-fit:cover; display:block; }.photo-preview-actions { position:absolute; right:10px; bottom:10px; display:flex; gap:6px; }.photo-preview-actions label,.photo-preview-actions button { border:0; border-radius:99px; padding:7px 11px; margin:0; background:rgba(32,33,30,.86); color:white; font-size:10px; font-weight:700; backdrop-filter:blur(6px); cursor:pointer; }.photo-preview-actions button { background:rgba(243,93,61,.92); }.photo-processing { min-height:105px; display:grid; place-items:center; border-radius:9px; background:#f1eee6; color:#7f7b73; font-size:12px; }.photo-processing[hidden] { display:none; }
.map-dialog { width:min(94vw,1050px); }.map-dialog-shell { padding:0; }.map-dialog-header { min-height:92px; padding:24px 28px 18px; position:relative; display:flex; align-items:end; justify-content:space-between; }.map-dialog-header h2 { margin:5px 0 0; font-size:28px; }.map-dialog-header .dialog-close { position:static; align-self:start; }
.map-searchbar { margin:0 28px 18px; display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:10px; padding:7px 8px 7px 14px; background:white; position:relative; z-index:5; }.map-searchbar>span { font-size:20px; color:#777; }.map-searchbar input { border:0; box-shadow:none; margin:0; padding:8px 2px; }.map-searchbar button { border:0; border-radius:7px; padding:10px 18px; background:var(--coral); color:white; font-size:12px; font-weight:700; }.map-searchbar .locate-button { padding:9px 12px; background:#e8efe9; color:#27604a; font-size:17px; }
.poi-suggestions { position:absolute; top:calc(100% + 8px); left:0; right:0; max-height:360px; overflow:auto; background:white; border:1px solid var(--line); border-radius:10px; box-shadow:0 18px 50px rgba(30,29,25,.2); }.poi-suggestion { width:100%; display:flex; align-items:center; gap:11px; border:0; border-bottom:1px solid var(--line); border-radius:0!important; padding:13px 15px!important; background:white!important; color:var(--ink)!important; text-align:left; }.poi-suggestion:last-child { border-bottom:0; }.poi-suggestion:hover,.poi-suggestion:focus { background:#f5f1e9!important; outline:none; }.suggestion-icon { display:grid; place-items:center; flex:0 0 31px; width:31px; height:31px; border-radius:50%; background:#fbe3dc; font-size:15px; }.suggestion-copy { min-width:0; flex:1; }.suggestion-copy b,.suggestion-copy span { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }.suggestion-copy b { font-size:13px; }.suggestion-copy span { margin-top:3px; color:#918e87; font-size:10px; }.suggestion-distance { color:#aaa69e; font-size:10px; white-space:nowrap; }.suggestion-status { padding:17px; text-align:center; color:#8a8881; font-size:11px; }
.map-searchbar .clear-poi-search { flex:0 0 auto; width:28px; height:28px; padding:0; border-radius:50%; background:#eeeae2; color:#77736c; font-size:18px; font-weight:400; }
.map-workspace { min-height:480px; display:grid; grid-template-columns:330px 1fr; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.poi-results { max-height:480px; overflow:auto; background:var(--paper); border-right:1px solid var(--line); }.poi-guide,.poi-status { min-height:100%; padding:48px 27px; display:flex; flex-direction:column; justify-content:center; text-align:center; color:#8a8881; }.poi-guide b { color:var(--ink); font-size:17px; margin-bottom:8px; }.poi-guide span,.poi-status { font-size:12px; line-height:1.7; }.poi-item { width:100%; padding:17px 19px; border:0; border-bottom:1px solid var(--line); text-align:left; background:transparent; display:flex; gap:12px; transition:.18s; }.poi-item:hover,.poi-item.active { background:#f1eee6; }.poi-number { display:grid; place-items:center; flex:0 0 25px; height:25px; border-radius:50% 50% 50% 4px; transform:rotate(-45deg); background:var(--coral); color:white; font-size:10px; font-weight:800; }.poi-number span { transform:rotate(45deg); }.poi-copy { min-width:0; }.poi-copy b,.poi-copy span { display:block; }.poi-copy b { font-size:14px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }.poi-copy span { color:#88857e; font-size:11px; line-height:1.5; margin-top:4px; }.poi-copy em { display:block; color:#afa9a0; font-style:normal; font-size:10px; margin-top:5px; }.tencent-map { min-height:480px; background:#e6eee8; position:relative; }.map-loading { position:absolute; inset:0; display:grid; place-items:center; color:#6e8179; font-size:13px; }.map-attribution { padding:8px 28px; text-align:right; color:#aaa69d; font-size:9px; }
.comments-dialog { width:min(94vw,620px); max-height:min(88vh,820px); }.comments-shell { display:flex; flex-direction:column; max-height:min(88vh,820px); }.comments-header { flex:0 0 auto; padding:28px 30px 20px; display:flex; align-items:flex-start; justify-content:space-between; border-bottom:1px solid var(--line); }.comments-header h2 { margin:5px 0 0; font-size:25px; }.comments-header .dialog-close { position:static; }.comments-list { flex:1; min-height:170px; overflow:auto; padding:10px 30px; }.comments-empty { min-height:170px; display:grid; place-items:center; color:#99958d; font-size:12px; text-align:center; }.comment-item { display:grid; grid-template-columns:34px 1fr auto; gap:10px; padding:16px 0; border-bottom:1px solid var(--line); }.comment-avatar { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--mint); color:#28503f; font-size:10px; font-weight:800; }.comment-body { min-width:0; }.comment-meta { display:flex; align-items:center; gap:8px; }.comment-meta b { font-size:12px; }.comment-meta time { color:#aaa69e; font-size:9px; }.comment-body p { margin:7px 0; white-space:pre-wrap; word-break:break-word; color:#5f5c55; font-size:12px; line-height:1.6; }.comment-image { display:block; width:min(100%,260px); max-height:260px; object-fit:cover; border-radius:7px; margin-top:8px; }.delete-comment { align-self:start; border:0; background:transparent; color:#ba7666; font-size:10px; padding:4px; }.comment-form { flex:0 0 auto; padding:18px 30px 24px; background:#f8f4eb; border-top:1px solid var(--line); }.comment-form textarea { min-height:72px; margin:0; background:white; }.comment-form-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; }.comment-form-actions label { margin:0; cursor:pointer; color:#3e6a58; font-size:11px; }.comment-form-actions .primary-button { padding:9px 16px; font-size:11px; }.comment-form>small { display:block; margin-top:7px; color:#aaa69e; font-size:9px; }.comment-photo-preview { width:92px; height:92px; position:relative; margin-top:10px; }.comment-photo-preview img { width:100%; height:100%; object-fit:cover; border-radius:7px; }.comment-photo-preview button { position:absolute; right:-7px; top:-7px; width:23px; height:23px; border:2px solid white; border-radius:50%; background:var(--coral); color:white; }
.toast { position:fixed; left:50%; bottom:28px; z-index:30; transform:translate(-50%,30px); opacity:0; background:var(--ink); color:white; padding:11px 17px; border-radius:99px; font-size:13px; transition:.25s; pointer-events:none; }.toast.show { opacity:1; transform:translate(-50%,0); }

@media (max-width:900px) {
  .desktop-nav { display:none; }.hero { grid-template-columns:1fr; padding-top:55px; }.hero-visual { min-height:520px; }.feature-card { width:min(78vw,470px); }.sun-shape { width:min(85vw,540px); height:min(85vw,540px); }.feed-grid { grid-template-columns:repeat(2,1fr); }.map-strip { grid-template-columns:1fr; }.share-button { padding:10px 13px; }.share-button span { display:none; }
}
@media (max-width:620px) {
  body { padding-bottom:72px; }.topbar { height:62px; padding:0 18px; }.brand { font-size:15px; }.brand-mark { width:31px; height:31px; }.header-actions .avatar,.share-button { display:none; }.hero { padding:42px 20px 50px; min-height:auto; gap:35px; }.hero h1 { font-size:54px; }.hero-copy>p { font-size:15px; }.hero-actions button { flex:1; padding-inline:12px; }.friend-row { margin-top:3px; }.hero-visual { min-height:390px; }.feature-card { width:84vw; padding:9px; }.feature-card>img,.feature-empty-art { height:260px; }.floating-note { left:-4px; bottom:3%; }.scribble { right:-6px; }.feed-section { padding:65px 18px 75px; }.section-heading { align-items:start; }.section-heading h2 { font-size:31px; }.sync-status { margin-top:15px; }.feed-grid { grid-template-columns:1fr; gap:38px; }.photo-wrap { height:315px; }.map-strip { margin:0 18px 40px; padding:32px 25px; }.mini-map { min-height:260px; }.mobile-nav { position:fixed; display:flex; bottom:0; left:0; right:0; height:66px; z-index:15; background:rgba(255,253,248,.94); backdrop-filter:blur(15px); border-top:1px solid var(--line); align-items:center; justify-content:space-around; }.mobile-nav a { display:flex; flex-direction:column; align-items:center; gap:2px; color:#8a8881; text-decoration:none; font-size:20px; }.mobile-nav a span { font-size:9px; }.mobile-nav a.active { color:var(--coral); }.mobile-nav button { border:4px solid var(--paper); width:51px; height:51px; margin-top:-30px; background:var(--coral); color:white; border-radius:50%; font-size:27px; box-shadow:0 5px 18px rgba(243,93,61,.3); } dialog form { padding:30px 22px; }.map-dialog { width:100vw; max-width:none; height:100vh; max-height:none; border-radius:0; }.map-dialog-header { min-height:78px; padding:18px 18px 12px; }.map-dialog-header h2 { font-size:22px; }.map-searchbar { margin:0 14px 12px; gap:5px; padding-left:10px; }.map-searchbar button { padding:9px 12px; }.map-workspace { height:calc(100vh - 150px); min-height:0; display:flex; flex-direction:column-reverse; }.tencent-map { min-height:42%; flex:1; }.poi-results { max-height:47%; border-right:0; border-top:1px solid var(--line); }.poi-guide { padding:25px; }.map-attribution { display:none; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
@media (max-width:620px) { .comments-dialog { width:100vw; max-width:none; height:100vh; max-height:none; border-radius:0; }.comments-shell { height:100vh; max-height:none; }.comments-header { padding:20px 18px 14px; }.comments-list { padding:8px 18px; }.comment-form { padding:14px 18px 22px; }.comment-form textarea { min-height:64px; } }