/* =====================================================================
   app.css — styles added for the working app (forms, pop-ups, connect
   screen, libraries, print). Visual tokens come from styles.css.
   ===================================================================== */

/* connect / welcome screen */
.gate{position:fixed;inset:0;display:grid;place-items:center;background:var(--paper);padding:20px;z-index:40}
.gatecard{max-width:520px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px 28px;box-shadow:var(--raise)}
.gatecard .brand b{color:var(--ink)}.gatecard .brand small{color:var(--muted)}
.gatecard h2{font-family:var(--serif);font-weight:500;font-style:italic;font-size:24px;margin:18px 0 6px}
.gatecard p{color:var(--ink2)}
.gatecard .small{font-size:12.5px;color:var(--muted)}
.gatecard a{color:var(--accent);cursor:pointer;text-decoration:underline}
.btn.big{font-size:15px;padding:10px 18px}
.btn.danger{color:var(--alert);border-color:var(--alert)}
label.btn,.btnlike{cursor:pointer}
.btnlike{font-size:11.5px;border:1px solid var(--line);border-radius:6px;padding:3px 9px;color:var(--muted);display:inline-flex;align-items:center}

/* navigation: Stage 2 tabs are visible but quiet */
.nav button.later{color:var(--faint);font-weight:400}
.nav button.later:after{content:" · soon";font-size:10.5px}

/* day header add button */
.lc .dh{position:relative}
.dadd{margin-left:6px;width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:13px;line-height:1;display:grid;place-items:center;flex:none}
.dadd:hover{color:var(--ink);border-color:var(--accent)}
.row.done .ti b{text-decoration:line-through;color:var(--muted)}
.ptext{margin:0;font-size:13px;white-space:pre-wrap;color:var(--ink2)}
.shared{font-size:9.5px;letter-spacing:1px;text-transform:uppercase;background:var(--accent-soft);color:var(--accent);padding:1px 6px;border-radius:4px;margin-left:6px;font-weight:600;vertical-align:1px}
.empty{text-align:center;padding:40px}
.empty .h2{margin-bottom:8px}
.muted{color:var(--muted)}

