:root{
  --bg:#f8fafc; --surface:#ffffff; --surface-2:#f1f5f9; --ink:#0f172a; --muted:#64748b;
  --line:#e2e8f0; --primary:#0f766e; --primary-2:#115e59; --accent:#f59e0b; --danger:#dc2626;
  --ok:#16a34a; --purple:#7c3aed; --radius:22px; --shadow:0 18px 45px rgba(15,23,42,.08);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--ink)} button,input,select,textarea{font:inherit} button{cursor:pointer}
a{color:var(--primary);text-decoration:none} a:hover{text-decoration:underline}.small{font-size:12px}.muted{color:var(--muted)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.hide{display:none!important}
.app-shell{display:grid;grid-template-columns:290px minmax(0,1fr);min-height:100vh}.sidebar{background:#ffffff;border-right:1px solid var(--line);padding:22px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:20px}.brand{display:flex;gap:13px;align-items:center}.brand-mark{width:48px;height:48px;border-radius:18px;background:linear-gradient(135deg,#0f766e,#14b8a6);display:grid;place-items:center;color:#fff;font-weight:900;font-size:25px;box-shadow:0 14px 30px rgba(15,118,110,.25)}.brand h1{font-size:21px;margin:0}.brand p{margin:3px 0 0;color:var(--muted);font-size:12px}.side-nav{display:grid;gap:8px}.nav-btn{border:0;background:transparent;color:#334155;padding:11px 12px;border-radius:16px;text-align:left;display:flex;align-items:center;gap:10px;font-weight:800}.nav-btn:hover{background:var(--surface-2)}.nav-btn.active{background:#ccfbf1;color:#134e4a}.nav-icon{width:28px;height:28px;border-radius:10px;background:#f1f5f9;display:grid;place-items:center}.nav-btn.active .nav-icon{background:#99f6e4}.side-card{margin-top:auto;border:1px solid var(--line);background:#f8fafc;border-radius:20px;padding:15px;display:grid;gap:6px}.sync-mini{display:inline-flex;align-items:center;gap:6px;width:max-content;border-radius:999px;background:#eef2ff;color:#3730a3;font-size:12px;font-weight:800;padding:5px 9px}.main{min-width:0;padding:26px 30px 48px}.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px}.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-size:12px;font-weight:900;color:var(--primary);margin:0 0 6px}.topbar h2{font-size:30px;margin:0}.top-actions,.toolbar{display:flex;gap:9px;flex-wrap:wrap;align-items:center}.top-actions{justify-content:flex-end}.content{display:none}.content.active{display:block}.grid{display:grid;gap:16px}.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}.card.compact{padding:14px}.card h3,.card h4{margin:0 0 12px}.hero{background:radial-gradient(circle at top right,#99f6e4 0,#f0fdfa 34%,#fff 72%);padding:24px;border-radius:30px;border:1px solid var(--line);box-shadow:var(--shadow)}.hero-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.hero h3{font-size:27px;margin:0 0 8px}.hero p{color:var(--muted);line-height:1.7;margin:0}.pill-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.pill{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:900;color:#334155}.pill.locked{background:#fef3c7;border-color:#fde68a;color:#92400e}.pill.rain{background:#dbeafe;border-color:#bfdbfe;color:#1d4ed8}.pill.ok{background:#dcfce7;border-color:#bbf7d0;color:#166534}.pill.warn{background:#fee2e2;border-color:#fecaca;color:#991b1b}.pill.cloud{background:#eef2ff;border-color:#c7d2fe;color:#3730a3}.stat{display:grid;gap:7px}.stat .num{font-size:29px;font-weight:950}.stat .label{color:var(--muted);font-size:13px}.primary,.ghost,.danger{border:1px solid transparent;border-radius:14px;padding:10px 13px;font-weight:900;text-decoration:none;display:inline-flex;align-items:center;gap:7px;justify-content:center;background:#fff}.primary{background:var(--primary);color:#fff}.primary:hover{background:var(--primary-2);text-decoration:none}.ghost{border-color:var(--line);color:#334155}.ghost:hover{background:var(--surface-2);text-decoration:none}.danger{color:var(--danger)}.danger:hover{background:#fef2f2}.file-label{cursor:pointer}.toolbar{margin:0 0 16px}.toolbar input,.toolbar select,.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:14px;padding:11px 12px;background:#fff;color:var(--ink);outline:none;width:100%}.toolbar input{max-width:260px}.toolbar select{max-width:220px}.toolbar input:focus,.toolbar select:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:#5eead4;box-shadow:0 0 0 4px #ccfbf1}.field textarea{min-height:95px;resize:vertical}.timeline{display:grid;gap:14px}.date-section{display:grid;gap:10px}.date-title{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,var(--bg) 75%,rgba(248,250,252,0));padding:12px 0 8px;color:#0f766e;font-size:17px}.item-card{display:grid;grid-template-columns:92px 1fr auto;gap:14px;align-items:start;border:1px solid var(--line);background:#fff;border-radius:20px;padding:15px;box-shadow:0 10px 28px rgba(15,23,42,.05)}.time{font-weight:950;color:#0f766e}.item-title{font-weight:950}.meta{color:var(--muted);font-size:13px;line-height:1.6;margin-top:4px}.note{font-size:13px;color:#475569;line-height:1.7;margin-top:8px}.item-actions{display:flex;gap:6px;flex-wrap:wrap}.icon-btn{border:0;background:transparent;border-radius:12px;min-width:34px;min-height:34px;font-size:18px;color:var(--muted);display:inline-grid;place-items:center;text-decoration:none;cursor:pointer}.icon-btn:hover{background:var(--surface-2);color:var(--ink);text-decoration:none}.icon-btn.map-btn{background:#f0fdfa;color:#0f766e}.icon-btn.map-btn:hover{background:#ccfbf1;color:#115e59}.badge{display:inline-block;border-radius:999px;padding:4px 8px;background:#f1f5f9;color:#475569;font-weight:900;font-size:11px}.badge.flight{background:#e0f2fe;color:#075985}.badge.transport{background:#ede9fe;color:#5b21b6}.badge.hotel{background:#fae8ff;color:#86198f}.badge.food{background:#ffedd5;color:#9a3412}.badge.attraction{background:#dcfce7;color:#166534}.badge.event{background:#fef3c7;color:#92400e}.badge.free{background:#f1f5f9;color:#334155}.badge.expense{background:#fee2e2;color:#991b1b}.badge.doc{background:#e0e7ff;color:#3730a3}.badge.packing{background:#d1fae5;color:#065f46}.badge.bus{background:#fce7f3;color:#9d174d}.badge.train{background:#e0f2fe;color:#075985}.badge.subway{background:#ccfbf1;color:#134e4a}.badge.taxi{background:#fef3c7;color:#92400e}.place-list,.transport-grid,.doc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}.place-card h4,.transport-card h4,.doc-card h4{margin:0 0 8px;font-size:17px}.place-card p,.transport-card p{color:var(--muted);line-height:1.7;font-size:13px}.map-frame{height:360px;border-radius:22px;overflow:hidden;border:1px solid var(--line);background:#e2e8f0;position:relative}.map-dots{position:absolute;inset:0;background:linear-gradient(135deg,#ecfeff,#f8fafc)}.map-point{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:12px;font-weight:950;color:#0f172a}.map-point::before{content:"";width:12px;height:12px;border-radius:999px;background:var(--primary);box-shadow:0 0 0 5px rgba(15,118,110,.16)}.expense-table,.mini-table{width:100%;border-collapse:separate;border-spacing:0 9px}.expense-table th,.mini-table th{text-align:left;color:var(--muted);font-size:12px;padding:0 10px}.expense-table td,.mini-table td{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 10px;font-size:14px;vertical-align:top}.expense-table td:first-child,.mini-table td:first-child{border-left:1px solid var(--line);border-radius:14px 0 0 14px}.expense-table td:last-child,.mini-table td:last-child{border-right:1px solid var(--line);border-radius:0 14px 14px 0}.settlement{display:grid;gap:8px}.settlement-row{display:flex;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:16px;background:#fff;padding:12px}.split-list{display:grid;gap:6px;margin-top:8px}.split-row{display:flex;justify-content:space-between;gap:10px;padding:6px 8px;border-radius:12px;background:#f8fafc;color:#475569;font-size:12px}.checklist{display:grid;gap:10px}.check-row{display:grid;grid-template-columns:1fr auto auto auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:12px;background:#fff}.check-row.done span{text-decoration:line-through;color:var(--muted)}.check-label{font-weight:850}.check-status{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:12px}.empty{border:1px dashed #cbd5e1;border-radius:20px;padding:22px;text-align:center;color:var(--muted);background:#fff}.source-box{border:1px solid var(--line);border-radius:18px;background:#fff;padding:14px;line-height:1.65;color:#475569}.notice{border-left:4px solid var(--accent);background:#fffbeb;border-radius:18px;padding:14px;color:#92400e;line-height:1.7}.okbox{border-left:4px solid var(--ok);background:#f0fdf4;border-radius:18px;padding:14px;color:#166534;line-height:1.7}.dangerbox{border-left:4px solid var(--danger);background:#fef2f2;border-radius:18px;padding:14px;color:#991b1b;line-height:1.7}.two-pane{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}.doc-viewer-card{width:min(1080px,calc(100vw - 28px));max-height:92vh;display:flex;flex-direction:column}.doc-viewer-body,.dialog-body{padding:18px 20px;overflow:auto;display:grid;gap:14px}.doc-viewer-grid{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(320px,1.2fr);gap:14px;align-items:start}.doc-frame{width:100%;height:62vh;border:1px solid var(--line);border-radius:16px;background:#fff}.doc-image-preview{width:100%;max-height:62vh;object-fit:contain;border:1px solid var(--line);border-radius:16px;background:#f8fafc}.doc-text-preview{white-space:pre-wrap;word-break:break-word;max-height:62vh;overflow:auto;background:#f8fafc;border:1px solid var(--line);border-radius:16px;padding:14px;font-size:12px;line-height:1.55;color:#334155}.doc-upload{border:2px dashed #99f6e4;border-radius:22px;background:#f0fdfa;padding:18px;display:grid;gap:10px}.upload-input{display:none}.upload-label{display:grid;place-items:center;min-height:90px;border-radius:16px;background:#fff;color:#0f766e;font-weight:950}.install-card{width:min(760px,calc(100vw - 28px))}.dialog-card{min-width:min(760px,calc(100vw - 28px));border:0;border-radius:26px;padding:0;background:#fff;box-shadow:0 28px 90px rgba(15,23,42,.26);overflow:hidden}dialog{border:0;background:transparent}dialog::backdrop{background:rgba(15,23,42,.45);backdrop-filter:blur(5px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}.dialog-head h3{margin:0}.dialog-fields{padding:18px 20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.field.full{grid-column:1/-1}.field label{display:block;font-size:12px;font-weight:950;color:#475569;margin:0 0 6px}.field .hint{font-size:12px;color:var(--muted);margin-top:5px}menu{padding:16px 20px;margin:0;display:flex;justify-content:flex-end;gap:10px;border-top:1px solid var(--line)}#toast{position:fixed;left:50%;bottom:86px;transform:translateX(-50%) translateY(30px);background:#0f172a;color:#fff;border-radius:999px;padding:11px 16px;font-weight:900;font-size:13px;opacity:0;pointer-events:none;transition:.22s;z-index:20}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.bottom-nav{display:none}.cloud-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.cloud-dot{width:10px;height:10px;border-radius:999px;background:#94a3b8}.cloud-dot.ok{background:#22c55e}.cloud-dot.warn{background:#f59e0b}.divider{height:1px;background:var(--line);margin:12px 0}.print-only{display:none}.ratio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}.chip-list{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid var(--line);border-radius:999px;background:#fff;padding:7px 10px;font-size:12px;font-weight:850;color:#334155}.currency-list{display:grid;gap:8px}.currency-row{display:grid;grid-template-columns:90px 1fr 160px auto;gap:8px;align-items:center}.currency-row strong{font-size:14px}
@media (max-width: 980px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.main{padding:18px 14px 92px}.topbar{display:grid;gap:13px}.top-actions{justify-content:flex-start}.grid.cols-2,.grid.cols-3,.grid.cols-4,.two-pane{grid-template-columns:1fr}.item-card{grid-template-columns:1fr;gap:9px}.item-actions{justify-content:flex-start}.toolbar input,.toolbar select{max-width:none}.bottom-nav{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-top:1px solid var(--line);z-index:10;padding-bottom:env(safe-area-inset-bottom)}.bottom-nav .nav-btn{border-radius:0;display:grid;place-items:center;gap:1px;font-size:10px;padding:7px 2px}.bottom-nav .nav-icon{width:auto;font-size:19px}.topbar h2{font-size:25px}.hero-top{display:grid}.dialog-fields{grid-template-columns:1fr}.expense-table,.mini-table{font-size:13px;display:block;overflow:auto;white-space:nowrap}.map-frame{height:300px}.doc-viewer-grid{grid-template-columns:1fr}.doc-frame,.doc-image-preview,.doc-text-preview{max-height:48vh;height:48vh}.check-row{grid-template-columns:1fr 1fr 1fr auto}.currency-row{grid-template-columns:1fr 1fr;}.currency-row button{grid-column:1/-1}}
@media print{.sidebar,.bottom-nav,.topbar .top-actions,.item-actions,.toolbar{display:none!important}.app-shell{grid-template-columns:1fr}.main{padding:0}.content{display:block!important;page-break-after:always}.card,.hero,.item-card{box-shadow:none}.print-only{display:block}}

/* v3.3 Embedded Google Map */
.map-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.map-toolbar select{max-width:300px}
.map-layout{grid-template-columns:minmax(420px,1.2fr) minmax(320px,.8fr)}
.map-card{overflow:hidden}
.embedded-map-wrap{height:430px;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#e2e8f0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}
.embedded-map{width:100%;height:100%;border:0;display:block}
.map-focus{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-top:12px;padding:11px 12px;border:1px solid var(--line);border-radius:16px;background:#f8fafc}
.map-focus span{color:var(--muted);font-size:13px;text-align:right;line-height:1.5}
.map-chip-list{margin-top:12px;max-height:160px;overflow:auto;padding-right:4px}
.map-chip{cursor:pointer;font-family:inherit}
.map-chip.active{background:#ccfbf1;border-color:#5eead4;color:#115e59}
@media (max-width: 980px){.map-layout{grid-template-columns:1fr}.embedded-map-wrap{height:360px}.map-toolbar select{max-width:none;width:100%}.map-focus{display:grid}.map-focus span{text-align:left}}


/* v3.5 Mobile expense layout fix: convert wide expense table to cards on phones */
@media (max-width: 760px){
  html, body{max-width:100%; overflow-x:hidden;}
  .main{width:100%; overflow-x:hidden;}
  .card{min-width:0;}
  #expenses .grid{min-width:0;}
  #expenses .card{overflow:hidden;}
  #expenses .expense-table{
    display:block;
    width:100%;
    min-width:0;
    border-collapse:collapse;
    border-spacing:0;
    overflow:visible;
    white-space:normal;
  }
  #expenses .expense-table thead{display:none;}
  #expenses .expense-table tbody{display:grid; gap:12px; width:100%; min-width:0;}
  #expenses .expense-table tr{
    display:block;
    width:100%;
    min-width:0;
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff;
    padding:12px 14px;
    box-shadow:0 8px 22px rgba(15,23,42,.04);
  }
  #expenses .expense-table td{
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    gap:10px;
    align-items:start;
    width:100%;
    min-width:0;
    background:transparent;
    border:0;
    border-radius:0;
    padding:8px 0;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  #expenses .expense-table td::before{
    color:var(--muted);
    font-size:12px;
    font-weight:950;
    line-height:1.6;
  }
  #expenses .expense-table td:nth-child(1)::before{content:'日期';}
  #expenses .expense-table td:nth-child(2)::before{content:'項目';}
  #expenses .expense-table td:nth-child(3)::before{content:'金額';}
  #expenses .expense-table td:nth-child(4)::before{content:'付款人';}
  #expenses .expense-table td:nth-child(5)::before{content:'分攤';}
  #expenses .expense-table td:nth-child(6)::before{content:'';}
  #expenses .expense-table td:nth-child(6){
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding-top:10px;
    border-top:1px solid var(--line);
  }
  #expenses .expense-table td:nth-child(6) .ghost{flex:1 1 88px;}
  #expenses .split-list{width:100%; min-width:0; margin-top:0;}
  #expenses .split-row{
    display:grid;
    grid-template-columns:1fr;
    gap:4px;
    width:100%;
    min-width:0;
    white-space:normal;
  }
  #expenses .split-row strong,
  #expenses .settlement-row strong{
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  #expenses .settlement-row{
    display:grid;
    grid-template-columns:1fr;
    align-items:start;
  }
}

