/* feat-entry: Entry & safety (web/entry.js). Theme tokens only (var(--ink) …), never literal colours. */
#entry-body{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
.en-tabs{margin:0 0 12px}
.en-tabs .seg-b{min-height:44px}
.en-pane{display:flex;flex-direction:column;gap:12px;min-width:0}
.en-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;min-width:0;overflow-wrap:anywhere}
.en-h{font-size:1.05rem;margin:0 0 8px;color:var(--ink)}
.en-card h3{font-size:1rem;margin:0;color:var(--ink)}
.en-k{color:var(--ink-3);font-size:.85rem;margin-right:8px}

/* passport + destinations */
.en-passport{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.en-passport.is-ask{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px}
.en-passport.is-ask p{margin:0 0 4px;color:var(--ink-2)}
.en-passport .btn.sm{min-height:44px}
.en-sel,.en-in,#entry-body input[type=text].en-in{font-size:16px;font-family:inherit;min-height:44px;padding:8px 10px;border-radius:8px;border:1px solid var(--line);
  background:var(--panel-2);color:var(--ink);max-width:100%;min-width:0;box-sizing:border-box}
.en-passport .en-sel{flex:1 1 180px}
.en-dests{display:flex;flex-direction:column;gap:8px}
.en-chips{display:flex;flex-wrap:wrap;gap:8px}
.en-chip{min-height:44px;padding:8px 14px;border-radius:22px;border:1px solid var(--line);background:var(--panel-2);
  color:var(--ink-2);font:inherit;font-size:.9rem;cursor:pointer}
.en-chip.is-on{background:var(--datum);border-color:var(--datum);color:var(--on-accent);font-weight:600}
.en-add{width:100%}

/* the visa answer */
.en-status{display:inline-block;font-size:1.15rem;font-weight:700;padding:8px 14px;border-radius:10px;
  background:var(--panel-2);border:1px solid var(--line);color:var(--ink)}
.en-st-visa_free,.en-st-own{border-color:var(--ok);color:var(--ok)}
.en-st-visa_on_arrival,.en-st-eta,.en-st-e_visa{border-color:var(--warn);color:var(--ink)}
.en-st-visa_required,.en-st-no_admission{border-color:var(--magenta);color:var(--magenta)}
.en-status.is-disputed{opacity:.75;font-size:1rem;border-style:dashed}
.en-note{margin:10px 0 0;padding:10px;border-radius:8px;border-left:3px solid var(--warn);
  background:color-mix(in srgb,var(--warn) 12%,transparent);color:var(--ink)}
.en-result{display:flex;flex-direction:column;gap:12px}

/* one official system */
.en-sys-h{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.en-rel{flex:none;font-size:.75rem;font-weight:600;padding:3px 8px;border-radius:12px;border:1px solid var(--line);color:var(--ink-2);white-space:nowrap}
.en-rel.is-need{border-color:var(--datum);color:var(--datum)}
.en-rel.is-ok{border-color:var(--ok);color:var(--ok)}
.en-rel.is-dim{color:var(--ink-3)}
.en-why{margin-top:4px}
.en-what{margin:8px 0;color:var(--ink-2)}
.en-dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0 0 12px}
.en-dl dt{color:var(--ink-3);font-size:.85rem}
.en-dl dd{margin:0;color:var(--ink);font-size:.9rem;min-width:0}
.en-go{display:flex;align-items:center;justify-content:center;min-height:44px;text-decoration:none;text-align:center;box-sizing:border-box;width:100%}
.en-warn{margin:10px 0 0;padding:10px;border-radius:8px;font-size:.88rem;color:var(--ink-2);
  background:color-mix(in srgb,var(--magenta) 8%,transparent);border:1px solid color-mix(in srgb,var(--magenta) 25%,transparent)}
.en-warn a{color:var(--datum)}
.en-all{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:0 14px}
.en-all summary{min-height:44px;display:flex;align-items:center;cursor:pointer;color:var(--ink)}
.en-all-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.en-all-t{display:flex;flex-direction:column;min-width:0}
.en-all-t .fine{margin:2px 0 0}
.en-all-row .btn{min-height:44px;display:flex;align-items:center;text-decoration:none;flex:none}

/* alerts */
.en-points{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:6px}
.en-points li{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--ink)}
.en-pk{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px 6px;border-radius:6px;
  background:var(--panel-2);color:var(--ink-3);border:1px solid var(--line)}
