/* ============================================================
   平仄搜團台 — 品牌樣式
   取自平仄官網 dofuntrip.com 的視覺：米白底 × 墨綠 × 藍灰 accent × 襯線字
   ============================================================ */
:root{
  /* 品牌色 */
  --ink:#213631;          /* 墨綠主色（logo、標題） */
  --ink-2:#26344a;        /* 深藍灰（次要深色） */
  --accent:#6086aa;       /* 藍灰 CTA */
  --accent-deep:#3e577d;  /* 深藍灰 hover */
  --cream:#faf8f3;        /* 主背景 米白 */
  --cream-2:#f2eee6;      /* 次背景 */
  --cream-3:#ebe6dc;      /* 卡片分隔/邊 */
  --paper:#ffffff;        /* 卡片白 */
  --mist:#8499b5;         /* 藍灰輔助 */
  --mist-2:#b3c1d3;       /* 淡藍灰 */
  --muted:#5a6472;        /* 次要文字 */
  --line:#e2ddd2;         /* 細線 */
  /* 狀態 */
  --ok:#3f7d5f; --ok-bg:#e4efe8;
  --warn:#b4691a; --warn-bg:#f6e8d4;
  /* 廠商 */
  --wu:#b4691a; --wu-bg:#f6e8d4;
  --cola:#c0392b; --cola-bg:#f6e0dc;
  --lion:#1f6f8b; --lion-bg:#dcecf1;
  --uplan:#6d5aa6; --uplan-bg:#e8e2f3;
  --t4u:#2e8b57; --t4u-bg:#dcefe3;
  --erts:#b14a78; --erts-bg:#f6e0eb;
  --bwt:#c77d2e; --bwt-bg:#f6ecdd;
  --set:#3f6fb5; --set-bg:#dde7f4;
  --best:#1f9b8e; --best-bg:#d8efec;
  /* 字體 */
  --serif:"Noto Serif TC",Georgia,"Times New Roman",serif;
  --sans:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  --radius:14px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#e8ebe4; --ink-2:#cdd6e4; --accent:#7fa6cc; --accent-deep:#a7c4e0;
  --cream:#121613; --cream-2:#191e1a; --cream-3:#232a24; --paper:#1b211c;
  --mist:#8499b5; --mist-2:#5a6b84; --muted:#9aa89d; --line:#2c352c;
  --ok:#7bc39c; --ok-bg:#1b2c22; --warn:#e0a558; --warn-bg:#2e2414;
  --wu:#e0a558; --wu-bg:#2e2414; --cola:#f0776a; --cola-bg:#331c19;
  --lion:#6fc0d8; --lion-bg:#15303a; --uplan:#b4a3e6; --uplan-bg:#241f33;
  --t4u:#7ccfa0; --t4u-bg:#163020; --erts:#e59bbf; --erts-bg:#331a26; --bwt:#e2a860; --bwt-bg:#33260f; --set:#86aee0; --set-bg:#172234; --best:#5fc9bd; --best-bg:#102a27;
  color-scheme:dark;
}}
:root[data-theme="dark"]{
  --ink:#e8ebe4; --ink-2:#cdd6e4; --accent:#7fa6cc; --accent-deep:#a7c4e0;
  --cream:#121613; --cream-2:#191e1a; --cream-3:#232a24; --paper:#1b211c;
  --mist:#8499b5; --mist-2:#5a6b84; --muted:#9aa89d; --line:#2c352c;
  --ok:#7bc39c; --ok-bg:#1b2c22; --warn:#e0a558; --warn-bg:#2e2414;
  --wu:#e0a558; --wu-bg:#2e2414; --cola:#f0776a; --cola-bg:#331c19;
  --lion:#6fc0d8; --lion-bg:#15303a; --uplan:#b4a3e6; --uplan-bg:#241f33;
  --t4u:#7ccfa0; --t4u-bg:#163020; --erts:#e59bbf; --erts-bg:#331a26; --bwt:#e2a860; --bwt-bg:#33260f; --set:#86aee0; --set-bg:#172234; --best:#5fc9bd; --best-bg:#102a27;
  color-scheme:dark;
}