/* pop-ups */
.mback{position:fixed;inset:0;background:rgba(10,8,6,.62);display:grid;place-items:start center;padding:6vh 16px;overflow:auto}
:root:not([data-theme="dark"]) .mback{background:rgba(60,50,35,.35)}
.modal{width:min(560px,100%);background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.5);display:flex;flex-direction:column}
.modal.wide{width:min(860px,100%)}
.mh{display:flex;align-items:center;padding:14px 18px 10px;border-bottom:1px solid var(--line2)}
.mh h3{margin:0;font-family:var(--serif);font-weight:500;font-size:20px;flex:1}
.mx{background:none;border:none;color:var(--muted);font-size:22px;line-height:1}
.mb{padding:14px 18px;max-height:68vh;overflow:auto}
.mb p{margin:0 0 10px;color:var(--ink2)}
.mf{display:flex;align-items:center;gap:8px;justify-content:flex-end;padding:12px 18px;border-top:1px solid var(--line2)}
.merr{color:var(--alert);font-size:12.5px;margin-right:auto}
.merr:empty{display:none}
.frow{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;align-items:flex-end}
.fld{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--muted);min-width:140px;flex:1}
.fld.sm{flex:0 1 150px;min-width:120px}
.fld.grow{flex:2 1 240px}
.fld.wide{width:100%;margin-bottom:10px}
.fld small{color:var(--faint);font-size:11px}
.fld input,.fld select,.fld textarea{font:inherit;font-size:13.5px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:7px 9px;width:100%;color-scheme:dark}
:root:not([data-theme="dark"]) .fld input,:root:not([data-theme="dark"]) .fld select,:root:not([data-theme="dark"]) .fld textarea{color-scheme:light;background:#efe6d4}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.fsec{font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent);font-weight:600;margin:14px 0 8px;padding-top:10px;border-top:1px dashed var(--line2)}
.checks{display:flex;gap:16px;flex-wrap:wrap;margin:2px 0 12px;align-items:center}
.chk{display:inline-flex;gap:6px;align-items:center;font-size:13px;color:var(--ink2);cursor:pointer}
.chk input{accent-color:var(--accent);width:15px;height:15px}
.preview{font-size:12.5px;background:var(--paper);border:1px dashed var(--line);border-radius:8px;padding:7px 10px;margin:-2px 0 10px;color:var(--ink2)}
.preview.inl{margin:0;align-self:flex-end;flex:1;min-width:180px}
.typegrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.typebtn{text-align:left;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.typebtn b{font-size:14px;color:var(--ink)}.typebtn span{font-size:12px;color:var(--muted)}
.typebtn:hover{border-color:var(--accent)}
.optlist{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}
.optrow{display:grid;grid-template-columns:18px minmax(0,auto) 1fr auto 26px;gap:8px;align-items:center;padding:6px 8px;border:1px solid var(--line2);border-radius:7px;font-size:13px;cursor:pointer}
.optrow.on{border-color:var(--accent-line);background:var(--accent-soft)}
.optrow input{accent-color:var(--accent)}
.optrow span{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.optrow .tg2{font-size:11px}
.mini2{width:24px;height:24px;border-radius:6px;border:1px solid var(--line);background:none;color:var(--muted);font-size:12px}
.mini2:hover{color:var(--ink);border-color:var(--accent)}

/* libraries in Data tab */
.libr{display:grid;grid-template-columns:minmax(0,auto) 1fr 26px;gap:10px;align-items:center;padding:5px 0;border-bottom:1px solid var(--line2);font-size:13px}
.libr span{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.libh{font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--accent);margin:10px 0 2px}

/* print */
@media print{
  #printdoc .pm{font-family:var(--sans);color:#444;font-size:10pt;margin-bottom:6pt}
  #printdoc h2 .pbed{float:right;font-weight:400;font-size:9pt;color:#555}
  #printdoc .pt{width:120px;white-space:nowrap}
  #printdoc .pp{width:80px;text-align:right;white-space:nowrap}
  #printdoc .pd{color:#555;font-size:9pt}
  #printdoc tr{page-break-inside:avoid}
  .gate,#modalRoot{display:none!important}
}
.nights{overflow-x:auto}
.st.considered{background:var(--line2);color:var(--muted)}.st.rejected{background:var(--alert-soft);color:var(--alert)}
.gate[hidden]{display:none!important}

.lc .dh{flex-wrap:nowrap}
.lc .dh .dc{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lc .dh .bed{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40%}
.lc .dh > *{flex:none}
.lc .dh .dc{flex:1 1 auto}
.lc .dh .bed{flex:0 1 auto;min-width:0}
/* keep the timeline inside the window on narrow screens */
.tlwrap{grid-template-columns:minmax(0,1fr)}
.tlwrap.pn{grid-template-columns:minmax(0,1fr) 390px}
.tlmain,.lines,.lc{min-width:0}
.nights{max-width:100%}
@media (max-width:980px){.tlwrap,.tlwrap.pn{grid-template-columns:minmax(0,1fr)}}
@media (max-width:700px){.ln{grid-template-columns:14px 6px 12px minmax(0,1fr);column-gap:5px}.cb .lab{display:none}.lc .dh .bed,.lc .dh .dsum{display:none}}

/* =====================================================================
   Round 2 (Oct 13): collapsible sidebar · readability · softer inputs ·
   centered day ＋ · photo tags & conditions · City lists
   ===================================================================== */

/* ---------- collapsible sidebar ---------- */
.app{transition:grid-template-columns .18s}
.brand{position:relative}
.sidetog{margin-left:auto;width:28px;height:28px;border-radius:8px;border:1px solid var(--side-line2);background:var(--side-2);color:var(--side-muted);display:grid;place-items:center;padding:0;flex:none}
.sidetog:hover{color:var(--side-hi);border-color:var(--side-muted)}
.miniRail{display:none}
.app.sidemini{grid-template-columns:60px 1fr}
.app.sidemini .side{padding:16px 8px;align-items:center}
.app.sidemini .sfull,.app.sidemini .bt{display:none}
.app.sidemini .brand{flex-direction:column;gap:10px}
.app.sidemini .sidetog{margin:0;transform:rotate(180deg)}
.app.sidemini .miniRail{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:6px;flex:1}
.mv{width:34px;height:34px;border-radius:9px;border:1px solid var(--side-line2);background:var(--side-2);color:var(--side-hi);font-weight:700;font-size:13px;padding:0}
.mv.on{background:var(--accent);color:var(--on-ink);border-color:var(--accent)}
.mv.add{color:var(--side-muted);border-style:dashed;background:none}
.mdot{margin-top:auto;width:8px;height:8px;border-radius:50%;background:var(--good)}
@media (max-width:980px){.app.sidemini{grid-template-columns:1fr}.app.sidemini .side{flex-direction:row;height:auto;padding:10px 16px}.app.sidemini .miniRail{flex-direction:row;margin:0}.app.sidemini .mdot{margin:0 0 0 auto}}

/* ---------- readability: slightly larger small text, softer-but-clearer greys ---------- */
:root[data-theme="dark"]{--muted:#aca290;--faint:#80776a;--ink2:#d3c9b7;--side-muted:#9b917f}
:root:not([data-theme="dark"]){--muted:#665b49;--faint:#8c806a}
body{font-size:14.5px}
.row .tm{font-size:13px}.row .tm small{font-size:11.5px}
.row .ti b{font-size:14.5px}.row .ti span{font-size:13px}
.row .chip{font-size:11.5px;padding:1px 7px}
.row .price{font-size:13.5px}.row .price.incl{font-size:12px}
.flg{font-size:11.5px;min-width:19px;height:19px}
.thin{font-size:13px}
.lc .dh .dc,.lc .dh .bed,.lc .dh .dsum{font-size:13px}
.lc .dh .dn{font-size:11.5px}
.lc .dh .dd{font-size:18.5px}
.cpill{font-size:12.5px}
.cb .lab{font-size:11.5px}
.nights .ncell{font-size:11.5px}.nights .ncell b{font-size:12.5px}
.nseg{font-size:12.5px}.nseg .ns{font-size:11.5px}
.nlegend,.tlbar,.tlkey{font-size:12.5px}
.det .kv{font-size:13px}.det h5{font-size:11px}
.insp .ih h3{font-size:20px}
.kv{font-size:13.5px}
.panel h3{font-size:11.5px}
.iss{font-size:13px}
.fo{font-size:13px}.fo1 b{font-size:14px}.fo2,.fo3{font-size:12.5px}.fo .tg{font-size:11.5px}
.trip .tn{font-size:14px}.trip .td{font-size:12px}.ver{font-size:13.5px}.side h6{font-size:11px}
.dbbox{font-size:12px}
.nav button{font-size:14px}
.vtab .l1{font-size:13.5px}
.vtab .amt{font-size:16px}
.fld{font-size:12.5px}.fld input,.fld select,.fld textarea{font-size:14px}

/* ---------- softer form fields (dark background, dimmer text) ---------- */
:root[data-theme="dark"] .fld input,:root[data-theme="dark"] .fld select,:root[data-theme="dark"] .fld textarea{color:#b9ae9a;background:#14130f;border-color:#3a352e}
:root[data-theme="dark"] .fld input::placeholder,:root[data-theme="dark"] .fld textarea::placeholder{color:#5f574b}
:root[data-theme="dark"] .fld input:focus,:root[data-theme="dark"] .fld select:focus,:root[data-theme="dark"] .fld textarea:focus{color:#cdc2ae}
:root[data-theme="dark"] .citychips input{color:#b9ae9a}

/* ---------- centered ＋ on day headers ---------- */
.dadd{width:24px;height:24px;padding:0;display:inline-grid;place-items:center;line-height:0;font-size:0}
.dadd svg{display:block}

/* ---------- flexible slots: conditions, reasons, food ---------- */
.conds{gap:5px}
.conds .cl{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--faint);margin:0 2px 0 8px}
.conds .cl:first-child{margin-left:0}
.cond{font-size:12.5px}
.sunl{font-size:12px;color:var(--muted);margin-right:10px;white-space:nowrap}
.goodw{font-size:12px;color:var(--good);font-weight:500}
.fo.best:before{content:"◎ Best match today"}
.fo.food{border-style:solid;background:color-mix(in srgb,var(--card) 92%,var(--accent))}
.tagrow{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:0 0 8px}
.tgl{width:96px;font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--faint)}
.optgrp{margin-bottom:10px}
.optgh{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:var(--ink2);margin:4px 0 6px}
.btn.sm{font-size:12px;padding:3px 9px}
.sp{flex:1}

/* ---------- City lists tab ---------- */
.citychips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.cchip{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:7px 12px;text-align:left;display:flex;flex-direction:column;box-shadow:var(--raise)}
.cchip b{font-size:14px}.cchip span{font-size:12px;color:var(--muted)}
.cchip.on{border-color:var(--accent-line);box-shadow:inset 0 -2px 0 var(--accent),var(--raise)}
.cchip.add{padding:0;justify-content:center}
.cchip.add input{background:transparent;border:none;color:var(--ink);font:inherit;font-size:13px;padding:10px 12px;width:200px;outline:none}
.lgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:16px;align-items:start}
.lhead{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.lhead h3{margin:0}
.ltags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}
.icard{border:1px solid var(--line2);border-radius:10px;padding:10px 12px;margin-bottom:8px;background:color-mix(in srgb,var(--card) 70%,var(--paper))}
.ic1{display:flex;justify-content:space-between;gap:8px}.ic1 b{font-size:14.5px}
.ic2{font-size:12.5px;color:var(--muted);margin-top:2px}
.ic2 a{color:var(--accent)}
.icard .tags{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 2px}
.icard .tg{font-size:11.5px;padding:1px 7px;border-radius:4px;background:var(--line2);color:var(--ink2)}
.icard .tg.book{background:var(--alert-soft);color:var(--alert)}
.ic3{font-size:13px;color:var(--ink2);margin-top:4px}
.ic4{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:12px}
.ic4 .used{color:var(--good)}
.ic4 button{font-size:12px;border:1px solid var(--line);background:none;border-radius:6px;padding:3px 9px;color:var(--muted)}
.ic4 button:hover{color:var(--ink);border-color:var(--accent)}
.tzlist{display:flex;flex-wrap:wrap;gap:4px 6px;font-size:12.5px;color:var(--muted);align-items:center}
.tzlist b{color:var(--ink)}
.tzlist i{color:var(--faint);font-style:normal}

/* country labels never spill past their own band */
.cb .lab{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* country names centered inside the wide band */
.cb .lab{left:0;right:0;margin:0 auto;width:max-content;transform:none;line-height:1}

/* ---------- Route puzzle ---------- */
.rptop{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.rptop > div:first-child{flex:1;min-width:260px}
.rpset{display:flex;gap:10px;flex-wrap:wrap}
.rpset .fld{min-width:150px}
.rpcols{display:flex;gap:0;overflow-x:auto;padding-bottom:10px;align-items:flex-start}
.rpcol{flex:0 0 250px;background:color-mix(in srgb,var(--card) 45%,var(--paper));border:1px solid var(--line);border-radius:12px;padding:10px}
.rpcol.addcol{flex:0 0 140px;background:none;border-style:dashed;display:grid;place-items:center;min-height:120px}
.rph{display:flex;align-items:center;gap:8px}
.rph b{font-size:14.5px}
.rpn{width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--on-ink);font-size:12px;font-weight:700;display:grid;place-items:center;flex:none}
.rpk{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--faint);margin:6px 0 8px}
.rpgap{flex:0 0 26px;display:grid;place-items:center;align-self:stretch}
.rpgap button{width:20px;height:20px;border-radius:50%;border:1px dashed var(--line);background:none;color:var(--faint);font-size:12px;line-height:1;padding:0;opacity:.5}
.rpgap button:hover{opacity:1;color:var(--ink);border-color:var(--accent)}
.rpopt{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:8px 10px;margin-bottom:7px;cursor:pointer;box-shadow:var(--raise);transition:.12s}
.rpopt:hover{border-color:var(--faint)}
.rpopt.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--raise);background:var(--accent-soft)}
.rpopt.locked{border-color:var(--good);box-shadow:0 0 0 1px var(--good)}
.rpopt.dead{opacity:.42}
.rpopt.skip{border-style:dashed;background:transparent;box-shadow:none}
.rpopt .r1{display:flex;justify-content:space-between;gap:8px;font-size:14px}
.rpopt .r1 .pr{font-weight:600}
.rpopt .r2{font-size:12.5px;color:var(--muted);margin-top:1px}
.rpopt .r3{font-size:12px;color:var(--ink2);margin-top:3px}
.rpopt .why{color:var(--alert)}
.rpopt .r4{display:flex;align-items:center;gap:4px;margin-top:6px}
.rpopt .r4 button{font-size:11.5px;border:1px solid var(--line);background:none;border-radius:6px;padding:1px 7px;color:var(--muted)}
.rpopt .r4 button.on{border-color:var(--good);color:var(--good)}
.nst{display:inline-flex;align-items:center;gap:6px;font-size:12.5px}
.nst button{width:22px;height:22px;padding:0!important}
.pzdown{color:var(--good)}.pzup{color:var(--alert)}
.rpadd{color:var(--muted)!important;border-color:var(--line)!important;text-align:center!important}
.rpresh{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:18px 0 10px}
.combo .hrs{font-size:12.5px;white-space:nowrap}
.combo .path{font-size:13.5px}
.combo .ar{color:var(--accent)}

/* ---------- Budget ---------- */
.bprog{height:10px;background:var(--line2);border-radius:6px;overflow:hidden;margin:8px 0 4px}.bprog i{display:block;height:100%}
.cat{margin:9px 0}.cat .cl{display:flex;justify-content:space-between;font-size:13.5px}
.cb2{height:9px;background:var(--line2);border-radius:4px;overflow:hidden;margin-top:4px}.cb2 i{display:block;height:100%;background:var(--accent);border-radius:0 4px 4px 0}
.btab{width:100%;border-collapse:collapse;font-size:13.5px}
.btab th{text-align:left;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--faint);font-weight:600;padding:6px 6px;border-bottom:1px solid var(--line2)}
.btab td{padding:6px;border-bottom:1px solid var(--line2)}
.btab input{width:110px;font:inherit;font-size:13.5px;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:4px 7px;color:var(--ink2)}
.btab.legs tr:hover td{background:var(--accent-soft)}
.bdays{display:flex;align-items:flex-end;gap:4px;height:190px;overflow-x:auto;padding-top:10px}
.bday{flex:1 0 30px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;cursor:default}
.bday .bbar{width:100%;max-width:30px;background:var(--accent);border-radius:4px 4px 0 0}
.bday .bbar.cut{background:repeating-linear-gradient(180deg,var(--accent) 0 8px,color-mix(in srgb,var(--accent) 55%,transparent) 8px 10px)}
.bday:hover .bbar{filter:brightness(1.2)}
.bday .bv{font-size:11px;color:var(--muted)}.bday .bl{font-size:11px;color:var(--muted)}

/* ---------- Checklist ---------- */
.ckgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px;align-items:start}
.ck{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px solid var(--line2);font-size:13.5px}
.ck:last-child{border-bottom:none}
.ck input{margin-top:3px;accent-color:var(--good);width:16px;height:16px;flex:none}
.ck .t{flex:1}.ck .t a{color:var(--accent)}
.ck .src{font-size:11.5px;color:var(--faint)}
.ck .due{font-size:12px;color:var(--muted);white-space:nowrap;margin-top:2px}.ck .due.red{color:var(--alert);font-weight:600}
.ck.done .t{color:var(--faint)}.ck.done .t{text-decoration:line-through}
.ck .mini2{flex:none;opacity:.4}.ck:hover .mini2{opacity:1}

/* ---------- Map ---------- */
.mapbox2{height:520px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--side-2)}
:root:not([data-theme="dark"]) .mapbox2 .leaflet-tile-pane{filter:sepia(.35) saturate(.8)}
:root[data-theme="dark"] .mapbox2 .leaflet-tile-pane{filter:sepia(.3) brightness(.95)}
.mpin{width:26px;height:26px;border-radius:50%;background:var(--c);border:2px solid #1a1712;color:#1a1712;font:700 12px var(--sans);display:grid;place-items:center;box-shadow:0 1px 4px rgba(0,0,0,.5)}
.mpin.small{width:12px;height:12px;border-width:2px}
.leaflet-popup-content{font:13px var(--sans)}
.mapsvg{width:100%;height:100%;display:block}

/* ---------- suggestion dropdown (replaces Chrome's narrow list) ---------- */
.combo-pop{position:fixed;z-index:200;display:none;overflow-y:auto;background:var(--card);border:1px solid var(--faint);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.5);padding:4px}
.combo-pop .ci{padding:7px 10px;border-radius:7px;font-size:13.5px;color:var(--ink2);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.combo-pop .ci b{color:var(--accent);font-weight:700}
.combo-pop .ci.hi{background:var(--accent-soft);color:var(--ink)}
.combo-pop .ci.cur:after{content:"  ✓";color:var(--good)}
.combo-pop .cmore{padding:8px 10px;font-size:12.5px;color:var(--muted)}

/* ---------- bigger, more glanceable icons ----------
   Flight = solid round badge · ground (van/bus/train/ferry/car) = outlined square ·
   hotel = gold square · flexible = dashed · activity / to-do = soft square */
.row{grid-template-columns:34px 140px minmax(0,1fr) auto 64px 26px 14px;padding:8px 12px}
.tlmain.glance .row{grid-template-columns:34px 140px minmax(0,1fr) auto 64px 26px 14px}
.row .ic{width:34px;height:34px;border-radius:9px}
.row .ic svg{width:20px;height:20px}
.row .ic.fl{border-radius:50%;background:var(--ink2)}
.row .ic.fl svg{fill:var(--paper)}
.row .ic.gr{background:transparent;border:2px solid var(--ink2)}
.row .ic.gr svg{fill:var(--ink2)}
.row .ic.stay{background:var(--accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 60%,#000)}
.row .ic.stay svg{width:21px;height:21px}
.row .ic.fx{border-width:2px}.row .ic.fx svg{width:18px;height:18px}
.row .ic.act{background:color-mix(in srgb,var(--accent) 22%,var(--card));border:1px solid var(--accent-line)}.row .ic.act svg{fill:var(--accent)}
.row .ic.task{background:var(--line2);border:1px solid var(--line)}.row .ic.task svg{fill:var(--ink2)}
.row .ic.op{border-width:2px}
.stt{width:26px;height:26px;font-size:14px;border-width:1.5px}
.flg{min-width:22px;height:22px;font-size:12.5px;border-radius:5px}
.row .chev{font-size:18px}
.dadd{width:28px;height:28px}.dadd svg{width:12px;height:12px}
.dchev{font-size:13px;width:16px}
.thin{font-size:13.5px}
.insp .ih{position:relative}
.rpn{width:26px;height:26px;font-size:13px}
.rpopt .r4 button{font-size:13px;padding:2px 8px}
.mini2{width:28px;height:28px;font-size:14px}
.ic4 button{font-size:13px}
.nlegend i{width:16px;height:11px}
@media (max-width:900px){.row{grid-template-columns:34px minmax(0,1fr) 60px 26px 14px}}
/* route / hotel name stays whole; the grey detail after it gives way first */
.row .ti{display:flex;align-items:baseline;min-width:0}
.row .ti b{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.row .ti span{flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis}

/* ---------- activity icons ---------- */
.row .ic.act{background:color-mix(in srgb,var(--accent) 24%,var(--card));border:1px solid var(--accent-line)}
.row .ic.act svg,.row .ic.fx svg{fill:var(--accent);width:20px;height:20px}
.row .ic.k-food,.row .ic.k-coffee,.row .ic.k-drinks{border-radius:50%}
.row .ic.fx.k-food,.row .ic.fx.k-coffee,.row .ic.fx.k-drinks{border-radius:50%}
.ki{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:color-mix(in srgb,var(--accent) 20%,var(--card));flex:none}
.ki svg{width:14px;height:14px;fill:var(--accent)}
.wico{display:inline-flex;align-items:center;gap:7px;min-width:0}
.ipick{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.ipick button{display:flex;flex-direction:column;align-items:center;gap:3px;width:62px;padding:7px 2px 5px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--muted)}
.ipick button svg{width:22px;height:22px;fill:var(--ink2)}
.ipick button small{font-size:10.5px;line-height:1.1;text-align:center}
.ipick button:hover{border-color:var(--faint)}
.ipick button.on{border-color:var(--accent);background:var(--accent-soft);color:var(--ink)}
.ipick button.on svg{fill:var(--accent)}

/* ---------- To-dos & lists ---------- */
.lsh{display:flex;align-items:center;gap:8px;cursor:default}
.sugp .lsh{cursor:pointer}
.lsh h3{margin:0}
.lcount{font-size:12px;color:var(--muted);background:var(--line2);border-radius:20px;padding:1px 9px}
.sugcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:4px 26px}
.lsub{font-size:11px;letter-spacing:1.3px;text-transform:uppercase;color:var(--accent);margin:12px 0 2px;font-weight:600}
.lhead2{display:flex;align-items:center;gap:10px;margin:24px 0 12px}
.ulgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px;align-items:start}
.ulist .lname{cursor:pointer;font-family:var(--serif);font-size:17px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink)}
.ulist .lname:hover{color:var(--accent)}
.lprog{height:4px;background:var(--line2);border-radius:3px;overflow:hidden;margin:8px 0 2px}.lprog i{display:block;height:100%;background:var(--good)}
.ulist .ck{align-items:center}
.ulist .ck .t{cursor:text}
.grip{cursor:grab;color:var(--faint);font-size:12px;letter-spacing:-2px;opacity:.5;user-select:none}
.ck:hover .grip{opacity:1}
.ck.dover,.ldrop.dover{box-shadow:inset 0 2px 0 var(--accent)}
.ldrop{min-height:10px;font-size:12.5px;color:var(--faint);padding:6px 0}
.ladd{display:flex;gap:8px;margin-top:8px;padding-top:10px;border-top:1px dashed var(--line2)}
.ladd input{flex:1;min-width:0;font:inherit;font-size:14px;background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:7px 10px;color:var(--ink2)}
.ladd input:focus{outline:none;border-color:var(--accent)}
.mini2[disabled]{opacity:.25;cursor:default}
.rpwhere{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line2);font-size:12px;color:var(--ink2);line-height:1.5}
.rpwhere span{color:var(--faint);font-size:10.5px;letter-spacing:1px;text-transform:uppercase;margin-right:4px}
.rptop .lead i{font-style:normal;color:var(--accent)}

/* ---------- edit in place ---------- */
.ed{cursor:text;border-radius:4px;padding:0 3px;margin:0 -3px;transition:background .12s}
.ed:hover{background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent-line)}
.ed.tog{cursor:pointer}
.ed.editing{background:none;box-shadow:none;display:inline-block;width:100%}
.edempty{color:var(--faint);font-size:12px}
.ed:hover .edempty{color:var(--accent)}
.edin{font:inherit;font-size:13px;width:100%;min-width:120px;color:var(--ink);background:var(--paper);border:1px solid var(--accent);border-radius:6px;padding:4px 7px;box-shadow:0 0 0 2px var(--accent-soft);color-scheme:dark;text-align:left}
:root:not([data-theme="dark"]) .edin{color-scheme:light}
textarea.edin{display:block;resize:vertical}
.det .kv span:last-child .ed{display:inline-block}
.det .ed > .dnotes{margin:0}
.det > div > .ed{display:block;margin-top:2px}
.edhint{font-size:11.5px;flex-basis:100%;margin-bottom:2px}
.dacts .edhint + .sp{display:none}

/* ---------- route sketch ---------- */
.skwrap{display:flex;flex-direction:column;gap:10px}
.skhead{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap;justify-content:space-between}
.skset{display:flex;gap:8px;flex-wrap:wrap}
.sktabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sktabs .seg2 button{font-size:13px;padding:5px 14px}
.skbody{display:grid;grid-template-columns:minmax(0,1fr) 320px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card);height:max(480px,calc(100vh - 250px))}
@media (max-width:1000px){ .skbody{grid-template-columns:1fr;height:auto} .skbody .skmain{height:520px} }
.skmain{display:flex;flex-direction:column;min-width:0;min-height:0}
.skside{border-left:1px solid var(--line);background:var(--side-2);overflow:auto;padding:14px}
.skside h3{font-family:var(--serif);font-weight:650;font-size:16px;margin:0 0 2px}
.sknote{font-size:12.5px;color:var(--muted);margin:0 0 10px}
.skhow{font-size:12.5px;color:var(--muted);padding:8px 14px;border-bottom:1px solid var(--line2);display:flex;gap:6px 16px;flex-wrap:wrap}
.skhow b{color:var(--ink2);font-weight:600}
kbd{font-family:var(--sans);font-size:11px;border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;padding:0 4px;background:var(--card);color:var(--ink2)}
.skstage{flex:1;min-height:0;overflow:auto;position:relative;background-color:var(--paper);background-image:radial-gradient(color-mix(in srgb,var(--ink) 13%,transparent) 1px,transparent 1.2px);background-size:22px 22px}
.skinner{position:relative}
svg.skmap{display:block;user-select:none;-webkit-user-select:none}
.skmap .edge path.ln{fill:none;stroke:var(--faint);stroke-width:1.7}
.skmap .edge.best path.ln{stroke:var(--good);stroke-width:3.2}
.skmap .edge.hl path.ln{stroke:var(--accent);stroke-width:3.4}
.skmap .edge.dead path.ln{stroke-dasharray:4 5;opacity:.55}
.skmap .edge.dead .pill{opacity:.6}
.skmap .pill rect{fill:var(--card);stroke:var(--line);stroke-width:1}
.skmap .pill text{fill:var(--ink);font-size:12.5px;font-weight:600;text-anchor:middle}
.skmap .pill text .m{fill:var(--muted);font-weight:500}
.skmap .edge.best .pill rect{fill:var(--good-soft);stroke:var(--good-line)}
.skmap .edge.hl .pill rect{fill:var(--accent-soft);stroke:var(--accent)}
.skmap .edge.nop .pill rect{stroke:var(--alert);stroke-dasharray:3 2}
.skmap.interactive .pill{cursor:text}
.skmap.interactive .pill:hover rect{stroke:var(--accent)}
.skmap .ah{fill:var(--faint)} .skmap .ah.best{fill:var(--good)} .skmap .ah.hl{fill:var(--accent)}
.skmap .node .nc{fill:var(--card);stroke:var(--line);stroke-width:2}
.skmap .node .code{fill:var(--ink);font-family:var(--serif);font-weight:650;font-size:15px;text-anchor:middle}
.skmap .node .nm{fill:var(--muted);font-size:11.5px;text-anchor:middle}
.skmap .node .cost{fill:var(--good);font-size:12px;font-weight:700;text-anchor:middle}
.skmap .node .cost.st{fill:var(--accent)}
.skmap .node.start .nc{fill:var(--accent-soft);stroke:var(--accent)}
.skmap .node.goal .nc{stroke:var(--good);stroke-width:3}
.skmap .node.goal .ring{fill:none;stroke:var(--good-line);stroke-width:1.5}
.skmap .node.onbest .nc{stroke:var(--good)}
.skmap .node.far{opacity:.55}
.skmap .node.sel .nc{stroke:var(--accent);stroke-width:3.5}
.skmap.interactive .node{cursor:grab}
.skmap .plus{opacity:0;transition:opacity .12s;cursor:crosshair}
.skmap .plus circle{fill:var(--accent);stroke:var(--card);stroke-width:2}
.skmap .plus text{fill:var(--on-ink);font-size:14px;font-weight:700;text-anchor:middle;pointer-events:none}
.skmap .node:hover .plus,.skmap .node.sel .plus{opacity:1}
.skmap .tmp{stroke:var(--accent);stroke-width:2;stroke-dasharray:5 4;fill:none}
.skpop{position:absolute;z-index:5;width:272px;background:var(--card);border:1px solid var(--accent-line);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.28);padding:9px}
.skpop .ph{display:flex;align-items:center;gap:6px;margin-bottom:7px;font-size:12.5px;color:var(--muted)}
.skpop .ph b{font-family:var(--serif);font-size:15px;color:var(--ink)}
.skpop .ph button{background:none;border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:11.5px;color:var(--muted)}
.skpop .ph button:hover,.skpop .ph button.on{color:var(--ink);border-color:var(--accent)}
.skpop input{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:7px 9px;font-size:15px;color:var(--ink)}
.skpop input:focus{outline:none;border-color:var(--accent)}
.skpop .hint{font-size:11.5px;color:var(--muted);margin-top:6px;line-height:1.5}
.skpop .peek{font-size:12px;color:var(--good);margin-top:5px;min-height:1em}
.skempty{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 22px;width:min(380px,90%);text-align:center}
.skempty input{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:9px 11px;font-size:16px;text-align:center;color:var(--ink)}
.sktype{flex:1;min-height:0;display:grid;grid-template-columns:minmax(240px,380px) minmax(0,1fr)}
.sktl{display:flex;flex-direction:column;border-right:1px solid var(--line);min-height:0}
.sktl textarea{flex:1;min-height:200px;resize:none;border:0;background:var(--card);color:var(--ink);padding:14px 16px;font:inherit;font-size:15.5px;line-height:1.75;outline:none;white-space:pre;overflow:auto}
.sksyn{padding:10px 16px 12px;font-size:12.5px;color:var(--muted);border-top:1px solid var(--line);background:var(--paper)}
.sksyn code{font-family:var(--sans);font-weight:600;color:var(--ink2);background:var(--card);border:1px solid var(--line2);border-radius:4px;padding:0 5px}
.sksyn div{margin-top:3px}
.skerr{color:var(--alert);font-size:12px;padding:6px 16px;background:var(--paper);border-top:1px solid var(--line2)}
.skroutes{display:flex;flex-direction:column;gap:7px;margin-bottom:20px}
.skroute{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:9px 11px;cursor:pointer}
.skroute:hover{border-color:var(--accent-line)}
.skroute.pin{border-color:var(--accent)}
.skroute.best{border-color:var(--good-line);background:color-mix(in srgb,var(--good) 8%,var(--card))}
.skroute .rt{display:flex;align-items:baseline;gap:8px}
.skroute .rt b{font-size:17px;font-family:var(--serif);font-weight:650}
.skroute .rt .d{font-size:12px;color:var(--muted)}
.skroute.best .rt .d{color:var(--good);font-weight:600}
.skroute .rt .meta{margin-left:auto;font-size:11.5px;color:var(--muted)}
.skroute .chain{margin-top:4px;font-size:13px;line-height:1.7;color:var(--ink2)}
.skroute .chain i{font-style:normal;font-size:11.5px;color:var(--muted);margin:0 3px}
.skroute .chain i::before{content:"→ "}
.skroute .use{margin-top:7px;display:none}
.skroute.pin .use{display:block}
table.skeach{width:100%;border-collapse:collapse;font-size:12.5px}
table.skeach td{padding:5px 4px;border-top:1px solid var(--line2);vertical-align:top}
table.skeach td:first-child{font-family:var(--serif);font-weight:650;font-size:13.5px;width:52px}
table.skeach td.p{text-align:right;font-weight:600;white-space:nowrap}
table.skeach .via{color:var(--muted)}

