
  @media (max-width: 768px) {
    body { padding-bottom: calc(60px + env(safe-area-inset-bottom)) !important; }
    #ta-btt { position: fixed; left: 0; right: 0; bottom: 0; z-index: 99999; display: flex; align-items: stretch; background: #fff; border-top: 1px solid #ececec; box-shadow: 0 -4px 20px rgba(0,0,0,.08); padding-bottom: env(safe-area-inset-bottom); height: 60px; }
    #ta-btt .ta-btt-item { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; text-decoration: none; color: #8a948f; font-size: 11px; font-weight: 600; -webkit-tap-highlight-color: transparent; }
    #ta-btt .ta-btt-item svg { width: 23px; height: 23px; display: block; }
    #ta-btt .ta-btt-item.active { color: #00aa6c; }
    #ta-btt .ta-btt-item:active { transform: scale(.94); }

    /* ===== Discover page ===== */
    .ta-disc { padding: 12px 12px 24px; }
    .ta-disc-chips { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 12px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    .ta-disc-chips::-webkit-scrollbar { display: none; }
    .ta-disc-chip { flex: 0 0 auto; padding: 8px 16px; border-radius: 999px; border: 1px solid #e2e6e4; background: #fff; color: #5a6663; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; }
    .ta-disc-chip.active { background: #00aa6c; border-color: #00aa6c; color: #fff; }
    .ta-disc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .ta-pcard { background: #fff; border-radius: 14px; overflow: hidden; text-decoration: none; color: inherit; box-shadow: 0 4px 16px rgba(0,0,0,.07); position: relative; display: block; }
    .ta-pcard img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; background: #f2f4f3; }
    .ta-pcard .ta-pc-body { padding: 9px 10px 11px; }
    .ta-pcard .ta-pc-name { font-size: 13px; line-height: 1.35; color: #1c1c1c; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 34px; }
    .ta-pcard .ta-pc-price { margin-top: 6px; font-size: 14px; font-weight: 800; color: #e8451c; }
    .ta-pcard .ta-pc-price small { font-weight: 600; color: #9aa3a0; font-size: 11px; }
    .ta-save { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; border-radius: 50%; box-sizing: border-box; padding: 0; min-width: 0; background: rgba(255,255,255,.95); border: 1px solid rgba(0,0,0,.06); display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,.18); cursor: pointer; z-index: 2; }
    .ta-save svg { width: 18px; height: 18px; flex: 0 0 auto; fill: #7c8884; stroke: none; }
    .ta-save.on svg { fill: #e8451c; }
    .ta-disc-more { text-align: center; margin: 18px 0 6px; }
    .ta-disc-more button { padding: 11px 26px; border-radius: 999px; border: 1px solid #00aa6c; background: #fff; color: #00aa6c; font-weight: 700; font-size: 14px; }
    .ta-disc-empty, .ta-disc-load { text-align: center; color: #8a948f; font-size: 14px; padding: 26px 0; }
    .ta-rank-entry { display:flex; align-items:center; gap:10px; background:linear-gradient(135deg,#fff2ee,#fff); border:1px solid #f3d9c4; border-radius:14px; padding:13px 14px; text-decoration:none; margin-bottom:12px; box-shadow:0 4px 14px rgba(232,69,28,.08); }
    .ta-rank-entry .re-ic { font-size:22px; }
    .ta-rank-entry .re-t { font-size:14.5px; font-weight:800; color:#1c1c1c; display:flex; flex-direction:column; gap:1px; }
    .ta-rank-entry .re-s { font-size:11px; color:#93a09b; font-weight:600; }
    .ta-rank-entry .re-go { margin-left:auto; color:#e8451c; font-weight:800; font-size:19px; }
    .ta-tools { display:flex; gap:10px; margin-bottom:14px; }
    .ta-tool { flex:1; display:flex; align-items:center; gap:10px; background:#fff; border:1px solid #e2e6e4; border-radius:14px; padding:12px; cursor:pointer; }
    .ta-tool .t-ic { font-size:22px; }
    .ta-tool .t-t { font-size:13.5px; font-weight:800; color:#1c1c1c; text-align:left; line-height:1.4; }
    .ta-tool .t-t em { font-style:normal; font-size:10.5px; color:#93a09b; font-weight:600; display:block; }
    .ta-sec-t { font-size:15px; font-weight:800; color:#1c1c1c; margin:4px 2px 10px; }

    /* ===== Me page ===== */
    .ta-me { padding: 10px 12px 24px; }
    .ta-me-top { display:flex; align-items:center; padding: 4px 2px 12px; }
    .ta-me-top .tt { font-size: 18px; font-weight: 800; color: #1c1c1c; }
    .ta-me-top .gear { margin-left:auto; text-decoration:none; font-size:17px; color:#5a6663; }
    .ta-me-head { display: flex; align-items: center; gap: 12px; background: linear-gradient(135deg,#00aa6c,#0a7a4a); color: #fff; border-radius: 16px; padding: 18px 16px; margin-bottom: 14px; }
    .ta-me-avatar { width: 50px; height: 50px; border-radius: 50%; background: rgba(255,255,255,.22); display: flex; align-items: center; justify-content: center; font-size: 21px; font-weight: 800; flex:0 0 auto; }
    .ta-me-head .ta-me-name { font-size: 17px; font-weight: 800; display:flex; align-items:center; gap:8px; }
    .ta-me-lv { font-size:10.5px; font-weight:800; background:rgba(255,255,255,.25); padding:2px 8px; border-radius:999px; }
    .ta-me-head .ta-me-sub { font-size: 12px; opacity: .9; margin-top: 2px; }
    .ta-me-list { background: #fff; border-radius: 14px; overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,.06); margin-bottom: 14px; }
    .ta-me-row { display: flex; align-items: center; gap: 12px; padding: 15px 16px; text-decoration: none; color: #1c1c1c; border-bottom: 1px solid #f0f2f1; font-size: 15px; font-weight: 600; }
    .ta-me-row:last-child { border-bottom: none; }
    .ta-me-row .ta-me-ic { width: 30px; height: 30px; border-radius: 9px; background: #eafaf2; color: #00aa6c; display: flex; align-items: center; justify-content: center; font-size: 16px; flex:0 0 auto; }
    .ta-me-row .ta-me-arrow { margin-left: auto; color: #c3cbc8; font-size:18px; }
    .ta-me-row .ta-me-cnt { margin-left:auto; font-size:12.5px; font-weight:800; color:#0a7a4a; background:#eafaf2; border-radius:999px; padding:3px 10px; }
    .ta-me-row .ta-me-cnt + .ta-me-arrow { margin-left:6px; }
    .ta-me-row .val { margin-left:auto; font-size:13px; color:#8a948f; font-weight:700; }
    .ta-me-sec { background: #fff; border-radius: 14px; box-shadow: 0 4px 16px rgba(0,0,0,.06); padding: 14px 16px; margin-bottom: 14px; }
    .ta-me-sec h3 { margin: 0 0 10px; font-size: 15px; color: #1c1c1c; }
    .ta-me-empty { color: #9aa3a0; font-size: 13px; padding: 6px 0; }
    .ta-wl-item { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid #f0f2f1; text-decoration: none; color: inherit; }
    .ta-wl-item:first-of-type { border-top: none; }
    .ta-wl-item img { width: 52px; height: 40px; object-fit: cover; border-radius: 8px; background: #f2f4f3; }
    .ta-wl-item .ta-wl-n { font-size: 13px; font-weight: 600; line-height: 1.3; }
    .ta-wl-item .ta-wl-p { font-size: 12px; color: #e8451c; font-weight: 700; margin-top: 2px; }

    /* ===== Trips page ===== */
    .ta-trips { padding: 10px 12px 24px; }
    .ta-tr-top { display:flex; align-items:center; gap:10px; padding: 4px 2px 12px; }
    .ta-tr-top .back { text-decoration:none; color:#1c1c1c; font-size:20px; line-height:1; }
    .ta-tr-top .tt { font-size: 18px; font-weight: 800; color: #1c1c1c; }
    .ta-tr-top .new { margin-left:auto; text-decoration:none; font-size:13px; font-weight:800; color:#00aa6c; background:#eafaf2; border:1px solid #bfe8d6; padding:7px 14px; border-radius:999px; }
    .ta-tr-tabs { display:flex; gap:8px; padding: 2px 0 14px; overflow-x:auto; scrollbar-width:none; }
    .ta-tr-tabs::-webkit-scrollbar{ display:none; }
    .ta-tr-tab { flex:0 0 auto; padding:8px 16px; border-radius:999px; border:1px solid #e2e6e4; background:#fff; color:#5a6663; font-size:13px; font-weight:800; cursor:pointer; white-space:nowrap; }
    .ta-tr-tab.active { background:#e8451c; border-color:#e8451c; color:#fff; }
    .ta-tr-mode { display:flex; gap:8px; padding: 2px 0 12px; }
    .ta-tr-mode .tm { flex:1; padding:11px 12px; border-radius:12px; border:1px solid #e2e6e4; background:#fff; color:#5a6663; font-size:14px; font-weight:800; cursor:pointer; }
    .ta-tr-mode .tm.active { background:#00aa6c; border-color:#00aa6c; color:#fff; box-shadow:0 2px 8px rgba(0,170,108,.18); }
    .ta-diary-head { display:flex; align-items:center; margin-bottom:10px; font-size:12.5px; color:#6b7a75; font-weight:700; }
    .ta-diary-head .new { margin-left:auto; text-decoration:none; font-size:12.5px; font-weight:800; color:#00aa6c; background:#eafaf2; border:1px solid #bfe8d6; padding:6px 13px; border-radius:999px; }
    .ta-diarycard { background:#fff; border-radius:14px; box-shadow:0 3px 12px rgba(0,0,0,.07); padding:13px 14px; margin-bottom:10px; }
    .ta-diarycard .dc-route { font-size:13.5px; font-weight:800; color:#1c1c1c; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
    .ta-diarycard .dc-badge { font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:999px; background:#eafaf2; color:#0a7a4a; border:1px solid #bfe8d6; }
    .ta-diarycard .dc-date { margin-left:auto; font-size:11px; color:#9aa3a0; font-weight:600; }
    .ta-diarycard .dc-photos { display:flex; gap:6px; flex-wrap:wrap; margin:9px 0; }
    .ta-diarycard .dc-photos img { width:72px; height:72px; object-fit:cover; border-radius:8px; }
    .ta-diarycard .dc-text { font-size:13px; color:#43504b; line-height:1.6; white-space:pre-wrap; word-break:break-word; }
    .ta-diarycard .dc-foot { display:flex; gap:8px; margin-top:11px; }
    .ta-diarycard .dc-edit { border:1px solid #e2e6e4; background:#fff; color:#37423e; font-size:12px; font-weight:800; padding:6px 15px; border-radius:999px; cursor:pointer; }
    .ta-tripcard { background:#fff; border-radius:16px; box-shadow:0 4px 16px rgba(0,0,0,.07); padding:14px; margin-bottom:12px; }
    .ta-tripcard .tc-main { display:flex; gap:12px; align-items:flex-start; }
    .ta-tripcard .tc-img { flex:0 0 auto; width:94px; height:74px; border-radius:10px; overflow:hidden; background:#f2f4f3; }
    .ta-tripcard .tc-img img { width:100%; height:100%; object-fit:cover; display:block; }
    .ta-tripcard .tc-img.tc-img-empty { display:flex; align-items:center; justify-content:center; font-size:26px; color:#c2c9c6; background:linear-gradient(135deg,#f4f6f5,#e6ece8); }
    .ta-tripcard .tc-ct { flex:1 1 auto; min-width:0; }
    .ta-tripcard .tc-route { font-size:15px; font-weight:800; color:#1c1c1c; line-height:1.4; }
    .ta-tripcard .tc-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
    .ta-tripcard .tc-meta span { font-size:11.5px; font-weight:700; color:#5a6663; background:#f4f6f5; padding:4px 9px; border-radius:999px; }
    .ta-tripcard .tc-status { margin-top:9px; font-size:12.5px; font-weight:800; }
    .ta-tripcard .tc-status.st-processing{ color:#b9770e; }
    .ta-tripcard .tc-status.st-confirmed{ color:#0a7a4a; }
    .ta-tripcard .tc-status.st-draft{ color:#8a948f; }
    .ta-tripcard .tc-actions { display:flex; gap:8px; margin-top:11px; }
    .ta-tripcard .tc-actions button, .ta-tripcard .tc-actions a { flex:1; text-align:center; text-decoration:none; padding:9px 0; border-radius:10px; font-size:13px; font-weight:800; cursor:pointer; }
    .ta-tripcard .tc-actions .a-view { border:1.5px solid #00aa6c; background:#fff; color:#0a7a4a; }
    .ta-tripcard .tc-actions .a-share { border:none; background:#e8451c; color:#fff; }
    .ta-tripcard .tc-actions .a-edit { border:1.5px solid #e8451c; background:#fff; color:#e8451c; }
    .ta-tripcard .tc-actions .a-note { border:1.5px solid #b9770e; background:#fffdf5; color:#b9770e; }
    .ta-tripcard .tc-detail { display:none; margin-top:10px; padding:10px 12px; background:#f7f9f8; border-radius:10px; font-size:12.5px; color:#444; line-height:1.6; max-height:200px; overflow-y:auto; }
    .ta-tripcard .tc-detail.open { display:block; }
    .ta-trips .ta-me-empty { text-align:center; padding:40px 0; }

    /* ===== Trip notes (游记) ===== */
    .ta-tripcard .tc-note { margin-top:10px; padding:10px 12px; background:#fffdf5; border:1px solid #f0e6c8; border-radius:10px; font-size:12.5px; color:#555; line-height:1.6; }
    .ta-tripcard .tc-note .tn-h { font-size:11px; font-weight:800; color:#b9770e; margin-bottom:4px; }
    .ta-tripcard .tc-note .tn-photos { display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; }
    .ta-tripcard .tc-note .tn-photos img { width:56px; height:44px; object-fit:cover; border-radius:6px; }
    .ta-note-mask { position:fixed; inset:0; z-index:100070; background:rgba(0,0,0,.5); display:none; align-items:flex-end; justify-content:center; }
    .ta-note-mask.open { display:flex; }
    @media (min-width:769px){ .ta-note-mask{ align-items:center; } }
    .ta-note-sheet { width:100%; max-width:480px; background:#fff; border-radius:18px 18px 0 0; padding:16px 16px calc(18px + env(safe-area-inset-bottom)); max-height:86vh; overflow-y:auto; }
    @media (min-width:769px){ .ta-note-sheet{ border-radius:18px; margin:0 16px; } }
    .ta-note-sheet .nh { display:flex; align-items:center; font-size:16px; font-weight:800; color:#1c1c1c; margin-bottom:2px; }
    .ta-note-sheet .nx { margin-left:auto; border:none; background:#f1f3f2; color:#47524e; width:30px; height:30px; border-radius:50%; font-size:18px; line-height:1; cursor:pointer; }
    .ta-note-sheet .nm { font-size:12px; color:#93a09b; margin-bottom:10px; }
    .ta-note-sheet textarea { width:100%; box-sizing:border-box; min-height:140px; border:1.5px solid #dfe4e2; border-radius:12px; padding:12px; font-size:14px; line-height:1.6; resize:vertical; outline:none; font-family:inherit; }
    .ta-note-sheet textarea:focus { border-color:#00aa6c; }
    .ta-note-sheet .nph { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
    .ta-note-sheet .nph .np { position:relative; width:64px; height:64px; border-radius:8px; overflow:hidden; }
    .ta-note-sheet .nph .np img { width:100%; height:100%; object-fit:cover; display:block; }
    .ta-note-sheet .nph .np button { position:absolute; top:2px; right:2px; width:18px; height:18px; border-radius:50%; border:none; background:rgba(0,0,0,.55); color:#fff; font-size:11px; line-height:1; cursor:pointer; }
    .ta-note-sheet .nph .np-add { width:64px; height:64px; border-radius:8px; border:1.5px dashed #c2c9c6; background:#f7f9f8; display:flex; align-items:center; justify-content:center; font-size:22px; color:#8a948f; cursor:pointer; }
    .ta-note-sheet .npub { display:flex; align-items:center; gap:10px; background:#f7f9f8; border-radius:12px; padding:12px; margin:12px 0; font-size:13px; color:#37423e; }
    .ta-note-sheet .npub input { width:18px; height:18px; accent-color:#00aa6c; }
    .ta-note-sheet .npub .pt { font-weight:700; }
    .ta-note-sheet .npub .pd { font-size:11.5px; color:#93a09b; margin-top:2px; }
    .ta-note-sheet .nsv { width:100%; padding:13px; border:none; border-radius:12px; background:#00aa6c; color:#fff; font-weight:800; font-size:14.5px; cursor:pointer; }
    /* public notes on Discover */
    .ta-notes-sec { margin: 2px 0 6px; }
    .ta-notes-sec h3 { font-size:15px; font-weight:800; color:#1c1c1c; margin:0 2px 10px; }
    .ta-notecard { background:#fff; border-radius:14px; box-shadow:0 3px 12px rgba(0,0,0,.07); padding:13px 14px; margin-bottom:10px; }
    .ta-notecard .nc-route { font-size:13.5px; font-weight:800; color:#1c1c1c; }
    .ta-notecard .nc-text { font-size:12.5px; color:#555; line-height:1.6; margin:6px 0 8px; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
    .ta-notecard .nc-photo { width:100%; height:130px; border-radius:10px; overflow:hidden; margin-bottom:8px; }
    .ta-notecard .nc-photo img { width:100%; height:100%; object-fit:cover; display:block; }
    .ta-notecard .nc-foot { display:flex; align-items:center; gap:8px; }
    .ta-notecard .nc-helpful { border:1px solid #e2e6e4; background:#fff; color:#37423e; font-size:12px; font-weight:800; padding:5px 12px; border-radius:999px; cursor:pointer; }
    .ta-notecard .nc-helpful.voted { background:#eafaf2; border-color:#00aa6c; color:#0a7a4a; }
    .ta-notecard .nc-by { margin-left:auto; font-size:11px; color:#9aa3a0; }
    .ta-notecard .nc-full { display:none; margin-top:8px; }
    .ta-notecard .nc-full.open { display:block; }
    .ta-notecard .nc-full img { width:100%; border-radius:8px; margin-bottom:6px; display:block; }
    .ta-notes-sec .ta-me-empty { font-size:12.5px; padding:10px 2px; }
  }
  @media (min-width: 769px) { #ta-btt { display: none !important; } }
  