/* 我的旅帖（my.html）：收納箱、地圖檢視、行程、分享與共編、副本與版本。
   設計見 proposals/account-ui.html §收納箱 §行程 §分享、共編與複製 §手機版 §各種狀態；色彩與間距全部來自 site.css 的設計記號。
   所有類別以 my- 開頭，避免與 site.css 的元件同名。 */
body{background:var(--paper)}
.my-ico{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
.my-ico.s{width:14px;height:14px}
.my-hide{display:none!important}
.my-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- 按鈕、膠囊、輸入 ---------- */
.my-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 14px;border-radius:8px;border:1px solid var(--line);background:var(--sheet);
  color:var(--ink);font:500 13.5px/1.2 var(--f-body);cursor:pointer;white-space:nowrap;text-decoration:none}
.my-btn:hover{border-color:var(--ink-3)}
.my-btn.pri{background:var(--btn-pri-bg);border-color:var(--btn-pri-bg);color:#f4f5f2}   /* --btn-pri-bg：site.css，深色另給較亮的藍 */
.my-btn.pri:hover{filter:brightness(1.15)}
.my-btn.gold{background:var(--glow);border-color:var(--glow);color:#1b1f27}
.my-btn.ghost{border-color:transparent;background:none;color:var(--ink-2)}
.my-btn.ghost:hover{background:var(--paper-2);color:var(--ink)}
.my-btn.sm{min-height:30px;padding:0 10px;font-size:12.5px}
.my-btn.danger{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 55%,var(--line))}
.my-btn.danger.solid{background:var(--warn);border-color:var(--warn);color:#fff}
.my-btn[disabled]{opacity:.5;cursor:default}
.my-btn[aria-busy="true"]{opacity:.65;cursor:progress}
.my-ib{width:34px;height:34px;display:inline-grid;place-items:center;border:1px solid transparent;border-radius:8px;background:none;color:var(--ink-3);cursor:pointer;flex:none;padding:0}
.my-ib:hover{background:var(--paper-2);color:var(--ink)}
.my-ib[aria-pressed="true"]{border-color:var(--line);background:var(--sheet);color:var(--ink)}
.my-fc{white-space:nowrap;font:13px/1.4 var(--f-body);border:1px solid var(--line);border-radius:var(--r-pill);padding:4px 12px;background:var(--sheet);color:var(--ink-2);cursor:pointer;
  display:inline-flex;gap:6px;align-items:center}
.my-fc:hover{border-color:var(--ink-3);color:var(--ink)}
.my-fc[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.my-fc i{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}
.my-fc em{font:400 12px var(--f-mono);font-style:normal;opacity:.75}
.my-in{box-sizing:border-box;width:100%;height:40px;border:1px solid var(--line);border-radius:8px;padding:0 12px;background:var(--sheet);color:var(--ink);font:14.5px var(--f-body)}
textarea.my-in{height:auto;min-height:72px;padding:8px 12px;line-height:1.6;resize:vertical}
select.my-in{padding-right:28px}
.my-in:focus{outline:none;border-color:var(--ai);box-shadow:0 0 0 3px color-mix(in srgb,var(--ai) 18%,transparent)}
.my-in.err{border-color:var(--warn)}
.my-lab{display:block;font-size:12.5px;color:var(--ink-2);margin-bottom:5px}
.my-hint{font-size:12px;color:var(--ink-3);margin-top:5px}
.my-hint.err{color:var(--warn)}
.my-chk{display:flex;gap:10px;align-items:flex-start;font-size:14px;cursor:pointer;line-height:1.5}
.my-chk input{width:17px;height:17px;margin:2px 0 0;accent-color:var(--ai);flex:none}
.my-chk small{display:block;font-size:12px;color:var(--ink-3)}
.my-av{width:30px;height:30px;border-radius:50%;background:var(--glow);color:#1b1f27;display:inline-grid;place-items:center;font:700 13px/1 var(--f-display);flex:none;position:relative}
.my-av.c1{background:var(--ai);color:var(--paper)}.my-av.c2{background:var(--kinu);color:var(--paper)}.my-av.c3{background:var(--kin);color:var(--paper)}.my-av.c4{background:var(--tabe);color:var(--paper)}
.my-av.on::after{content:"";position:absolute;right:-1px;bottom:-1px;width:8px;height:8px;border-radius:50%;background:var(--ok);border:2px solid var(--paper)}
.my-stack{display:inline-flex;padding-left:8px}
.my-stack .my-av{width:28px;height:28px;font-size:12px;border:2px solid var(--paper);margin-left:-8px}
.my-stack.xs .my-av{width:18px;height:18px;font-size:9px;border-width:1px;margin-left:-5px}
.my-bdg{font-size:11.5px;border-radius:6px;padding:1px 8px;white-space:nowrap;display:inline-block;line-height:1.6}
.my-bdg.ok{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
.my-bdg.no{background:var(--paper-2);color:var(--ink-3)}
.my-bdg.new{background:color-mix(in srgb,var(--glow) 28%,transparent);color:var(--kin-text)}
.my-kick{font:500 11px var(--f-mono);letter-spacing:.2em;color:var(--kin-text);text-transform:uppercase;display:block}
.my-capt{font:500 11px var(--f-mono);letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase;margin:0}

/* ---------- 版面：左側導覽＋內容 ---------- */
.my-root{max-width:calc(1320px + 2 * var(--gutter));margin:0 auto;padding:0 var(--gutter)}
.my-shell{display:grid;grid-template-columns:224px minmax(0,1fr);gap:var(--s6);align-items:start;padding-block:var(--s5) var(--s8)}
.my-side{position:sticky;top:calc(var(--head-h) + var(--s5));display:flex;flex-direction:column;gap:2px;font-size:14px;max-height:calc(100vh - var(--head-h) - 48px);overflow:auto;
  padding-right:4px;scrollbar-width:thin}
.my-srch{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:0 8px 0 10px;color:var(--ink-3);background:var(--sheet);height:36px;margin-bottom:8px}
.my-srch:focus-within{border-color:var(--ai);box-shadow:0 0 0 3px color-mix(in srgb,var(--ai) 15%,transparent)}
.my-srch input{flex:1;min-width:0;border:0;outline:0;background:none;font:13.5px var(--f-body);color:var(--ink);height:100%}
.my-srch kbd{font:11px var(--f-mono);border:1px solid var(--line);border-radius:4px;padding:0 4px;background:var(--paper);color:var(--ink-3)}
.my-side .gh{font:500 11px var(--f-mono);letter-spacing:.18em;color:var(--ink-3);padding:16px 10px 6px;text-transform:uppercase;display:flex;align-items:center}
.my-side .gh button{margin-left:auto;width:24px;height:24px;border-radius:6px;border:0;background:none;color:var(--ink-3);cursor:pointer;display:grid;place-items:center}
.my-side .gh button:hover{background:var(--paper-2);color:var(--ink)}
.my-side a{display:flex;align-items:center;gap:10px;min-height:36px;padding:0 10px;border-radius:8px;color:var(--ink-2);text-decoration:none;min-width:0}
.my-side a span.t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-side a:hover{background:var(--sheet);color:var(--ink)}
.my-side a[aria-current]{background:var(--sheet);color:var(--ink);font-weight:600;box-shadow:inset 2px 0 0 var(--glow)}
.my-side a em{font:400 12px var(--f-mono);font-style:normal;color:var(--ink-3);flex:none}
.my-side a.drop-on{outline:1.5px dashed var(--ai);outline-offset:-2px}
.my-sw{width:10px;height:10px;border-radius:3px;flex:none}
.my-side .none{font-size:12.5px;color:var(--ink-3);padding:2px 10px 6px}
.my-sync{margin-top:var(--s4);padding:10px;font-size:12px;color:var(--ok);display:flex;gap:6px;align-items:center}
.my-sync[data-s="off"],.my-sync[data-s="err"]{color:var(--kin-text)}
.my-sync[data-s="pend"]{color:var(--ink-3)}
.my-pane{min-width:0;display:flex;flex-direction:column;gap:var(--s4)}
.my-ph{display:flex;align-items:flex-end;gap:var(--s4);flex-wrap:wrap}
.my-ph h1{margin:0;font:700 var(--fs-h2)/1.3 var(--f-display);letter-spacing:.08em}
.my-ph p{margin:2px 0 0;font-size:13.5px;color:var(--ink-2)}
.my-ph .r{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.my-off{display:flex;gap:8px;align-items:center;background:color-mix(in srgb,var(--kin) 14%,var(--sheet));border:1px solid color-mix(in srgb,var(--kin) 40%,var(--line));color:var(--ink);
  border-radius:8px;padding:8px 12px;font-size:13px}
.my-off .my-btn{margin-left:auto}

/* ---------- 篩選列 ---------- */
.my-flt{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.my-flt .sep{width:1px;height:20px;background:var(--line);margin:0 2px}
.my-flt .r{margin-left:auto;display:flex;gap:4px;align-items:center}
.my-sort{border:0;background:none;font:13px var(--f-body);color:var(--ink-2);cursor:pointer;padding:4px;border-radius:6px}
.my-sort:hover{color:var(--ink)}

/* ---------- 收納卡（格狀） ---------- */
.my-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.my-it{background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;position:relative;cursor:pointer;transition:transform .15s,box-shadow .15s;
  display:flex;flex-direction:column;text-align:left;color:inherit;font:inherit;padding:0}
.my-it:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.my-it:focus-visible{outline:2px solid var(--glow);outline-offset:2px}
.my-it .my-img,.my-it .my-fb{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--paper-2)}
.my-fb{display:grid!important;place-items:center;font:700 44px/1 var(--f-display);color:var(--k,var(--ai));background:color-mix(in srgb,var(--k,var(--ai)) 12%,var(--sheet))!important;
  letter-spacing:0;overflow:hidden;user-select:none}
.my-it .bd{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px;min-width:0}
.my-it h3{margin:0;font:700 15px/1.4 var(--f-display);letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-m{font:12px/1.5 var(--f-mono);color:var(--ink-3);display:flex;gap:8px;flex-wrap:wrap;min-width:0}
.my-m .sc,.my-sc{color:var(--tabe);font-family:var(--f-mono);font-weight:500}
.my-tg{position:absolute;top:8px;left:8px;font-size:11.5px;background:rgba(18,21,27,.72);color:#fff;border-radius:6px;padding:1px 8px;line-height:1.6;max-width:calc(100% - 50px);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-sel{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:7px;border:0;background:none;display:grid;place-items:center;cursor:pointer;padding:0;opacity:0;transition:opacity .12s}
.my-sel span{width:22px;height:22px;border-radius:6px;background:rgba(255,255,255,.92);border:1.5px solid rgba(0,0,0,.28);display:grid;place-items:center;color:#fff}
.my-it:hover .my-sel,.my-sel:focus-visible,.my-picking .my-sel,.my-it.picked .my-sel{opacity:1}
.my-it.picked{outline:2px solid var(--ai);outline-offset:-1px}
.my-it.picked .my-sel span,.my-row.picked .my-sel span{background:var(--ai);border-color:var(--ai)}
.my-trip{font-size:12px;color:var(--ai);display:flex;align-items:center;gap:4px;min-width:0;line-height:1.5}
.my-trip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-note{font-size:12.5px;color:var(--ink-2);line-height:1.5;margin-top:2px;border-left:2px solid var(--kin);padding-left:8px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* ---------- 收納列（清單） ---------- */
.my-rows{display:flex;flex-direction:column;background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.my-row{display:grid;grid-template-columns:28px 64px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 12px;border-bottom:1px solid var(--line);cursor:pointer;position:relative}
.my-row:last-child{border-bottom:0}
.my-row:hover{background:var(--paper)}
.my-row.picked{background:color-mix(in srgb,var(--ai) 7%,var(--sheet))}
.my-row .my-sel{position:static;opacity:1}
.my-row .my-img,.my-row .my-fb{width:64px;height:64px;border-radius:8px;object-fit:cover;font-size:26px}
.my-row h3{margin:0;font:700 15px/1.4 var(--f-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-row .my-note{-webkit-line-clamp:1}

/* ---------- 底部批次操作列 ---------- */
.my-bulk{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:1200;display:flex;align-items:center;gap:10px;background:var(--ink);
  color:var(--paper);border-radius:12px;padding:8px 10px 8px 16px;font-size:13.5px;box-shadow:var(--shadow);width:min(640px,calc(100vw - 32px))}
.my-bulk[hidden]{display:none}
.my-bulk b{white-space:nowrap}
.my-bulk .sp{flex:1}
.my-bulk .my-btn{background:transparent;border-color:rgba(255,255,255,.25);color:var(--paper)}
.my-bulk .my-btn:hover{border-color:rgba(255,255,255,.6)}
.my-bulk .my-btn.gold{background:var(--glow);color:#1b1f27;border-color:var(--glow)}
.my-bulk kbd{font:11px var(--f-mono);opacity:.6}

/* ---------- 狀態卡 ---------- */
.my-state{background:var(--sheet);border:1px solid var(--line);border-radius:14px;padding:32px 28px;display:flex;flex-direction:column;gap:10px;align-items:flex-start;max-width:560px}
.my-state.c{align-items:center;text-align:center;margin:var(--s7) auto}
.my-state h2{margin:0;font:700 20px/1.4 var(--f-display);letter-spacing:.05em}
.my-state p{margin:0;font-size:14px;color:var(--ink-2);line-height:1.75}
.my-state .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.my-state.err h2{color:var(--warn)}
.my-sk{background:var(--paper-2);border-radius:6px;animation:my-sk 1.4s ease-in-out infinite}
@keyframes my-sk{50%{opacity:.5}}
.my-skc{background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;display:flex;flex-direction:column;gap:8px;padding-bottom:12px}
.my-skc .my-sk:first-child{border-radius:0;aspect-ratio:3/2}
.my-skc .my-sk{margin:0 12px}
.my-skc .my-sk:first-child{margin:0}
.my-slow{font-size:12.5px;color:var(--ink-3)}

/* ---------- 行程卡牆 ---------- */
.my-sech{display:flex;align-items:baseline;gap:10px;margin:var(--s3) 0 0}
.my-sech h2{margin:0;font:700 var(--fs-h4)/1.4 var(--f-display);letter-spacing:.06em}
.my-sech small{font:12px var(--f-mono);color:var(--ink-3)}
.my-tripc{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.my-tc{background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s;position:relative}
.my-tc:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.my-cv{height:118px;display:grid;grid-template-columns:2fr 1fr;grid-template-rows:118px;gap:2px;overflow:hidden;background:var(--paper-2)}
.my-cv.one{grid-template-columns:1fr}
.my-cv>div{display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:2px;overflow:hidden;min-height:0}
.my-cv img,.my-cv .my-fb{width:100%;height:100%;object-fit:cover;display:block;min-height:0;font-size:40px}
.my-tc .bd{padding:12px 14px 14px;display:flex;flex-direction:column;gap:2px}
.my-tc h3{margin:0;font:700 16px/1.4 var(--f-display);letter-spacing:.04em;display:flex;align-items:center;gap:8px;min-width:0}
.my-tc h3 span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-bar{display:flex;gap:3px;margin-top:10px}
.my-bar i{flex:1;height:4px;border-radius:2px;background:var(--paper-2)}
.my-bar i.f{background:var(--ai)}
.my-tc .ft{display:flex;align-items:center;gap:8px;margin-top:6px}
.my-tc .ft .my-m{flex:1}
.my-tc.new{border-style:dashed;display:grid;place-items:center;color:var(--ink-3);min-height:220px;font-size:14px;background:transparent;cursor:pointer;font-family:var(--f-body)}
.my-tc.new:hover{color:var(--ai);border-color:var(--ai)}
.my-tc.gone{opacity:.75}
.my-tc.gone .my-cv{filter:grayscale(1)}

/* ---------- 單一行程 ---------- */
.my-tp{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,42%);gap:var(--s5);align-items:start}
.my-tl{display:flex;flex-direction:column;gap:14px;min-width:0}
.my-tbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.my-tbar h1{margin:0;font:700 26px/1.3 var(--f-display);letter-spacing:.08em;min-width:0;overflow-wrap:anywhere}
.my-tbar .ttl{border:0;background:none;padding:2px 4px;margin:-2px -4px;border-radius:6px;cursor:text;color:inherit;font:inherit;text-align:left;display:flex;align-items:center;gap:8px}
.my-tbar .ttl:hover{background:var(--paper-2)}
.my-tbar .ttl .my-ico{color:var(--ink-3)}
.my-tbar input.ttl-in{font:700 24px/1.3 var(--f-display);letter-spacing:.06em;border:1px solid var(--ai);border-radius:8px;padding:2px 8px;background:var(--sheet);color:var(--ink);min-width:0;width:min(420px,100%)}
.my-tbar .meta2{font:12.5px var(--f-mono);color:var(--ink-3);flex-basis:100%;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.my-tbar .sp{flex:1}
.my-ro{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-2);background:var(--paper-2);border-radius:8px;padding:8px 12px}
.my-ro .my-btn{margin-left:auto}
.my-dtabs{display:flex;gap:2px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.my-dtabs::-webkit-scrollbar{display:none}
.my-dtab{padding:8px 11px 7px;font:13.5px/1.3 var(--f-body);color:var(--ink-2);cursor:pointer;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;background:none;text-align:left;border-radius:6px 6px 0 0}
.my-dtab b{display:block;font:500 11px var(--f-mono);letter-spacing:.1em;color:var(--ink-3)}
.my-dtab em{font-style:normal;font:11px var(--f-mono);color:var(--ink-3);margin-left:4px}
.my-dtab:hover{color:var(--ink);background:var(--paper-2)}
.my-dtab[aria-selected="true"]{color:var(--ink);font-weight:600;border-bottom-color:var(--glow)}
.my-dtab[aria-selected="true"] b{color:var(--ink-2)}
.my-dtab.today b{color:var(--kin-text)}
.my-dtab.drop-on{background:color-mix(in srgb,var(--ai) 10%,transparent);outline:1.5px dashed var(--ai);outline-offset:-2px}
.my-dtab.add{color:var(--ink-3);font-size:18px;padding:8px 14px}
.my-day h2{margin:4px 0 10px;font:700 17px/1.4 var(--f-display);letter-spacing:.04em;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.my-day h2 small{font:400 12px var(--f-mono);color:var(--ink-3);letter-spacing:0}
.my-stops{display:flex;flex-direction:column;min-height:48px;border-radius:10px}
.my-stops.drop-on{background:color-mix(in srgb,var(--ai) 4%,transparent)}
.my-stop{display:grid;grid-template-columns:18px 54px 56px minmax(0,1fr) auto;gap:10px;align-items:center;background:var(--sheet);border:1px solid var(--line);border-radius:10px;padding:8px 8px 8px 10px;
  position:relative;transition:box-shadow .15s,border-color .15s}
.my-stop.nt{grid-template-columns:18px 56px minmax(0,1fr) auto}
.my-stop.hl{border-color:var(--glow);box-shadow:0 0 0 3px color-mix(in srgb,var(--glow) 25%,transparent)}
.my-stop.cur{border-color:var(--glow);box-shadow:inset 3px 0 0 var(--glow)}
.my-stop.done{opacity:.58}
.my-stop.done h3{text-decoration:line-through;text-decoration-color:var(--ink-3)}
.my-stop.fresh{background:color-mix(in srgb,var(--glow) 9%,var(--sheet))}
.my-stop.dragging{opacity:.4}
.my-gp{color:var(--ink-3);cursor:grab;display:grid;place-items:center;width:18px;height:28px}
.my-gp:active{cursor:grabbing}
.my-tm{font:500 13px/1.3 var(--f-mono);color:var(--ink);border:0;background:none;padding:4px 2px;border-radius:6px;cursor:pointer;text-align:left;width:100%}
.my-tm small{display:block;font-size:11px;color:var(--ink-3);font-weight:400}
.my-tm.none{color:var(--ink-3);font-weight:400}
.my-tm:hover{background:var(--paper-2)}
.my-tm[disabled]{cursor:default}.my-tm[disabled]:hover{background:none}
.my-stop .my-img,.my-stop .my-fb{width:56px;height:42px;border-radius:6px;object-fit:cover;font-size:20px}
.my-stop h3{margin:0;font:700 14.5px/1.4 var(--f-display);letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-stop h3 a{color:inherit;text-decoration:none}
.my-stop h3 a:hover{color:var(--ai);text-decoration:underline}
.my-stop .my-m{font-family:var(--f-body)}
.my-stop .my-m .mt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-stop .sn{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.my-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 4px;border-radius:10px;background:var(--ai);color:var(--paper);font:500 11px/1 var(--f-mono);margin-right:6px;vertical-align:1px}
.my-stop .act{display:flex;gap:4px;align-items:center}
/* 去過：沒勾時圓內放淡色 ✓，看得出用途（aria-label、title「去過」） */
.my-ck{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line);background:var(--sheet);color:color-mix(in srgb,var(--ink-3) 55%,transparent);display:grid;place-items:center;cursor:pointer;padding:0;position:relative}
.my-ck:hover{border-color:var(--ok);color:var(--ok)}
.my-ck[aria-pressed="true"]{background:var(--ok);border-color:var(--ok);color:#fff}
.my-leg{font-size:12px;color:var(--ink-3);display:flex;align-items:center;gap:6px;padding:5px 0 5px 92px;min-height:26px}
.my-leg.warn{color:var(--kin-text)}
.my-leg.nogeo{padding-block:3px;min-height:10px}
.my-drop{border:1.5px dashed var(--ai);border-radius:10px;height:44px;display:grid;place-items:center;font-size:12.5px;color:var(--ai);background:color-mix(in srgb,var(--ai) 6%,transparent);margin:4px 0}
.my-empty-day{border:1.5px dashed var(--line);border-radius:10px;padding:22px 16px;text-align:center;font-size:13.5px;color:var(--ink-3)}
.my-tray{border-top:1px solid var(--line);padding-top:12px;display:flex;flex-direction:column;gap:10px}
.my-tray .hd{display:flex;align-items:center;gap:8px}
.my-tray .hd a,.my-tray .hd button.lnk{margin-left:auto;font-size:12.5px;color:var(--ai);text-decoration:none;border:0;background:none;cursor:pointer;font-family:var(--f-body)}
.my-tray.drop-on{background:color-mix(in srgb,var(--ai) 5%,transparent);border-radius:10px;outline:1.5px dashed var(--ai);outline-offset:4px}
.my-chipsx{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.my-mini{display:flex;align-items:center;gap:8px;background:var(--sheet);border:1px solid var(--line);border-radius:10px;padding:5px 10px 5px 5px;font:13px var(--f-body);white-space:nowrap;cursor:grab;
  color:var(--ink);flex:none;max-width:220px}
.my-mini:hover{border-color:var(--ai)}
.my-mini span.t{overflow:hidden;text-overflow:ellipsis}
.my-mini .my-img,.my-mini .my-fb{width:32px;height:32px;border-radius:6px;object-fit:cover;font-size:15px;flex:none}
.my-mini.in{border-style:dashed}
.my-tray .none{font-size:12.5px;color:var(--ink-3)}
.my-mapc{position:sticky;top:calc(var(--head-h) + var(--s4));height:calc(100vh - var(--head-h) - 48px);min-height:420px;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);background:var(--paper-2)}
.my-map{position:absolute!important;inset:0}
.my-maplg{position:absolute;left:12px;bottom:12px;background:var(--sheet);border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:12px;color:var(--ink-2);display:flex;gap:12px;flex-wrap:wrap;z-index:2;max-width:calc(100% - 24px)}
.my-maplg i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;vertical-align:0}
.my-mapmsg{position:absolute;inset:0;display:grid;place-items:center;font-size:13px;color:var(--ink-3);text-align:center;padding:20px}
.my-pin{width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--ai);border:2px solid #fff;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.3);cursor:pointer}
.my-pin b{transform:rotate(45deg);color:#fff;font:500 11px/1 var(--f-mono)}
.my-pinw{cursor:pointer;padding:2px}
.my-pinw.hl .my-pin{outline:3px solid var(--glow);outline-offset:2px}
.my-pin.done{background:var(--ink-3)}
.my-pop-map .maplibregl-popup-content{background:var(--sheet);color:var(--ink);border-radius:10px;padding:10px 12px;box-shadow:var(--shadow);font:13px/1.5 var(--f-body);min-width:180px}
.my-pop-map .maplibregl-popup-tip{border-top-color:var(--sheet);border-bottom-color:var(--sheet)}
.my-pop-map b{display:block;font:700 14px var(--f-display);letter-spacing:.03em}
.my-pop-map .acts{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.my-pop-map .maplibregl-popup-close-button{font-size:16px;width:24px;height:24px;color:var(--ink-3)}

/* ---------- 地圖檢視頁 ---------- */
.my-bigmap{position:relative;height:calc(100vh - var(--head-h) - 220px);min-height:420px;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);background:var(--paper-2)}

/* ---------- 對話框、抽屜、選單 ---------- */
.my-scrim{position:fixed;inset:0;z-index:1500;background:rgba(18,21,27,.5);display:grid;place-items:center;padding:16px;overflow:auto}
.my-dlg{position:relative;width:min(420px,100%);background:var(--sheet);color:var(--ink);border-radius:14px;box-shadow:0 30px 60px -20px rgba(0,0,0,.45);font-size:14px;line-height:1.5}
.my-dlg.wide{width:min(480px,100%)}
.my-dlg .hd{padding:20px 56px 4px 22px}
.my-dlg .hd h2{margin:0;font:700 19px/1.4 var(--f-display);letter-spacing:.05em;overflow-wrap:anywhere}
.my-dlg .hd p{margin:4px 0 0;font-size:13px;color:var(--ink-2)}
.my-dlg .bd{padding:14px 22px 22px;display:flex;flex-direction:column;gap:14px}
.my-dlg .ft{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.my-dlg .ft .my-btn{min-height:40px}
.my-dlg .x{position:absolute;top:12px;right:12px;width:36px;height:36px;border:0;border-radius:8px;background:none;color:var(--ink-3);font-size:17px;cursor:pointer}
.my-dlg .x:hover{background:var(--paper);color:var(--ink)}
.my-dlg .center{text-align:center;align-items:center}
.my-err{font-size:13px;color:var(--warn);background:color-mix(in srgb,var(--warn) 8%,transparent);border-radius:8px;padding:8px 12px}
.my-err:empty{display:none}
.my-seg{display:flex;gap:6px;flex-wrap:wrap}
.my-optl{display:flex;flex-direction:column;gap:2px;margin:0 -22px;max-height:300px;overflow:auto}
.my-opt{display:flex;align-items:center;gap:10px;width:100%;padding:8px 22px;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.my-opt:hover{background:var(--paper)}
.my-opt[aria-pressed="true"]{background:color-mix(in srgb,var(--ai) 8%,var(--sheet))}
.my-opt b{display:block;font-weight:600}
.my-opt small{display:block;font-size:12px;color:var(--ink-3)}
.my-rad{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--ink-3);flex:none;display:grid;place-items:center}
.my-opt[aria-pressed="true"] .my-rad{border-color:var(--ai)}
.my-opt[aria-pressed="true"] .my-rad::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--ai)}
.my-dch{display:flex;gap:6px;flex-wrap:wrap;padding:0 22px 8px 50px}
.my-dch button{font:500 12px var(--f-body);border:1px solid var(--line);border-radius:999px;padding:3px 10px;cursor:pointer;color:var(--ink-2);background:var(--sheet)}
.my-dch button[aria-pressed="true"]{background:var(--glow);border-color:var(--glow);color:#1b1f27}
.my-mbr{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14px}
.my-mbr>div:nth-child(2){min-width:0;flex:1}
.my-mbr b{display:block;overflow:hidden;text-overflow:ellipsis}
.my-mbr small{display:block;font-size:12px;color:var(--ink-3);line-height:1.4}
.my-mbr .role{font-size:13px;color:var(--ink-2);display:flex;align-items:center;gap:4px}
.my-mbr select{height:32px;border:1px solid var(--line);border-radius:8px;background:var(--sheet);color:var(--ink);font:13px var(--f-body);padding:0 6px}
.my-lnk{border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--paper);display:flex;flex-direction:column;gap:10px}
.my-lnk .row{display:flex;align-items:center;gap:10px}
.my-lnk .row>div{flex:1;min-width:0}
.my-lnk b{font-size:13.5px}
.my-lnk small{display:block;font-size:12px;color:var(--ink-3)}
.my-lnk input[readonly]{font:12px var(--f-mono);height:34px}
.my-lnk .row2{display:flex;gap:8px;flex-wrap:wrap}
.my-lnk .row2 select{flex:1;min-width:140px;height:34px}
.my-tgl{width:40px;height:22px;border-radius:11px;border:0;background:var(--line);position:relative;flex:none;cursor:pointer;padding:0}
.my-tgl::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s}
.my-tgl[aria-checked="true"]{background:var(--ai)}
.my-tgl[aria-checked="true"]::after{left:20px}
.my-drw{position:fixed;top:0;right:0;bottom:0;z-index:1450;width:min(400px,100vw);background:var(--sheet);border-left:1px solid var(--line);box-shadow:var(--shadow);
  padding:18px 20px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px;overflow:auto;font-size:14px}
.my-drw-bg{position:fixed;inset:0;z-index:1440;background:rgba(18,21,27,.3)}
.my-drw .top{display:flex;gap:10px;align-items:flex-start}
.my-drw .top h2{margin:0;font:700 19px/1.4 var(--f-display);letter-spacing:.04em;flex:1;min-width:0;overflow-wrap:anywhere}
.my-drw .top .x{width:36px;height:36px;border:0;border-radius:8px;background:none;color:var(--ink-3);font-size:17px;cursor:pointer;flex:none}
.my-drw .top .x:hover{background:var(--paper);color:var(--ink)}
.my-drw .hero2{width:calc(100% + 40px);margin:-18px -20px 0;aspect-ratio:16/9;object-fit:cover;display:block;max-width:none}
.my-drw .my-fb.hero2{font-size:64px}
.my-drw dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:13.5px}
.my-drw dt{color:var(--ink-3)}
.my-drw dd{margin:0}
.my-drw .acts{display:flex;gap:8px;flex-wrap:wrap}
.my-tabs2{display:flex;gap:4px;border-bottom:1px solid var(--line)}
.my-tabs2 button{border:0;background:none;padding:8px 10px;font:600 14px var(--f-body);color:var(--ink-3);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer}
.my-tabs2 button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--glow)}
.my-act{display:flex;gap:10px;font-size:13.5px;line-height:1.55;padding:4px 0}
.my-act .my-av{width:26px;height:26px;font-size:11px}
.my-act>div{flex:1;min-width:0}
.my-act small{display:block;font-size:11.5px;color:var(--ink-3)}
.my-act button{border:0;background:none;color:var(--ai);font:500 13px var(--f-body);cursor:pointer;padding:0 0 0 4px}
.my-ver{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 8px;font-size:13.5px;padding:8px 10px;border-radius:8px}
.my-ver small{grid-column:1;font-size:12px;color:var(--ink-3)}
.my-ver .my-btn{grid-row:1/3;grid-column:2}
.my-ver.now{background:var(--paper);box-shadow:inset 2px 0 0 var(--glow)}
.my-snap{display:flex;gap:8px}
.my-snap input{height:34px}
.my-menu{position:fixed;z-index:1600;min-width:200px;max-width:calc(100vw - 16px);background:var(--sheet);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);
  font-size:14px;padding:4px 0;max-height:min(70vh,520px);overflow:auto}
.my-menu button,.my-menu a{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:0 16px;border:0;background:none;color:inherit;font:inherit;text-decoration:none;cursor:pointer;text-align:left;box-sizing:border-box}
.my-menu button:hover,.my-menu a:hover,.my-menu button:focus-visible,.my-menu a:focus-visible{background:var(--paper);outline:none}
.my-menu button[disabled]{opacity:.45;cursor:default}
.my-menu .warn{color:var(--warn)}
.my-menu hr{border:0;border-top:1px solid var(--line);margin:4px 0}
.my-menu .lb{font:500 11px var(--f-mono);letter-spacing:.14em;color:var(--ink-3);padding:8px 16px 2px;text-transform:uppercase}
.my-menu .ics{color:var(--ink-2)}
.my-pop{position:fixed;z-index:1600;width:280px;background:var(--sheet);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:14px;display:flex;flex-direction:column;gap:10px;font-size:14px}
.my-pop .row{display:flex;gap:8px}
.my-pop .row>*{flex:1}

/* ---------- 加入行程頁 ---------- */
.my-join{max-width:420px;margin:var(--s7) auto;background:var(--sheet);border:1px solid var(--line);border-radius:14px;padding:30px 26px;text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center}
.my-join h1{margin:0;font:700 21px/1.4 var(--f-display);letter-spacing:.05em}
.my-join p{margin:0;font-size:14px;color:var(--ink-2)}
.my-join .my-btn{width:100%;min-height:44px}
.my-join small{font-size:12.5px;color:var(--ink-3)}

/* ---------- 帳號分頁（手機） ---------- */
.my-acct{display:flex;flex-direction:column;gap:12px}
.my-acct .me{display:flex;gap:12px;align-items:center;background:var(--sheet);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.my-acct .me b{font:700 17px var(--f-display)}
.my-acct .me small{display:block;font-size:12.5px;color:var(--ink-3)}
.my-acct .lst{background:var(--sheet);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.my-acct .lst a,.my-acct .lst button{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:0 16px;border:0;border-bottom:1px solid var(--line);background:none;color:var(--ink);font:15px var(--f-body);text-decoration:none;cursor:pointer;text-align:left}
.my-acct .lst>*:last-child{border-bottom:0}
.my-acct .lst em{margin-left:auto;font:400 13px var(--f-mono);font-style:normal;color:var(--ink-3)}

/* ---------- 底部分頁（手機） ---------- */
.my-tabbar{display:none}

/* ---------- 列印 ---------- */
.my-print{display:none}

@media (max-width:1100px){
  .my-shell{grid-template-columns:196px minmax(0,1fr);gap:var(--s5)}
  .my-tp{grid-template-columns:minmax(0,1fr) minmax(280px,38%)}
}
@media (max-width:900px) and (min-width:761px){
  .my-tp{grid-template-columns:minmax(0,1fr)}
  .my-mapc{position:relative;top:0;height:340px;min-height:0;order:-1}
}

/* ---------- 手機：底部分頁、清單列、緊湊時間軸 ---------- */
@media (max-width:760px){
  .my-root{padding:0 var(--gutter)}
  .my-shell{grid-template-columns:minmax(0,1fr);padding-block:var(--s4) calc(96px + env(safe-area-inset-bottom,0px))}
  .my-side{display:none}
  .my-ph h1{font-size:22px}
  .my-ph .r .my-btn .lbl{display:none}
  .my-tabbar{display:grid;position:fixed;left:0;right:0;bottom:0;z-index:1100;grid-template-columns:repeat(4,1fr);background:var(--sheet);border-top:1px solid var(--line);
    padding:6px 0 calc(6px + env(safe-area-inset-bottom,0px))}
  .my-tabbar a{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--ink-2);text-decoration:none;min-height:46px;justify-content:center}
  .my-tabbar a .my-ico{width:21px;height:21px}
  .my-tabbar a[aria-current]{color:var(--ink);font-weight:600}
  .my-tabbar a[aria-current] .my-ico{color:var(--ai)}
  .my-msrch{display:flex!important}
  .my-flt{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scrollbar-width:none}
  .my-flt::-webkit-scrollbar{display:none}
  .my-flt .r{margin-left:0}
  .my-rows{background:none;border:0;border-radius:0}
  .my-row{grid-template-columns:64px minmax(0,1fr) auto;padding:8px 0;background:none}
  .my-row:hover{background:none}
  .my-row .my-sel{display:none}
  .my-picking .my-row .my-sel{display:grid;position:absolute;right:44px;top:50%;transform:translateY(-50%)}
  .my-bulk{bottom:calc(72px + env(safe-area-inset-bottom,0px));padding:8px;gap:6px;flex-wrap:wrap}
  .my-bulk kbd{display:none}
  .my-tripc{grid-template-columns:minmax(0,1fr)}
  .my-tp{grid-template-columns:minmax(0,1fr);gap:var(--s3)}
  .my-mapc{position:relative;top:0;height:190px;min-height:0;order:-1;border-radius:10px}
  .my-tl{order:0}
  .my-tbar h1,.my-tbar .ttl{font-size:21px}
  .my-tbar .lbl{display:none}
  .my-stop{grid-template-columns:44px minmax(0,1fr) auto;padding:8px 6px 8px 10px;gap:8px}
  .my-stop .my-gp,.my-stop>.my-img,.my-stop>.my-fb{display:none!important}
  .my-stop.nt{grid-template-columns:minmax(0,1fr) auto}
  .my-leg{padding-left:54px}
  .my-mini{cursor:pointer}
  .my-drw{width:100vw;top:auto;max-height:88vh;border-radius:16px 16px 0 0;border-left:0}
  .my-drw .hero2{border-radius:16px 16px 0 0}
  .my-scrim{place-items:end center;padding:0}
  .my-dlg,.my-dlg.wide{width:100%;border-radius:16px 16px 0 0;padding-bottom:env(safe-area-inset-bottom,0px);max-height:92vh;overflow:auto}
  .my-menu.sheet{left:0!important;right:0;bottom:0;top:auto!important;border-radius:16px 16px 0 0;padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));max-width:none;width:auto}
  .my-menu.sheet button,.my-menu.sheet a{min-height:46px}
  .my-pop.sheet{left:0!important;right:0;bottom:0;top:auto!important;width:auto;border-radius:16px 16px 0 0;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}
  .my-bigmap{height:calc(100vh - var(--head-h) - 250px)}
  .my-state{padding:24px 20px}
}
.my-msrch{display:none}
@media (hover:none){ .my-sel{opacity:1} }
@media (prefers-reduced-motion:reduce){ .my-sk{animation:none} .my-it,.my-tc{transition:none} .my-it:hover,.my-tc:hover{transform:none} .my-tgl::after{transition:none} }

@media print{
  body{background:#fff;color:#000}
  body>*:not(main),.mast,.my-shell,.my-tabbar,.my-bulk,.ac-toast,.my-scrim,.my-drw,.my-drw-bg,.my-menu,.my-pop{display:none!important}
  .my-root{padding:0;max-width:none}
  .my-print{display:block;font:11pt/1.6 var(--f-body);color:#000}
  .my-print h1{font:700 20pt/1.3 var(--f-display);margin:0 0 4pt;letter-spacing:.05em}
  .my-print .sub{font:10pt var(--f-mono);color:#555;margin-bottom:14pt}
  .my-print h2{font:700 13pt var(--f-display);margin:14pt 0 6pt;padding-bottom:3pt;border-bottom:1.5pt solid #000;break-after:avoid}
  .my-print ol{margin:0;padding:0;list-style:none}
  .my-print li{display:grid;grid-template-columns:52pt 1fr;gap:8pt;padding:4pt 0;border-bottom:.5pt solid #ccc;break-inside:avoid}
  .my-print li .t{font-family:var(--f-mono)}
  .my-print li b{font-family:var(--f-display)}
  .my-print li small{display:block;color:#555}
  .my-print .walk{font-size:9pt;color:#666;padding:1pt 0 1pt 60pt;border:0;display:block}
}
.my-tabbar[hidden],.my-side[hidden]{display:none!important}
@media (max-width:760px){
  .my-tbar{gap:6px}
  .my-tbar .my-stack{display:none}
  .my-tbar .ttl{flex:1;min-width:0}
  .my-tbar h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .my-maplg{left:8px;bottom:8px;padding:3px 8px;font-size:11px;gap:8px}
  .my-mapc .maplibregl-ctrl-bottom-right .maplibregl-ctrl-group{display:none}
}
@media (max-width:760px){
  .my-tbar .sp{display:none}
  .my-tbar .ttl h1{min-width:0;flex:0 1 auto}
  .my-maplg{bottom:auto;top:8px}
}
.my-ck[disabled]{cursor:default}
.my-ck[disabled]:not([aria-pressed="true"]){visibility:hidden}
@media (max-width:760px){ .my-tbar>h1{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} }

/* ---------- 日期、跨城市 ---------- */
.my-tbar .ttl:hover .my-ico{color:var(--ai)}
.my-tbar .ttl:focus-visible{outline:2px solid var(--glow);outline-offset:2px}
.my-dt{display:inline-flex;align-items:center;gap:6px;border:0;background:none;font:inherit;color:inherit;padding:2px 6px;margin:-2px -6px;border-radius:6px;cursor:pointer}
.my-dt .my-ico:last-child{opacity:.55}
.my-dt:hover{background:var(--paper-2);color:var(--ink)}
.my-dt:hover .my-ico:last-child{opacity:1;color:var(--ai)}
.my-route,.my-tcc{display:inline-flex;align-items:center;gap:5px;color:var(--ink-2)}
.my-tcc{margin-top:2px}
.my-dc{margin-left:6px;padding:0 5px;border-radius:4px;background:color-mix(in srgb,var(--ai) 10%,transparent);color:var(--ai);letter-spacing:.06em}
.my-dtab[aria-selected="true"] .my-dc{background:var(--ai);color:var(--paper)}
.my-city{font:500 12px/1.6 var(--f-body);letter-spacing:.04em;color:var(--ai);background:color-mix(in srgb,var(--ai) 10%,transparent);border-radius:6px;padding:0 8px;align-self:center}
.my-tcf{display:flex;gap:6px;flex-wrap:wrap;margin-top:-4px}
.my-fc.sm{padding:2px 10px;font-size:12.5px}
.my-side-help{display:flex;align-items:center;gap:6px;margin:2px 0 0;padding:6px 10px;border:0;background:none;color:var(--ink-3);font:12.5px var(--f-body);cursor:pointer;border-radius:8px;text-align:left}
.my-side-help:hover{color:var(--ai);background:var(--sheet)}

/* ---------- 第一次使用的教學提示（入口：桌機左側選單、手機「帳號」分頁） ---------- */
.my-offer{position:fixed;z-index:1001;bottom:24px;right:max(var(--gutter),calc((100vw - 1320px) / 2));width:300px;background:var(--sheet);color:var(--ink);border:1px solid var(--line);
  border-radius:14px;box-shadow:var(--shadow);padding:16px 16px 14px;display:flex;flex-direction:column;gap:6px;font-size:13.5px;animation:my-pop .25s ease-out}
.my-offer b{font:700 16px/1.4 var(--f-display);letter-spacing:.04em}
.my-offer p{margin:0;color:var(--ink-2);line-height:1.6}
.my-offer .acts{display:flex;gap:6px;margin-top:6px}
.my-offer .x{position:absolute;top:8px;right:8px;width:30px;height:30px;border:0;border-radius:8px;background:none;color:var(--ink-3);cursor:pointer}
.my-offer .x:hover{background:var(--paper)}
@keyframes my-pop{from{opacity:0;transform:translateY(6px)}}
@media (max-width:760px){
  .my-offer{right:12px;left:12px;width:auto;bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  .my-offer::before{content:"";position:absolute;bottom:-7px;right:calc(12.5% - 18px);width:12px;height:12px;background:var(--sheet);border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}   /* 指向「帳號」分頁 */
  body:has(.my-tabbar[hidden]) .my-offer{bottom:calc(18px + env(safe-area-inset-bottom,0px))}
  body:has(.my-tabbar[hidden]) .my-offer::before{display:none}
}
@media (prefers-reduced-motion:reduce){ .my-offer{animation:none} }

/* ---------- 使用教學（my-help.js） ---------- */
.hp-scrim{position:fixed;inset:0;z-index:1700;background:rgba(18,21,27,.55);display:grid;place-items:center;padding:24px}
.hp{width:min(1140px,100%);height:min(800px,100%);background:var(--sheet);color:var(--ink);border-radius:16px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);display:grid;grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr);overflow:hidden}
.hp-hd{display:flex;align-items:center;gap:10px;padding:12px 14px 12px 22px;border-bottom:1px solid var(--line)}
.hp-hd h2{margin:0;font:700 19px/1.3 var(--f-display);letter-spacing:.08em}
.hp-hd .my-kick{letter-spacing:.18em}
.hp-sub{font-size:12.5px;color:var(--ink-3);flex:1}
.hp-x{width:38px;height:38px;border:0;border-radius:8px;background:none;color:var(--ink-3);font-size:17px;cursor:pointer}
.hp-x:hover{background:var(--paper);color:var(--ink)}
.hp-body{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:0}
.hp-toc{overflow:auto;border-right:1px solid var(--line);padding:10px;display:flex;flex-direction:column;gap:2px;scrollbar-width:thin}
.hp-toc button{display:flex;gap:10px;align-items:flex-start;width:100%;border:0;background:none;color:var(--ink-2);text-align:left;padding:9px 10px;border-radius:10px;cursor:pointer;font:14px/1.4 var(--f-body)}
.hp-toc button:hover{background:var(--paper);color:var(--ink)}
.hp-toc button[aria-current="true"]{background:color-mix(in srgb,var(--glow) 16%,var(--sheet));color:var(--ink);font-weight:600}
.hp-toc b{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font:500 11.5px/1 var(--f-mono);background:var(--paper-2);color:var(--ink-2)}
.hp-toc button[aria-current="true"] b{background:var(--glow);color:#1b1f27}
.hp-toc small{display:block;font-size:12px;font-weight:400;color:var(--ink-3)}
.hp-main{display:flex;flex-direction:column;gap:10px;padding:14px 22px 16px;min-width:0;min-height:0}
.hp-ch{display:flex;align-items:baseline;gap:12px}
.hp-chn{font:500 11px var(--f-mono);letter-spacing:.14em;color:var(--kin-text)}
.hp-cht{margin:0;font:700 20px/1.3 var(--f-display);letter-spacing:.06em}
.hp-fit{flex:1;min-height:0;position:relative}
.hp-stage{position:absolute;inset:0;margin:auto;max-width:100%;max-height:100%;overflow:hidden;border-radius:10px;border:1px solid var(--line);background:var(--paper-2);box-shadow:0 14px 30px -16px rgba(22,30,48,.45)}
.hp-stage.ph{border:7px solid #1b1f27;border-radius:26px}
.hp-zoom{position:absolute;left:0;top:0;width:100%;height:100%;transform-origin:0 0}
.hp-zoom.now{transition:transform .6s cubic-bezier(.4,0,.2,1)}
.hp-img{display:block;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}
.hp-zoom[style*="--z"] .hp-box b{transform:scale(calc(1 / var(--z)));transform-origin:0 0}
.hp-zoom[style*="--z"] .hp-box{border-width:calc(2.5px / var(--z))}
.hp-zoom[style*="--z"] .hp-cur{width:calc(28px / var(--z));height:calc(28px / var(--z))}
.hp-marks{position:absolute;inset:0;pointer-events:none}
.hp-box{position:absolute;border:2.5px solid var(--glow);border-radius:8px;pointer-events:none;
  box-shadow:0 0 0 200vmax rgba(10,14,24,.38),0 0 0 5px color-mix(in srgb,var(--glow) 35%,transparent);transition:left .5s cubic-bezier(.4,0,.2,1),top .5s cubic-bezier(.4,0,.2,1),width .5s cubic-bezier(.4,0,.2,1),height .5s cubic-bezier(.4,0,.2,1)}
.hp-box.st{box-shadow:0 0 0 4px color-mix(in srgb,var(--glow) 30%,transparent);transition:none}
.hp-box b{position:absolute;top:-14px;left:-14px;width:26px;height:26px;border-radius:50%;background:var(--glow);color:#1b1f27;display:grid;place-items:center;font:600 13px/1 var(--f-mono);box-shadow:0 2px 6px rgba(0,0,0,.35)}
.hp-box.in b{top:4px;left:4px}
.hp{outline:none}
.hp-box.now{animation:hp-in .5s ease-out}
@keyframes hp-in{from{border-color:transparent}}
.hp-cur{position:absolute;left:50%;top:70%;width:28px;height:28px;margin:-3px 0 0 -6px;pointer-events:none;opacity:0;transition:opacity .3s;filter:drop-shadow(0 2px 3px rgba(0,0,0,.4));z-index:3}
.hp-cur svg{width:100%;height:100%;display:block}
.hp-rip{position:absolute;width:46px;height:46px;border-radius:50%;border:3px solid var(--glow);opacity:0;transform:translate(-50%,-50%);pointer-events:none;z-index:2}
.hp-ghost{position:absolute;transform:translate(-50%,-50%);border:2px dashed var(--ai);border-radius:8px;background:color-mix(in srgb,var(--ai) 22%,transparent);opacity:0;pointer-events:none;z-index:2}
.hp-cap{min-height:58px;display:flex;flex-direction:column;gap:4px}
.hp-lead{margin:0;font:700 16px/1.5 var(--f-display);letter-spacing:.04em}
.hp-mk{margin:0;display:flex;gap:8px;align-items:center;font-size:14px;color:var(--ink-2);line-height:1.5}
.hp-mk b,.hp-list b{flex:none;width:22px;height:22px;border-radius:50%;background:var(--glow);color:#1b1f27;display:inline-grid;place-items:center;font:600 11.5px/1 var(--f-mono)}
.hp-mk.dim{color:var(--ink-3);font-size:13px}
.hp-list{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13.5px;color:var(--ink-2)}
.hp-list li{display:flex;gap:6px;align-items:center}
.hp-ctl{display:flex;align-items:center;gap:8px}
.hp-b{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;border-radius:8px;border:1px solid var(--line);background:var(--sheet);color:var(--ink);font:500 13.5px/1.2 var(--f-body);cursor:pointer;white-space:nowrap}
.hp-b:hover{border-color:var(--ink-3)}
.hp-b.pri{background:var(--ai);border-color:var(--ai);color:var(--paper)}
.hp-b[disabled]{opacity:.45;cursor:default}
.hp-b span{font-size:15px;line-height:1}
.hp-play span{font-size:10px;letter-spacing:-1px}
.hp-b:focus-visible,.hp-toc button:focus-visible,.hp-x:focus-visible{outline:2px solid var(--glow);outline-offset:2px}
.hp-dots{flex:1;min-width:0;display:flex;justify-content:center;gap:6px}
.hp-ctl{min-width:0}
.hp-dots i{width:7px;height:7px;border-radius:4px;background:var(--line);transition:width .25s}
.hp-dots i.on{width:22px;background:var(--glow)}
@media (max-width:760px){
  .hp-scrim{padding:0;display:block}
  .hp{width:100%;height:100%;border-radius:0}
  .hp-hd{padding:8px 8px 8px 16px;padding-top:calc(8px + env(safe-area-inset-top,0px))}
  .hp-sub{display:none}.hp-hd h2{flex:1}
  .hp-body{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .hp-toc{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:8px 12px;gap:6px;scrollbar-width:none}
  .hp-toc::-webkit-scrollbar{display:none}
  .hp-toc button{width:auto;flex:none;align-items:center;padding:6px 12px 6px 6px;border-radius:var(--r-pill);border:1px solid var(--line);white-space:nowrap;font-size:13px}
  .hp-toc button[aria-current="true"]{border-color:var(--glow)}
  .hp-toc small{display:none}
  .hp-main{padding:10px 14px calc(12px + env(safe-area-inset-bottom,0px));gap:8px}
  .hp-cht{font-size:17px}
  .hp-lead{font-size:15px}
  .hp-mk{font-size:13.5px}
  .hp-cap{min-height:66px}
  .hp-b{padding:0 11px;font-size:13px}
  .hp-b.pri{max-width:46vw;overflow:hidden;text-overflow:ellipsis}
  .hp-stage.ph{border-width:5px;border-radius:20px}
}
@media (prefers-reduced-motion:reduce){ .hp-box,.hp-dots i,.hp-cur{transition:none} .hp-box.now{animation:none} }
.my-tm small{white-space:nowrap}
@media (max-width:760px){
  .my-stop{grid-template-columns:52px minmax(0,1fr) auto}
  .my-leg{padding-left:62px}
}
.my-flt,.my-dtabs,.my-chipsx,.my-tcf{position:relative}   /* 讓 .my-sr 等絕對定位的元素留在捲動區內，不撐寬手機頁面 */
.my-tbar input.ttl-in{flex:1 1 200px;width:auto;max-width:440px;font-size:22px}

/* 自動排列 */
.my-day h2 .my-arr{margin-left:auto;align-self:center;display:flex;gap:6px;flex-wrap:wrap}
.my-arr-scope{display:grid;gap:8px}
.my-arr-days{display:flex;flex-wrap:wrap;gap:6px}
.my-arr-days .my-fc em{font-style:normal;color:var(--ink-3);margin-left:4px;font-size:11px}
.my-arr-pv{display:grid;gap:14px;max-height:min(60vh,560px);overflow:auto;padding-right:4px}
.my-arr-d{border:1px solid var(--line,#e3e1dc);border-radius:10px;padding:12px 14px}
.my-arr-d.warn{border-color:var(--warn)}
.my-arr-d h3{margin:0 0 6px;font:700 15px/1.4 var(--f-display);display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
.my-arr-d h3 span{font:400 12px var(--f-mono);color:var(--ink-2)}
.my-arr-d h3 small{font:400 12px var(--f-mono);color:var(--ink-3)}
.my-arr-d .why{margin:0 0 8px;font-size:13px;color:var(--ink-2);line-height:1.6}
.my-arr-d ol,.my-arr-d ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.my-arr-d li{display:grid;grid-template-columns:52px 1fr;gap:2px 10px;font-size:14px;line-height:1.5}
.my-arr-d ul li{grid-template-columns:1fr}
.my-arr-d li b{font:600 13px var(--f-mono);color:var(--ink);grid-row:span 2}
.my-arr-d li small{font-size:12px;color:var(--ink-3)}
.my-arr-d li em{font-style:normal;font-size:11px;color:var(--kin-text);margin-left:6px}
.my-arr-d li.done{opacity:.6}
.my-arr-d .note{margin:8px 0 0;font-size:12.5px;color:var(--warn);display:flex;gap:6px;align-items:flex-start;line-height:1.55}

/* 新增地點 */
/* 新增方式分頁：底線分頁（DESIGN.md P12：目前分頁＝粗體＋金色底線），與天數分頁、動態／版本紀錄相同 */
.my-pl-tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none;position:relative}
.my-pl-tabs::-webkit-scrollbar{display:none}
.my-pl-tabs button{border:0;border-bottom:2px solid transparent;margin-bottom:-1px;background:none;padding:8px 10px 7px;min-height:40px;font:500 14px/1.3 var(--f-body);color:var(--ink-2);cursor:pointer;white-space:nowrap;border-radius:6px 6px 0 0}
.my-pl-tabs button:hover{color:var(--ink);background:var(--paper-2)}
.my-pl-tabs button[aria-selected="true"]{color:var(--ink);font-weight:700;border-bottom-color:var(--glow)}
.my-pl-tabs button:focus-visible{outline:2px solid var(--glow);outline-offset:-2px}
.my-pl-mini{position:relative;height:150px;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--paper-2);flex:none}
.my-pl-mini[hidden]{display:none}
.my-pinw.sm .my-pin{width:20px;height:20px;border-width:1.5px}
.my-pinw.sm .my-pin b{font-size:10px}
.my-pl-q{display:flex;gap:8px}
.my-pl-q .my-in{flex:1;min-width:0}
.my-pl-res{display:grid;gap:8px;max-height:min(46vh,420px);overflow:auto}
.my-pl-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.my-pl-list button{width:100%;text-align:left;display:grid;gap:2px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--sheet);cursor:pointer;font:inherit;color:var(--ink)}
.my-pl-list button:hover,.my-pl-list button:focus-visible{border-color:var(--ai)}
.my-pl-list b{font-size:14.5px}
.my-pl-list small{font-size:12px;color:var(--ink-3)}
.my-src{font-size:11.5px;color:var(--ink-3);margin:0}
.my-pl-dist ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.my-pl-dist li{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;line-height:1.5;padding:4px 0;border-bottom:1px dashed var(--line)}
.my-pl-dist li small{color:var(--ink-3);font-size:12px;white-space:nowrap}
.my-pl-info p{margin:0 0 6px;font-size:14px;line-height:1.65;color:var(--ink-2)}
.my-newpin{width:22px;height:22px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--kin);border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.my-pickbar{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:5;display:flex;gap:10px;align-items:center;background:var(--ink,#1f2a3d);color:#fff;padding:8px 10px 8px 14px;border-radius:999px;font-size:13.5px;box-shadow:0 4px 14px rgba(0,0,0,.25);max-width:calc(100% - 24px)}
.my-pickbar .my-btn{min-height:30px}
.my-near{display:grid;gap:2px;margin-top:6px;font-size:12.5px}
.my-near span{display:flex;justify-content:space-between;gap:10px}
.my-near small{color:var(--ink-3)}
.my-cpi{display:inline-block;width:10px;height:10px;border-radius:50%;background:#fff;border:2.5px solid var(--kin);margin-right:4px;vertical-align:-1px}

/* ---------- 旅遊風格（proposals/trip-style.html 方案 A） ---------- */
.my-labr{display:flex;align-items:baseline;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.my-ntstyle{display:flex;flex-direction:column;gap:8px}
.my-ntstyle[hidden]{display:none}
.my-pcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.my-pc{position:relative;border:1px solid var(--line);border-radius:10px;background:var(--sheet);padding:10px 30px 10px 48px;min-height:64px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  text-align:left;font:inherit;color:var(--ink);cursor:pointer;gap:1px}
.my-pc:hover{border-color:var(--ink-3)}
.my-pc:focus-visible{outline:2px solid var(--glow);outline-offset:2px}
.my-pc .ic{position:absolute;left:10px;top:50%;margin-top:-15px;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--ai) 10%,var(--sheet));color:var(--ai)}
.my-pc .ic .my-ico{width:18px;height:18px;vertical-align:0}
.my-pc b{font:700 14.5px/1.35 var(--f-display);letter-spacing:.04em}
.my-pc small{font-size:12px;color:var(--ink-3);line-height:1.45}
.my-pc .ok{position:absolute;top:8px;right:8px;width:18px;height:18px;border-radius:50%;background:var(--glow);color:#1b1f27;display:none;place-items:center}
.my-pc .ok .my-ico{width:12px;height:12px;stroke-width:3;vertical-align:0}
.my-pc[aria-checked="true"]{border:2px solid var(--ai);padding:9px 29px 9px 47px;background:color-mix(in srgb,var(--ai) 7%,var(--sheet))}
.my-pc[aria-checked="true"] .ic{background:var(--btn-pri-bg);color:#f4f5f2;left:9px}
.my-pc[aria-checked="true"] .ok{display:grid;top:7px;right:7px}
.my-sumline{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px;color:var(--ink-2);background:var(--paper);border-radius:8px;padding:8px 12px;align-items:center;line-height:1.6}
.my-sumline span{white-space:nowrap}
.my-sumline b{font-weight:600;color:var(--ink)}
.my-lnk2{border:0;background:none;padding:0;color:var(--ai);font:500 13px/1.4 var(--f-body);cursor:pointer;white-space:nowrap;margin-left:auto}
.my-lnk2:hover{text-decoration:underline}
.my-dlg.xwide{width:min(640px,100%)}
.my-dlg .ft .l{margin-right:auto;align-self:center;font-size:12px;color:var(--ink-3)}
.my-sthd{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-bottom:12px}
.my-sthd .sp,.my-lodge .sp,.my-stbox .sp{flex:1}
.my-stcards{display:flex;flex-direction:column;gap:6px;padding-bottom:12px}
.my-stcards .my-hint{margin:0}
.my-dim{display:grid;grid-template-columns:96px minmax(0,1fr);gap:6px 14px;align-items:start;padding:12px 0;border-top:1px solid var(--line)}
.my-dim>.k{font:700 14px/1.4 var(--f-display);letter-spacing:.04em;padding-top:8px}
.my-dim>.k small{display:block;font:400 11px var(--f-mono);color:var(--ink-3);letter-spacing:.02em;margin-top:2px}
.my-dim>.v{display:flex;flex-direction:column;gap:8px;min-width:0}
.my-dim .my-hint{margin:0}
.my-sg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--sheet);min-width:0}
.my-sg button{flex:1 1 0;min-width:0;min-height:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:13px/1.3 var(--f-body);color:var(--ink-2);background:none;
  border:0;border-left:1px solid var(--line);border-radius:0;padding:4px 6px;text-align:center;cursor:pointer;width:auto}
.my-sg button:first-child{border-left:0}
.my-sg button small{font:400 10.5px/1.35 var(--f-mono);color:var(--ink-3)}
.my-sg button:hover{background:var(--paper-2);color:var(--ink)}
.my-sg button:focus-visible{outline:2px solid var(--glow);outline-offset:-2px}
.my-sg button[aria-checked="true"],.my-sg button[aria-pressed="true"]{background:var(--ink);color:var(--paper);font-weight:600}
.my-sg button[aria-checked="true"] small,.my-sg button[aria-pressed="true"] small{color:color-mix(in srgb,var(--paper) 72%,transparent)}
.my-wrow{display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;align-items:center;font-size:13px}
.my-wrow .nm{display:flex;align-items:center;gap:6px;color:var(--ink)}
.my-wrow .my-sg button{min-height:34px;font-size:12.5px}
.my-dotc{width:8px;height:8px;border-radius:50%;flex:none;display:inline-block}
.my-from{font-size:11.5px;color:var(--kin-text)}
.my-tm2{display:flex;gap:8px;align-items:center}
.my-tm2 .my-in{flex:1;min-width:0;font-family:var(--f-mono)}
.my-tm2 span{color:var(--ink-3)}
.my-lodge{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}
.my-lodge .my-ico{color:var(--kin)}
.my-stc{display:inline-flex;align-items:center;gap:6px;font:500 12.5px/1 var(--f-body);letter-spacing:0;color:var(--ink);border:1px solid var(--line);background:var(--sheet);border-radius:var(--r-pill);
  padding:0 10px 0 5px;min-height:30px;white-space:nowrap;align-self:center;flex:none}
button.my-stc{cursor:pointer}
button.my-stc:hover:not([disabled]){border-color:var(--ink-3)}
button.my-stc[disabled]{cursor:default;opacity:1}
.my-stc .ic2{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:color-mix(in srgb,var(--ai) 12%,var(--sheet));color:var(--ai)}
.my-stc .ic2 .my-ico{width:13px;height:13px;vertical-align:0}
.my-stc>.my-ico{color:var(--ink-3)}
.my-stc.day{border-color:color-mix(in srgb,var(--kin) 55%,var(--line));background:color-mix(in srgb,var(--kin) 8%,var(--sheet))}
.my-stc.day .ic2{background:color-mix(in srgb,var(--kin) 22%,var(--sheet));color:var(--kin-text)}
.my-stc.inh{border-style:dashed;color:var(--ink-2)}
.my-dtab .my-dst{display:block;font-style:normal;font:11.5px/1.35 var(--f-body);color:var(--ink-3);margin-top:2px;max-width:128px;overflow:hidden;text-overflow:ellipsis;font-weight:400;letter-spacing:0}
.my-dtab .my-dst.ds{color:var(--kin-text)}
.my-day h2 .my-stc{font-family:var(--f-body)}
.my-dayline{font-size:12.5px;color:var(--ink-2);margin:-4px 0 10px;display:flex;gap:4px 14px;flex-wrap:wrap}
.my-dayline span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.my-dayline .my-ico{color:var(--ink-3)}
.my-pop.wide{width:360px}
.my-pop-h{margin:0;font:700 15px/1.4 var(--f-display);letter-spacing:.04em;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.my-pop-h small{font:400 12px var(--f-mono);color:var(--ink-3);letter-spacing:0}
.my-pop .my-hint{margin:4px 0 0}
.my-dsp .my-fc{min-height:32px}
.my-stbox{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.my-stbox .row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.my-stbox .t{font-size:12.5px;color:var(--ink-2);line-height:1.6}
/* 重要程度：必去＝實心藍、想去＝藍框、備案＝虛線灰（不用紅色） */
.my-pr{display:inline-flex;align-items:center;font:600 11px/1 var(--f-body);border-radius:5px;padding:3px 6px;white-space:nowrap;letter-spacing:.02em;margin-left:6px;vertical-align:2px;flex:none}
.my-pr.must{background:var(--btn-pri-bg);color:#f4f5f2}
.my-pr.want{border:1px solid var(--ai);color:var(--ai);padding:2px 5px}
.my-pr.back{border:1px dashed var(--ink-3);color:var(--ink-2);padding:2px 5px;font-weight:500}
.my-mini .my-pr{margin-left:2px}
.my-mseg{padding:8px 12px 10px}
.my-mseg .lb2{display:block;font-size:12px;color:var(--ink-3);margin-bottom:6px}
.my-menu .my-mseg .my-sg button{display:flex;width:auto;min-height:36px;padding:0 6px;justify-content:center;text-align:center;gap:0}
.my-menu .my-mseg .my-sg button:hover{background:var(--paper-2)}
.my-menu .my-mseg .my-sg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
/* 排列預覽：依照的風格、空檔提示（暗金，不用紅色） */
.my-rules{display:flex;flex-direction:column;gap:4px;margin:8px 0 10px;padding:8px 10px;background:var(--paper);border-radius:8px}
.my-rule{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;font-size:12.5px;line-height:1.55;align-items:start}
.my-rule .src{font:500 10.5px/1.6 var(--f-mono);color:var(--kin-text);border:1px solid color-mix(in srgb,var(--kin) 45%,var(--line));border-radius:4px;padding:0 5px;white-space:nowrap}
.my-arr-d .note{color:var(--ink);border-left:2px solid var(--kin);padding:2px 0 2px 10px;display:block}
.my-arr-d.warn{border-color:var(--line)}
.my-arr-d.must{border-color:color-mix(in srgb,var(--ai) 55%,var(--line))}
.my-arr-d ul li{display:flex;gap:8px;justify-content:space-between;border-bottom:1px dashed var(--line);padding:3px 0;font-size:13px}
.my-arr-d ul li small{text-align:right}
.my-arr-d li .my-pr{margin-left:6px}
@media (max-width:760px){
  .my-dim{grid-template-columns:minmax(0,1fr);gap:8px;padding:12px 0}
  .my-dim>.k{padding-top:0}
  .my-dim>.k small{display:inline;margin-left:6px}
  .my-sg button,.my-wrow .my-sg button{min-height:44px}
  .my-wrow{grid-template-columns:68px minmax(0,1fr)}
  .my-lnk2{min-height:44px;display:inline-flex;align-items:center}
  .my-stc{min-height:44px}
  .my-sthd .my-btn,.my-lodge .my-btn,.my-day h2 .my-arr .my-btn{min-height:44px}
  .my-dsp .my-fc,.my-dim .my-seg .my-fc{min-height:44px}
  .my-pop.wide{width:auto}
  .my-pop .row .my-btn{min-height:44px}
  .my-mseg .my-sg button,.my-menu .my-mseg .my-sg button{min-height:46px}
  .my-dlg .ft .l{flex-basis:100%}
  .my-dtab .my-dst{max-width:104px}
}

/* ---------- 排序模式（觸控裝置不能拖曳：每一站 ↑↓，一下移一格） ---------- */
.my-sortbar{display:flex;align-items:center;gap:10px;margin:-2px 0 10px;padding:6px 6px 6px 12px;border-radius:10px;background:color-mix(in srgb,var(--ai) 8%,var(--sheet));border:1px solid color-mix(in srgb,var(--ai) 30%,var(--line));font-size:13px;color:var(--ink)}
.my-sortbar span{flex:1;min-width:0}
.my-day h2 .my-arr .my-btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.my-mv{width:44px;height:44px;border-radius:10px;border:1px solid var(--line);background:var(--sheet);color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;flex:none}
.my-mv .my-ico{width:20px;height:20px;stroke-width:2.2}
.my-mv:hover:not([disabled]){border-color:var(--ai);color:var(--ai)}
.my-mv:focus-visible{outline:2px solid var(--glow);outline-offset:1px}
.my-mv[disabled]{opacity:.3;cursor:default}
.my-stops.sorting .my-stop{border-style:dashed}
.my-stops.sorting .my-stop .act{gap:6px}

/* ---------- 手機觸控目標 ≥ 44px（DESIGN.md §3.7）：外觀維持精簡，點擊範圍放大 ---------- */
@media (max-width:760px){
  .my-btn.sm{min-height:44px;min-width:44px}
  .my-ib{width:44px;height:44px}
  .my-stop .act{gap:2px}
  .my-ck{width:44px;height:44px;border:0;background:none}
  .my-ck::before{content:"";position:absolute;inset:7px;border-radius:50%;border:1.5px solid var(--line);background:var(--sheet)}
  .my-ck .my-ico{position:relative}
  .my-ck:hover::before{border-color:var(--ok)}
  .my-ck[aria-pressed="true"]{background:none;color:#fff}
  .my-ck[aria-pressed="true"]::before{background:var(--ok);border-color:var(--ok)}
  .my-tm{min-height:44px}
  .my-dt{min-height:44px;margin-block:-6px}
  .my-fc{min-height:44px}
  .my-flt .my-fc,.my-tcf .my-fc{min-height:0;position:relative}   /* 橫向一列的篩選膠囊：外觀維持 30 高，點擊範圍上下各延伸 8px */
  .my-flt .my-fc::after,.my-tcf .my-fc::after{content:"";position:absolute;inset:-8px -3px}
  .my-flt{padding-block:8px;margin-block:-8px}
  .my-tcf{padding-block:8px;margin-block:-12px -8px;row-gap:16px}
  .my-sort{min-height:44px}
  .my-chk{min-height:44px;align-items:center}
  .my-chk input{margin:0}
  .my-dch button{min-height:40px;padding:4px 12px}
  .my-tbar .ttl{min-height:44px}
  .my-sortbar{position:sticky;top:calc(var(--head-h) + 6px);z-index:3}
}
@media (max-width:760px){
  /* 這一天的操作按鈕：一列放得下（排序、補滿這一天、自動排列、新增地點），放不下時橫向捲動 */
  .my-day h2 .my-arr{flex-basis:100%;margin-left:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:6px;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter)}
  .my-day h2 .my-arr::-webkit-scrollbar{display:none}
  .my-day h2 .my-arr .my-btn{padding:0 10px;flex:none}
  .my-day h2 .my-arr .my-btn .my-ico{display:none}
}

/* ---------- 旅遊風格第二階段：投票、我的玩法、合併結果、AI 工作單（proposals/trip-style.html 第 07–09 節） ---------- */
.my-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.my-vts{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap}
.my-vt{display:inline-flex;align-items:center;gap:2px;font:500 11.5px/1 var(--f-body);color:var(--ai);position:relative}
.my-vt .my-stack{padding-left:7px}
.my-vt .my-stack.xs .my-av{width:18px;height:18px;font-size:9.5px;border:1px solid var(--sheet)}
.my-vt.skip{color:var(--ink-2)}
.my-vt.skip .my-av{background:var(--paper-2);color:var(--ink-2)}
.my-vt em{font:11px var(--f-mono);font-style:normal;color:var(--ink-3);margin-left:2px}
.my-vmini{display:inline-flex;gap:4px;margin-left:2px}
.my-vmini b{font:500 10.5px/1 var(--f-body);border-radius:4px;padding:3px 5px;white-space:nowrap}
.my-vmini b.w{color:var(--ai);border:1px solid color-mix(in srgb,var(--ai) 45%,var(--line))}
.my-vmini b.s{color:var(--ink-2);border:1px dashed var(--ink-3)}
.my-mnote{margin:0;padding:0 16px 8px;font-size:12px;line-height:1.5;color:var(--ink-2);max-width:280px}
.my-stc.mine .my-ico{color:var(--ai);width:15px;height:15px;margin-left:3px}
.my-stc.mine.todo{border-color:color-mix(in srgb,var(--ai) 50%,var(--line));color:var(--ai)}
.my-dayline .mg,.my-dayline .sit{color:var(--ai)}
.my-dayline .mg .my-ico,.my-dayline .sit .my-ico{color:var(--ai)}
/* 成員對話框：旅伴的玩法與合併結果 */
.my-crews{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
.my-crews .my-pop-h{align-items:center}
.my-crews .my-pop-h .my-ico{color:var(--ai)}
.my-crew{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:14px;border-bottom:1px dashed var(--line)}
.my-crew>div{min-width:0;flex:1}
.my-crew b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-crew small{display:block;font-size:12.5px;color:var(--ink-2);line-height:1.45}
.my-crew .when{font:12px var(--f-mono);color:var(--ink-3);white-space:nowrap}
.my-crew .when.no{font-family:var(--f-body);color:var(--kin-text)}
.my-merge{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-top:6px}
.my-merge .r{display:grid;grid-template-columns:76px minmax(0,1fr) minmax(0,1.2fr);gap:4px 12px;padding:8px 12px;font-size:13px;align-items:baseline;border-top:1px solid var(--line)}
.my-merge .r:first-child{border-top:0}
.my-merge .k{color:var(--ink-3);font-size:12px}
.my-merge b{font-weight:600}
.my-merge .by{font-size:12px;color:var(--ink-3)}
.my-merge .by em{font-style:normal;color:var(--ai);font-weight:600;margin-right:6px}
.my-split{margin:10px 0 0;padding:8px 12px;border-left:3px solid var(--kin);background:color-mix(in srgb,var(--kin) 7%,var(--sheet));border-radius:0 8px 8px 0;font-size:13px;line-height:1.6}
.my-split b{color:var(--kin-text)}
.my-split small{display:block;color:var(--ink-3);font-size:12px}
/* 我的玩法（五題） */
.my-mys .bd{gap:14px}
.my-q{display:flex;flex-direction:column;gap:6px;padding:12px 0;border-top:1px solid var(--line)}
.my-q:first-of-type{border-top:0;padding-top:0}
.my-qh{margin:0;font:700 16px/1.4 var(--f-display);letter-spacing:.03em;display:flex;align-items:center;gap:8px;outline:none}
.my-qh .no{width:24px;height:24px;border-radius:50%;background:var(--btn-pri-bg);color:#f4f5f2;display:grid;place-items:center;font:600 12px var(--f-mono);flex:none}
.my-qs{gap:8px}
.my-qs .my-fc{min-height:40px;display:inline-flex;align-items:center;gap:4px}
.my-qs .my-fc .my-ico{width:14px;height:14px}
.my-qs .my-fc[disabled]{opacity:.45;cursor:default}
.my-qt{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-2);margin-top:4px}
.my-qt .my-in{width:auto;min-width:130px;font-family:var(--f-mono)}
.my-qw{display:flex;flex-direction:column;gap:8px}
.my-qa{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:1px solid var(--line);border-radius:10px;background:var(--sheet);color:var(--ink);padding:10px 40px 10px 14px;min-height:56px;cursor:pointer;font:inherit}
.my-qa b{font:700 15px/1.35 var(--f-display);letter-spacing:.03em}
.my-qa small{font-size:12.5px;color:var(--ink-3)}
.my-qa:hover{border-color:var(--ink-3)}
.my-qa:focus-visible{outline:2px solid var(--glow);outline-offset:2px}
.my-qa .ok{position:absolute;right:12px;top:50%;margin-top:-10px;width:20px;height:20px;border-radius:50%;background:var(--btn-pri-bg);color:#f4f5f2;display:none;place-items:center}
.my-qa .ok .my-ico{width:12px;height:12px;stroke-width:3}
.my-qa[aria-checked="true"]{border-color:var(--btn-pri-bg);box-shadow:inset 0 0 0 1px var(--btn-pri-bg);background:color-mix(in srgb,var(--ai) 6%,var(--sheet))}
.my-qa[aria-checked="true"] .ok{display:grid}
.my-qbar{height:4px;border-radius:2px;background:var(--paper-2);overflow:hidden;margin-bottom:12px}
.my-qbar i{display:block;height:100%;background:var(--btn-pri-bg);border-radius:2px}
.my-qn{font:12.5px var(--f-mono);color:var(--ink-3);text-align:center;flex:1}
.my-mys .ft .l{margin-right:auto;font-size:12px;color:var(--ink-3)}
/* AI 工作單、匯入錯誤 */
.my-jobl{margin:0;padding:0 0 0 18px;font-size:13.5px;line-height:1.75;color:var(--ink-2)}
.my-jobl li.no{color:var(--ink-3)}
.my-errl{margin:0;padding:0 0 0 18px;font-size:13.5px;line-height:1.7;color:var(--ink);max-height:50vh;overflow:auto;overflow-wrap:anywhere}
.my-arr-d .why.ai{color:var(--ink);background:color-mix(in srgb,var(--ai) 6%,var(--sheet));border-radius:8px;padding:8px 10px;overflow-wrap:anywhere}
.my-arr-d .why.ai .src{font:500 10.5px/1.6 var(--f-mono);color:var(--ai);border:1px solid color-mix(in srgb,var(--ai) 45%,var(--line));border-radius:4px;padding:0 5px;margin-right:8px;white-space:nowrap}
.my-arr-d .note.ai{border-left-color:var(--ai);overflow-wrap:anywhere}
.my-arr-d.warn ul li span{overflow-wrap:anywhere}
@media (max-width:760px){
  .my-merge .r{grid-template-columns:68px minmax(0,1fr);padding:8px 10px}
  .my-merge .by{grid-column:2}
  .my-qs .my-fc,.my-qa{min-height:48px}
  .my-qt .my-in{min-height:44px}
  .my-mys .ft{flex-wrap:nowrap;align-items:center}
  .my-mys .ft .my-btn{min-height:44px;flex:none}
  .my-crew .my-btn.sm{flex:none}
  .my-lnk2[data-clear]{margin-top:8px}
  .my-vt .my-stack.xs .my-av{width:20px;height:20px}
}
.my-dlg.my-mys{width:min(560px,100%)}
.my-pop .my-wrow{grid-template-columns:96px minmax(0,1fr)}
.my-pop .my-wrow .nm{white-space:nowrap}

/* ---------- 旅遊風格第三階段：時段列、分頭（proposals/trip-style.html 第 06 節） ----------
   主題顏色只用藍、灰綠、暗金等中性色（不用紅色）；自由＝虛線、分頭＝深藍實心 */
.my-blks{display:flex;gap:4px;margin:-2px 0 12px;min-height:44px}
.my-blk{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;text-align:left;padding:5px 8px 5px 9px;border-radius:8px;border:1px solid var(--line);
  border-left:3px solid var(--bk,var(--line));background:color-mix(in srgb,var(--bk,var(--line)) 8%,var(--sheet));color:var(--ink);font:inherit;cursor:pointer}
span.my-blk{cursor:default}
.my-blk b{font:600 12.5px/1.3 var(--f-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-blk .pt{color:var(--ink-2);font-weight:500}
.my-blk small{font:11px/1.2 var(--f-mono);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
button.my-blk:hover{border-color:var(--ink-3);border-left-color:var(--bk,var(--ink-3))}
.my-blk:focus-visible{outline:2px solid var(--glow);outline-offset:1px}
.my-blk.gap{border:1px dashed var(--line);background:none;align-items:center;color:var(--ink-3);padding:0;font-size:14px}
button.my-blk.gap:hover{color:var(--ai);border-color:var(--ai)}
.f-art{--bk:var(--ai)}.f-shop{--bk:#4a5d8f}.f-food{--bk:var(--kin)}.f-cafe{--bk:var(--kinu)}.f-free{--bk:var(--ink-3)}.f-split{--bk:var(--btn-pri-bg)}
:root[data-theme="dark"] .f-shop{--bk:#8b9bd0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .f-shop{--bk:#8b9bd0}}
.my-blk.f-free{border-style:dashed;border-left-style:solid;background:var(--sheet)}
.my-blk.f-split{background:var(--btn-pri-bg);border-color:var(--btn-pri-bg);color:#f4f5f2}
.my-blk.f-split .pt,.my-blk.f-split small{color:color-mix(in srgb,#f4f5f2 78%,transparent)}
.my-blkadd{display:inline-flex;align-items:center;gap:5px;border:1px dashed var(--line);background:none;border-radius:var(--r-pill);padding:0 10px;min-height:26px;font:500 12px var(--f-body);color:var(--ai);cursor:pointer}
.my-blkadd:hover{border-color:var(--ai)}
.my-dayline .my-blkadd .my-ico{color:var(--ai)}
/* 時間軸上的時段分隔線 */
.my-blksep{display:flex;align-items:center;gap:8px;margin:10px 0 6px;font:600 12px/1.4 var(--f-body);color:var(--ink-2);letter-spacing:.03em}
.my-blksep::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--bk);flex:none}
.my-blksep small{font:11px var(--f-mono);color:var(--ink-3);font-weight:400}
.my-blksep::after{content:"";flex:1;border-top:1px dashed var(--line)}
.my-stops>.my-blksep:first-child{margin-top:0}
/* 分頭：桌機分欄、手機分組卡片 */
.my-splitbox{border:1px solid color-mix(in srgb,var(--ai) 35%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--ai) 4%,var(--sheet));padding:10px 12px 12px;margin:6px 0}
.my-splitbox .hd{display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap}
.my-splitbox .hd .k{display:inline-flex;align-items:center;gap:5px;font:600 11.5px/1 var(--f-body);color:#f4f5f2;background:var(--btn-pri-bg);border-radius:5px;padding:5px 8px}
.my-splitbox .hd .k .my-ico{color:#f4f5f2}
.my-splitbox .hd b{font:700 14px/1.45 var(--f-display);letter-spacing:.03em;min-width:0}
.my-splitbox .hd .my-btn{margin-left:auto}
.my-splitbox .none{margin:8px 0 0;font-size:12.5px;color:var(--ink-3)}
.my-sgcols{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:10px;margin-top:10px}
.my-sgc{background:var(--sheet);border:1px solid var(--line);border-top:3px solid var(--gc,var(--ai));border-radius:10px;padding:8px 10px;min-width:0}
.my-sgc.g1,.my-spn.g1{--gc:var(--ai)}.my-sgc.g2,.my-spn.g2{--gc:var(--kinu)}.my-sgc.g3,.my-spn.g3{--gc:var(--kin)}.my-sgc.g4,.my-spn.g4{--gc:var(--ink-3)}
.my-sgc .gh{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.my-sgc .gh b{font:700 13.5px/1.35 var(--f-display);letter-spacing:.03em}
.my-sgc .gh small{flex-basis:100%;font-size:12px;color:var(--ink-3)}
.my-sgc .gh .my-stack .my-av{width:22px;height:22px;font-size:10.5px;border:1.5px solid var(--sheet)}
.my-sgc ol{list-style:none;margin:6px 0 0;padding:0}
.my-gstop{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:6px;align-items:center;border-top:1px dashed var(--line);padding:3px 0}
.my-gstop.done{opacity:.6}
.my-gstop .tm{font:500 12px var(--f-mono);color:var(--ink-2)}
.my-gstop .tt{min-width:0}
.my-gstop .tt b{display:block;font:600 13.5px/1.35 var(--f-display);letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-gstop .tt .my-pr{margin-left:0}
.my-gstop .tt small{display:block;font-size:11.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-gstop .my-ib{width:34px;height:34px}
.my-splitbox .meet{display:flex;align-items:center;gap:6px;margin-top:10px;font:600 13px/1.4 var(--f-body);color:var(--ai)}
.my-splitbox .meet .my-ico{color:var(--ai)}
/* 時段選單（桌機彈出框、手機底部面板） */
.my-bfs{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.my-bf{display:flex;flex-direction:column;gap:1px;align-items:flex-start;text-align:left;border:1px solid var(--line);border-left:3px solid var(--bk);border-radius:9px;background:var(--sheet);color:var(--ink);padding:7px 10px;cursor:pointer;font:inherit;min-height:48px}
.my-bf b{font:600 13.5px/1.3 var(--f-body)}
.my-bf small{font-size:11.5px;color:var(--ink-3)}
.my-bf:hover{border-color:var(--ink-3);border-left-color:var(--bk)}
.my-bf:focus-visible{outline:2px solid var(--glow);outline-offset:1px}
.my-bf[aria-checked="true"]{background:color-mix(in srgb,var(--bk) 12%,var(--sheet));border-color:var(--bk);box-shadow:inset 0 0 0 1px var(--bk)}
/* 分組設定 */
.my-spd .bd{gap:10px}
.my-spd .my-capt{margin:6px 0 0}
.my-spd .my-capt small{display:block;font-size:12px;color:var(--ink-3);font-weight:400;letter-spacing:0;text-transform:none}
.my-spt .row,.my-spm{display:flex;gap:8px}
.my-spt .row>*,.my-spm>*{flex:1;min-width:0}
.my-spg{display:flex;flex-direction:column;gap:6px}
.my-spn{display:flex;align-items:center;gap:8px}
.my-spn .no{width:24px;height:24px;border-radius:50%;background:var(--gc);color:var(--paper);display:grid;place-items:center;font:600 12px var(--f-mono);flex:none}
.my-spn .my-in{flex:1;min-width:0}
.my-spg>.my-btn{align-self:flex-start}
.my-spl{display:flex;flex-direction:column}
.my-spr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:6px 12px;align-items:center;padding:6px 0;border-bottom:1px dashed var(--line)}
.my-spr .nm{display:flex;align-items:center;gap:8px;min-width:0;font-size:13.5px}
.my-spr .nm b{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.my-spr .nm small{font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.my-spr .nm .my-pr{margin-left:0}
.my-spr .my-sg button{min-height:36px;font-size:12.5px}
.my-split p{margin:0}
.my-split .row{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin-top:6px}
.my-split .row small{flex:1 1 200px}
.my-arr-d li.sp{background:color-mix(in srgb,var(--ai) 6%,var(--sheet));border-radius:8px;padding:6px 8px;margin:0 -8px}
.my-arr-d li.sp span{overflow-wrap:anywhere}
@media (max-width:760px){
  .my-blk{min-width:44px;min-height:44px;padding:4px 6px 4px 7px}
  .my-blk .pt{display:none}
  .my-blkadd{min-height:44px}
  .my-sgcols{grid-template-columns:minmax(0,1fr)}
  .my-gstop .my-ib{width:44px;height:44px}
  .my-splitbox .hd .my-btn{margin-left:0}
  .my-bf{min-height:56px}
  .my-spr{grid-template-columns:minmax(0,1fr)}
  .my-spr .my-sg button{min-height:44px}
  .my-spn .my-ib{width:44px;height:44px}
  .my-spg>.my-btn{min-height:44px}
  .my-spd .ft .my-btn{min-height:44px}
}