/* ---------- files & drop zones ---------- */
.dropzone{position:relative;border-radius:10px}
.dropmsg{display:none}
body.filedrag .dropzone{outline:2px dashed var(--accent-line);outline-offset:4px}
.dropzone.dropon{outline:2px dashed var(--accent)!important;outline-offset:4px;background:var(--accent-soft)}
.dropzone.dropon .dropmsg{display:grid;place-items:center;position:absolute;inset:0;background:color-mix(in srgb,var(--card) 70%,transparent);border-radius:10px;font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink);pointer-events:none}
body.filedrag #content{outline:1px dashed var(--line);outline-offset:-2px}
#content.dropon{outline:2px dashed var(--accent)!important;outline-offset:-4px}
.skstage.dropon,.dropon .skstage{background-color:var(--accent-soft)}
.attsec{margin-top:12px}
.attsec h5{margin:0 0 6px}
.attrow{display:flex;gap:8px;flex-wrap:wrap}
.att{width:76px;height:76px;border-radius:8px;border:1px solid var(--line);background:var(--paper);padding:0;overflow:hidden;display:grid;place-items:center;cursor:pointer;color:var(--muted)}
.att:hover{border-color:var(--accent)}
.att img{width:100%;height:100%;object-fit:cover;display:block}
.att.gone{opacity:.4}
.att.add{border-style:dashed;font-size:18px;text-align:center;line-height:1.1}
.att.add small{display:block;font-size:10.5px}
.attdoc{display:flex;flex-direction:column;align-items:center;font-weight:700;font-size:13px;color:var(--alert);gap:2px;padding:4px;text-align:center}
.attdoc small{font-weight:400;font-size:9.5px;color:var(--muted);word-break:break-all;line-height:1.15}
.attview{text-align:center;background:var(--paper);border-radius:8px;padding:6px}
.attview img{max-width:100%;max-height:70vh;border-radius:6px}
.rdgrid{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:700px){ .rdgrid{grid-template-columns:1fr} }
.rdimg img.attbig{width:100%;border-radius:8px;border:1px solid var(--line);display:block}
.rdimg .attdoc{border:1px solid var(--line);border-radius:8px;padding:20px}
.rdopt{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr) 110px;gap:4px 8px;align-items:end;border:1px solid var(--line);border-radius:9px;padding:6px 10px 8px;margin-bottom:8px;background:var(--paper)}
.rdopt .chk{padding-bottom:9px}
.rdopt .rdsub{grid-column:2 / -1;font-size:12px;color:var(--muted)}
.rdfill .h,.rdfill .r{display:grid;grid-template-columns:22px 120px minmax(0,1fr) minmax(0,1.3fr);gap:8px;align-items:center;padding:4px 0}
.rdfill .h{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}
.rdfill .r{border-top:1px solid var(--line2);cursor:pointer}
.rdfill .r .now{color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rdfill .r input:not([type=checkbox]){width:100%;background:var(--field);border:1px solid var(--line);border-radius:6px;padding:5px 7px;color:var(--ink);font:inherit;font-size:13px}
.rdraw{white-space:pre-wrap;font-family:var(--sans);font-size:12px;max-height:360px;overflow:auto;background:var(--paper);border-radius:8px;padding:10px;color:var(--ink2)}
.rdbar{position:fixed;left:50%;bottom:18px;transform:translate(-50%,30px);opacity:0;pointer-events:none;transition:.2s;z-index:200;background:var(--card);border:1px solid var(--accent-line);border-radius:10px;padding:9px 14px;box-shadow:0 8px 24px rgba(0,0,0,.3);font-size:13px;min-width:260px}
.rdbar.show{opacity:1;transform:translate(-50%,0)}
.rdbar i{display:block;height:4px;background:var(--line2);border-radius:3px;margin-top:6px;overflow:hidden}
.rdbar i b{display:block;height:100%;background:var(--accent);transition:width .2s}
.skpop .skopts{display:flex;flex-direction:column;gap:3px;margin-top:6px}
.skpop .skopts:empty{display:none}
.skpop .skopts .o{border:1px solid var(--line);border-radius:7px;padding:5px 8px;cursor:pointer;display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.skpop .skopts .o b{font-weight:600;font-size:13px}
.skpop .skopts .o small{color:var(--muted);font-size:11.5px}
.skpop .skopts .o.hi{border-color:var(--accent);background:var(--accent-soft)}

/* ---------- trip outline ---------- */
.olp{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px 12px;margin-bottom:12px}
.olp.olempty{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 14px}
.olp.olempty b{font-family:var(--serif);font-size:16px}
.olp.olempty .muted{font-size:12.5px}
.olhd{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.olt{font-family:var(--serif);font-size:16px;font-weight:650;cursor:pointer;display:flex;align-items:center;gap:6px}
.olstart{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.olstart input{background:var(--field);border:1px solid var(--line);border-radius:7px;padding:3px 7px;color:var(--ink);font:inherit;font-size:13px}
.olstat{font-size:12.5px;color:var(--muted)}
.olstat b{font-family:var(--serif);font-size:15px;color:var(--ink);font-weight:650}
.olchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.olchip{position:relative;border-radius:10px;padding:6px 9px 7px 11px;min-width:112px;display:flex;flex-direction:column;gap:1px;cursor:grab;border:1px solid transparent;
  background:color-mix(in srgb,var(--c) 22%,var(--card));border-left:5px solid var(--c);transition:transform .12s}
.olchip.travel{background:repeating-linear-gradient(-45deg,transparent 0 6px,color-mix(in srgb,var(--ink) 5%,transparent) 6px 12px),var(--paper);border:1px dashed var(--faint);border-left:5px solid var(--faint)}
.olchip.dragging{opacity:.4}
.olchip.over{transform:translateX(6px);box-shadow:-3px 0 0 var(--accent)}
.olchip.sel{outline:2px solid var(--accent);outline-offset:1px}
.olchip .n{font-weight:650;font-size:13.5px;white-space:nowrap;padding-right:16px}
.olchip .co{font-size:11.5px;color:var(--muted);white-space:nowrap}
.olchip .rw{display:flex;align-items:center;gap:6px;margin-top:2px}
.olchip .d{font-family:var(--serif);font-weight:650;font-size:15px;min-width:36px}
.olchip .pm{width:22px;height:22px;border-radius:6px;border:1px solid var(--line);background:var(--card);font-size:14px;line-height:1;padding:0;color:var(--ink)}
.olchip .pm:hover{border-color:var(--accent)}
.olchip .cov{font-size:11px;color:var(--muted)}
.olchip .cov.ok{color:var(--good);font-weight:600}
.olchip .olx{position:absolute;top:3px;right:4px;background:none;border:0;color:var(--muted);font-size:12px;opacity:0;padding:0 3px}
.olchip:hover .olx{opacity:1}
.oladd{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;align-items:center}
.oladd input{background:var(--field);border:1px solid var(--line);border-radius:8px;padding:6px 10px;width:280px;max-width:100%;color:var(--ink);font:inherit}
.oladd .muted{font-size:12px}
.thin.olline{display:flex;gap:10px;align-items:center;flex-wrap:wrap;cursor:pointer;transition:box-shadow .3s;border-radius:8px}
.thin.olline.flash{box-shadow:0 0 0 2px var(--accent)}
.olpill{display:inline-flex;gap:4px;align-items:center;border:1px dashed var(--accent-line);border-radius:999px;padding:2px 11px;font-size:12px;color:var(--ink2);background:var(--accent-soft)}
.olpill.travel{border-color:var(--faint);background:transparent}
.olcov{font-size:12px;color:var(--muted)}
.olcov.ok{color:var(--good)}
.olline .mk{font-size:11.5px;background:none;border:1px dashed var(--line);border-radius:7px;padding:1px 8px;color:var(--muted)}
.olline .mk:hover{border-color:var(--accent);color:var(--ink)}
.olwarn{font-size:12px;color:var(--alert)}
.thin.olday b{color:var(--ink)}
.olwhen{font-size:10.5px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);margin-right:5px}
.olsep{color:var(--faint);margin:0 4px}
.nseg.plan{background:transparent;border:1px dashed var(--accent-line);color:var(--muted)}
.nseg.plan .nn{color:var(--ink2);font-weight:500}
.olchip .olreal{align-self:flex-start;font-size:11px;background:none;border:1px dashed var(--accent-line);border-radius:6px;padding:0 6px;color:var(--accent);margin-top:1px}
.olchip .olreal:hover{border-color:var(--accent);color:var(--ink)}
/* notes with a time: a blocked-out stretch of the day */
.row.openr.blockr{border-style:solid;border-color:var(--line);background:repeating-linear-gradient(-45deg,transparent 0 7px,color-mix(in srgb,var(--accent) 7%,transparent) 7px 14px)}
.row.openr.blockr .ti b{font-weight:600;color:var(--ink)}
/* places editor */
.psearch{width:100%;background:var(--field);border:1px solid var(--line);border-radius:8px;padding:7px 10px;color:var(--ink);font:inherit;margin-bottom:8px}
.ptag{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;border-radius:999px;padding:0 7px;margin-left:4px;border:1px solid var(--line);color:var(--muted)}
.ptag.yours{border-color:var(--accent-line);color:var(--accent)}
.ptag.corrected{border-color:var(--alert);color:var(--alert)}

/* ---------- area lists ---------- */
.alay{display:grid;grid-template-columns:250px minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:900px){ .alay{grid-template-columns:1fr} .aside{max-height:260px} }
.aside{padding:10px;position:sticky;top:12px;max-height:calc(100vh - 40px);overflow:auto;display:flex;flex-direction:column;gap:1px}
.asearch,.aadd input{width:100%;background:var(--field);border:1px solid var(--line);border-radius:8px;padding:6px 9px;color:var(--ink);font:inherit;font-size:13px}
.asearch{margin-bottom:6px}
.aadd{margin-top:8px}
.agrp{font-size:10.5px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:8px 4px 3px;font-weight:600}
.aco{font-size:11.5px;color:var(--faint);margin:6px 6px 1px}
.arow{display:flex;justify-content:space-between;align-items:baseline;gap:8px;background:none;border:0;border-radius:7px;padding:5px 8px;text-align:left;color:var(--ink);width:100%}
.arow b{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arow span{font-size:11.5px;color:var(--muted);white-space:nowrap}
.arow:hover{background:var(--line2)}
.arow.on{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
.ahead{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.ppmode button{font-size:12.5px;padding:5px 12px}
/* picking from the area list in the activity form */
.actpick:empty{display:none}
.actpick{border:1px dashed var(--accent-line);border-radius:10px;padding:8px 10px;margin-bottom:10px;background:color-mix(in srgb,var(--accent) 5%,transparent)}
.aphead{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12.5px}
.aphead .muted{font-size:12px}
.apq{margin-left:auto;background:var(--field);border:1px solid var(--line);border-radius:6px;padding:3px 7px;color:var(--ink);font:inherit;font-size:12px;width:140px}
.apchips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px;max-height:120px;overflow:auto}
.apchip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:2px 10px 2px 4px;font-size:12.5px;color:var(--ink)}
.apchip:hover{border-color:var(--accent)}
.apchip .ki{transform:scale(.8)}
.aplink{display:flex;align-items:center;gap:8px;font-size:13px}
.quickadd{display:flex;gap:6px;margin-bottom:8px}
.quickadd input{flex:1;background:var(--field);border:1px solid var(--line);border-radius:7px;padding:6px 9px;color:var(--ink);font:inherit;font-size:13px}
.quickadd select{background:var(--field);border:1px solid var(--line);border-radius:7px;color:var(--ink);font:inherit;font-size:12.5px}
#f_tokind{background:var(--field);border:1px solid var(--line);border-radius:6px;color:var(--ink);font:inherit;font-size:12.5px;padding:2px 4px;margin-left:6px}

/* ===================== Locations library (placesview.js) ===================== */
:root{--t-geo:#6d93cc;--t-park:#5c8a50;--t-city:#b07c35;--t-spot:#8a6aa0;--t-food:#b0624a;--t-camp:#4e8f8f}
:root[data-theme="dark"]{--t-geo:#8fb0de;--t-park:#93ab84;--t-city:#d6a75e;--t-spot:#b796c8;--t-food:#d58a74;--t-camp:#7cc0bd}
.pllib{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:14px;align-items:start}
@media (max-width:980px){.pllib{grid-template-columns:1fr}}
.pltreep{padding:12px;display:flex;flex-direction:column;gap:8px;min-height:520px}
.pltbar{display:flex;gap:6px;align-items:center}
.plsbox{flex:1;position:relative;display:flex;align-items:center;min-width:0}
.plsbox svg{position:absolute;left:10px;width:15px;height:15px;color:var(--muted);pointer-events:none}
.plsbox input{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:7px 30px 7px 32px;font-size:14px;color:var(--ink)}
.plsbox input:focus{outline:none;border-color:var(--accent)}
.plsx{position:absolute;right:6px;background:none;border:0;color:var(--muted);font-size:16px;padding:0 4px;cursor:pointer}
.btn.plact{border-color:var(--accent);background:var(--accent-soft)}
.pldd{position:relative}
.plpm{position:absolute;top:calc(100% + 5px);left:0;z-index:20;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.3);padding:5px;min-width:190px;display:flex;flex-direction:column}
.plpm.wide{min-width:250px}.plpm.right{left:auto;right:0;min-width:360px;max-height:60vh;overflow:auto}
.plpm .ph{font-size:10.5px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:7px 8px 3px}
.plpm .mi{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:6px;font-size:13px;background:none;border:0;text-align:left;cursor:pointer;color:var(--ink)}
.plpm .mi:hover{background:var(--line2)}
.plpm .mi i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.plpm .mi .n{margin-left:auto;font-size:11.5px;color:var(--muted)}
.plpm .mi input{accent-color:var(--accent)}
.plpm .pf{display:flex;justify-content:space-between;gap:6px;padding:6px 4px 2px;border-top:1px solid var(--line2);margin-top:4px}
.plpm .mi.dup{align-items:flex-start;gap:10px;cursor:default;padding:7px 8px;border-bottom:1px solid var(--line2);border-radius:0}
.plpm .mi.dup:hover{background:none}
.plpm .mi.dup small{color:var(--muted);font-size:11px}
.plpm .mi.dup .da{display:flex;flex-direction:column;gap:4px;margin-left:auto}
.plpm .mi.ign{font-size:12.5px;color:var(--muted);align-items:center;justify-content:space-between}
.plachips{display:flex;flex-wrap:wrap;gap:5px}
.plach{display:inline-flex;align-items:center;gap:2px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:999px;padding:1px 4px 1px 10px;font-size:12px}
.plach button{background:none;border:0;color:var(--muted);font-size:13px;padding:0 4px;cursor:pointer}
.plstatus{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--muted);flex-wrap:wrap;min-height:22px}
.pldpill{background:var(--alert-soft);border:1px solid color-mix(in srgb,var(--alert) 45%,var(--card));color:var(--ink);border-radius:999px;padding:1px 10px;font-size:12px;cursor:pointer}
.pldpill.quiet{background:none;border-color:var(--line);color:var(--muted)}
.pltree{flex:1;overflow:auto;max-height:68vh;border-top:1px solid var(--line2);padding-top:6px}
.plnode{display:flex;align-items:center;gap:6px;padding:3px 6px;border-radius:7px;cursor:pointer;position:relative;user-select:none;-webkit-user-select:none;font-size:13.5px}
.plnode:hover{background:var(--line2)}
.plnode.sel{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
.plnode.ctx{opacity:.5}
.pltw{width:24px;height:24px;flex:none;display:grid;place-items:center;border-radius:6px;color:var(--ink2);cursor:pointer}
.pltw:hover{background:var(--line);color:var(--ink)}
.pltw svg{width:16px;height:16px;transition:transform .15s}
.pltw.open svg{transform:rotate(90deg)}
.pltw:empty{cursor:default}.pltw:empty:hover{background:none}
.plgrip{color:var(--faint);font-size:11px;cursor:grab;opacity:0;flex:none}
.plnode:hover .plgrip{opacity:1}
.plnm{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plnode.country .plnm{font-family:var(--serif);font-weight:650;font-size:15px}
.plnode mark{background:color-mix(in srgb,var(--accent) 35%,transparent);color:inherit;border-radius:3px;padding:0 1px}
.pltp{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--c,var(--muted));border:1px solid color-mix(in srgb,var(--c,var(--muted)) 50%,transparent);border-radius:999px;padding:0 6px;white-space:nowrap;flex:none;font-weight:500}
.plmeta{margin-left:auto;display:flex;gap:6px;align-items:center;color:var(--muted);font-size:11.5px;flex:none}
.plcnt{font-size:11px;color:var(--faint)}
.plnode.drop-in{outline:2px dashed var(--accent);outline-offset:-2px}
.plnode.drop-before::before,.plnode.drop-after::after{content:"";position:absolute;left:24px;right:6px;height:2px;background:var(--accent);border-radius:2px}
.plnode.drop-before::before{top:-1px}.plnode.drop-after::after{bottom:-1px}
.plnode.dragging{opacity:.35}
.plnode.dropon{outline:2px dashed var(--accent);outline-offset:-2px;background:var(--accent-soft)}
.plnode.dropon::after{content:"＋ photos";position:absolute;right:8px;font-size:11.5px;color:var(--accent);font-weight:600;background:var(--accent-soft);padding-left:6px}
.plempty{color:var(--muted);font-size:13px;padding:14px 8px}
/* details */
.pldet{padding:0;display:flex;flex-direction:column;position:sticky;top:12px;overflow:hidden}
.pldet.dropon::after{content:"Drop to add photos";position:absolute;inset:6px;border:2px dashed var(--accent);border-radius:12px;background:color-mix(in srgb,var(--card) 80%,transparent);display:grid;place-items:center;font-family:var(--serif);font-size:18px;color:var(--ink);pointer-events:none;z-index:8}
.plhero{height:170px;background:var(--paper);border-bottom:1px solid var(--line)}
.plhero img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.pldbody{padding:14px 18px 16px;display:flex;flex-direction:column;gap:12px}
.plcrumb{font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.plcrumb a{cursor:pointer;color:var(--muted)}.plcrumb a:hover{color:var(--ink)}
.pltitle h2{margin:0;font-family:var(--serif);font-size:25px;font-weight:650;line-height:1.2;display:inline}
.pltp.big{cursor:pointer;font-size:11px;padding:1px 8px;margin-left:10px;vertical-align:5px}
.pltpmenu{display:flex;flex-wrap:wrap;gap:4px}
.pltpmenu .pltp{cursor:pointer}
.pltpmenu .pltp.on,.plnp .types .pltp.on{background:color-mix(in srgb,var(--c) 22%,transparent);font-weight:700}
.plaka{font-size:12.5px;color:var(--muted);margin-top:-8px}
.plfacts{display:grid;grid-template-columns:96px minmax(0,1fr);border-top:1px solid var(--line2)}
.plfacts>div{padding:7px 0;border-bottom:1px solid var(--line2);font-size:13.5px;min-width:0}
.plfacts .k{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding-top:9px}
.pled{cursor:text;border-radius:5px;padding:1px 4px;margin:-1px -4px;display:inline-block;max-width:100%}
.pled:hover{background:var(--line2)}
.pled.none{color:var(--faint)}
.plinh{color:var(--muted)}.plinh small{font-size:11.5px;color:var(--faint)}
.pledin{background:var(--paper);border:1px solid var(--accent);border-radius:6px;padding:4px 7px;font-size:13.5px;width:100%;outline:none;color:var(--ink);font-family:inherit}
textarea.pledin{min-height:80px;resize:vertical;line-height:1.5}
.plmini{font-size:12px;color:var(--muted);margin-left:8px}
.pltags{display:inline-flex;flex-wrap:wrap;gap:3px;vertical-align:1px}
.plcamp{display:flex;flex-wrap:wrap;gap:6px;padding:9px 10px;border-radius:10px;background:color-mix(in srgb,var(--t-camp) 10%,var(--card));border:1px solid color-mix(in srgb,var(--t-camp) 35%,var(--card))}
.plcamp .cf{display:inline-flex;gap:5px;align-items:baseline;border-radius:999px;padding:2px 10px;background:var(--card);font-size:12.5px;cursor:pointer;border:1px solid transparent}
.plcamp .cf:hover{border-color:var(--t-camp)}
.plcamp .cf small{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.plcamp .cf.none{color:var(--faint)}
.plcamp .ct{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--t-camp);font-weight:700;width:100%;margin-bottom:1px}
.plnotes{font-size:13.5px;line-height:1.6;color:var(--ink2);white-space:pre-wrap;cursor:text;border-radius:6px;padding:4px 6px;margin:-4px -6px;display:block}
.plnotes:hover{background:var(--line2)}.plnotes.none{color:var(--faint)}
.plslabel{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);display:flex;align-items:center;gap:10px}
.pllnk{background:none;border:0;color:var(--accent);font-size:12.5px;padding:0;cursor:pointer;text-transform:none;letter-spacing:0}
.plinside{display:flex;flex-direction:column;gap:2px;max-height:260px;overflow:auto}
.plirow{display:flex;gap:8px;align-items:center;padding:3px 6px;border-radius:6px;cursor:pointer;font-size:13.5px}
.plirow:hover{background:var(--line2)}
.plirow .pltp{margin-left:auto}
.pldfoot{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line2);padding-top:10px;font-size:12.5px;color:var(--muted)}
.pldfoot a{cursor:pointer;color:var(--ink2)}.pldfoot a:hover{text-decoration:underline}
.plmenu{position:relative}
.plmenu .mm{position:absolute;right:0;bottom:calc(100% + 4px);background:var(--card);border:1px solid var(--line);border-radius:9px;box-shadow:0 10px 24px rgba(0,0,0,.25);padding:4px;display:flex;flex-direction:column;min-width:200px;z-index:6}
.plmenu .mm button{background:none;border:0;text-align:left;padding:6px 10px;border-radius:6px;font-size:13px;color:var(--ink);cursor:pointer}
.plmenu .mm button:hover{background:var(--line2)}
.plmenu .mm button.danger{color:var(--alert)}
/* photos */
.plstrip{display:flex;gap:6px;flex-wrap:wrap}
.plpth{position:relative;width:76px;height:56px;border-radius:7px;overflow:hidden;border:2px solid transparent;cursor:grab;background:var(--paper)}
.plpth img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.plpth.cover{border-color:var(--accent)}
.plpth .x{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.6);color:#fff;font-size:14px;line-height:1;display:grid;place-items:center;padding:0;cursor:pointer}
.plpth .x:hover{background:var(--alert);border-color:var(--alert)}
.plpth.over{border-color:var(--accent);transform:translateX(4px)}
.plpth.adder{display:grid;place-items:center;border:1.5px dashed var(--line);color:var(--muted);font-size:18px;cursor:pointer}
.plpth.adder:hover{border-color:var(--accent);color:var(--ink)}
.plviewer{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:90;display:grid;place-items:center;padding:20px}
.plviewer img{max-width:92vw;max-height:80vh;border-radius:8px}
.plviewer .vbar{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;gap:8px;align-items:center}
.plviewer .vbar span{color:#fff;font-size:13px;margin-right:6px;white-space:nowrap}
.plviewer .vbar button{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:13px;cursor:pointer}
.plviewer .nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.4);border:0;color:#fff;font-size:28px;width:44px;height:64px;border-radius:8px;cursor:pointer}
.plviewer .nav.l{left:16px}.plviewer .nav.r{right:16px}
#toast .tundo{background:none;border:1px solid currentColor;border-radius:6px;color:inherit;font-size:12px;padding:1px 8px;margin-left:10px;cursor:pointer}
/* merge */
.plmerge{display:flex;gap:10px}.plmerge .btn{flex:1;text-align:left;padding:10px 12px}
.plmerge .muted{font-size:12px}
.plmq{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:8px 11px;font-size:14px;color:var(--ink)}
.plmres{margin-top:6px;max-height:300px;overflow:auto}
.plpr{display:flex;gap:8px;align-items:center;padding:7px 10px;border-radius:7px;cursor:pointer}
.plpr:hover{background:var(--accent-soft)}
.plpr .pp{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.attlist{max-height:320px;overflow:auto}
/* New place dialog */
.modal.plnpm{width:min(960px,calc(100vw - 32px));max-width:none}
.modal.plnpm .mb{padding:0}
.plnp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);min-height:0}
@media (max-width:760px){.plnp{grid-template-columns:1fr}}
.plnpl{border-right:1px solid var(--line2);display:flex;flex-direction:column;padding:12px 12px 10px;gap:8px;background:color-mix(in srgb,var(--paper) 40%,var(--card))}
.plnp .lbl{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin-bottom:4px}
.plnpl input.q,.plnpl .npco{background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:6px 9px;font-size:13px;color:var(--ink)}
.plnpl .npco{color:var(--muted)}
.plmtree{overflow:auto;max-height:48vh;min-height:240px}
.plmtree .mn{display:flex;align-items:center;gap:6px;padding:3px 6px;border-radius:7px;cursor:pointer;font-size:13.5px}
.plmtree .mn:hover{background:var(--line2)}
.plmtree .mn.on{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
.plmtree .pltw{width:22px;height:22px}.plmtree .pltw svg{width:14px;height:14px}
.plmtree .mn .add{margin-left:auto;opacity:0;background:none;border:1px solid var(--line);border-radius:6px;font-size:11.5px;padding:0 6px;color:var(--muted);cursor:pointer}
.plmtree .mn:hover .add{opacity:1}
.plmtree .mn.country b{font-family:var(--serif)}
.plmtree .mn.newrow input{flex:1;background:var(--paper);border:1px solid var(--accent);border-radius:6px;padding:3px 7px;font-size:13px;color:var(--ink);min-width:0}
.plmtree .mn.newrow select{background:var(--paper);border:1px solid var(--line);border-radius:6px;font-size:12.5px;color:var(--ink);padding:2px 4px}
.plnpr{padding:14px 18px;display:flex;flex-direction:column;gap:11px;overflow:auto;max-height:62vh}
.plnpr .nm{font-family:var(--serif);font-size:22px;font-weight:650;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:5px 10px;width:100%;color:var(--ink)}
.plnpr .nm:focus{outline:none;border-color:var(--accent)}
.plnp .types{display:flex;flex-wrap:wrap;gap:4px}
.plnp .types .pltp{cursor:pointer;padding:2px 9px;font-size:11px}
.plnpr .two{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px 10px;align-items:center}
.plnpr .two input{background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:5px 8px;font-size:13.5px;width:100%;color:var(--ink)}
.plnpr .two .k{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}
.plnpr textarea{background:var(--paper);border:1px solid var(--line);border-radius:7px;padding:6px 8px;font-size:13.5px;min-height:56px;resize:vertical;color:var(--ink);font-family:inherit}
.plwarn{background:var(--alert-soft);border-radius:8px;padding:8px 10px;font-size:12.5px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.plwarn b{color:var(--alert)}
.plsaveas{font-size:12.5px;color:var(--muted);margin-right:auto;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.plsaveas b{color:var(--ink)}
.npcamp{display:flex;flex-wrap:wrap;gap:6px}
.npcamp label{display:flex;flex-direction:column;font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);gap:2px}
.npcamp input,.npcamp select{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:3px 6px;font-size:13px;width:96px;color:var(--ink)}
.npph{display:flex;gap:6px;flex-wrap:wrap;align-items:center;border-radius:8px}
.npph img{width:58px;height:44px;object-fit:cover;border-radius:6px}
.npph .dz{border:1.5px dashed var(--line);border-radius:7px;padding:8px 12px;font-size:12.5px;color:var(--muted);cursor:pointer}
.npph.dropon .dz,.npph .dz:hover{border-color:var(--accent);background:var(--accent-soft)}
/* combo: place path, New place row */
.combo-pop .ci .cpath{color:var(--muted);font-size:12px;margin-left:8px}
.combo-pop .ci.cnew{color:var(--accent);font-weight:600;border-top:1px solid var(--line2)}
.combo-pop .ci.cnew .cpath{font-weight:400}

/* ===================== timeline: drag to move (tldrag.js) ===================== */
.row[data-drag]{position:relative}
.tlgrip{position:absolute;left:1px;top:50%;transform:translateY(-50%);font-size:10px;letter-spacing:-1px;color:var(--faint);opacity:0;cursor:grab;padding:4px 1px;line-height:1}
.row[data-drag]:hover .tlgrip{opacity:1}
.row.tldragging{opacity:.35}
.ln.tl-before .lc{box-shadow:inset 0 3px 0 -1px var(--accent)}
.ln.tl-after .lc{box-shadow:inset 0 -3px 0 -1px var(--accent)}
.ln.tl-day .lc{outline:2px dashed var(--accent);outline-offset:-2px;border-radius:8px}
.tltip{position:fixed;z-index:95;display:none;pointer-events:none;background:var(--ink);color:var(--paper);font-size:12.5px;font-weight:600;padding:4px 9px;border-radius:7px;box-shadow:0 4px 14px rgba(0,0,0,.25)}

/* ===================== linked visits (links.js) ===================== */
.visitsh{border:1px dashed var(--accent-line);border-radius:10px;padding:8px 12px 10px;background:color-mix(in srgb,var(--accent) 5%,transparent)}
.visitsh h5 .shared{text-transform:none;letter-spacing:0}
.vphotos{display:flex;gap:5px;flex-wrap:wrap;margin:4px 0 8px;align-items:center}
.vphotos img{width:72px;height:52px;object-fit:cover;border-radius:6px;cursor:zoom-in;background:var(--line2)}
.vacts{font-size:12px;color:var(--muted);margin-top:8px}
.vacts a{cursor:pointer;color:var(--accent)}
.row .ti .rthumb{width:22px;height:22px;object-fit:cover;border-radius:5px;vertical-align:-6px;margin-right:6px;background:var(--line2)}
.row .ti .rlink{font-size:10px;opacity:.55;font-weight:400}

/* ===================== flexible slots + Locations ===================== */
.fo{position:relative}
.fo .focover{width:calc(100% + 22px);margin:-9px -11px 4px;height:84px;object-fit:cover;border-radius:9px 9px 0 0;cursor:zoom-in;display:block;background:var(--line2)}
.fo .form{position:absolute;top:5px;right:5px;width:20px;height:20px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:11px;line-height:1;display:grid;place-items:center;padding:0;cursor:pointer;opacity:0;transition:opacity .15s}
.fo:hover .form{opacity:1}.fo .form:hover{color:var(--alert);border-color:var(--alert)}
.fxcardadd{margin-top:8px}
.fxcardadd input,.fxsearch input{width:100%;background:var(--paper);border:1px dashed var(--line);border-radius:8px;padding:6px 10px;font-size:13px;color:var(--ink)}
.fxcardadd input:focus,.fxsearch input:focus{outline:none;border-style:solid;border-color:var(--accent)}
.fxsearch{margin-bottom:8px}
.fxlist{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.fxrow{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto 26px;gap:10px;align-items:center;padding:5px 8px;border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:8px}
.fxrow img,.fxrow .fxic{width:44px;height:34px;border-radius:5px;object-fit:cover;display:grid;place-items:center;background:var(--line2)}
.fxrow .fxn{display:flex;flex-direction:column;min-width:0}
.fxrow .fxn b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fxrow .fxn small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fxrow .fxn .fxaway{color:var(--accent)}
.fxrow .fxtg{display:flex;gap:3px;flex-wrap:wrap;justify-content:flex-end}
.fxrow .fxtg .tg{font-size:10.5px}
.fxhere .optgh{display:flex;gap:6px;align-items:center;font-size:12px;color:var(--muted);margin-bottom:5px}
.stplace:empty{display:none}
.stplace{font-size:12.5px;color:var(--ink2);background:color-mix(in srgb,var(--t-camp) 10%,var(--card));border:1px solid color-mix(in srgb,var(--t-camp) 35%,var(--card));border-radius:8px;padding:6px 10px;margin:-2px 0 10px}

/* ===================== streamlined forms (fk.js) ===================== */
.fkform{display:flex;flex-direction:column;gap:12px}
.fkwhat{display:flex;gap:8px;align-items:flex-start;position:relative}
.fkname{flex:1;min-width:0;background:var(--field,var(--paper));border:1px solid var(--line);border-radius:10px;padding:11px 14px;font-size:16px;color:var(--ink);font-family:inherit}
.fkname:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
:root:not([data-theme="dark"]) .fkname,:root:not([data-theme="dark"]) .fkchip,:root:not([data-theme="dark"]) .fkarea{background:#efe6d4}
:root[data-theme="dark"] .fkname,:root[data-theme="dark"] .fkchip,:root[data-theme="dark"] .fkarea{background:#14130f;border-color:#3a352e}
.fkic{position:relative;flex:none}
.fkicb{width:46px;height:46px;border:1px solid var(--line);background:var(--paper);border-radius:10px;display:grid;place-items:center;position:relative;cursor:pointer;padding:0}
.fkicb:hover{border-color:var(--accent)}
.fkicb svg{width:20px;height:20px;fill:var(--ink)}
.fkicb small{position:absolute;bottom:1px;right:4px;font-size:9px;color:var(--faint)}
.fkicb.static{cursor:default}.fkicb.static:hover{border-color:var(--line)}
.fkicpop{position:absolute;left:0;top:calc(100% + 4px);z-index:30;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 30px rgba(0,0,0,.35);padding:8px;width:min(460px,80vw)}
.fkicpop .fld>span{display:none}
.fkcardslot{flex:1;min-width:0}
.fkcard{display:flex;gap:12px;align-items:center;border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:12px;padding:8px 10px 8px 8px}
.fkcard>img,.fkcard .fkcardic{width:78px;height:58px;border-radius:8px;flex:none;object-fit:cover;background:var(--line2);display:grid;place-items:center}
.fkcard .fkcardic svg{width:22px;height:22px;fill:var(--ink2)}
.fkcard .b{min-width:0;flex:1}
.fkcard .t{font-family:var(--serif);font-size:17px;font-weight:650;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.fkcard .w{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fkcard .f{font-size:12.5px;color:var(--ink2);margin-top:2px}
.fkcard .lk{color:var(--accent);font-size:11.5px;cursor:pointer}
.fkchg{background:none;border:1px solid var(--line);border-radius:7px;padding:3px 9px;font-size:12px;color:var(--muted);align-self:flex-start;cursor:pointer}
.fknew{font-size:12.5px;color:var(--muted);margin-top:-6px;padding-left:54px}
.fknew:empty{display:none}
.fknew a,.fkhint a{color:var(--accent);cursor:pointer}
.fkrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.fkchip{display:flex;flex-direction:column;justify-content:center;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:3px 10px 4px;min-height:44px;min-width:0}
.fkchip small{font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);line-height:1.2}
.fkchip input{background:none;border:0;outline:none;padding:0;font-size:14px;color:var(--ink);font-family:inherit;min-width:0;width:100%}
.fkchip:focus-within{border-color:var(--accent)}
.fkchip input[type=date]{width:128px}.fkchip input[type=time]{width:100px}.fkchip input[type=number]{width:110px}
.fkchip.grow{flex:1;min-width:180px}
.fkarrow{color:var(--faint)}
.fkspan{font-size:12px;color:var(--muted)}
.fkl,.fklbl{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}
.fklbl{margin-bottom:5px}
.fkhint{font-size:11.5px;color:var(--faint)}
.fkarea{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:8px 11px;resize:vertical;color:var(--ink);font-family:inherit;font-size:13.5px;line-height:1.5}
.fkarea:focus{outline:none;border-color:var(--accent)}
.fktog{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--ink2);cursor:pointer;user-select:none}
.fktog input{display:none}
.fktog i{width:30px;height:18px;border-radius:999px;background:var(--line);position:relative;transition:.15s;flex:none}
.fktog i::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--card);transition:.15s}
.fktog input:checked+i{background:var(--accent)}.fktog input:checked+i::after{left:14px}
.fkseg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;flex-wrap:wrap}
.fkseg button{background:none;border:0;padding:6px 12px;font-size:13px;color:var(--muted);border-right:1px solid var(--line2);cursor:pointer}
.fkseg button:last-child{border-right:0}
.fkseg button.on{background:var(--accent-soft);color:var(--ink);font-weight:600}
.fkseg button.on.ok{background:color-mix(in srgb,var(--good) 18%,var(--card))}
.fkseg button.on.warn{background:color-mix(in srgb,var(--alert) 16%,var(--card))}
.fkmode .fkseg button{padding:5px 10px;font-size:12.5px}
.fkft{display:flex;gap:8px;align-items:flex-start}
.fkftc{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.fkft .fkarrow{padding-top:13px}
.fkcap{font-size:11.5px;color:var(--muted);padding-left:4px;min-height:15px}
.fkxf{display:flex;flex-direction:column;gap:8px}
.fkxf:not(:has(.fkx:not([hidden]))){display:none}
.fkextras{display:flex;gap:6px;flex-wrap:wrap}
.fkextras button{background:none;border:1px dashed var(--line);border-radius:999px;padding:3px 11px;font-size:12.5px;color:var(--muted);cursor:pointer}
.fkextras button:hover{border-color:var(--accent);color:var(--ink)}
.fkform .actpick:empty{display:none}
.fkform .stplace{margin:-4px 0 0}
.fkdec{background:none;border:1px solid var(--line);border-radius:7px;padding:2px 8px;font-size:12px;color:var(--muted);cursor:pointer;white-space:nowrap}
.fkdec.on{background:color-mix(in srgb,var(--good) 20%,var(--card));border-color:var(--good);color:var(--ink);font-weight:600}
.rdtop{display:flex;gap:12px;align-items:center;font-size:12.5px;color:var(--ink2);background:var(--paper);border:1px dashed var(--line);border-radius:10px;padding:8px 10px;margin-bottom:12px}
.rdtop img,.rdtop .attdoc{width:64px;height:48px;object-fit:cover;border-radius:6px;flex:none}
@media (max-width:640px){.fkft{flex-direction:column}.fkft .fkarrow{display:none}}
.modal .fkcard+.seg2{margin-top:12px}

/* ===================== Browse Locations (browse.js) ===================== */
.fkbrowse{flex:none;display:inline-flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:0 12px;height:46px;font-size:13px;color:var(--ink2);cursor:pointer}
.fkbrowse:hover{border-color:var(--accent);color:var(--ink)}
.fkbrowse svg{width:15px;height:15px}
.fxsearch,.fxcardadd{display:flex;gap:6px;align-items:stretch}
.fxsearch input,.fxcardadd input{flex:1}
.fxsearch .fkbrowse,.fxcardadd .fkbrowse{height:auto;padding:4px 10px;border-radius:8px;font-size:12.5px}
.modal.pbm{width:min(1120px,calc(100vw - 32px));max-width:none}
.modal.pbm .mb{padding:0}
.pbw{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);height:min(70vh,720px)}
@media (max-width:820px){.pbw{grid-template-columns:1fr;height:auto}.pbr{border-left:0;border-top:1px solid var(--line2)}}
.pbl{display:flex;flex-direction:column;gap:8px;padding:12px;min-height:0;background:color-mix(in srgb,var(--paper) 40%,var(--card))}
.pbchips{display:flex;flex-wrap:wrap;gap:5px}
.pbchip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:none;border-radius:999px;padding:2px 10px;font-size:12px;color:var(--ink2);cursor:pointer}
.pbchip i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.pbchip small{color:var(--muted)}
.pbchip.on{background:var(--accent-soft);border-color:var(--accent);color:var(--ink)}
.pbtree{flex:1;overflow:auto;min-height:0;border-top:1px solid var(--line2);padding-top:6px}
.pbtree .plnode{cursor:pointer}
.plnode.pbadded{background:color-mix(in srgb,var(--good) 14%,transparent)}
.pbok{color:var(--good);font-weight:600}
.pbr{border-left:1px solid var(--line2);display:flex;flex-direction:column;min-height:0}
.pbhero{height:200px;flex:none;background:var(--paper)}
.pbhero img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.pbdb{flex:1;overflow:auto;padding:14px 18px;display:flex;flex-direction:column;gap:10px}
.pbthumbs{display:flex;gap:5px;flex-wrap:wrap;align-items:center}
.pbthumbs img{width:70px;height:50px;object-fit:cover;border-radius:6px;cursor:zoom-in;background:var(--line2)}
.pbnotes{font-size:13.5px;line-height:1.6;color:var(--ink2);white-space:pre-wrap}
.pbact{display:flex;align-items:center;gap:10px;padding:10px 18px;border-top:1px solid var(--line2)}
.pbact a{cursor:pointer;font-size:12.5px}
.pbl .plsbox{flex:none}
.pbl .plsbox input{background:var(--paper)}
.pbdb .pltitle .pltp{margin-left:10px;vertical-align:5px}
.modal.pbm .mb{overflow:hidden;max-height:none}.modal.pbm .pbw{height:min(calc(100vh - 230px),680px)}

/* ===================== timeline top buttons (Outline / Where you sleep) ===================== */
.tltop{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.tltb{flex:1;min-width:240px;display:flex;align-items:baseline;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 12px;text-align:left;cursor:pointer;color:var(--ink);box-shadow:var(--raise)}
.tltb:hover{border-color:var(--accent-line)}
.tltb b{font-family:var(--serif);font-size:15px;font-weight:600;white-space:nowrap}
.tltb span{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.tltb i{font-style:normal;color:var(--muted);font-size:12px}
.tltb.on{border-color:var(--accent);background:var(--accent-soft)}
.tltb.warn span{color:var(--alert)}
.tltop + .olp, .tltop + .nights{margin-top:0}

/* ===================== Glance & Day lines density ===================== */
.dens-glance .lc.dbox,.dens-lines .lc.dbox{background:none;border:0;box-shadow:none;border-radius:0;padding:0;margin-top:0}
.dens-glance .lc.dtop{margin-top:6px}
.dens-glance .ln,.dens-lines .ln{grid-template-columns:22px 7px 0 minmax(0,1fr);column-gap:7px}
.gdh{display:flex;gap:8px;align-items:baseline;padding:5px 4px 2px;border-bottom:1px solid var(--line2);cursor:pointer;min-width:0}
.gdh:hover{background:var(--line2)}
.gdd{font-weight:700;font-size:12.5px;white-space:nowrap}
.gpl{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.gbed{margin-left:auto;font-size:11px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}
.gbed.bad{color:var(--alert)}.gbed.soft{color:var(--muted)}
.gfold{color:var(--muted);font-size:11px}
.lines .grow{display:flex;gap:7px;align-items:center;height:23px;padding:0 4px;font-size:13px;border-radius:5px;cursor:pointer;min-width:0}
.lines .grow:hover{background:var(--line2)}
.lines .grow.sel{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
.lines .grow .gic{width:16px;height:16px;flex:none;display:grid;place-items:center}
.lines .grow .gic svg{width:12px;height:12px;fill:var(--muted)}
.lines .grow .gtm{width:62px;flex:none;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.lines .grow .gnm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.lines .grow .gsub{color:var(--muted);font-weight:400}
.lines .grow .gal{margin-left:auto;color:var(--alert);font-size:11px;white-space:nowrap;flex:none}
.lines .grow.g-stay .gnm{color:var(--ink2)}
.lines .grow.g-flex .gic svg{fill:var(--accent)}
.lines .grow.done .gnm{text-decoration:line-through;color:var(--muted)}
.lines .grow.glay{cursor:default;font-size:12px;color:var(--muted);height:20px}
.gbad{color:var(--alert)}
.gfree{font-size:11.5px;color:var(--faint);padding:0 4px 2px 27px;height:20px;cursor:pointer}
.gfree:hover{color:var(--accent)}
.dens-glance .drawer{margin:4px 0 8px}
.dlday{display:flex;gap:8px;align-items:center;min-height:27px;padding:2px 4px;border-bottom:1px solid var(--line2);font-size:13px;min-width:0}
.dlday:hover{background:color-mix(in srgb,var(--line2) 60%,transparent)}
.dld{font-weight:700;font-size:12px;width:52px;flex:none;white-space:nowrap}
.dlitems{display:flex;gap:4px;align-items:center;overflow:hidden;white-space:nowrap;flex:1;min-width:0}
.dlit{color:var(--ink2);cursor:pointer;border-radius:4px;padding:0 2px}
.dlit:hover{background:var(--line2);color:var(--ink)}
.dlit b{color:var(--ink)}
.dlit.bad{color:var(--alert)}
.dlit.sel{background:var(--accent-soft)}
.dlsep{color:var(--faint)}
.dlfree{color:var(--faint);cursor:pointer}
.dlbed{font-size:11px;color:var(--faint);white-space:nowrap;flex:none}
.dlbed.bad{color:var(--alert)}.dlbed.soft{color:var(--muted)}
.cb .lab.h{writing-mode:horizontal-tb;rotate:none;top:4px;letter-spacing:.3px;font-size:9px;max-height:none}
.gadd{flex:none;width:20px;height:20px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:12px;line-height:1;display:grid;place-items:center;padding:0;cursor:pointer;align-self:center}
.gadd:hover{border-color:var(--accent);color:var(--ink);background:var(--accent-soft)}
.gdh .gbed{margin-left:auto}
.dlday .dlbed+.gadd,.gdh .gbed+.gadd,.gdh .gfold+.gadd{margin-left:2px}
/* ---- outline: real plans win, split strips, mismatch ---- */
.olchip.mis{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--alert) 70%,transparent)}
.olchip .olmisc{font-size:10.5px;color:var(--alert);font-weight:600}
.olmis{font-size:12px;color:var(--alert);font-weight:600}
.dlhalf{height:9px}
.gfree.olday,.dlfree.olday{color:var(--muted);font-style:italic}
.gfree.olday b,.dlfree.olday b{font-weight:600;font-style:normal}
.gfree.olday .olwhen,.dlfree.olday .olwhen{font-size:10px;text-transform:uppercase;letter-spacing:.6px;margin-right:4px;font-style:normal;color:var(--faint)}
.dens-lines .cb.first,.dens-glance .cb.first{margin-top:3px}.dens-lines .cb.last,.dens-glance .cb.last{margin-bottom:3px}
.dens-lines .cc.first,.dens-glance .cc.first{margin-top:2px}.dens-lines .cc.last,.dens-glance .cc.last{margin-bottom:2px}
.dlhalf{height:13px}
.gdh .gadd{margin-left:auto}
/* ---- planning details (Tags & open days) ---- */
.modal.pdm{max-width:760px}
.pdf{display:flex;flex-direction:column;gap:9px}
.pdf .fkrow{flex-wrap:nowrap}
.pdsub{margin:0 0 2px;color:var(--muted);font-size:12.5px}
.pdf .fkchip select{background:none;border:0;outline:none;color:var(--ink);font:inherit;font-size:14px;padding:0}
.pdicon{display:flex;align-items:center;gap:6px;flex:none;border:1px solid var(--line);border-radius:9px;padding:3px 6px 3px 10px;min-height:44px;background:var(--paper)}
.pdicon>small{font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted)}
.pdicon .fkicpop{right:0;left:auto}
.pdsec{margin-top:8px;padding-top:10px;border-top:1px solid var(--line2);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--accent)}
.pdg{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:start}
.pdgl{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding-top:6px}
.pdpills{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pdp{cursor:pointer;user-select:none}
.pdp input{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.pdp span{display:inline-block;padding:4px 11px;border:1px solid var(--line);border-radius:99px;font-size:12.5px;color:var(--muted);background:var(--paper);transition:.12s}
.pdp:hover span{border-color:var(--faint);color:var(--ink)}
.pdp input:checked+span{background:var(--accent-soft);border-color:var(--accent);color:var(--ink);font-weight:600}
.pdp input:focus-visible+span{outline:2px solid var(--accent);outline-offset:1px}
.pdhint{font-size:11.5px;color:var(--faint);margin-left:4px}
@media (max-width:640px){.pdf .fkrow{flex-wrap:wrap}.pdg{grid-template-columns:1fr;gap:4px}.pdgl{padding-top:0}}
.pdf .fkchip{text-align:left;align-items:stretch}
.pdf .fkchip small{text-align:left}
.pdf .fkchip input,.pdf .fkchip select{padding:0;margin:0;border:0;background:none;box-shadow:none;height:auto;min-height:0;text-align:left;width:100%}
.pdf .fkchip input::placeholder{color:var(--faint);opacity:1}
.pdf .fkchip{justify-content:center;gap:1px}.pdf .fkchip input,.pdf .fkchip select{font-size:14px;line-height:20px}
/* ---- Locations details: every planning field in plain view ---- */
.plpills{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.plpill{padding:1px 9px;border:1px solid var(--line);border-radius:99px;font-size:12px;color:var(--muted);cursor:pointer;user-select:none}
.plpill:hover{border-color:var(--faint);color:var(--ink)}
.plpill.on{background:var(--accent-soft);border-color:var(--accent);color:var(--ink);font-weight:600}
.pltags .tg{padding:1px 8px;border:1px solid var(--line);border-radius:99px;font-size:12px;background:var(--paper)}
.pltags .tgadd{padding:1px 7px;font-size:12px;color:var(--faint)}
.plic{display:inline-flex !important;align-items:center;gap:7px;cursor:pointer}
.plic svg{width:15px;height:15px;fill:var(--muted)}
.plic small{color:var(--faint);font-size:11px}
.plicgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:5px;margin-top:6px}
.plicgrid button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--muted);cursor:pointer}
.plicgrid button svg{width:15px;height:15px;fill:currentColor}
.plicgrid button small{font-size:10px}
.plicgrid button:hover,.plicgrid button.on{border-color:var(--accent);color:var(--ink)}
.plicgrid button.on{background:var(--accent-soft)}

/* ---- empty fields look empty: placeholders and "＋ add" prompts are dim and italic ---- */
:root{--ghost:color-mix(in srgb,var(--faint) 40%,var(--card))}
input::placeholder,textarea::placeholder{color:var(--ghost) !important;opacity:1 !important;font-style:italic}
:root[data-theme="dark"] .fld input::placeholder,:root[data-theme="dark"] .fld textarea::placeholder{color:var(--ghost) !important}
.pled.none,.pled.none .plinh,.plcamp .cf.none{color:var(--ghost);font-style:italic}
.pled.none small,.pled.none .plinh small{color:var(--ghost)}
.pled.none .plinh{font-style:normal;color:var(--faint)}.pled.none .plinh small{color:var(--ghost)}
input[type=time][value=""]::-webkit-datetime-edit,input[type=date][value=""]::-webkit-datetime-edit,input[type=time]:not([value])::-webkit-datetime-edit{color:var(--ghost);font-style:italic}
/* ---- side panel: the place's photos in the header ---- */
.insp .ih.hasph{padding-top:0;overflow:hidden}
.insp .ih .ihero{display:block;width:calc(100% + 32px);margin:0 -16px 10px;height:170px;object-fit:cover;cursor:zoom-in;background:var(--line2);border-radius:12px 12px 0 0}
.insp .ithumbs{display:flex;gap:5px;margin:8px 0 2px;align-items:center;flex-wrap:wrap}
.insp .ithumbs img{width:46px;height:34px;object-fit:cover;border-radius:5px;cursor:zoom-in;background:var(--line2);border:1px solid var(--line)}
.insp .ithumbs img:hover{border-color:var(--accent)}
.insp .ithumbs span{font-size:11.5px;color:var(--muted)}
.insp .ib .vphotos{display:none}   /* the side panel shows them at the top already */
.mapbox2.dark .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.82) contrast(.9) saturate(.55)}
/* ---- Google Maps links ---- */
.gmlink{white-space:nowrap}
.dh .droute{font-size:11.5px;color:var(--muted);text-decoration:none;border:1px solid var(--line);border-radius:99px;padding:1px 8px;margin-right:6px;white-space:nowrap}
.dh .droute:hover{color:var(--ink);border-color:var(--accent)}
.gmdays{display:flex;flex-direction:column}
.gmday{display:grid;grid-template-columns:52px 110px minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px 4px;border-top:1px solid var(--line2);color:var(--ink);text-decoration:none;font-size:13px}
.gmday:first-child{border-top:0}
.gmday:hover{background:var(--line2)}
.gmday span{color:var(--muted)}
.gmday i{font-style:normal;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gmday em{font-style:normal;color:var(--accent);font-weight:600;white-space:nowrap}
@media (max-width:640px){.gmday{grid-template-columns:48px minmax(0,1fr) auto}.gmday span{display:none}}
/* ---- flexible slot form: name and time are optional ---- */
.fxquick{display:flex;flex-wrap:wrap;gap:5px;margin:-2px 0 2px}
.fxquick button{border:1px solid var(--line);background:none;color:var(--muted);border-radius:99px;padding:2px 10px;font:inherit;font-size:12px;cursor:pointer}
.fxquick button:hover{color:var(--ink);border-color:var(--faint)}
.fxquick button.on{background:var(--accent-soft);border-color:var(--accent);color:var(--ink)}
.fxhint{margin:-2px 0 0;font-size:12px;color:var(--faint)}
#fxTimes[hidden]{display:none !important}
/* ---- Browse: places already on this trip ---- */
.pbon{color:var(--ok, #8fa97a);font-size:11.5px;white-space:nowrap}
.pbhide{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin:2px 0 6px;cursor:pointer}
.pbhide small{color:var(--faint)}
.pbonbox{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center;margin:6px 0 8px;padding:6px 9px;border:1px solid color-mix(in srgb,var(--ok, #8fa97a) 45%,transparent);border-radius:8px;background:color-mix(in srgb,var(--ok, #8fa97a) 9%,transparent);font-size:12px}
.pbonbox b{color:var(--ok, #8fa97a);font-weight:600;margin-right:4px}
.pbonbox span{color:var(--ink2)}
.pbonbox span+span::before{content:"· ";color:var(--faint)}
/* ---- flexible slot details: compact ---- */
.flex .fxh{gap:6px;margin-bottom:8px;font-size:12.5px;color:var(--muted)}
.flex .fxh .fxt{font-weight:600;color:var(--ink2)}
.fo{gap:2px;padding:8px 10px}
.fo1{display:flex;align-items:center;gap:8px;min-width:0}
.fo1 b.wico{display:flex;align-items:center;gap:7px;min-width:0;flex:1}
.fo1 b.wico>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fo1 .price{flex:none;font-size:12px;color:var(--muted)}
.fo button.fopick{flex:none;margin:0;align-self:center;padding:2px 10px;font-size:11.5px}
.fo .form{top:-7px;right:-7px}
.fo .fo2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}
.fo .tags{gap:3px;margin:3px 0 0}
.fo .tg{font-size:10.5px;padding:0 6px}
.fo .tg.hit{background:var(--accent-soft);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent)}
.fo .tgmore{font-size:10.5px;color:var(--faint);padding:0 3px;cursor:default}
.fo.best:before,.fo.chosen:before{margin-bottom:1px}
.conds2{margin:0 0 10px}
.condt{display:flex;align-items:center;gap:8px;width:100%;background:none;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font:inherit;font-size:12.5px;color:var(--ink2);cursor:pointer;text-align:left}
.condt:hover{border-color:var(--faint)}
.condt span{font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--faint);flex:none}
.condt b{font-weight:600;color:var(--accent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.condt i{color:var(--faint);font-style:italic}
.condt em{margin-left:auto;font-style:normal;color:var(--faint)}
.conds2.open .conds{margin:8px 0 0}
/* ---- the day's light as one bar ---- */
.sunbar{margin:4px 0 2px;font-size:11.5px;color:var(--muted)}
.sb-track{position:relative;height:14px;border-radius:7px;background:color-mix(in srgb,#1d2333 80%,var(--paper));overflow:hidden}
.sb-track i{position:absolute;top:0;bottom:0}
.sb-day{background:color-mix(in srgb,#e9d8a6 55%,var(--card))}
.sb-gold,.sunbar .sb-key i.sb-gold{background:#e2a24c}
.sb-blue,.sunbar .sb-key i.sb-blue{background:#4f6fa8}
.sb-tick{position:absolute;top:0;bottom:0;width:1px;background:color-mix(in srgb,var(--ink) 18%,transparent)}
.sb-span{position:absolute;top:-1px;bottom:-1px;border:2px solid var(--ink);border-radius:4px;box-shadow:0 0 0 1px var(--card)}
.sb-lbl{position:relative;height:16px;margin-top:3px}
.sb-lbl span{position:absolute;transform:translateX(-50%);white-space:nowrap;color:var(--ink2);font-weight:600;font-variant-numeric:tabular-nums}
.sb-key{display:flex;flex-wrap:wrap;gap:3px 12px;align-items:center;margin-top:2px;color:var(--faint);font-size:11px}
.sb-key i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.sb-key i.sb-spank{border:1.5px solid var(--ink);background:none}
.sb-key .sb-len{margin-left:auto}
/* ---- the right-hand panel scrolls on its own ---- */
@media (min-width:981px){
  .rightcol{max-height:calc(100vh - 28px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;padding-right:2px;margin-right:-2px}
  .rightcol::-webkit-scrollbar{width:8px}.rightcol::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
}
@media (min-width:981px){.rightcol>.rtabs{position:sticky;top:0;z-index:3;box-shadow:0 6px 8px -6px var(--paper)}}
@media (min-width:981px){.rightcol>*{flex-shrink:0}}
@media (min-width:981px){.rightcol .insp .ib{max-height:none;overflow:visible}}
.actsun{display:none}.insp .actsun{display:block}
/* ---- weather ---- */
.wxchip{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--ink2);padding:1px 8px;border-radius:99px;border:1px solid var(--line);white-space:nowrap;flex:none;margin-left:6px}
.wxchip.typ{border-style:dashed;color:var(--muted)}
.wxchip i{font-style:normal;font-size:13px}
.wxchip .lo{color:var(--faint)}
.wxchip .rn,.wxc .rn{color:#7fa3d6;font-weight:600}
:root:not([data-theme="dark"]) .wxchip .rn,:root:not([data-theme="dark"]) .wxc .rn{color:#3f6aa8}
.gdh .wxchip{margin-left:auto}
.wxsec{display:none}.insp .wxsec{display:block}
.wxc{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:grid;grid-template-columns:auto 1fr;gap:3px 12px;align-items:center}
.wxc.typ{border-style:dashed}
.wxc .big{font-size:28px;line-height:1;grid-row:1/3}
.wxc .hl{font-size:19px;font-weight:600}.wxc .hl .lo{color:var(--faint);font-weight:500;font-size:15px}
.wxc .d{font-size:12.5px;color:var(--muted)}
.wxc .facts{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--ink2);margin-top:6px;padding-top:7px;border-top:1px solid var(--line2)}
.wxc .facts b{font-weight:600}
.wxbadge{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;padding:1px 6px;border-radius:5px;border:1px solid var(--line);color:var(--muted);margin-left:7px;vertical-align:3px}
.wxbadge.fc{color:var(--good, #8fa97a);border-color:color-mix(in srgb,var(--good, #8fa97a) 50%,transparent)}
.wxhrs{grid-column:1/-1;display:grid;grid-template-columns:repeat(9,1fr);gap:2px;margin-top:8px}
.wxhrs div{display:flex;flex-direction:column;align-items:center;font-size:10.5px;color:var(--muted);padding:3px 0;border-radius:6px}
.wxhrs div.in{background:var(--accent-soft);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent-line)}
.wxhrs i{font-style:normal;font-size:14px;line-height:1.3}.wxhrs b{font-weight:600;color:var(--ink2)}.wxhrs small{color:#7fa3d6;font-size:10px;min-height:12px}
.wxupd{font-size:11px;color:var(--faint);margin-top:5px}
.wxwait{font-size:12.5px;color:var(--faint);margin:0}
.condt .cauto{flex:none;font-size:10px;color:var(--good, #8fa97a);border:1px solid color-mix(in srgb,var(--good, #8fa97a) 50%,transparent);border-radius:5px;padding:0 6px;text-transform:none;letter-spacing:0}
.tbgrp{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
/* ---- archive ---- */
.arclink{display:flex;align-items:center;gap:6px;width:100%;margin-top:6px;background:none;border:0;color:var(--side-muted);font:inherit;font-size:12.5px;padding:5px 10px;border-radius:8px;cursor:pointer;text-align:left}
.arclink:hover{background:color-mix(in srgb,var(--side-ink) 8%,transparent);color:var(--side-ink)}
.arclink span{margin-left:auto;font-size:11px;opacity:.8}
.trip.arch{border-style:dashed}
.archtag{font-size:9.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;border:1px solid currentColor;border-radius:4px;padding:0 4px;opacity:.7;vertical-align:2px}
.archrest{margin-top:6px;background:none;border:1px solid var(--side-line);color:var(--side-ink);border-radius:6px;font:inherit;font-size:11.5px;padding:2px 8px;cursor:pointer}
.archrest:hover{border-color:var(--accent)}
.modal.arcm{max-width:860px}
.arclist{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.arcrow{display:grid;grid-template-columns:minmax(0,1fr) 140px auto;gap:12px;align-items:center;padding:10px 12px;border-top:1px solid var(--line2)}
.arcrow:first-child{border-top:0}
.arcn b{display:block;font-size:14.5px}.arcn span{font-size:12px;color:var(--muted)}
.arcsz{font-size:12px;color:var(--muted);text-align:right}
.arcact{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.arcact .btn[disabled]{opacity:.4;pointer-events:none}
.arcfoot{font-size:12px;color:var(--faint);margin-top:10px}
.arcfoot a{cursor:pointer;text-decoration:underline}
.arcwarn{color:var(--alert);font-size:13px}
@media (max-width:700px){.arcrow{grid-template-columns:1fr}.arcsz{text-align:left}.arcact{justify-content:flex-start}}
/* ---- versions as a drop-down ---- */
.vtabs{padding-top:10px}
.vdd{position:relative}
.vddb{display:inline-flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:6px 10px 6px 7px;font:inherit;color:var(--ink);cursor:pointer}
.vddb:hover,.vdd.open .vddb{border-color:var(--accent)}
.vddb .k,.vddi .k{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--accent);color:var(--paper);font-size:11.5px;font-weight:700}
.vddb .vn{font-weight:600;font-size:13.5px}
.vddb .amt,.vddi .amt{font-size:13px;color:var(--ink2);font-variant-numeric:tabular-nums}
.vddb .st,.vddi .st{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:0 5px}
.vddb .vcount{font-size:12px;color:var(--faint)}
.vddb i{font-style:normal;color:var(--faint);font-size:11px}
.vddm{position:absolute;top:calc(100% + 6px);left:0;z-index:40;min-width:340px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.35);padding:6px}
.vddi{display:grid;grid-template-columns:22px minmax(0,1fr) auto auto;gap:10px;align-items:center;width:100%;background:none;border:0;border-radius:8px;padding:7px 8px;font:inherit;color:var(--ink);cursor:pointer;text-align:left}
.vddi:hover{background:var(--line2)}
.vddi.on{background:var(--accent-soft)}
.vddi .vn{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vddi:not(.on) .k{background:var(--line2);color:var(--ink2)}
.vdda{display:flex;flex-wrap:wrap;gap:4px;border-top:1px solid var(--line2);margin-top:5px;padding-top:6px}
.vdda button{background:none;border:0;color:var(--muted);font:inherit;font-size:12.5px;padding:4px 8px;border-radius:6px;cursor:pointer}
.vdda button:hover{background:var(--line2);color:var(--ink)}
/* ---- slimmer header: icon buttons, version chooser on the same line ---- */
.top{align-items:center}
.top .actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.top .actions .vtabs{padding:0;margin-right:6px}
.top .actions .vddm{left:auto;right:0}
.ibtn{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--card);color:var(--ink2);cursor:pointer;padding:0}
.ibtn:hover{border-color:var(--accent);color:var(--ink)}
.ibtn.pri{background:var(--accent);border-color:var(--accent);color:var(--paper)}
.theme{display:contents}
.tlbar{gap:8px}
.seg2.icn button{display:inline-grid;place-items:center;padding:4px 9px}
.seg2.icn svg{width:15px;height:15px}
.top .actions .theme button.ibtn{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--card);color:var(--ink2);padding:0;font-size:inherit}
.top .actions .theme button.ibtn:hover{border-color:var(--accent);color:var(--ink)}
.stkind{margin:-2px 0 4px}.stkind .fkseg button{padding:5px 14px}
/* ---- outline-only days: one quiet line ---- */
.olq2{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;color:var(--muted);font-size:12.5px}
.olq2 .oltag{font-size:9.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--faint);border:1px dashed var(--line);border-radius:4px;padding:0 5px}
.olq2 .olq{cursor:pointer}.olq2 .olq:hover{color:var(--ink)}
.olq2 .olq b{color:var(--ink2);font-weight:600}
.olq2 .olwhen{font-size:10px;text-transform:uppercase;letter-spacing:.6px;margin-right:4px;color:var(--faint)}
.olq2 .olmk{font-size:11.5px;color:var(--faint);cursor:pointer;opacity:0;transition:opacity .15s}
.dbox:hover .olq2 .olmk,.olq2:hover .olmk{opacity:1}
.olq2 .olmk:hover{color:var(--accent)}
.olq2 .olsep{color:var(--faint)}
.thin.free{color:var(--faint);font-size:12.5px}
.thin.free:hover{color:var(--accent)}
/* Day lines: a day that changes place halfway gets its second colour on the lower half of its own row */
.ln.lnhalf{margin-top:-14px;height:14px;pointer-events:none;position:relative;z-index:1}
.ln.lnhalf .lc{display:none}
.ln.lnhalf .cb,.ln.lnhalf .cc{margin-top:0 !important;border-top-right-radius:0}
.ln.lnhalf .cc{border-radius:0 0 4px 4px}
.ln.lnhalf .cc:not(.last){border-radius:0}
.dlhalf{display:none}
/* no time set: the name moves left, next to the icon */
@media (min-width:901px){.row.notm{grid-template-columns:34px 0 minmax(0,1fr) auto 64px 26px 14px}}
.row.notm .tm{overflow:hidden}
/* ---- inline details: cover strip, light & weather shown, no duplicate photos ---- */
.drawer .dcover{position:relative;height:96px;margin:0 0 12px;border-radius:9px;overflow:hidden;background:var(--line2)}
.drawer .dcover img{width:100%;height:100%;object-fit:cover;object-position:center 40%;display:block;cursor:zoom-in}
.drawer .dcover span{position:absolute;right:8px;bottom:6px;font-size:11px;color:#fff;background:rgba(0,0,0,.45);padding:1px 7px;border-radius:99px;pointer-events:none}
.drawer .vphotos{display:none}
.drawer .actsun,.drawer .wxsec{display:block}
/* cover strip: the photo's vertical middle sits at the top edge, so the strip shows the lower half */
.drawer .dcover img{position:absolute;left:0;top:0;width:100%;height:auto;min-height:192px;object-fit:cover;transform:translateY(-50%)}
#stBk2[hidden],#stBk3[hidden],#stGps[hidden]{display:none !important}
/* ---- pick a spot on a map ---- */
.modal.gpm{max-width:900px}
.gpw{display:flex;flex-direction:column;gap:8px;position:relative}
.gpbar{display:flex;gap:6px}
.gpbar input{flex:1;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:8px 10px;color:var(--ink);font:inherit}
.gpres{position:absolute;top:44px;left:0;right:0;z-index:1000;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.35);padding:4px;max-height:280px;overflow:auto}
.gpres button{display:block;width:100%;text-align:left;background:none;border:0;padding:7px 9px;border-radius:7px;color:var(--ink);font:inherit;font-size:13px;cursor:pointer}
.gpres button:hover{background:var(--line2)}
.gpres button span{color:var(--muted);font-size:12px}
.gpres .muted{padding:8px;font-size:12.5px}
.gpmap{height:min(58vh,460px);border-radius:10px;border:1px solid var(--line)}
.gpfoot{display:flex;align-items:center;gap:10px;font-size:12.5px}
.gplayer{margin-left:auto;display:inline-flex;border:1px solid var(--line);border-radius:99px;overflow:hidden}
.gplayer button{background:none;border:0;color:var(--muted);font:inherit;font-size:12px;padding:3px 10px;cursor:pointer}
.gplayer button.on{background:var(--accent);color:var(--paper)}
.geoin{display:flex;gap:6px;align-items:center}.geoin input{flex:1;min-width:0}
.geob{display:inline-grid;place-items:center;min-width:34px;height:34px;padding:0 8px;border-radius:8px;border:1px solid var(--line);background:var(--card);cursor:pointer;font:inherit;font-size:14px;color:var(--ink2);text-decoration:none;white-space:nowrap}
.geob:hover{border-color:var(--accent);color:var(--ink)}
.geob.sm{display:inline-flex;min-width:0;height:auto;padding:0 6px;font-size:12px;border-radius:6px;gap:3px;vertical-align:1px}
/* ---- Map tab: every plan, a day list beside the map ---- */
.maphd{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.maphd .lead b{color:var(--ink)}
.mtog{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);cursor:pointer}
.mapgrid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:14px;align-items:stretch}
.mapgrid .mapbox2{height:640px}
@media (max-width:1000px){.mapgrid{grid-template-columns:1fr}.maplist{max-height:320px}}
.maplist{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:6px;overflow:auto;max-height:640px}
.mlday+.mlday{margin-top:6px;border-top:1px solid var(--line2);padding-top:6px}
.mlh{display:grid;grid-template-columns:auto auto 1fr;gap:8px;align-items:baseline;width:100%;background:none;border:0;border-radius:7px;padding:5px 7px;font:inherit;color:var(--ink);cursor:pointer;text-align:left}
.mlh:hover{background:var(--line2)}.mlh.on{background:var(--accent-soft)}
.mlh b{font-size:12.5px}.mlh span{font-size:12px;color:var(--muted)}.mlh i{font-style:normal;font-size:11.5px;color:var(--faint);text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mlrow{display:grid;grid-template-columns:22px minmax(0,1fr) auto 34px;gap:8px;align-items:center;padding:4px 7px;border-radius:7px;cursor:pointer;font-size:13px}
.mlrow:hover,.mlrow.on{background:var(--line2)}
.mli{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 30%,var(--card));border:1px solid color-mix(in srgb,var(--c) 70%,transparent)}
.mli svg{width:13px;height:13px;fill:var(--ink)}
.mln{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mln small{color:var(--faint);font-size:11px}
.mlt{font-size:11.5px;color:var(--muted);white-space:nowrap}
.mlp{text-align:right;font-size:12px}.mlp em{font-style:normal;color:var(--faint);font-size:11px}.mlp b{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--ink);color:var(--paper);font-size:10.5px}
.mlrow.nopin .mln{color:var(--muted)}.mlrow.nopin:hover .mlp em{color:var(--accent)}
.mlrow.opt{opacity:.75}.mlrow.opt .mli{background:none;border-style:dashed}
.mlnote{font-size:11.5px;color:var(--faint);margin:8px 7px 4px}.mlnote em{font-style:normal;color:var(--muted)}
.mpin.dim{opacity:.55}
.mstop{position:relative;width:28px;height:28px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);background:var(--c);border:2px solid #1a1712;box-shadow:0 2px 6px rgba(0,0,0,.45);display:grid;place-items:center}
.mstop svg{width:14px;height:14px;fill:#1a1712;transform:rotate(45deg)}
.mstop.opt{background:rgba(26,23,18,.55);border:2px dashed var(--c)}.mstop.opt svg{fill:var(--c)}
.mstop.stay{border-radius:6px;transform:none}.mstop.stay svg{transform:none}
.mstop b{position:absolute;top:-9px;right:-9px;transform:rotate(45deg);min-width:16px;height:16px;border-radius:8px;background:#f3ead8;color:#1a1712;font:700 10px var(--sans);display:grid;place-items:center;border:1px solid #1a1712}
.mpop{font:13px var(--sans);min-width:180px}.mpop b{font-size:14px}
.mpk{font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:#7a6e5c;margin-bottom:2px}
.mpm{font-size:12px;color:#5c5243;margin-top:2px}
.mpa{margin-top:6px;font-size:12px}.mpa a{cursor:pointer}
.mpl{display:flex;flex-direction:column;gap:1px;margin:6px 0}
.mpl a{display:grid;grid-template-columns:18px 1fr auto;gap:6px;align-items:center;font-size:12.5px;padding:2px 3px;border-radius:5px;cursor:pointer;color:inherit;text-decoration:none}
.mpl a:hover{background:rgba(0,0,0,.06)}.mpl span svg{width:13px;height:13px}.mpl small{color:#8a7e6a;font-size:11px}
.mpg{font-size:12px}
/* maps keep their layers to themselves, so pop-ups and search results always sit on top */
.mapbox2,.gpmap{position:relative;z-index:0;isolation:isolate}
/* icon boxes: all solid and the same weight; notes and flexible slots differ by fill, not by a dashed outline */
.row .ic.op,.row .ic.fx{border:1px solid var(--line);border-style:solid}
.row .ic.op{background:color-mix(in srgb,var(--card) 60%,transparent)}
.row .ic.op svg{fill:var(--muted)}
.row .ic.fx{background:color-mix(in srgb,var(--accent) 12%,transparent);border-color:color-mix(in srgb,var(--accent) 55%,transparent)}
/* the flexible-slot icon shares the class name "fx" with the exchange-rate table; undo that table layout here so the icon centres */
.row .ic.fx{grid-template-columns:none;gap:0;font-size:inherit}
.btab tr.norate td:first-child{color:var(--ink)}.ratewait{font-size:11px;color:var(--alert);margin-left:6px;white-space:nowrap}

/* route sketch zoom readout */
.skz{min-width:58px;font-variant-numeric:tabular-nums;color:var(--muted)}
.skz[hidden]{display:none!important}

/* route sketch: Space + drag moves the map (no scrollbars) */
#skStage{overflow:hidden}
#skStage .skinner{transform-origin:0 0}
#skStage.panready,#skStage.panready *{cursor:grab!important}
#skStage.panning,#skStage.panning *{cursor:grabbing!important;user-select:none}
.skzw{display:inline-flex;gap:6px}
.skzw[hidden]{display:none!important}

/* trip readiness check (Trip summary tab) */
.readyp .rdys{display:grid;gap:7px;margin-bottom:10px}
.rdy{display:grid;grid-template-columns:118px 1fr 44px;align-items:center;gap:8px;font-size:12.5px}
.rdy b{font-family:var(--mono);font-weight:600;text-align:right;font-size:12px}
.rbar{height:7px;border-radius:4px;background:var(--line2);overflow:hidden}
.rbar i{display:block;height:100%;background:var(--accent);border-radius:4px}
.rbar i.full{background:var(--good)}
.rsum{font-size:13px;font-weight:600;padding:8px 10px;border-radius:8px;background:var(--line2);margin-bottom:4px}
.rsum.ok{background:var(--good-soft);color:var(--good)}
.rsum.hi{background:color-mix(in srgb,var(--alert) 14%,transparent);color:var(--alert)}
.rgrp h4{margin:12px 0 2px;font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);font-weight:600;display:flex;gap:6px;align-items:center}
.rgrp h4 span{font-family:var(--mono);background:var(--line2);border-radius:8px;padding:0 6px;font-size:10.5px}
.rtcount{display:inline-block;min-width:18px;padding:0 5px;margin-left:4px;border-radius:9px;background:var(--line2);font-size:11px;font-family:var(--mono);line-height:17px;text-align:center}
.rtcount.hi{background:var(--alert);color:#fff}
.lines .ln.flash .lc{box-shadow:0 0 0 2px var(--accent);border-radius:8px}

/* places on the open trip: marked in Locations and Browse */
.plnode .pbon{font-weight:600;padding:1px 7px;border-radius:9px;background:color-mix(in srgb,var(--ok, #8fa97a) 16%,transparent)}
.pbin{color:var(--ok, #8fa97a);font-size:11px;opacity:.8;white-space:nowrap}
.pluse{color:var(--faint)}

/* ---------- trip themes: a survey map behind the trip's header (tripthemes.js) ---------- */
.main{position:relative}
.ttbanner{position:absolute;left:0;right:0;top:0;height:250px;background-size:cover;background-position:50% 45%;pointer-events:none;z-index:0;opacity:0;transition:opacity .4s}
.ttbanner.on{opacity:1}
.ttbanner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--paper) 10%,transparent) 0%,transparent 22%,color-mix(in srgb,var(--paper) 70%,transparent) 66%,var(--paper) 100%)}
body.themed .top,body.themed .nav{position:relative;z-index:1}
body.themed .top{padding-top:92px}
body.themed .top h1{text-shadow:0 1px 18px color-mix(in srgb,var(--paper) 80%,transparent)}
body.themed .top .eyebrow{color:var(--ink);opacity:.85}
body.themed .top .eyebrow:after{background:var(--ink)}
body.themed .side{background-image:linear-gradient(var(--side-bg) 38%,color-mix(in srgb,var(--side-bg) 80%,transparent)),var(--tt-map,none);background-size:100% 100%,auto 100%;background-position:0 0,30% 100%;background-repeat:no-repeat}
.trip.has-tt{display:grid;grid-template-columns:46px 1fr;column-gap:10px;align-items:center}
.trip.has-tt .tthumb{grid-row:1 / span 2;width:46px;height:30px;border-radius:4px;object-fit:cover;background:var(--side-2);outline:1px solid var(--side-line)}
.trip.has-tt .tn,.trip.has-tt .td,.trip.has-tt .archrest{grid-column:2}
/* the picker in Trip settings */
.ttfld > span small{font-weight:400}
.ttpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;margin-top:6px;max-height:360px;overflow:auto;padding:2px}
.ttt{background:none;border:0;padding:0;text-align:left;color:inherit;font:inherit;cursor:pointer}
.ttt .ttim{display:block;aspect-ratio:2/1;border-radius:6px;overflow:hidden;background:var(--line2);outline:1px solid var(--line);position:relative}
.ttt .ttim img{width:100%;height:100%;object-fit:cover;display:block}
.ttt .ttim.none{display:grid;place-items:center;font-size:12px;color:var(--muted);background:repeating-linear-gradient(135deg,var(--line2) 0 6px,transparent 6px 12px)}
.ttt.on .ttim{outline:2px solid var(--accent);outline-offset:2px}
.ttt b{display:block;font-size:12.5px;margin-top:6px}
.ttt small{display:block;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* your own header photo */
:root[data-theme="dark"] .ttbanner.photo{filter:brightness(.82) saturate(.95)}
.ttphoto{margin:6px 0 12px}
.ttphadd{display:flex;gap:12px;align-items:center;padding:12px 14px;border:1.5px dashed var(--line);border-radius:10px;cursor:pointer;color:var(--ink2)}
.ttphadd:hover,.ttphadd.over{border-color:var(--accent);background:var(--accent-soft)}
.ttphadd > span:first-child{font-size:22px}
.ttphadd b{display:block;font-size:13.5px}
.ttphadd small{display:block;color:var(--muted);font-size:12px}
.ttph{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:14px;align-items:center}
.ttphimg{aspect-ratio:3.6/1;border-radius:8px;background-size:cover;background-color:var(--line2);outline:1px solid var(--line)}
.ttphc b{display:block;font-size:13.5px;margin-bottom:6px}
.ttslide{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}
.ttslide input{display:block;width:100%;margin-top:4px;accent-color:var(--accent)}
.ttphb{display:flex;gap:6px;flex-wrap:wrap}
.ttt .ttim.pal{display:grid;grid-template-columns:repeat(4,1fr)}
.ttt .ttim.pal i{display:block}
@media (max-width:700px){ .ttph{grid-template-columns:1fr} }

/* ---------- outline, tidied: summary line + timeline strip + one editor row ---------- */
.ol2 .olhd{gap:12px}
.ol2 .olt{font-size:17px}
.olwhen{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2)}
.olwhen .arr{color:var(--faint)}
.oldate{position:relative;border:1px solid var(--line);background:var(--field);border-radius:8px;padding:3px 10px;font-weight:600;color:var(--ink);cursor:pointer}
.oldate:hover{border-color:var(--accent)}
.oldate input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;border:0;padding:0}
.olsum{font-size:12.5px;color:var(--muted)}
.olsum b{color:var(--ink);font-weight:600}
button.olmis{background:none;border:1px solid color-mix(in srgb,var(--alert) 45%,transparent);border-radius:8px;padding:3px 9px;cursor:pointer;font:inherit;font-size:12px}
button.olmis:hover{background:var(--alert-soft)}
.olmore{position:relative}
.olmb{background:transparent;border:1px solid var(--line);color:var(--ink2);border-radius:8px;width:32px;height:28px;font:inherit;font-size:15px;cursor:pointer;line-height:1}
.olmb:hover{border-color:var(--accent)}
.olmm{position:absolute;right:0;top:34px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:5px;min-width:250px;box-shadow:0 10px 30px rgba(0,0,0,.35);z-index:20}
.olmm button{display:block;width:100%;text-align:left;background:none;border:0;color:var(--ink);font:inherit;font-size:13px;padding:7px 10px;border-radius:7px;cursor:pointer}
.olmm button:hover{background:var(--line2)}
.olmm button.danger{color:var(--alert)}
.olmm small{display:block;color:var(--muted);font-size:11.5px}
.olstrip{display:flex;gap:6px;margin-top:12px;align-items:stretch}
.olgrid{flex:1;display:grid;min-width:0}
.olb{position:relative;margin:0 1.5px;border-radius:8px;padding:7px 8px 7px 11px;min-width:0;cursor:pointer;background:color-mix(in srgb,var(--c) 15%,var(--card));border:1px solid color-mix(in srgb,var(--c) 32%,transparent);overflow:hidden;transition:border-color .12s,box-shadow .12s}
.olb::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c)}
.olb:hover{border-color:color-mix(in srgb,var(--c) 75%,transparent)}
.olb .n{display:block;font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:26px}
.olb .n svg{vertical-align:-1px;margin-right:4px;opacity:.75}
.olb .d{position:absolute;right:8px;top:7px;font-family:var(--serif);font-weight:650;font-size:13.5px;color:var(--ink2)}
.olb .m{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.olb .m .w{font-style:normal;color:var(--alert);font-size:11px}
.dot{flex:none;display:inline-block;width:7px;height:7px;border-radius:50%;border:1.5px solid var(--alert)}
.dot.part{border-color:var(--warn);background:color-mix(in srgb,var(--warn) 45%,transparent)}
.dot.ok{background:var(--good);border-color:var(--good)}
.olb.travel{background:repeating-linear-gradient(-45deg,transparent 0 5px,color-mix(in srgb,var(--ink) 5%,transparent) 5px 10px),var(--paper);border:1px dashed var(--faint)}
.olb.travel::before{display:none}
.olb.travel .n{font-weight:500;color:var(--ink2);font-size:13px}
.olb.mis{border-color:color-mix(in srgb,var(--alert) 60%,transparent)}
.olb.sel{border:1.5px solid var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
.olb.dragging{opacity:.4}
.olb.over{box-shadow:-4px 0 0 var(--accent)}
.oladdb{flex:0 0 42px;border-radius:8px;background:transparent;border:1.5px dashed var(--line);color:var(--muted);font-size:19px;cursor:pointer}
.oladdb:hover,.oladdb.on{border-color:var(--accent);color:var(--accent)}
.olruler{display:grid;margin:4px 48px 0 0}
.olruler span{font-size:10.5px;color:var(--faint);white-space:nowrap;overflow:hidden;padding-left:3px;min-width:0}
.oled{margin-top:11px;border-top:1px solid var(--line2);padding-top:10px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-height:30px}
.oled input{background:var(--field);border:1px solid var(--line);border-radius:8px;padding:6px 10px;width:300px;max-width:100%;color:var(--ink);font:inherit;font-size:13px}
.olen{font-weight:600;font-size:14px}
.olen svg{vertical-align:-1px;opacity:.75}
.olen small{font-weight:400;color:var(--muted);font-size:12.5px;margin-left:7px}
.olstep{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.olstep button{background:transparent;border:0;color:var(--ink);width:30px;height:28px;font:inherit;font-size:15px;cursor:pointer}
.olstep button:hover{background:var(--line2)}
.olstep span{min-width:66px;text-align:center;font-family:var(--serif);font-weight:650;font-size:13.5px;border-left:1px solid var(--line);border-right:1px solid var(--line);line-height:28px}
.olst{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.ollnk{background:none;border:0;padding:0;color:var(--accent);font:inherit;font-size:12.5px;cursor:pointer}
.ollnk:hover{text-decoration:underline}
.ollnk.danger{color:var(--alert)}
.olhint{font-size:11.5px;color:var(--faint)}
.ol2.folded{padding-bottom:10px}
.ol2 .olwhen,.ol2 .oldate,.ol2 .olsum{text-transform:none;letter-spacing:0}
.olb{container-type:inline-size}
@container (max-width:84px){ .olb .m{display:none} .olb .d{display:none} .olb .n{padding-right:0} }
@container (max-width:46px){ .olb .n{font-size:0;text-align:center} .olb .n svg{margin:0;width:13px;height:13px} }
.olb.place{min-height:44px}
.olruler b{font-weight:600;color:var(--muted)}
.olb{padding:0}
.olb .n{padding:7px 30px 0 11px}
.olb .m{padding:1px 8px 7px 11px;margin-top:0}
.olb.travel .n,.olb.travel .m{padding-left:9px}
@container (max-width:84px){ .olb .n{padding:7px 4px 7px 10px} }
@container (max-width:46px){ .olb .n{font-size:11px;padding:8px 2px 8px 7px;text-overflow:clip} .olb.travel .n{font-size:0;padding:9px 0;text-align:center} .olb.travel .n svg{width:12px;height:12px;opacity:.6} }

/* ---------- online version: log-in screen and upload progress ---------- */
.onlgate form{display:flex;flex-direction:column;gap:10px;margin-top:12px;text-align:left}
.onlgate .fld{display:flex;flex-direction:column;gap:4px}
.onlgate .fld span{font-size:12px;color:var(--muted)}
.onlgate input{background:var(--field);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--ink);font:inherit;font-size:15px}
.onlerr{color:var(--alert);font-size:13px;min-height:1em;margin:0}
.onlprog{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--card);border:1px solid var(--accent);color:var(--ink);padding:10px 18px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.35);z-index:200;font-size:13.5px}