/* 租透 RentThru — design system (design handoff §9 tokens).
   Same-origin stylesheet → CSP style-src 'self'. Fonts: system CJK stack
   (Google Fonts is CSP-blocked); Space Grotesk falls back to a tabular
   monospace so numbers still read as the eyebrow/figure style.
   The :root token block below is the canonical mirror of
   design-system/tokens/tokens.css (the claude.ai/design DesignSync source of
   truth) — edit both together so the synced design system never drifts. */

:root {
  --green:#2E6B4F; --green-d:#22503B; --green-s:#E7F0EA;
  --clay:#B0603A; --clay-s:#F6E7DD;
  --slate:#48587A; --slate-s:#E7EAF2;
  --ochre:#A67B1F; --ochre-s:#F5ECD6;
  --ink:#23201A; --ink2:#6B655A; --ink3:#9A9284; --ink4:#B3AB9C;
  --paper:#F6F3EC; --paper2:#EDE7DA; --panel:#FFFFFF;
  --line:#E7E1D5; --line2:#F0EBE1; --high:#B4472F;
  --serif:'Noto Serif TC','Songti TC',serif;
  --sans:'Noto Sans TC',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'Space Grotesk',ui-monospace,'SF Mono','Segoe UI',Menlo,monospace;
  --sh-card:0 6px 22px rgba(35,32,26,.06);
  --sh-over:0 18px 50px rgba(35,32,26,.14);
  --sh-toast:0 10px 34px rgba(35,32,26,.32);
}

* { box-sizing: border-box; }
/* The `hidden` attribute must win over component classes that set an explicit
   `display` (badges/pills/toast use display:flex, which otherwise overrides the
   UA [hidden]{display:none} rule and leaves empty elements stuck visible). */
[hidden] { display: none !important; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  background: var(--paper); color: var(--ink);
  font-family: var(--sans); -webkit-font-smoothing: antialiased;
  font-size: 14px; line-height: 1.5;
}
a { color: var(--green); text-decoration: none; }
a:hover { color: var(--green-d); }
button { font-family: var(--sans); }
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: #D8D1C2; border-radius: 6px; }
::-webkit-scrollbar-track { background: transparent; }
input::placeholder, textarea::placeholder { color: var(--ink4); }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }

@keyframes fadeUp { from { transform: translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes popIn { from { transform: scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes toastIn { from { transform: translate(-50%,12px); opacity: 0; } to { transform: translate(-50%,0); opacity: 1; } }
@keyframes slideInLeft { from { transform: translateX(-26px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes slideInRight { from { transform: translateX(26px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ── App shell ── */
.rt-app { height: 100vh; display: flex; flex-direction: column; background: var(--paper); overflow: hidden; }

/* ── Header ── */
.rt-header { flex: 0 0 auto; height: 62px; display: flex; align-items: center; gap: 16px; padding: 0 20px; background: var(--panel); border-bottom: 1px solid var(--line); z-index: 30; }
.rt-logo { display: flex; align-items: baseline; gap: 8px; flex: 0 0 auto; }
.rt-logo:hover { text-decoration: none; }
.rt-logo-zh { font-family: var(--serif); font-weight: 700; font-size: 23px; color: var(--green); letter-spacing: .02em; }
.rt-logo-en { font-family: var(--mono); font-weight: 600; font-size: 10px; letter-spacing: .16em; color: var(--ink3); text-transform: uppercase; }
.rt-search { flex: 1 1 auto; max-width: 540px; display: flex; align-items: center; gap: 8px; background: var(--paper); border: 1px solid var(--line); border-radius: 10px; padding: 0 12px; height: 40px; }
.rt-search-ic { color: var(--ink3); font-size: 16px; }
.rt-search input { flex: 1; min-width: 0; border: none; background: transparent; outline: none; font-size: 14px; color: var(--ink); font-family: var(--sans); }
.rt-search-go { border: none; background: var(--green); color: #fff; height: 28px; padding: 0 13px; border-radius: 7px; font-size: 13px; cursor: pointer; }
.rt-search-go:hover { background: var(--green-d); }
.rt-spacer { flex: 1 1 auto; }
.rt-btn-dark { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 17px; border: none; border-radius: 10px; background: var(--ink); color: #fff; font-size: 14px; cursor: pointer; }
.rt-btn-dark:hover { background: #3A352B; }
.rt-icon-btn { position: relative; flex: 0 0 auto; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; font-size: 18px; line-height: 1; }
.rt-icon-btn:hover { background: var(--paper); }
.rt-badge { position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; color: #fff; font-family: var(--mono); font-weight: 600; font-size: 10px; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; }
.rt-badge-clay { background: var(--clay); }
.rt-badge-red { background: var(--high); }
.rt-account { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 6px; border: 1px solid var(--line); border-radius: 20px; background: #fff; cursor: pointer; }
.rt-account:hover { background: var(--paper); }
.rt-avatar { width: 28px; height: 28px; border-radius: 50%; background: var(--green); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; flex: 0 0 auto; }
.rt-account-name { font-size: 13px; color: var(--ink); max-width: 80px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rt-verified { font-size: 10px; color: var(--green); background: var(--green-s); padding: 1px 5px; border-radius: 4px; font-weight: 600; }

/* ── Toolbar ── */
.rt-toolbar { flex: 0 0 auto; height: 50px; display: flex; align-items: center; gap: 14px; padding: 0 20px; background: var(--panel); border-bottom: 1px solid var(--line); z-index: 29; overflow-x: auto; }
.rt-eyebrow { font-family: var(--mono); font-weight: 600; font-size: 11px; letter-spacing: .08em; color: var(--ink3); text-transform: uppercase; flex: 0 0 auto; }
.rt-layers { display: flex; gap: 7px; flex: 0 0 auto; }
.rt-layer { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 9px; border: 1px solid var(--line); background: #fff; color: var(--ink2); font-size: 13px; cursor: pointer; white-space: nowrap; flex: 0 0 auto; }
.rt-layer .dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.rt-layer .n { font-family: var(--mono); font-weight: 600; opacity: .6; }
.rt-layer.on { color: #fff; border-color: transparent; }
.rt-layer.on .n { opacity: .8; }
.rt-pill { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 9px; border: 1px solid var(--line); background: #fff; color: var(--ink2); font-size: 13px; cursor: pointer; white-space: nowrap; flex: 0 0 auto; }
.rt-pill:hover { background: var(--paper); }
.rt-pill.on { background: var(--green-s); border-color: #CFE3D7; color: var(--green); }
.rt-pill .n { font-family: var(--mono); font-weight: 700; }
.rt-tb-divider { width: 1px; height: 22px; background: var(--line); flex: 0 0 auto; }
.rt-chev { font-size: 12px; color: var(--ink3); }

/* ── Main region ── */
.rt-main { flex: 1 1 auto; display: flex; min-height: 0; position: relative; }
.rt-aside { flex: 0 0 380px; display: flex; flex-direction: column; min-height: 0; background: var(--panel); border-right: 1px solid var(--line); }
.rt-aside-top { flex: 0 0 auto; border-bottom: 1px solid var(--line2); padding: 11px 16px 12px; }
.rt-filter-trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 42px; padding: 0 13px; border: 1px solid var(--line); border-radius: 11px; background: #FCFAF5; cursor: pointer; }
.rt-filter-trigger:hover { border-color: var(--green); background: #fff; }
.rt-filter-trigger-l { display: flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 600; color: var(--ink); }
.rt-filter-trigger-hint { font-size: 12.5px; color: var(--green); font-weight: 600; white-space: nowrap; }
.rt-count-pill { background: var(--green); color: #fff; font-size: 11px; font-family: var(--mono); font-weight: 600; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; padding: 0 5px; border-radius: 9px; }
.rt-filter-summary { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin-top: 10px; }
.rt-sm-chip { font-size: 11.5px; color: var(--green); background: var(--green-s); border: 1px solid #D9E7DF; padding: 2px 8px; border-radius: 20px; }
.rt-sm-clear { border: none; background: none; color: var(--ink3); font-size: 11.5px; cursor: pointer; text-decoration: underline; padding: 2px 4px; }
.rt-result-bar { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 10px 16px; border-bottom: 1px solid var(--line2); }
.rt-result-count { font-size: 13px; color: var(--ink2); }
.rt-result-count b { font-family: var(--mono); font-weight: 700; color: var(--ink); font-size: 15px; }
.rt-result-actions { display: flex; align-items: center; gap: 7px; }
.rt-sub-btn { height: 30px; padding: 0 11px; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 12.5px; color: var(--green); cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.rt-sub-btn:hover { background: var(--green-s); }
.rt-sub-btn.on { background: var(--green-s); border-color: #CFE3D7; }
.rt-sort { height: 30px; border: 1px solid var(--line); border-radius: 7px; background: var(--paper); font-size: 12.5px; color: var(--ink); padding: 0 8px; outline: none; cursor: pointer; font-family: var(--sans); }
.rt-cards { flex: 1 1 auto; overflow-y: auto; padding: 10px 12px 16px; }

/* ── Listing card ── */
.rt-card { display: block; width: 100%; text-align: left; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 13px 14px; margin-bottom: 10px; cursor: pointer; font-family: var(--sans); transition: border-color .15s, box-shadow .15s; animation: fadeUp .2s ease both; }
.rt-card:hover { border-color: #CDBFA6; box-shadow: var(--sh-card); }
.rt-card.sel { border-color: var(--green); box-shadow: 0 0 0 1px var(--green); }
.rt-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 5px; }
.rt-card-tags { display: flex; align-items: center; gap: 6px; min-width: 0; flex-wrap: wrap; }
.rt-card-right { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.rt-date { font-size: 11px; color: var(--ink3); }
.rt-save { cursor: pointer; font-size: 16px; line-height: 1; color: var(--ink4); }
.rt-save.on { color: var(--clay); }
.rt-tag { font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 5px; white-space: nowrap; }
.rt-tag-demo { font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 5px; color: var(--ink3); background: var(--line2); border: 1px dashed #D8CFBD; }
.rt-trust { font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 5px; display: inline-flex; align-items: center; gap: 3px; }
.rt-price-row { display: flex; align-items: baseline; gap: 4px; margin-bottom: 3px; }
.rt-price { font-family: var(--mono); font-weight: 700; font-size: 20px; color: var(--ink); }
.rt-price-unit { font-size: 12px; color: var(--ink2); }
.rt-signal { margin-left: auto; flex: 0 0 auto; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 5px; }
.rt-card-title { font-weight: 600; font-size: 14.5px; color: var(--ink); margin-bottom: 3px; }
.rt-card-stars { color: var(--clay); font-size: 12.5px; font-family: var(--mono); font-weight: 600; margin-left: 6px; }
.rt-card-sub { font-size: 12.5px; color: var(--ink2); margin-bottom: 6px; }
.rt-meta { display: flex; flex-wrap: wrap; gap: 5px; }
.rt-meta-chip { font-size: 11.5px; color: var(--ink2); background: var(--paper); border: 1px solid var(--line2); padding: 2px 7px; border-radius: 5px; font-family: var(--mono); }
.rt-feats { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.rt-feat-chip { font-size: 11.5px; color: var(--green); background: var(--green-s); padding: 2px 7px; border-radius: 5px; }
.rt-card-comment { font-size: 12.5px; color: var(--ink2); line-height: 1.5; margin-top: 6px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rt-cards-msg { color: var(--ink3); text-align: center; padding: 2.5rem 1rem; font-size: 13px; line-height: 1.7; }

/* ── Map ── */
.rt-map-wrap { flex: 1 1 auto; position: relative; min-width: 0; }
#map { position: absolute; inset: 0; background: #EDE8DE; }
.leaflet-container { font-family: var(--sans); background: #EDE8DE; }
.leaflet-control-attribution { font-size: 10px; background: rgba(255,255,255,.7); }
.leaflet-bar a { color: var(--ink); }
.rt-legend { position: absolute; top: 14px; right: 14px; z-index: 500; background: rgba(255,255,255,.95); border: 1px solid var(--line); border-radius: 12px; padding: 11px 13px; box-shadow: var(--sh-card); font-size: 12px; max-width: 190px; }
.rt-legend h4 { margin: 0 0 8px; font-family: var(--mono); font-weight: 600; font-size: 10px; letter-spacing: .08em; color: var(--ink3); text-transform: uppercase; }
.rt-legend-row { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; color: var(--ink2); }
.rt-legend-row .dot { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }
.rt-legend-note { font-size: 11px; color: var(--ink3); margin-top: 7px; line-height: 1.5; }
.rt-legend-note b { color: var(--green); font-weight: 600; }
.rt-map-hint { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 500; background: var(--ink); color: #fff; font-size: 12.5px; padding: 7px 14px; border-radius: 20px; box-shadow: var(--sh-toast); display: inline-flex; align-items: center; gap: 7px; }

/* Price-bubble map markers (Leaflet divIcon) */
.rt-pin { transform: translate(-50%, -100%); display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 9px 9px 9px 2px; font-family: var(--mono); font-weight: 700; font-size: 12px; color: #fff; white-space: nowrap; box-shadow: 0 2px 8px rgba(0,0,0,.28); cursor: pointer; }
.rt-pin .badge { font-size: 9.5px; font-weight: 700; padding: 0 4px; border-radius: 6px; background: rgba(255,255,255,.9); }
.rt-pin.sel { outline: 2px solid #fff; }

/* ── Overlay primitives ── */
.rt-backdrop { position: fixed; inset: 0; z-index: 700; background: rgba(35,32,26,.42); animation: fadeUp .16s ease; }
.rt-drawer { position: fixed; left: 0; top: 0; bottom: 0; z-index: 701; width: 410px; max-width: 93vw; display: flex; flex-direction: column; background: var(--paper); border-right: 1px solid var(--line); box-shadow: 0 0 46px rgba(35,32,26,.24); animation: slideInLeft .24s cubic-bezier(.2,.75,.28,1); }
.rt-detail { position: fixed; top: 112px; right: 0; bottom: 0; z-index: 620; width: 400px; max-width: 100%; display: flex; flex-direction: column; background: #fff; border-left: 1px solid var(--line); box-shadow: var(--sh-over); animation: slideInRight .24s cubic-bezier(.2,.75,.28,1); }
.rt-modal-wrap { position: fixed; inset: 0; z-index: 900; background: rgba(35,32,26,.5); display: flex; align-items: center; justify-content: center; padding: 20px; }
.rt-sheet { background: #fff; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.3); animation: popIn .2s ease; display: flex; flex-direction: column; overflow: hidden; }
.rt-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--line2); flex: 0 0 auto; }
.rt-sheet-title { font-family: var(--serif); font-weight: 700; font-size: 18px; color: var(--ink); }
.rt-x { border: none; background: var(--line2); width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 14px; color: var(--ink2); flex: 0 0 auto; }
.rt-x:hover { background: var(--line); }

/* ── Detail overlay ── */
.rt-detail-head { flex: 0 0 auto; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 18px 12px; border-bottom: 1px solid var(--line2); }
.rt-detail-eyebrow { font-family: var(--mono); font-weight: 600; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.rt-detail-loc { font-family: var(--serif); font-weight: 700; font-size: 19px; color: var(--ink); margin-top: 3px; }
.rt-detail-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 16px 18px; }
.rt-detail-rent { display: flex; align-items: baseline; gap: 6px; margin-bottom: 16px; }
.rt-detail-rent .v { font-family: var(--mono); font-weight: 700; font-size: 34px; color: var(--ink); }
.rt-detail-rent .u { font-size: 14px; color: var(--ink2); }
.rt-fair { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 8px; font-size: 12.5px; font-weight: 600; }
.rt-fair-sub { font-size: 11.5px; color: var(--ink3); margin-top: 6px; }
.rt-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line2); border: 1px solid var(--line2); border-radius: 10px; overflow: hidden; margin: 16px 0; }
.rt-fact { background: #fff; padding: 10px 12px; }
.rt-fact .k { font-size: 11px; color: var(--ink3); margin-bottom: 2px; }
.rt-fact .v { font-size: 14px; color: var(--ink); font-weight: 500; }
.rt-box { border: 1px solid var(--line); border-radius: 12px; padding: 14px; margin-bottom: 16px; }
.rt-box-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }
.rt-box-label { font-family: var(--mono); font-weight: 600; font-size: 11px; letter-spacing: .06em; color: var(--ink3); text-transform: uppercase; }
.rt-comp-badge { color: #fff; font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 6px; }
.rt-comp-line { margin-bottom: 9px; }
.rt-comp-line .lab { display: flex; justify-content: space-between; font-size: 12px; margin-bottom: 3px; }
.rt-comp-line .lab .mono { font-family: var(--mono); }
.rt-track { height: 8px; background: var(--line2); border-radius: 5px; overflow: hidden; }
.rt-track > span { display: block; height: 100%; border-radius: 5px; }
.rt-comp-note { font-size: 11.5px; color: var(--ink3); margin-top: 9px; }
.rt-detail-note { background: var(--slate-s); border-radius: 10px; padding: 12px 14px; font-size: 13px; color: var(--slate); line-height: 1.6; margin-bottom: 16px; }
.rt-quote { background: var(--paper); border-left: 3px solid var(--clay); border-radius: 0 8px 8px 0; padding: 12px 14px; font-size: 13.5px; color: #3A352B; line-height: 1.7; margin-bottom: 12px; }
.rt-ratings { margin-bottom: 14px; }
.rt-rating-row { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; }
.rt-rating-row .k { font-size: 12.5px; color: var(--ink2); width: 52px; flex: 0 0 auto; }
.rt-rating-row .v { font-family: var(--mono); font-size: 12.5px; color: var(--ink); width: 26px; text-align: right; }
.rt-overall { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.rt-overall .n { font-family: var(--mono); font-weight: 700; font-size: 30px; color: var(--clay); }
.rt-overall .stars { color: var(--clay); font-size: 15px; letter-spacing: 2px; }
.rt-exp-facts { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 13px; }
.rt-exp-fact { font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 6px; }
.rt-detail-foot { flex: 0 0 auto; padding: 14px 18px; border-top: 1px solid var(--line); background: #fff; }
.rt-safety { display: flex; align-items: flex-start; gap: 7px; margin-bottom: 12px; font-size: 11.5px; color: #8A6A16; background: var(--ochre-s); border-radius: 9px; padding: 9px 12px; line-height: 1.55; }
.rt-commute-box { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding: 10px 13px; background: var(--green-s); border: 1px solid #D3E5DA; border-radius: 11px; }
.rt-commute-box .big { font-size: 14px; font-weight: 700; color: var(--ink); }
.rt-commute-box .sub { font-size: 12px; color: var(--ink2); }
.rt-nearby-box { margin-bottom: 12px; padding: 11px 13px; background: #FBF9F4; border: 1px solid #EEE7DA; border-radius: 11px; }
.rt-nearby-chip { font-size: 11.5px; padding: 3px 8px; border-radius: 6px; display: inline-flex; align-items: center; gap: 4px; }
.rt-foot-actions { display: flex; gap: 10px; align-items: stretch; }
.rt-save-btn { flex: 0 0 auto; width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 11px; background: #fff; cursor: pointer; font-size: 20px; color: var(--ink4); }
.rt-save-btn.on { color: var(--clay); border-color: #E6CBB9; background: var(--clay-s); }
.rt-contact-btn { flex: 1; height: 46px; border: none; border-radius: 11px; background: var(--green); color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
.rt-contact-btn:hover { background: var(--green-d); }

/* ── Chat ── */
.rt-chat { width: 440px; max-width: 100%; height: 78vh; max-height: 640px; }
.rt-chat-list { flex: 1; min-height: 0; overflow-y: auto; }
.rt-thread-item { width: 100%; display: flex; align-items: center; gap: 12px; padding: 14px 20px; border: none; border-bottom: 1px solid var(--paper); background: #fff; cursor: pointer; text-align: left; }
.rt-thread-item:hover { background: #FAF8F2; }
.rt-thread-av { width: 42px; height: 42px; border-radius: 50%; background: var(--green); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; flex: 0 0 auto; }
.rt-thread-main { flex: 1; min-width: 0; }
.rt-thread-title { display: flex; align-items: center; gap: 7px; }
.rt-thread-title b { font-size: 14px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rt-thread-preview { font-size: 12.5px; color: var(--ink2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
.rt-thread-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; flex: 0 0 auto; }
.rt-thread-time { font-size: 10.5px; color: var(--ink3); white-space: nowrap; }
.rt-chat-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; padding: 40px 30px; text-align: center; color: var(--ink2); }
.rt-chat-empty .ic { font-size: 38px; margin-bottom: 14px; opacity: .45; }
.rt-chat-head { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--line2); flex: 0 0 auto; }
.rt-back { border: none; background: none; cursor: pointer; font-size: 22px; color: var(--ink2); padding: 0 4px; flex: 0 0 auto; line-height: 1; }
.rt-chat-peer { flex: 1; min-width: 0; }
.rt-chat-peer b { font-size: 14.5px; font-weight: 700; color: var(--ink); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rt-chat-peer span { font-size: 11.5px; color: var(--ink3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rt-chat-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: 16px 18px; background: var(--paper); }
.rt-chat-safety { display: flex; align-items: flex-start; gap: 7px; margin-bottom: 14px; font-size: 11px; color: #8A6A16; background: var(--ochre-s); border-radius: 9px; padding: 9px 12px; line-height: 1.55; }
.rt-msg-row { display: flex; margin-bottom: 10px; }
.rt-msg-row.me { justify-content: flex-end; }
.rt-bubble { max-width: 74%; padding: 9px 13px; font-size: 13.5px; line-height: 1.55; white-space: pre-wrap; word-break: break-word; }
.rt-bubble.me { background: var(--green); color: #fff; border-radius: 13px 13px 3px 13px; }
.rt-bubble.peer { background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: 13px 13px 13px 3px; }
.rt-msg-card { max-width: 82%; padding: 11px 13px; border-radius: 13px; background: #fff; border: 1px solid var(--line); box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.rt-msg-card.ok { border-color: var(--green); }
.rt-msg-time { font-size: 10px; color: var(--ink3); margin-top: 5px; }
.rt-msg-row.me .rt-bubble + .rt-msg-time, .rt-msg-time.me { text-align: right; }
.rt-card-when { font-size: 13px; color: #3A352B; margin-top: 5px; }
.rt-card-badge { display: inline-block; margin-top: 8px; font-size: 11px; font-weight: 600; padding: 2px 9px; border-radius: 20px; }
.rt-passport-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.rt-passport-chip { font-size: 11.5px; color: var(--green-d); background: var(--green-s); padding: 3px 9px; border-radius: 7px; }
.rt-sched { flex: 0 0 auto; padding: 12px 16px; border-top: 1px solid var(--line2); background: #FBF9F4; }
.rt-sched-lbl { font-family: var(--mono); font-weight: 600; font-size: 10px; letter-spacing: .06em; color: var(--ink3); text-transform: uppercase; margin-bottom: 7px; }
.rt-sched-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 11px; }
.rt-sched-chip { height: 32px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-size: 12.5px; color: var(--ink); cursor: pointer; }
.rt-sched-chip.on { background: var(--green); border-color: var(--green); color: #fff; }
.rt-compose { flex: 0 0 auto; display: flex; align-items: flex-end; gap: 9px; padding: 12px 16px; border-top: 1px solid var(--line2); background: #fff; }
.rt-compose-ic { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 11px; border: 1px solid var(--line); background: #fff; color: var(--ink2); font-size: 17px; cursor: pointer; line-height: 1; }
.rt-compose-ic.on { border-color: var(--green); background: var(--green-s); color: var(--green); }
.rt-compose textarea { flex: 1; min-width: 0; resize: none; max-height: 96px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 11px; font-size: 13.5px; line-height: 1.5; font-family: var(--sans); color: var(--ink); outline: none; }
.rt-send { flex: 0 0 auto; height: 42px; padding: 0 18px; border: none; border-radius: 11px; background: var(--green); color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; }
.rt-send:hover { background: var(--green-d); }

/* ── Saved / subscribe panel, commute & POI panels, filter drawer, area menu ── */
.rt-panel { width: 420px; max-width: 100%; max-height: 86vh; }
.rt-panel-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 16px 20px 20px; }
.rt-tabs { display: flex; gap: 8px; padding: 12px 20px 0; }
.rt-tab { height: 34px; padding: 0 14px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--ink2); font-size: 13px; cursor: pointer; }
.rt-tab.on { background: var(--green); border-color: var(--green); color: #fff; }
.rt-empty { font-size: 14px; color: var(--ink2); line-height: 1.7; padding: 24px 8px; text-align: center; }
.rt-saved-row { display: flex; align-items: center; gap: 11px; padding: 12px 0; border-bottom: 1px solid var(--line2); }
.rt-saved-main { flex: 1; min-width: 0; }
.rt-saved-main b { font-size: 14px; color: var(--ink); font-weight: 600; }
.rt-saved-main .s { font-size: 12px; color: var(--ink2); margin-top: 2px; }
.rt-remove { flex: 0 0 auto; border: none; background: none; cursor: pointer; font-size: 17px; color: var(--clay); }
.rt-section { margin-bottom: 16px; }
.rt-section-lbl { font-family: var(--mono); font-weight: 600; font-size: 10px; letter-spacing: .06em; color: var(--ink3); text-transform: uppercase; margin-bottom: 8px; }
.rt-field-lbl { font-size: 12.5px; color: var(--ink2); margin-bottom: 6px; }
.rt-input { width: 100%; height: 38px; padding: 0 11px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); font-size: 13.5px; color: var(--ink); font-family: var(--sans); outline: none; }
.rt-input:focus { border-color: var(--green); }
.rt-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rt-chip { height: 32px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-size: 12.5px; color: var(--ink2); cursor: pointer; }
.rt-chip.on { background: var(--green); border-color: var(--green); color: #fff; }
.rt-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; width: 100%; text-align: left; }
.rt-toggle-row .t { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.rt-toggle-row .s { font-size: 11.5px; color: var(--ink3); }
.rt-switch { flex: 0 0 auto; width: 40px; height: 23px; border-radius: 20px; background: var(--line); position: relative; transition: background .15s; }
.rt-switch > i { position: absolute; top: 2px; left: 2px; width: 19px; height: 19px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: left .15s; }
.rt-switch.on { background: var(--green); }
.rt-switch.on > i { left: 19px; }
.rt-drawer-head { flex: 0 0 auto; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 17px 20px 14px; background: #fff; border-bottom: 1px solid var(--line); }
.rt-drawer-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 14px 18px 18px; }
.rt-drawer-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 15px 16px 16px; margin-bottom: 12px; }
.rt-drawer-foot { flex: 0 0 auto; display: flex; gap: 10px; padding: 13px 18px; background: #fff; border-top: 1px solid var(--line); }
.rt-btn-primary { height: 44px; border: none; border-radius: 11px; background: var(--green); color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
.rt-btn-primary:hover { background: var(--green-d); }
.rt-btn-ghost { height: 44px; padding: 0 18px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--ink2); font-size: 14px; cursor: pointer; }
.rt-area-menu { position: absolute; z-index: 601; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--sh-over); padding: 12px; width: 240px; }
.rt-area-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }

/* ── Toast ── */
.rt-toast { position: fixed; left: 50%; bottom: 30px; transform: translateX(-50%); z-index: 2000; background: var(--ink); color: #fff; font-size: 13.5px; padding: 11px 18px; border-radius: 11px; box-shadow: var(--sh-toast); animation: toastIn .24s ease; display: inline-flex; align-items: center; gap: 8px; max-width: 90vw; }
.rt-toast .ok { color: #7FD1A6; }

/* ── Responsive ── */
@media (max-width: 860px) {
  .rt-aside { flex-basis: 300px; }
}
@media (max-width: 720px) {
  .rt-main { flex-direction: column; }
  .rt-aside { flex: 1 1 auto; border-right: none; border-bottom: 1px solid var(--line); }
  .rt-map-wrap { flex: 0 0 300px; }
  .rt-detail { width: 100%; }
  .rt-search { max-width: none; }
}