*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.6;
  -webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;
  padding-left:max(18px,env(safe-area-inset-left,0px));
  padding-right:max(18px,env(safe-area-inset-right,0px))}

/* ---------- 頂部 ---------- */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--cream);
  border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);
  z-index:21;background:var(--cream)}
.topbar .wrap{display:flex;align-items:center;gap:14px;padding-block:13px}
.brand{font-family:var(--serif);font-weight:700;font-size:1.3rem;color:var(--ink);
  text-decoration:none;letter-spacing:.04em;white-space:nowrap}
.brand small{display:block;font-family:var(--sans);font-size:.56rem;letter-spacing:.32em;
  color:var(--mist);font-weight:500;margin-top:1px}
.topbar form{flex:1;min-width:0;display:flex;gap:8px}
.topbar input{flex:1;min-width:0;font-family:var(--sans);font-size:.95rem;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:10px 16px}
.topbar input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.topbar button{border:none;background:var(--ink);color:var(--cream);border-radius:999px;
  padding:0 18px;font-family:var(--sans);font-weight:700;font-size:.9rem;cursor:pointer}
.topbar button:hover{background:var(--accent-deep)}

/* ---------- 共用 ---------- */
.eyebrow{font-family:var(--sans);font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--mist);font-weight:700}
.sec-title{font-family:var(--serif);font-weight:700;font-size:1.5rem;color:var(--ink);margin:4px 0 0;
  letter-spacing:.02em;text-wrap:balance}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 0 16px}
.sec-head a.more{font-size:.82rem;color:var(--accent-deep);text-decoration:none;font-weight:700;white-space:nowrap}
.sec-head a.more:hover{text-decoration:underline}

/* ---------- 商品卡（橫式長條：圖左、資訊右，單欄往下） ---------- */
.cards{display:flex;flex-direction:column;gap:14px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:row;align-items:stretch;transition:box-shadow .15s,transform .15s}
.card:hover{box-shadow:0 8px 24px rgba(33,54,49,.1);transform:translateY(-1px)}
.card-photo{position:relative;flex:0 0 32%;max-width:300px;min-width:168px;overflow:hidden;
  background:linear-gradient(135deg,var(--ink),var(--ink-2));text-decoration:none}
.card-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;border:0;z-index:1}
/* 預設圖：沒有商品圖或圖載入失敗時，在目的地底色上顯示品牌圖示 */
.photo-ph{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;
  color:rgba(255,255,255,.5);pointer-events:none}
