.spkcustom .spkin{flex:1 1 auto;min-width:0;padding:8px 11px;border:1px solid var(--line);border-radius:999px;
    background:var(--card);color:var(--ink);font-size:15px;font-family:var(--ff-body)}
  .spkcustom .spkin:focus{outline:none;border-color:var(--teal)}
  .spkcustom .spkuse{flex:0 0 auto}
  .swappick a.spkmore,.swappick button.spkmore{width:100%;padding:8px 11px;border:1px dashed var(--teal);border-radius:12px;background:transparent;color:var(--teal);font-size:14.5px;font-weight:600;text-decoration:none;text-align:center;font-family:var(--ff-body);cursor:pointer}
  .swappick button.spkmore[disabled]{opacity:.6;cursor:default}
  /* Deliberately not the dashed teal of "show all" — removing a stop is a quiet option, not the
     one being suggested. It only picks up warning colour once you are actually on it. */
  .swappick button.spkrm{border-style:solid;border-color:var(--line);color:var(--muted);font-weight:500}
  .swappick button.spkrm:hover{border-color:#b4443a;color:#b4443a}
  .note{color:var(--muted);font-size:14.5px;text-align:center;margin-top:22px;padding:0 8px;text-wrap:balance}
  /* padding, not margin: the bigger chat button is fixed and used to sit right on this text */
  .foot{color:var(--muted);font-size:14.5px;text-align:center;margin-top:34px;line-height:1.6;padding-bottom:88px}
  .foot b{color:var(--ink)}

  .actions{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:10px 0 4px}
  /* Nine of these sat under every page and ate a screen between them. Smaller, but still well
     clear of the ~44px a thumb needs. */
  .act{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    border:1px solid var(--line);border-radius:11px;padding:8px 5px;background:var(--paper2);color:var(--ink);
    font-size:11.5px;font-weight:700;font-family:var(--ff-body);cursor:pointer;text-align:center;text-decoration:none}
  .acic{display:flex}
  .acic svg{width:17px;height:17px;fill:none;stroke:var(--amber);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .act:active{border-color:var(--amber-ink);color:var(--amber-ink)}
  .act:hover{border-color:var(--teal)}
  .act:active{transform:translateY(1px)}

  .themebtn{position:absolute;top:20px;right:18px;z-index:2;height:38px;padding:0 14px;display:inline-flex;align-items:center;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:14.5px;font-weight:600;cursor:pointer;font-family:var(--ff-body);transition:all .15s}
  .themebtn:hover{border-color:var(--teal);color:var(--ink)}
  #app[dir="rtl"] .themebtn{right:auto;left:18px}

  .menubtn{position:absolute;top:20px;left:18px;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:4px;width:38px;height:38px;padding:0 9px;border-radius:999px;border:1px solid var(--line);background:var(--card);cursor:pointer;transition:all .15s}
  .menubtn span{display:block;width:100%;height:2px;border-radius:2px;background:var(--ink);transition:all .15s}
  .menubtn:hover{border-color:var(--teal)}
  #app[dir="rtl"] .menubtn{left:auto;right:16px}
  .greet{color:var(--teal);font-size:14px;font-weight:700;margin:9px 0 0}

  .intro{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:16px 18px;margin-top:18px;animation:rise .45s ease}
  .introhead{display:flex;justify-content:space-between;align-items:center}
  .introhead .t{font-family:var(--ff-display);font-size:17px;font-weight:600}
  .introx{border:none;background:none;color:var(--muted);font-size:15px;cursor:pointer;padding:2px 6px;line-height:1}
  .introx:hover{color:var(--clay)}
  .introsteps{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
  .introsteps li{display:flex;align-items:center;gap:12px;font-size:14.5px}
  .istep{flex:0 0 26px;width:26px;height:26px;border-radius:50%;background:var(--amber);color:#211605;font-weight:700;font-size:14.5px;display:flex;align-items:center;justify-content:center;font-family:var(--ff-data)}
  .promptwrap:has(.micbtn:not(.is-hidden)) .promptbox{padding-right:56px}
  #app[dir="rtl"] .promptwrap:has(.micbtn:not(.is-hidden)) .promptbox{padding-right:14px;padding-left:56px}
  .micbtn.is-hidden{display:none}
  .miclang.is-hidden{display:none}
  .promptwrap:has(.miclang:not(.is-hidden)) .promptbox{padding-right:108px}
  #app[dir="rtl"] .promptwrap:has(.miclang:not(.is-hidden)) .promptbox{padding-right:14px;padding-left:108px}
  .micbtn.rec{background:#e5484d;border-color:#e5484d;color:#fff;animation:micpulse 1.2s infinite}
  @keyframes micpulse{0%{box-shadow:0 0 0 0 rgba(229,72,77,.45)}70%{box-shadow:0 0 0 11px rgba(229,72,77,0)}100%{box-shadow:0 0 0 0 rgba(229,72,77,0)}}
  .michint.is-hidden{display:none}
  .promptex .extry{color:var(--muted);font-size:14.5px;font-family:var(--ff-data);letter-spacing:.5px}
  .promptexchip{padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:var(--paper2);color:var(--ink);font-size:14.5px;font-family:var(--ff-body);cursor:pointer;transition:border-color .15s,background .15s}
  .promptexchip:hover{border-color:var(--teal);background:var(--teal-soft)}
  .promptexchip:active{transform:translateY(1px)}
  .manualtoggle{width:100%;margin-top:18px;padding:15px;background:var(--paper2);border:1px solid var(--line);border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--ink);font-size:15.5px;font-weight:600;font-family:var(--ff-body)}
  .manualtoggle:active{transform:translateY(1px)}
  .manualtoggle #promptOr{margin:0}
  .manualtoggle .mtspark{margin-right:2px}
  .moreopts{margin-top:12px;padding:12px;background:transparent;color:var(--muted);font-size:14.5px;font-weight:600}
  .mtchev{width:9px;height:9px;border-right:2px solid var(--amber);border-bottom:2px solid var(--amber);transform:rotate(45deg);transition:transform .2s;margin-top:-3px}
  .manualtoggle.open .mtchev{transform:rotate(-135deg);margin-top:3px}
  .manualform.is-hidden{display:none}

  .drawer{position:fixed;inset:0;z-index:25;background:rgba(18,14,8,.5);opacity:0;pointer-events:none;transition:opacity .25s}
  .drawer.show{opacity:1;pointer-events:auto}
  .drawerpanel{position:absolute;top:0;left:0;bottom:0;width:82%;max-width:320px;background:var(--card);border-right:1px solid var(--line);box-shadow:var(--shadow);padding:22px 16px;transform:translateX(-102%);transition:transform .25s;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .drawer.show .drawerpanel{transform:none}
  #app[dir="rtl"] .drawerpanel{left:auto;right:0;border-right:none;border-left:1px solid var(--line);transform:translateX(102%)}
  #app[dir="rtl"] .drawer.show .drawerpanel{transform:none}
  .drawerclose{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--paper2);color:var(--muted);font-size:14.5px;cursor:pointer}
  #app[dir="rtl"] .drawerclose{right:auto;left:14px}
  .drawerhead{padding:8px 8px 16px;border-bottom:1px solid var(--line);margin:8px 0 8px;cursor:pointer}
  .dpname{font-family:var(--ff-display);font-size:21px;font-weight:600}
  .dpedit{color:var(--muted);font-size:14.5px;margin-top:2px}
  .drawitem{display:block;width:100%;text-align:left;padding:13px 8px;padding-inline-start:40px;position:relative;border:none;background:none;color:var(--ink);font-size:15.5px;font-weight:600;font-family:var(--ff-body);cursor:pointer;border-radius:8px;text-decoration:none}
  .drawitem::before{content:'';position:absolute;inset-inline-start:10px;top:50%;transform:translateY(-50%);width:18px;height:18px;background:var(--amber);opacity:.9;
    -webkit-mask:var(--di,none) center/contain no-repeat;mask:var(--di,none) center/contain no-repeat}
  .drawitem[data-nav="how"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='12' cy='12' r='8.6'/><path d='M9.6 9.3a2.5 2.5 0 1 1 3.4 3c-.8.5-1 1-1 1.9M12 17.2v.2'/></svg>")}
  .drawitem[data-nav="trips"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='8' width='16' height='11' rx='2'/><path d='M9 8V6a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2M9 8v11M15 8v11'/></svg>")}
  .drawitem[data-nav="community"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='8.4'/><path d='M3.6 12h16.8M12 3.6c2.6 2.2 3.9 5 3.9 8.4s-1.3 6.2-3.9 8.4c-2.6-2.2-3.9-5-3.9-8.4s1.3-6.2 3.9-8.4z'/></svg>")}
  .drawitem[data-nav="saved"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M7 4.5h10a1 1 0 0 1 1 1V20l-6-3.4L6 20V5.5a1 1 0 0 1 1-1z'/></svg>")}
  .drawitem[data-nav="record"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M12 21s-6.5-5.6-6.5-10.4a6.5 6.5 0 0 1 13 0C18.5 15.4 12 21 12 21z'/><path d='M9.6 10.4l1.8 1.8 3.4-3.4'/></svg>")}
  .drawitem[data-nav="install"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M12 4v11M7.5 11l4.5 4.5L16.5 11M5 19.5h14'/></svg>")}
  .drawitem[data-nav="share"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='6' cy='12' r='2.4'/><circle cx='17.5' cy='5.8' r='2.4'/><circle cx='17.5' cy='18.2' r='2.4'/><path d='M8.2 10.9l7-4M8.2 13.1l7 4'/></svg>")}
  .drawitem[data-nav="feedback"]{--di:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 12a8 8 0 0 1-8 8H4l2.5-2.7A8 8 0 1 1 21 12z'/></svg>")}
  .drawitem:hover{background:var(--teal-soft)}
  #app[dir="rtl"] .drawerhead,#app[dir="rtl"] .drawitem{text-align:right}
  .drawerabout{color:var(--muted);font-size:14.5px;margin-top:16px;padding:14px 8px 0;border-top:1px solid var(--line);line-height:1.6;text-wrap:balance}

  .welcome{position:fixed;inset:0;z-index:20;background:rgba(18,14,8,.55);display:flex;align-items:center;justify-content:center;padding:22px;opacity:0;pointer-events:none;transition:opacity .25s}
  .welcome.show{opacity:1;pointer-events:auto}
  .welcard{position:relative;background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);max-width:400px;width:100%;padding:28px 24px;text-align:center;transform:translateY(10px);transition:transform .25s}
  .welclose{position:absolute;top:12px;right:14px;width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--paper2);color:var(--muted);font-size:15px;line-height:1;cursor:pointer;font-family:var(--ff-body);transition:all .15s}
  .welclose:hover{border-color:var(--clay);color:var(--clay)}
  #app[dir="rtl"] .welclose{right:auto;left:14px}
  .welremove{display:inline-block;margin-top:6px;background:none;border:none;color:var(--muted);font-size:14.5px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-family:var(--ff-body)}
  .welremove:hover{color:var(--clay)}
  .welcome.show .welcard{transform:none}
  .weleyebrow{font-size:11.5px;letter-spacing:2.2px;text-transform:uppercase;color:var(--amber-ink);font-weight:700;margin:2px 0 4px}
  #app[dir="rtl"] .weleyebrow{letter-spacing:normal;text-transform:none;font-size:13px}
  .welsteps{background:var(--paper2);border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin:14px 0 16px;text-align:start}
  .welsteps h3{margin:0 0 10px;font-size:16.5px;text-align:center}
  .welstep{display:flex;align-items:flex-start;gap:11px;margin:9px 0;font-size:14px;line-height:1.5;color:var(--ink)}
  .welstep b{flex:0 0 26px;width:26px;height:26px;border-radius:50%;background:var(--amber);color:var(--paper);
    display:flex;align-items:center;justify-content:center;font-size:13.5px;font-variant-numeric:tabular-nums}
  .welcard .compass{margin:0 auto 8px}
  .welcard h2{font-family:var(--ff-display);font-size:26px;margin:6px 0 4px;font-weight:600}
  .welcard .wsub{color:var(--muted);font-size:14px;margin:0 auto 18px;max-width:300px;text-wrap:balance}
  .wellangs{display:flex;gap:8px;justify-content:center;margin:2px 0 14px;flex-wrap:wrap}
  .wellang{padding:9px 16px;border:1px solid var(--line);border-radius:999px;background:var(--paper2);color:var(--ink);font-size:14px;font-weight:600;font-family:var(--ff-body);cursor:pointer;transition:all .15s}
  .wellang:hover{border-color:var(--teal)}
  .wellang.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}
  .welbtn,.pubgo{width:100%;padding:15px;border:none;border-radius:12px;
    background:linear-gradient(100deg,var(--amber) 0%,#f0d489 50%,var(--amber) 100%);color:#241a06;
    font-size:16px;font-weight:700;font-family:var(--ff-body);cursor:pointer;box-shadow:var(--shadow);transition:filter .15s}
  .welbtn:hover,.pubgo:hover{filter:brightness(1.05)}
  .welbtn:active,.pubgo:active{transform:translateY(1px)}
  .weldiv{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;margin:16px 0;font-family:var(--ff-data);letter-spacing:1.5px;text-transform:uppercase}
  .weldiv::before,.weldiv::after{content:"";flex:1;height:1px;background:var(--line)}
  #app[dir="rtl"] .weldiv{letter-spacing:normal;font-family:var(--ff-body)}
  .welname{width:100%;padding:13px;border-radius:12px;border:1px solid var(--line);background:var(--paper2);color:var(--ink);font-size:16px;font-family:var(--ff-body);outline:none;margin-bottom:10px}
  .welname:focus{border-color:var(--teal)}
  .welsave{width:100%;padding:15px;border:1px solid var(--teal);border-radius:12px;background:var(--teal-soft);color:var(--teal);font-size:16px;font-weight:700;font-family:var(--ff-body);cursor:pointer;transition:all .15s}
  .welsave:hover{filter:brightness(1.05)}
  .welsave:active{transform:translateY(1px)}
  .welnote{color:var(--muted);font-size:14px;margin-top:14px}
  .fbstars{display:flex;justify-content:center;gap:8px;margin:2px 0 14px}
  .fbstar{background:none;border:none;font-size:30px;line-height:1;cursor:pointer;color:var(--line);transition:color .12s,transform .12s;padding:0}
  .fbstar:hover{transform:scale(1.1)}
  .fbstar.on{color:var(--amber-ink)}
  .fbmsg{width:100%;padding:13px;border-radius:12px;border:1px solid var(--line);background:var(--paper2);color:var(--ink);font-size:15px;font-family:var(--ff-body);outline:none;resize:vertical;margin-bottom:10px}
  .fbmsg:focus{border-color:var(--teal)}

  .mytrips{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:14px 16px;margin-top:16px}
  .triptag .tx{color:var(--muted);font-weight:700;font-size:16px;line-height:1;padding:0 1px}
  .triptag .tx:hover{color:var(--clay)}
  .bud{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:16px 18px;margin-top:16px}
  .bud h4{font-family:var(--ff-display);font-size:17px;margin:0 0 10px;font-weight:600}
  .budrow{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-top:1px dashed var(--line);font-size:14px}
  .budrow:first-of-type{border-top:none}
  .budrow .amt{font-variant-numeric:tabular-nums;color:var(--muted)}
  .budrow.total{border-top:2px solid var(--line);margin-top:4px;font-weight:700}
  .budrow.total .amt{color:var(--ink)}
  .budnote{font-size:14px;color:var(--muted);margin-top:8px}
  .budgetamt{display:flex;gap:8px;margin-top:2px}
  .budgetamt input{flex:1;min-width:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--paper2);color:var(--ink);font-size:15px;font-family:var(--ff-body)}
  .budgetamt input:focus{outline:none;border-color:var(--teal)}
  .budgetamt select{flex:0 0 auto;width:auto;min-width:96px;padding:0 10px;border:1px solid var(--line);border-radius:12px;background:var(--paper2);color:var(--ink);font-size:14.5px;font-weight:700;font-family:var(--ff-data);cursor:pointer}
  .budcompare{display:flex;flex-direction:column;gap:2px;margin-top:10px;padding:10px 12px;border-radius:12px;font-size:15px}
  .budcompare .bcamt{font-weight:700}
  .budcompare.bfit{background:rgba(95,151,111,.14);color:#5f976f}
  .budcompare.bover{background:var(--clay-soft,rgba(217,138,143,.14));color:var(--clay)}
  .transfer{background:var(--paper2);border:1px dashed var(--clay);border-radius:12px;padding:12px 14px;margin:14px 0 4px}
  .transfer .tlabel{font-family:var(--ff-data);font-size:15px;letter-spacing:1.2px;text-transform:uppercase;color:var(--clay);font-weight:600}
  .transfer .tbody{font-size:14px;margin-top:3px}
  .transfer .troute{display:block;margin-top:7px;font-size:14.5px;font-weight:600;color:var(--teal);text-decoration:none}
  .transfer .troute:hover{text-decoration:underline}
  .nightsbar{background:var(--paper2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:14px 0}
  .nightslbl{font-family:var(--ff-data);font-size:15px;letter-spacing:1.2px;text-transform:uppercase;color:var(--clay);font-weight:600;margin-bottom:6px}
  .nrow{display:flex;align-items:center;justify-content:space-between;padding:5px 0}
  .nrow .ncity{font-size:14px;font-weight:600}
  .nctl{display:flex;align-items:center;gap:10px}
  .nctl .nnum{min-width:20px;text-align:center;font-family:var(--ff-data);font-weight:700}
  .nbtn{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:16px;font-weight:700;cursor:pointer;line-height:1;padding:0}
  .nbtn:hover{border-color:var(--teal)}
  .nbtn:active{transform:translateY(1px)}
  .nnote{font-size:14.5px;color:var(--muted);margin-top:8px;font-style:italic}
  .slot.extra .t{color:var(--teal)}
  .exdel{flex:0 0 auto;width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--muted);font-size:14.5px;line-height:1;cursor:pointer}
  .exdel:hover{border-color:var(--clay);color:var(--clay)}
  .lasttrip{display:flex;align-items:center;gap:10px;margin:16px 0 0;padding:12px 14px;border:1px dashed var(--line);border-radius:12px;background:var(--paper2)}
  .lasttrip .ltxt{flex:1;min-width:0;font-size:15px;color:var(--muted);line-height:1.45}
  .lasttrip .ltxt b{color:var(--ink);font-weight:600}
  .lasttrip .lopen{flex:0 0 auto;padding:8px 13px;border:1px solid var(--teal);border-radius:999px;background:transparent;color:var(--teal);font-size:14.5px;font-weight:600;font-family:var(--ff-body);cursor:pointer}
  .lasttrip .lx{flex:0 0 auto;width:28px;height:28px;padding:0;border:none;border-radius:50%;background:transparent;color:var(--muted);font-size:14px;line-height:1;cursor:pointer}
  .editbar{margin:18px 0 4px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--paper2)}
  .editq{font-size:14.5px;color:var(--ink);margin-bottom:10px;line-height:1.5}
  .editchips{display:flex;flex-wrap:wrap;gap:7px}
  .editchip{padding:8px 13px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink);font-size:15px;font-family:var(--ff-body);cursor:pointer}
  .editchip:hover{border-color:var(--teal);color:var(--teal)}
  .chatfab.dot::after{content:"";position:absolute;top:-2px;right:-2px;width:11px;height:11px;border-radius:50%;background:var(--amber);border:2px solid var(--card)}

  .picpop{position:fixed;z-index:30;max-width:240px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--card);box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .15s}
  .picpop.show{opacity:1}
  .dhint{margin:2px 0 8px;color:var(--muted);font-size:14px;line-height:1.5}
  .rate{display:inline-block;margin-inline-start:6px;padding:1px 7px;border-radius:999px;
    border:1px solid var(--line);color:var(--muted);font-size:14px;font-weight:600;
    font-family:var(--ff-data);vertical-align:2px}
  #app[dir="rtl"] .rate{font-family:var(--ff-body)}
  .rate.good{color:var(--amber-ink);border-color:var(--amber-ink)}
  .rstar{margin-inline-end:3px}
  .arrival{margin:0 0 14px;padding:12px 14px;border:1px solid var(--clay);border-radius:12px;background:var(--paper2)}
  .arrhdr{font-family:var(--ff-data);font-size:14px;letter-spacing:1px;text-transform:uppercase;color:var(--clay);font-weight:700;margin-bottom:6px}
  #app[dir="rtl"] .arrhdr{letter-spacing:normal;font-family:var(--ff-body)}
  .arrlead{font-size:15px;line-height:1.55}
  .arrops{margin:8px 0 0;padding-inline-start:18px}
  .arrops li{font-size:15px;line-height:1.7}
  .arrvia{color:var(--muted)}
  .slot.hotelrow{border-top:none;padding-bottom:12px}
  .slot.hotelrow .t{color:var(--amber-ink)}
  .hotelwarn{margin:0 0 8px;font-size:14px;color:var(--clay)}
  button.menulink{border:none;background:none;padding:0;cursor:pointer;font-family:var(--ff-body)}
  .hotelin{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);font-size:15px;font-family:var(--ff-body)}
  .hotelin:focus{border-color:var(--teal);outline:none}
  .menulink{margin-inline-start:8px;font-size:14px;font-weight:600;color:var(--teal);text-decoration:none;white-space:nowrap}
  .menulink:hover{text-decoration:underline}
  .menulink::before{content:'· ';color:var(--muted);font-weight:400}
  .arrleg{margin-bottom:2px}
  .arrlast{margin-top:8px;font-size:14px;font-weight:600;color:var(--muted)}
  .dayroute{display:block;text-align:center;margin:14px 0 4px;padding:14px;border-radius:12px;font-weight:700;
    font-size:15px;text-decoration:none;color:#241a06;
    background:linear-gradient(100deg,var(--amber) 0%,#f0d489 50%,var(--amber) 100%);box-shadow:var(--shadow)}
  .dayroute:hover{background:var(--teal);color:var(--paper)}
  .dayroute::after{content:' \2192'}
  #app[dir="rtl"] .dayroute::after{content:' \2190'}
  .hop{font-family:var(--ff-data);font-size:14px;color:var(--muted);opacity:.85;white-space:nowrap}
  #app[dir="rtl"] .hop{font-family:var(--ff-body)}
  .hop::before{content:'· '}
  .thinfood{margin:10px 0 2px;padding:10px 12px;border:1px solid var(--clay);border-radius:12px;
    color:var(--clay);font-size:14.5px;line-height:1.5}
  .dhhover{display:none}
  @media (hover:hover) and (pointer:fine){.dhtouch{display:none}.dhhover{display:inline}}
  /* same flex shape as a .slot, so each caption sits exactly over its column of buttons */
  .dcap{display:flex;gap:11px;align-items:flex-end;padding:0 0 4px}
  .dcap .t,.dcap .d{color:var(--muted);font-size:14px;font-weight:600}
  .dcap .t{width:96px;flex-shrink:0}
  .dcap .d{flex:1;min-width:0}
  .dcapw{flex:0 0 auto;width:30px;text-align:center;color:var(--muted);font-size:14px;
    font-weight:600;white-space:nowrap;overflow:visible}
  .dcappic{display:none}                  /* the photo button only exists on touch, so its caption does too */
  @media (hover:none){.dcappic{display:block}}
  .picbtn{display:none;flex:0 0 auto;width:30px;height:30px;padding:0;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--muted);cursor:pointer;align-items:center;justify-content:center;opacity:.75}
  .picbtn svg{width:16px;height:16px}
  .picbtn.on{border-color:var(--teal);color:var(--teal);opacity:1}
  @media (hover:none){.picbtn{display:flex}}
  /* Unlike the photo button this one is never hidden: it is the only thing telling a traveller
     that an unfamiliar name can be explained at all. Hover reads it, tap opens it inline. */
  .infobtn{display:flex;flex:0 0 auto;width:30px;height:30px;padding:0;border:1px solid var(--line);
    border-radius:50%;background:transparent;color:var(--muted);cursor:pointer;
    align-items:center;justify-content:center;opacity:.75;transition:opacity .15s,border-color .15s,color .15s}
  .infobtn svg{width:16px;height:16px}
  .infobtn.dayinfo{width:34px;height:34px}
  .infobtn.dayinfo svg{width:17px;height:17px}
  .infobtn:hover,.infobtn.on{border-color:var(--teal);color:var(--teal);opacity:1}
  /* the visited tick shows everywhere once the trip is live — desktop planners deserve it too */
  .wentbtn{display:flex;border-radius:50%}
  .wentbtn.on{background:var(--teal);border-color:var(--teal);color:#fff;opacity:1}
  .slot.went .d{opacity:.5}
  .slot.went .d>a:first-child{text-decoration:line-through;text-decoration-thickness:1px}
  .svbtn{display:flex}
  .svbtn.on{color:var(--amber-ink);border-color:var(--amber-ink);opacity:1}
  .svbtn.on svg path{fill:var(--amber)}
  .svgroup{margin-bottom:14px}
  .svrow{display:flex;align-items:center;gap:10px;padding:11px 4px;border-bottom:1px solid var(--line);font-size:15px}
  .svrow a{color:var(--ink);text-decoration-color:var(--amber-ink);text-underline-offset:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .svrow:last-child{border-bottom:none}
  .svrow .svarea{color:var(--muted);font-size:13px}
  .svrow .svx{margin-inline-start:auto;background:none;border:none;color:var(--muted);font-size:15px;cursor:pointer;padding:4px 8px}
  .svplan{display:block;width:100%;margin-top:10px;padding:12px;border:1px solid var(--amber);border-radius:12px;background:var(--amber-soft);color:var(--amber-ink);font-weight:700;font-size:14.5px;cursor:pointer}
  .svcatic{display:inline-flex;vertical-align:-3px;margin-inline-end:5px}
  .svcatic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .svrow .svcatic{flex:0 0 auto;color:var(--amber-ink)}
  .svaddrow{display:flex;gap:8px;margin:10px 0}
  .svaddrow input{flex:1;min-width:0;padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--paper2);color:var(--ink);font-size:14.5px}
  .svtoplan{margin-inline-start:auto;padding:7px 10px;border:1px solid var(--amber);border-radius:8px;background:var(--amber-soft);color:var(--amber-ink);font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
  .svmap{flex:0 0 auto;display:inline-flex;color:var(--amber-ink);padding:3px;text-decoration:none!important}
  .svmap svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .svrow:has(.svtoplan) .svx{margin-inline-start:6px}
  .svmiss{color:var(--muted);font-size:12.5px;margin-top:8px;text-align:center}
  .picinline{margin:6px 0 2px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--paper2)}
  .infinline{margin:6px 0 2px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;