.en-card>.btn.sm{min-height:44px}
.en-calm{margin:0;color:var(--ok)}
.en-evs{display:flex;flex-direction:column}
.en-ev{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.en-ev:first-child{border-top:0}
.en-ev-t{min-width:0;flex:1}
.en-ev-t a{color:var(--datum)}
.en-sev{flex:none;font-size:.7rem;font-weight:700;padding:3px 7px;border-radius:6px;border:1px solid var(--line);color:var(--ink-3)}
.en-sev.is-urgent{background:var(--magenta);border-color:var(--magenta);color:var(--on-accent)}
.en-sev.is-warn{border-color:var(--orange);color:var(--orange)}

/* I'm OK */
.en-ok{display:flex;flex-direction:column;gap:10px}
.en-to{margin:0;color:var(--ink-2)}
.en-need{margin:0;color:var(--ink-2)}
.en-big{min-height:96px;width:100%;border-radius:16px;border:0;background:var(--ok);color:var(--on-accent);
  font:inherit;font-size:1.8rem;font-weight:800;letter-spacing:.02em;cursor:pointer}
.en-big:disabled{opacity:.6}
.en-big:focus-visible{outline:3px solid var(--datum);outline-offset:3px}
.en-ok .en-in{width:100%}
.en-chk{display:flex;align-items:center;gap:8px;min-height:44px;color:var(--ink-2);font-size:.9rem;
  text-transform:none;letter-spacing:normal;margin:0}
.en-chk input{width:22px;height:22px;flex:none}
.en-sched{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}
.en-lab{display:flex;flex-direction:column;gap:4px;color:var(--ink-2);font-size:.9rem;text-transform:none;letter-spacing:normal;margin:0}
.en-lab .en-in{width:100%}
.en-card>.btn.primary{min-height:44px;width:100%}
.en-srow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid var(--line);color:var(--ink);font-size:.9rem}
.en-srow .btn{min-height:44px;flex:none}
.en-st-missed{color:var(--magenta)}
.en-st-done{color:var(--ok)}
.en-ci{padding:8px 0;border-top:1px solid var(--line);color:var(--ink)}
.en-ci:first-of-type{border-top:0}
.en-ci.is-missed strong{color:var(--magenta)}
.en-circle{padding:8px 0;border-top:1px solid var(--line)}
.en-circle:first-of-type{border-top:0}
.en-circle .btn{min-height:44px}
.en-code{font-family:ui-monospace,monospace;font-size:1.6rem;font-weight:700;letter-spacing:.12em;margin:10px 0 0;color:var(--ink);user-select:all}
.en-join{display:flex;flex-direction:column;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.en-join .btn{min-height:44px;align-self:flex-start}

/* ---- answers in a pop (pop.js): Entry rules' visa answer ---- */
.en-hint{margin:0}
.pop .en-result{gap:12px}
.pop .en-visa .en-h{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);margin-bottom:10px}

/* ---- Settings → Plan & billing (myplan.js): the total and the button, as a
   bar pinned over the foot of the screen once something is chosen. It
   overrides app.css's sticky card, which on a phone floated a nav's height
   above the view's own bottom, over the plan cards. The page keeps room under
   the last add-on for it (has-bar), and the assistant's round button moves up
   out of its way. --mp-bar is the bar's real height, from myplan.js. ---- */
#myplan .mp-foot{position:fixed;left:0;right:0;z-index:43;
  bottom:max(calc(var(--nav) + var(--safe-b)), var(--kb));
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 12px;
  margin:0;padding:10px 16px 10px;background:var(--panel);color:var(--ink);
  border:0;border-top:1px solid var(--line);border-radius:14px 14px 0 0;
  box-shadow:0 -8px 24px color-mix(in srgb,var(--shadow) 35%,transparent)}
#myplan .mp-foot.is-new{animation:mp-bar-up .2s ease both}
#myplan .mp-sum{display:flex;flex-direction:column;min-width:0}
#myplan .mp-sum .mp-total{font-size:1.25rem;line-height:1.2}
#myplan .mp-sum .fine{margin:0}
#myplan .mp-foot>.btn{min-height:44px;white-space:nowrap}
#myplan .mp-foot-note{grid-column:1/-1;margin:0;font-size:.78rem}
#myplan.has-bar{padding-bottom:calc(var(--mp-bar,120px) + 16px)}
@media (max-width:899px){
  html:has(#view-settings.is-active .set-pane.is-on .mp-foot) #ai-fab:not(.is-moved){
    bottom:calc(var(--ai-bottom) + var(--mp-bar,120px) + 8px)}
}
@keyframes mp-bar-up{from{transform:translateY(100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){#myplan .mp-foot.is-new{animation:none}}
/* Wide screens have no bottom nav and a content column beside the sidebar:
   the bar rides at the bottom of that column instead, as a card. */
@media (min-width:900px){
  #myplan .mp-foot{position:sticky;left:auto;right:auto;bottom:16px;
    border:1px solid var(--line);border-radius:14px;padding:12px 16px}
  #myplan.has-bar{padding-bottom:0}
  /* The assistant's button stands at bottom:22px here, over the card's note. */
  html:has(#view-settings.is-active .set-pane.is-on .mp-foot) #ai-fab:not(.is-moved){
    bottom:calc(22px + var(--mp-bar,100px) + 16px)}
}