@media (max-width: 430px){
  .main{padding-left:12px; padding-right:12px;}
  #expenses .expense-table td{grid-template-columns:62px minmax(0,1fr); gap:8px;}
  .top-actions .ghost,.top-actions .danger{padding:9px 11px; font-size:14px;}
}


/* v3.6 Mobile all-pages navigation: show 地圖、物品、設定 on phones */
@media (max-width: 980px){
  .bottom-nav{
    display:flex;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
    scrollbar-width:thin;
    padding-left:4px;
    padding-right:4px;
  }
  .bottom-nav .nav-btn{
    flex:0 0 76px;
    min-width:76px;
    white-space:nowrap;
  }
  .bottom-nav .nav-btn.active{
    box-shadow:inset 0 3px 0 rgba(15,118,110,.25);
  }
}
@media (max-width: 390px){
  .bottom-nav .nav-btn{flex-basis:70px; min-width:70px;}
}


/* v3.7 Calendar view */
.calendar-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;position:sticky;top:0;z-index:3}
.calendar-nav-buttons{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.calendar-title-wrap h3{margin:0;font-size:22px}.calendar-title-wrap{display:grid;gap:6px;justify-items:center}.calendar-date-jump{display:flex;gap:8px;align-items:center}.icon-only{min-width:42px}.calendar-wrap{padding:0;overflow:auto}.calendar-grid{--time-col:78px;--day-min:156px;--hour-height:64px;display:grid;grid-template-columns:var(--time-col) repeat(7,minmax(var(--day-min),1fr));min-width:calc(var(--time-col) + 7 * var(--day-min));background:#fff;border-radius:24px;overflow:hidden}.calendar-corner,.calendar-day-head{position:sticky;top:0;z-index:2;background:#f8fafc;border-bottom:1px solid var(--line);min-height:76px}.calendar-corner{left:0;z-index:4;display:flex;align-items:flex-end;padding:0 10px 12px;color:#64748b;font-weight:900;font-size:12px;border-right:1px solid var(--line)}.calendar-day-head{display:grid;place-items:center;border-right:1px solid var(--line);text-align:center;padding:8px 4px}.calendar-day-head span{font-size:12px;font-weight:900;color:#64748b}.calendar-day-head strong{font-size:24px;line-height:1}.calendar-day-head em{font-style:normal;font-size:11px;color:#64748b}.calendar-day-head.today strong{background:#bfdbfe;color:#0f172a;border-radius:999px;padding:7px 11px}.calendar-time-col{position:sticky;left:0;z-index:1;background:#fff;border-right:1px solid var(--line)}.calendar-hour-label{height:var(--hour-height);border-bottom:1px solid var(--line);display:flex;align-items:flex-start;justify-content:flex-end;padding:7px 10px;color:#64748b;font-size:12px;font-weight:900}.calendar-day-col{position:relative;height:calc(var(--hour-count) * var(--hour-height));border-right:1px solid var(--line);background:#fff}.calendar-hour-cell{height:var(--hour-height);border-bottom:1px solid var(--line)}.calendar-event{position:absolute;left:7px;right:7px;border:0;border-radius:9px;padding:8px 9px;background:#6d5dfc;color:#fff;text-align:left;cursor:pointer;box-shadow:0 8px 18px rgba(15,23,42,.16);overflow:hidden;font-family:inherit;display:grid;align-content:start;gap:2px}.calendar-event strong{font-size:12px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.calendar-event span,.calendar-event em{font-size:11px;opacity:.9;font-style:normal}.calendar-event.flight{background:#0284c7}.calendar-event.transport{background:#0f766e}.calendar-event.hotel{background:#7c3aed}.calendar-event.food{background:#be123c}.calendar-event.attraction{background:#b45309}.calendar-event.event{background:#6b21a8}.calendar-event.free{background:#334155}.calendar-event.locked-event{outline:2px solid rgba(255,255,255,.65)}.calendar-note{margin-top:16px}.calendar-detail-card{width:min(760px,calc(100vw - 28px))}.calendar-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width: 760px){.calendar-toolbar{position:static;display:grid;align-items:stretch}.calendar-title-wrap{justify-items:start}.calendar-date-jump{display:grid}.calendar-date-jump input{width:100%}.calendar-wrap{margin-left:-4px;margin-right:-4px;border-radius:18px}.calendar-grid{--time-col:62px;--day-min:132px;--hour-height:52px}.calendar-corner{font-size:11px;padding:0 7px 10px}.calendar-day-head{min-height:68px}.calendar-day-head strong{font-size:20px}.calendar-hour-label{font-size:11px;padding:6px}.calendar-event{left:5px;right:5px;padding:6px 7px}.calendar-event strong{font-size:11px}.calendar-event span,.calendar-event em{font-size:10px}.calendar-detail-grid{grid-template-columns:1fr}}

/* v3.8 Mobile calendar readability: mobile agenda replaces the 7-column weekly grid */
.calendar-mobile-view{display:none;}
.calendar-desktop-view{display:block;}
@media (max-width: 760px){
  .calendar-desktop-view{display:none;}
  .calendar-mobile-view{display:grid;gap:14px;}
  #calendar .calendar-toolbar.card{padding:14px;border-radius:20px;}
  #calendar .calendar-nav-buttons{display:grid;grid-template-columns:1fr 1fr 44px 44px;gap:8px;}
  #calendar .calendar-nav-buttons .ghost{padding:9px 8px;min-height:40px;}
  #calendar .calendar-title-wrap{align-items:start;}
  #calendar .calendar-title-wrap h3{font-size:20px;}
  #calendar .calendar-title-wrap .pill{width:max-content;max-width:100%;white-space:normal;}
  .calendar-mobile-week{padding:14px;border-radius:20px;overflow:hidden;}
  .calendar-mobile-week-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-end;margin-bottom:12px;}
  .calendar-day-strip{display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding:2px 2px 8px;scroll-snap-type:x mandatory;}
  .calendar-day-chip{flex:0 0 96px;scroll-snap-align:start;border:1px solid var(--line);background:#fff;border-radius:18px;padding:10px 9px;text-align:left;display:grid;gap:4px;color:var(--ink);box-shadow:0 8px 20px rgba(15,23,42,.05);}
  .calendar-day-chip span{font-size:12px;color:var(--muted);font-weight:900;}
  .calendar-day-chip strong{font-size:24px;line-height:1;}
  .calendar-day-chip em{font-style:normal;font-size:12px;font-weight:900;color:var(--primary);}
  .calendar-day-chip small{font-size:10px;line-height:1.25;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:25px;}
  .calendar-day-chip.active{border-color:#5eead4;background:#ccfbf1;box-shadow:0 10px 24px rgba(20,184,166,.18);}
  .calendar-day-chip.today strong{background:#bfdbfe;border-radius:999px;width:max-content;padding:4px 9px;}
  .calendar-mobile-agenda{padding:15px;border-radius:20px;}
  .calendar-mobile-agenda-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px;}
  .calendar-mobile-agenda-head h3{margin:0 0 4px;font-size:18px;line-height:1.35;}
  .calendar-mobile-agenda-head .ghost{flex:0 0 auto;padding:8px 10px;}
  .calendar-agenda-list{display:grid;gap:12px;}
  .calendar-agenda-card{width:100%;border:1px solid var(--line);background:#fff;border-radius:18px;padding:0;display:grid;grid-template-columns:72px minmax(0,1fr);text-align:left;color:var(--ink);overflow:hidden;box-shadow:0 8px 20px rgba(15,23,42,.05);}
  .calendar-agenda-card::before{content:"";display:block;width:5px;background:#334155;grid-row:1;grid-column:1;align-self:stretch;justify-self:start;}
  .calendar-agenda-card.flight::before{background:#0284c7;}.calendar-agenda-card.transport::before{background:#0f766e;}.calendar-agenda-card.hotel::before{background:#7c3aed;}.calendar-agenda-card.food::before{background:#be123c;}.calendar-agenda-card.attraction::before{background:#b45309;}.calendar-agenda-card.event::before{background:#6b21a8;}.calendar-agenda-card.free::before{background:#334155;}
  .agenda-time{grid-column:1;grid-row:1;padding:14px 8px 14px 13px;display:grid;align-content:start;gap:4px;color:var(--primary);font-weight:950;}
  .agenda-time strong{font-size:17px;line-height:1.1;}
  .agenda-time span{font-size:12px;color:var(--muted);}
  .agenda-main{grid-column:2;grid-row:1;padding:14px 13px 14px 8px;min-width:0;}
  .agenda-title{font-weight:950;line-height:1.45;overflow-wrap:anywhere;word-break:break-word;}
  .agenda-meta{color:var(--muted);font-size:12px;line-height:1.5;margin-top:5px;overflow-wrap:anywhere;}
  .agenda-pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;}
  .agenda-main p{margin:8px 0 0;color:#475569;font-size:12px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
  .calendar-note{font-size:13px;line-height:1.65;}
}
@media (max-width: 390px){
  #calendar .calendar-nav-buttons{grid-template-columns:1fr 1fr 40px 40px;gap:6px;}
  .calendar-day-chip{flex-basis:88px;}
  .calendar-agenda-card{grid-template-columns:66px minmax(0,1fr);}
  .agenda-time{padding-left:11px;}
}


/* v3.10 itinerary date filter */
.itinerary-toolbar{align-items:center;gap:10px;flex-wrap:wrap;}
.inline-filter{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:18px;background:#fff;padding:8px 12px;font-weight:800;color:var(--muted);}
.inline-filter select{border:0;background:transparent;font-weight:900;color:var(--ink);outline:none;min-width:220px;}
.filter-summary{margin:8px 0 18px;color:var(--muted);font-weight:800;}
@media (max-width: 760px){
  .itinerary-toolbar{display:grid;grid-template-columns:1fr 1fr;}
  .itinerary-toolbar .inline-filter{grid-column:1 / -1;width:100%;justify-content:space-between;}
  .inline-filter select{min-width:0;width:100%;}
}

/* v3.11 Candidate Database / Library */
.library-toolbar{align-items:center;gap:10px;flex-wrap:wrap;}
.library-toolbar input{min-width:280px;max-width:420px;}
.inline-check{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:16px;padding:10px 12px;font-weight:900;color:#334155;white-space:nowrap;}
.library-meta{margin:12px 0;color:var(--muted);font-weight:800;}
.library-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;}
.library-card{display:grid;gap:8px;align-content:start;}
.library-card h4{font-size:18px;margin:0;line-height:1.35;}
.library-card p{margin:0;color:#475569;font-size:13px;line-height:1.65;}
.library-card-head{display:flex;gap:7px;align-items:center;flex-wrap:wrap;}
.badge.library{background:#eef2ff;color:#3730a3;}
.badge.library.restaurant{background:#ffedd5;color:#9a3412;}
.badge.library.cafe{background:#fce7f3;color:#9d174d;}
.badge.library.attraction{background:#dcfce7;color:#166534;}
.badge.library.backup{background:#dbeafe;color:#1d4ed8;}
.badge.library.event{background:#fef3c7;color:#92400e;}
.badge.library.shopping{background:#fae8ff;color:#86198f;}
.badge.library.transport{background:#ccfbf1;color:#134e4a;}
#library .item-actions{margin-top:4px;}
#library .item-actions .primary,#library .item-actions .ghost,#library .item-actions .danger{padding:9px 11px;font-size:13px;}
@media (max-width:760px){
  .library-toolbar{display:grid;grid-template-columns:1fr;}
  .library-toolbar input,.library-toolbar select{min-width:0;max-width:none;width:100%;}
  .inline-check{width:100%;justify-content:flex-start;}
  .library-grid{grid-template-columns:1fr;}
  .library-card .item-actions{display:grid;grid-template-columns:1fr 1fr;}
  .library-card .item-actions a,.library-card .item-actions button{width:100%;}
}

/* v4.0 Supabase cloud / offline-first status */
.network-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:900;background:#f1f5f9;color:#475569;border:1px solid var(--line)}
.network-status::before{content:"";width:9px;height:9px;border-radius:999px;background:#94a3b8}
.network-status.online::before{background:#22c55e}.network-status.offline::before{background:#f59e0b}.network-status.pending::before{background:#6366f1}
.sync-mini.sync-ok{background:#dcfce7;color:#166534}.sync-mini.sync-error{background:#fee2e2;color:#991b1b}
.cloud-dialog-card{width:min(820px,calc(100vw - 28px));max-height:94vh}
.cloud-config-grid textarea{min-height:74px;resize:vertical}
.cloud-account-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
.cloud-account-grid>div{display:grid;gap:4px;border:1px solid var(--line);border-radius:16px;padding:12px;background:#f8fafc;min-width:0}
.cloud-account-grid strong{overflow-wrap:anywhere}
.cloud-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}
.cloud-settings-card{background:radial-gradient(circle at top right,#dbeafe 0,#f8fafc 42%,#fff 75%)}
.cloud-settings-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
@media(max-width:760px){.network-status{order:5}.cloud-account-grid,.cloud-action-grid{grid-template-columns:1fr}.cloud-dialog-card{max-height:92vh}.top-actions{align-items:stretch}.top-actions>#cloudBtn,.top-actions>.network-status{flex:1 1 auto}}
.cloud-dialog-card{display:flex;flex-direction:column}
.cloud-dialog-card>.dialog-body{min-height:0;overflow:auto}
.cloud-dialog-card>.dialog-head,.cloud-dialog-card>menu{flex:0 0 auto}

/* v4.1 Mobile usability fixes: currency editor, modal forms and editable pre-trip todos */
.todo-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}
.todo-card-head h3{margin-bottom:5px}
.todo-add-btn{flex:0 0 auto}
.todo-list{display:grid;gap:10px}
.todo-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:12px;background:#fff;min-width:0}
.todo-check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;min-width:0;cursor:pointer}
.todo-check input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--primary);flex:0 0 auto}
.todo-text{font-weight:850;line-height:1.6;overflow-wrap:anywhere;word-break:break-word;min-width:0}
.todo-row.done .todo-text{text-decoration:line-through;color:var(--muted)}
.todo-actions{display:flex;gap:4px;align-items:center}
.todo-actions .icon-btn.danger{color:var(--danger)}

.currency-row{grid-template-columns:90px minmax(0,1fr) minmax(160px,.75fr) auto;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);min-width:0}
.currency-row:last-child{border-bottom:0}
.currency-code,.currency-control{min-width:0}
.currency-code{display:grid;gap:5px;align-content:center}
.currency-code span,.currency-control>span{display:block;font-size:11px;font-weight:900;color:var(--muted);margin-bottom:5px}
.currency-control input{width:100%;min-width:0;max-width:100%;border:1px solid var(--line);border-radius:14px;padding:11px 12px;background:#fff;color:var(--ink);outline:none}
.currency-control input:focus{border-color:#5eead4;box-shadow:0 0 0 4px #ccfbf1}
.currency-delete{align-self:end}

/* Keep every add/edit dialog inside the visual viewport, even when fields contain long text. */
#editDialog{padding:0;max-width:100vw;max-height:100dvh;overflow:hidden}
#editDialog[open]{display:grid;place-items:center;width:100vw;height:100dvh;padding:12px}
#editDialog .dialog-card{display:flex;flex-direction:column;width:min(760px,100%);min-width:0;max-width:100%;max-height:calc(100dvh - 24px);margin:0;overflow:hidden}
#editDialog .dialog-head,#editDialog menu{flex:0 0 auto}
#editDialog .dialog-fields{flex:1 1 auto;min-height:0;min-width:0;max-width:100%;overflow-y:auto;overflow-x:hidden}
#editDialog .dialog-fields>*,#editDialog .field,#editDialog .field.full{min-width:0;max-width:100%}
#editDialog input,#editDialog select,#editDialog textarea{display:block;min-width:0;max-width:100%;width:100%}
#editDialog .ratio-grid{min-width:0;max-width:100%}

@media (max-width:760px){
  .todo-card-head{display:grid;grid-template-columns:1fr}
  .todo-add-btn{width:100%}
  .todo-row{grid-template-columns:minmax(0,1fr) auto;padding:13px 12px}
  .todo-actions{align-self:start}

  .currency-list{gap:12px}
  .currency-row{display:grid;grid-template-columns:1fr;gap:10px;padding:14px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(15,23,42,.04)}
  .currency-code{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
  .currency-code span{margin:0}
  .currency-code strong{font-size:18px}
  .currency-control>span{font-size:12px;margin-bottom:6px}
  .currency-delete{width:100%;grid-column:auto;align-self:stretch}

  #editDialog[open]{place-items:start center;padding:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom))}
  #editDialog .dialog-card{width:100%;max-height:calc(100dvh - 16px);border-radius:20px}
  #editDialog .dialog-head{padding:15px 16px}
  #editDialog .dialog-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:13px;padding:15px 16px}
  #editDialog .field.full{grid-column:auto}
  #editDialog menu{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 16px}
  #editDialog menu button{width:100%;min-width:0}
  #editDialog .ratio-grid{grid-template-columns:minmax(0,1fr)}
  #editDialog .source-box{overflow-wrap:anywhere;word-break:break-word}
}


/* v4.2 Persistent dialogs + accommodation planning */
dialog[data-dismiss-ready="1"]{overscroll-behavior:contain}
.compact-empty{padding:14px;border-radius:16px}
.itinerary-lodging-list{display:grid;gap:8px;margin-bottom:10px}
.itinerary-lodging-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;border:1px solid #ddd6fe;background:#faf5ff;border-radius:18px;padding:12px 14px}
.lodging-icon{width:40px;height:40px;border-radius:14px;background:#ede9fe;display:grid;place-items:center;font-size:21px}.lodging-main{min-width:0}.lodging-main strong{display:block;color:#5b21b6;overflow-wrap:anywhere}
.accommodation-toolbar{margin-bottom:16px}.accommodation-stats{margin-bottom:16px}.accommodation-help{margin-bottom:16px}.accommodation-list{display:grid;gap:16px}.accommodation-card{display:grid;gap:14px}.accommodation-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}.accommodation-title{font-size:20px;font-weight:950;line-height:1.35}.accommodation-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.accommodation-facts>div{border:1px solid var(--line);border-radius:16px;padding:11px;background:#f8fafc;display:grid;gap:3px;min-width:0}.accommodation-facts span,.accommodation-facts small{font-size:12px;color:var(--muted)}.accommodation-facts strong{overflow-wrap:anywhere}.accommodation-address{background:#faf5ff}.accommodation-related{border-top:1px solid var(--line);padding-top:12px}.accommodation-related summary{cursor:pointer;font-weight:900;color:#5b21b6}.accommodation-place-chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.accommodation-related-list{display:grid;gap:8px}.accommodation-related-list button{border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 12px;text-align:left;display:grid;grid-template-columns:120px minmax(0,1fr);gap:4px 10px;color:var(--ink)}.accommodation-related-list button span{font-size:12px;color:var(--primary);font-weight:900;grid-row:1/3}.accommodation-related-list button strong,.accommodation-related-list button small{overflow-wrap:anywhere}.accommodation-related-list button small{color:var(--muted)}

/* Calendar all-day accommodation lane */
.calendar-grid{grid-template-rows:auto auto auto}
.calendar-all-day-label{grid-column:1;grid-row:2;position:sticky;left:0;z-index:3;background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:flex-end;align-items:flex-start;padding:8px 10px;color:var(--muted);font-size:12px;font-weight:900;min-height:calc(var(--all-day-lanes,1) * 30px + 16px)}
.calendar-all-day-track{grid-column:2 / 9;grid-row:2;border-bottom:1px solid var(--line);background:#fff;min-height:calc(var(--all-day-lanes,1) * 30px + 16px);padding:7px}
.calendar-all-day-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:26px;gap:4px;height:100%;position:relative}
.calendar-all-day-event{z-index:1;border:0;border-radius:8px;background:#7c3aed;color:#fff;padding:4px 9px;text-align:left;font-size:12px;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:0 4px 12px rgba(124,58,237,.2)}
.calendar-all-day-empty{grid-column:1/-1;color:var(--muted);font-size:12px;padding:4px 8px}.accommodation-time-event{background:#7c3aed!important}
.calendar-mobile-stays{display:grid;gap:8px;margin-bottom:14px}.calendar-mobile-section-label{font-size:12px;font-weight:950;color:var(--muted);margin:10px 0 7px}.calendar-stay-card{width:100%;border:1px solid #ddd6fe;background:#faf5ff;border-radius:17px;padding:12px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;color:var(--ink)}.calendar-stay-card .stay-icon{width:38px;height:38px;border-radius:13px;background:#ede9fe;display:grid;place-items:center;font-size:20px}.calendar-stay-card strong{display:block;color:#5b21b6}.calendar-stay-card small{display:block;color:var(--muted);line-height:1.45;margin-top:3px;overflow-wrap:anywhere}.stay-arrow{font-size:24px;color:#7c3aed}

@media(max-width:980px){.accommodation-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  .itinerary-lodging-card{grid-template-columns:auto minmax(0,1fr);padding:12px}.itinerary-lodging-card .item-actions{grid-column:1/-1;justify-content:flex-end}
  .accommodation-toolbar{display:grid;grid-template-columns:1fr 1fr}.accommodation-toolbar .primary{grid-column:1/-1}.accommodation-stats{grid-template-columns:1fr!important}.accommodation-card-head{display:grid}.accommodation-card-head .item-actions{justify-content:flex-end}.accommodation-facts{grid-template-columns:1fr 1fr}.accommodation-related-list button{grid-template-columns:1fr}.accommodation-related-list button span{grid-row:auto}
}
@media(max-width:430px){.accommodation-facts{grid-template-columns:1fr}.accommodation-toolbar{grid-template-columns:1fr}.accommodation-toolbar .primary{grid-column:auto}}

/* v4.5 Desktop sidebar: keep every page reachable on shorter displays */
@media (min-width:981px){
  .sidebar{
    height:100dvh;
    max-height:100dvh;
    overflow:hidden;
    gap:14px;
    padding:18px 16px;
  }
  .side-nav{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    padding-right:5px;
  }
  .side-nav::-webkit-scrollbar{width:8px}
  .side-nav::-webkit-scrollbar-track{background:transparent}
  .side-nav::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px;border:2px solid #fff}
  .side-nav::-webkit-scrollbar-thumb:hover{background:#94a3b8}
  .side-card{
    flex:0 0 auto;
    margin-top:0;
  }
}

@media (min-width:981px) and (max-height:860px){
  .sidebar{gap:10px;padding-top:14px;padding-bottom:14px}
  .brand{gap:10px}
  .brand-mark{width:42px;height:42px;border-radius:15px;font-size:22px}
  .brand h1{font-size:19px}
  .brand p{font-size:11px}
  .side-nav{gap:4px}
  .nav-btn{padding:8px 10px;border-radius:13px;gap:9px}
  .nav-icon{width:26px;height:26px;border-radius:9px}
  .side-card{padding:10px 12px;border-radius:16px;gap:4px}
  .sync-mini{padding:4px 8px;font-size:11px;max-width:100%;white-space:normal}
}

@media (min-width:981px) and (max-height:680px){
  .brand p{display:none}
  .side-card .muted,.side-card #tripDateMini{display:none}
  .side-card{padding:8px 10px}
}