.photo-ph svg{width:40px;height:40px;opacity:.85}
.photo-ph em{font-family:var(--sans);font-style:normal;font-size:.56rem;font-weight:700;letter-spacing:.3em;color:rgba(255,255,255,.4)}
.photo-air{position:absolute;top:10px;left:10px;right:10px;z-index:1;font-size:.68rem;font-weight:700;color:var(--ink);
  background:rgba(255,255,255,.92);border-radius:999px;padding:4px 10px;display:inline-block;width:fit-content;
  max-width:calc(100% - 20px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-photo-pin{position:absolute;left:10px;bottom:10px;z-index:1;font-size:.66rem;font-weight:700;color:#fff;
  background:rgba(33,54,49,.72);border-radius:5px;padding:3px 9px;letter-spacing:.03em}
/* 無圖時每個目的地給不同底色，fallback 也好看 */
.card-photo[data-dest="北海道"]{background:linear-gradient(135deg,#2a4a5c,#1f3631)}
.card-photo[data-dest="東京"]{background:linear-gradient(135deg,#3e4a5c,#26344a)}
.card-photo[data-dest="大阪關西"]{background:linear-gradient(135deg,#5a4a3e,#3e3730)}
.card-photo[data-dest="沖繩"]{background:linear-gradient(135deg,#2d6a7a,#1f4a52)}
.card-photo[data-dest="九州"]{background:linear-gradient(135deg,#6a4a4a,#4a3030)}
.card-photo[data-dest="首爾"]{background:linear-gradient(135deg,#4a5a7a,#2d3e5c)}
.card-photo[data-dest="泰國"]{background:linear-gradient(135deg,#7a6a3e,#5c4a26)}
.card-photo[data-dest="越南"],.card-photo[data-dest="峴港"],.card-photo[data-dest="河內下龍"],.card-photo[data-dest="芽莊"]{background:linear-gradient(135deg,#3e6a5c,#26473e)}
.card-photo[data-dest="歐洲"]{background:linear-gradient(135deg,#4a5c6a,#2d3e4a)}
.card-body{flex:1;min-width:0;padding:13px 16px;display:flex;flex-direction:column;gap:8px}
.vtag{font-size:.66rem;font-weight:700;padding:2px 9px;border-radius:5px;white-space:nowrap}
.vtag.五福{background:var(--wu-bg);color:var(--wu)} .vtag.可樂{background:var(--cola-bg);color:var(--cola)}
.vtag.雄獅{background:var(--lion-bg);color:var(--lion)} .vtag.旅天下{background:var(--uplan-bg);color:var(--uplan)}
.vtag.山富{background:var(--t4u-bg);color:var(--t4u)} .vtag.旅遊家{background:var(--erts-bg);color:var(--erts)}
.vtag.百威{background:var(--bwt-bg);color:var(--bwt)}
.vtag.東南{background:var(--set-bg);color:var(--set)} .vtag.喜鴻{background:var(--best-bg);color:var(--best)}
.card-meta{display:flex;align-items:center;gap:8px;font-size:.76rem;color:var(--muted);letter-spacing:.02em;flex-wrap:wrap}
.card-meta .metatxt b{color:var(--ink);font-weight:700}
.statrow{display:inline-flex;gap:5px;align-items:center}
.st{font-size:.66rem;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap;letter-spacing:.02em}
.st-go{background:var(--ok-bg);color:var(--ok)}
.st-ok{background:var(--cream-2);color:var(--ink-2)}
.st-wait{background:var(--warn-bg);color:var(--warn)}
.st-seat{background:var(--cream-2);color:var(--muted)}
.st-low{background:var(--cola-bg);color:var(--cola)}
.card-title{font-family:var(--serif);font-size:1.12rem;font-weight:700;line-height:1.4;margin:0;color:var(--ink);text-wrap:balance}
.tags{display:flex;gap:6px;flex-wrap:wrap}
.tag{font-size:.68rem;color:var(--ink-2);background:var(--cream-2);border-radius:6px;padding:3px 9px;white-space:nowrap}
.tag.theme{background:var(--ink);color:var(--cream)}
.dates{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.dates-lab{font-size:.7rem;color:var(--muted);margin-right:2px}
.dchip{font-size:.72rem;font-variant-numeric:tabular-nums;color:var(--ink);background:var(--cream-2);
  border:1px solid var(--line);border-radius:7px;padding:3px 8px;line-height:1.3}
.dchip.more{color:var(--muted);background:transparent;border-style:dashed}
.card-foot{margin-top:auto;padding-top:10px;border-top:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:10px}
.price{font-family:var(--serif);display:flex;align-items:baseline;gap:4px;flex-wrap:wrap}
.price .num{font-size:1.3rem;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.price .cur{font-size:.7rem;color:var(--muted);font-family:var(--sans);font-weight:500}
.price .from{font-size:.68rem;color:var(--muted);font-family:var(--sans)}
.price .ind{font-family:var(--sans);font-size:.68rem;font-weight:700;color:var(--cola)}
a.cta{text-decoration:none;font-family:var(--sans);font-size:.85rem;font-weight:700;color:var(--cream);
  background:var(--accent);border-radius:999px;padding:9px 18px;white-space:nowrap}
a.cta:hover{background:var(--accent-deep)}
/* 窄螢幕：圖維持在左、縮小 */
@media (max-width:520px){
  .card-photo{flex-basis:38%;min-width:116px;max-width:150px}
  .card-body{padding:11px 13px;gap:7px}
  .card-title{font-size:1rem}
  .photo-air{font-size:.6rem;padding:3px 7px;top:7px;left:7px;right:7px;max-width:calc(100% - 14px)}
}

/* ---------- chips / 篩選 ---------- */
.chiprow{display:flex;gap:8px;flex-wrap:wrap}
.fchip{font-family:var(--sans);font-size:.85rem;font-weight:500;cursor:pointer;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:7px 15px;
  text-decoration:none;white-space:nowrap}
.fchip:hover{border-color:var(--accent)}
.fchip[aria-pressed="true"]{background:var(--ink);color:var(--cream);border-color:var(--ink)}

/* ---------- 搜尋頁：條件列 + 篩選面板 ---------- */
.searchbar{display:flex;gap:8px;margin:16px 0 6px}
.searchbar input{flex:1;min-width:0;font-family:var(--sans);font-size:1rem;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:12px 18px}
.searchbar input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.searchbar button{border:none;background:var(--ink);color:var(--cream);border-radius:999px;
  padding:0 20px;font-family:var(--sans);font-weight:700;font-size:.92rem;cursor:pointer}
.searchbar button:hover{background:var(--accent-deep)}
.hint{font-size:.74rem;color:var(--muted);margin:0 0 12px;padding-left:4px}

/* 已套用條件：可移除的 chip（NL 與面板同步的視覺呈現） */
.active-cond{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin:4px 0 14px;min-height:2px}
.cond{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:600;color:var(--cream);
  background:var(--accent);border-radius:999px;padding:5px 7px 5px 13px}
.cond b{font-weight:700}
.cond .x{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:999px;
  background:rgba(255,255,255,.25);color:#fff;font-size:.8rem;line-height:1;cursor:pointer;border:none}
.cond .x:hover{background:rgba(255,255,255,.45)}
.cond.clear{background:transparent;color:var(--accent-deep);border:1px dashed var(--line);padding:5px 13px;cursor:pointer;font-weight:700}

/* 篩選列：桌機一排，手機收合成抽屜 */
.filterbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.filter-toggle{display:none}
.result-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:6px 0 14px}
.result-count{font-size:.86rem;color:var(--muted)}
.result-count b{color:var(--ink);font-weight:700}
.sortsel{font-family:var(--sans);font-size:.82rem;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);border-radius:999px;padding:7px 12px;cursor:pointer}

.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 18px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;margin-bottom:16px}
.fgroup{display:flex;flex-direction:column;gap:8px}
.fgroup>.lab{font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.fgroup .chiprow{gap:6px}
.fgroup .fchip{font-size:.8rem;padding:6px 12px}
.frange{display:flex;align-items:center;gap:6px}
.frange input{width:100%;font-family:var(--sans);font-size:.85rem;color:var(--ink);background:var(--cream);
  border:1px solid var(--line);border-radius:8px;padding:7px 10px}
.frange span{color:var(--muted);font-size:.8rem}

/* 手機：篩選抽屜 */
@media (max-width:640px){
  .filter-toggle{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--paper);
    color:var(--ink);border-radius:999px;padding:9px 16px;font-family:var(--sans);font-weight:700;font-size:.88rem;cursor:pointer}
  .filter-toggle b.n{background:var(--ink);color:var(--cream);border-radius:999px;font-size:.7rem;padding:1px 7px}
  .filters{display:none;grid-template-columns:1fr}
  .filters.open{display:grid}
  .searchbar input{font-size:16px} /* 防 iOS 放大 */
}

/* ---------- 空狀態 / 註腳 ---------- */
.empty{text-align:center;color:var(--muted);padding:48px 16px;font-family:var(--serif);font-size:1.05rem}
footer{margin-top:40px;border-top:1px solid var(--line)}
footer .wrap{padding-block:22px 40px;font-size:.76rem;color:var(--muted);line-height:1.7}
footer b{color:var(--ink)}
footer .vn{color:var(--accent-deep);font-weight:700}
   新功能 UI：比較選取 / 比較視窗 / 分享對話框 / 落地頁共用
   ============================================================ */
.card{position:relative}

/* 卡片上的「比較」勾選 */
.cmp-pick{position:absolute;top:10px;right:10px;z-index:3;display:inline-flex;align-items:center;gap:5px;
  background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:999px;padding:4px 9px 4px 7px;
  cursor:pointer;font-size:.72rem;font-weight:700;color:var(--ink);backdrop-filter:blur(2px)}
.cmp-pick input{accent-color:var(--ink);width:14px;height:14px;cursor:pointer;margin:0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cmp-pick{background:rgba(27,33,28,.9)}}

/* 卡片動作列（分享 + 看行程） */
.card-actions{display:flex;align-items:center;gap:8px}
.share-btn{font-family:var(--sans);font-size:.82rem;font-weight:700;color:var(--accent-deep);
  background:var(--cream-2);border:1px solid var(--line);border-radius:999px;padding:7px 14px;cursor:pointer;white-space:nowrap}
.share-btn:hover{background:var(--cream-3)}

/* 底部已選列 */
.cmp-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--paper);border-top:1px solid var(--line);
  box-shadow:0 -6px 20px rgba(33,54,49,.1);padding-bottom:env(safe-area-inset-bottom,0px)}
.cmp-bar-in{max-width:960px;margin:0 auto;padding:12px 18px;display:flex;align-items:center;gap:12px}
.cmp-count{font-weight:700;color:var(--ink);white-space:nowrap}
.cmp-chips{display:flex;gap:7px;flex-wrap:wrap;flex:1;min-width:0}
.cmp-chip{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;background:var(--cream-2);
  border:1px solid var(--line);border-radius:999px;padding:4px 6px 4px 10px;color:var(--ink)}
.vdot{width:8px;height:8px;border-radius:50%;display:inline-block}
.vdot.五福{background:var(--wu)} .vdot.可樂{background:var(--cola)} .vdot.雄獅{background:var(--lion)} .vdot.旅天下{background:var(--uplan)}
.cmp-x{border:none;background:none;color:var(--mist);font-size:1rem;cursor:pointer;line-height:1;padding:0 2px}
.cmp-x:hover{color:var(--ink)}
.cmp-sp{flex:1}
.cmp-clear{background:none;border:none;color:var(--mist);font-weight:700;cursor:pointer;font-size:.85rem}
.cmp-go{background:var(--ink);color:var(--cream);border:none;border-radius:999px;padding:10px 18px;font-weight:700;
  cursor:pointer;white-space:nowrap;font-size:.9rem}
.cmp-go:disabled{background:var(--mist-2);cursor:default;color:var(--paper)}
body.has-cmpbar{padding-bottom:80px}

/* 覆蓋層（比較 / 分享共用） */
.ov{position:fixed;inset:0;z-index:60;background:rgba(20,30,25,.5);display:flex;align-items:center;justify-content:center;
  padding:18px}
.ov-box{background:var(--cream);border-radius:16px;width:100%;max-width:440px;max-height:90vh;display:flex;flex-direction:column;
  overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.ov-wide{max-width:860px}
.ov-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line)}
.ov-head h3{font-family:var(--serif);font-size:1.15rem;color:var(--ink);margin:0}
.ov-head small{font-weight:500;color:var(--mist);font-size:.8rem;margin-left:6px}
.ov-close{background:none;border:none;font-size:1.5rem;color:var(--mist);cursor:pointer;line-height:1}
.ov-scroll{overflow:auto;padding:18px 20px}
.ov-pad{padding:18px 20px}
body.noscroll{overflow:hidden}

/* 比較表 */
.ct{border-collapse:collapse;width:100%;font-size:.86rem;min-width:420px}
.ct th,.ct td{border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top}
.ct thead th{background:var(--cream-2);font-family:var(--serif);color:var(--ink);text-align:center}
.ct tbody th{background:var(--cream-2);color:var(--mist);font-weight:700;white-space:nowrap;width:76px;font-size:.78rem}
.ct td{background:var(--paper);color:var(--ink)}
.ct-title{color:var(--accent-deep);text-decoration:none;font-weight:500}
.ct-title:hover{text-decoration:underline}
.ct-best{background:#eef5ee !important;font-weight:700}
.ct-flag{font-size:.66rem;color:#2f7d4f;font-weight:700;font-style:normal;background:#d9efdf;border-radius:4px;padding:1px 5px;margin-left:4px}
.ct-na{color:var(--mist-2);font-style:italic}
.ct-detail th{opacity:.7}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ct-best{background:#17321f !important} :root:not([data-theme="light"]) .ct-flag{background:#17321f;color:#7fcf9a}}

/* AI 區塊 */
.ai-block{margin-top:20px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.ai-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--cream-2);padding:12px 16px;border-bottom:1px solid var(--line)}
.ai-title{font-family:var(--serif);font-weight:700;color:var(--ink)}
.seg{display:inline-flex;background:var(--paper);border:1px solid var(--line);border-radius:999px;overflow:hidden}
.seg-b{border:none;background:none;padding:6px 14px;font-weight:700;font-size:.82rem;color:var(--mist);cursor:pointer}
.seg-b.on{background:var(--ink);color:var(--cream)}
.ai-demo{font-size:.72rem;color:var(--mist);margin-left:auto}
.ai-body{padding:16px}
.ai-body p{margin:0;color:var(--ink);line-height:1.75}
.ai-biz{margin:0;padding-left:18px;color:var(--ink);line-height:1.7}
.ai-biz li{margin-bottom:7px}

/* 分享對話框 */
.shr-tour{font-size:.92rem;color:var(--ink);line-height:1.5;margin:0 0 14px}
.shr-lab{display:block;font-size:.76rem;font-weight:700;color:var(--mist);margin:12px 0 5px}
.shr-sales{width:100%;font-family:var(--sans);font-size:.92rem;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.shr-linkrow{display:flex;gap:8px}
.shr-link{flex:1;min-width:0;font-family:var(--sans);font-size:.85rem;color:var(--ink);background:var(--cream-2);
  border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.shr-copy{background:var(--ink);color:var(--cream);border:none;border-radius:10px;padding:0 16px;font-weight:700;cursor:pointer;white-space:nowrap}
.shr-note{font-size:.78rem;color:var(--mist);line-height:1.6;margin:12px 0 0}
.shr-actions{margin-top:14px;text-align:right}
.shr-preview{color:var(--accent-deep);font-weight:700;text-decoration:none;font-size:.9rem}
.shr-preview:hover{text-decoration:underline}

@media (max-width:600px){
  .cmp-bar-in{padding:10px 12px;gap:8px}
  .cmp-chips{display:none}
  .ov{padding:0;align-items:stretch}
  .ov-box{max-width:none;max-height:100vh;border-radius:0}
}

/* 右上角收合選單 */
.topmenu{position:relative;flex:0 0 auto;margin-left:auto}
.topmenu-btn{display:flex;align-items:center;justify-content:center;width:40px;height:36px;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:10px;font-size:1.15rem;line-height:1;cursor:pointer}
.topmenu-btn:hover{border-color:var(--accent);color:var(--accent-deep)}
.topmenu-panel{position:absolute;right:0;top:calc(100% + 8px);min-width:150px;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.14);padding:6px;display:none;z-index:50}
.topmenu.open .topmenu-panel{display:block}
.topmenu-panel a{display:block;padding:10px 13px;border-radius:8px;font-size:.9rem;font-weight:500;color:var(--ink);text-decoration:none;white-space:nowrap}
.topmenu-panel a:hover{background:var(--cream-3)}
/* 旅行社 chip 不上色 */
/* 旅行社 chip 不上色 */

.spot-card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin-bottom:14px}
.spot-h{font-weight:600;margin-bottom:10px;color:var(--ink)}
.spot-list{display:flex;flex-wrap:wrap;gap:8px}
.spot-list .spot{font-size:.85rem;background:var(--cream,#f4f1ea);border:1px solid var(--line);border-radius:999px;padding:5px 12px;color:var(--ink)}