/* ==========================================================================
   Saved in the folio (group 9, 2026-10-05): the Saved, SavedMap, AddPlace, PutOnDay, SavedEdit and SavedImport boards.
   The page is .sv-page; its sheets wear the Add a country frame (.ac, 81-folio-register.css) with .sv-sheet for
   Saved's own rows; the import is a page of its own over it (.sv-import).
   ========================================================================== */

.sv-page.active { min-height: 100vh; min-height: 100dvh; background: var(--fo-paper); color: var(--fo-ink); font-family: var(--fo-sans); padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 110px); }

/* On a map · SAVED · Add — Add in the red, the one act that adds to the record (the board). */
.sv-page .sv-bar { position: sticky; top: 0; z-index: 3; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 12px; height: 44px; padding: env(safe-area-inset-top, 0px) var(--fo-gutter) 0; background: var(--fo-paper); border-bottom: 1px dashed var(--fo-hair); }
.sv-page .sv-bar__word { justify-self: start; min-height: 44px; padding: 0; border: none; background: none; font: inherit; font-size: 14px; color: var(--fo-ink); cursor: pointer; }
.sv-page .sv-bar__word.is-add { justify-self: end; color: var(--fo-red); text-decoration: underline; text-underline-offset: 3px; }
.sv-page .sv-bar__title { margin: 0; font-family: var(--fo-mono); font-size: 10px; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; }

.sv-page .sv-tools { padding: 16px var(--fo-gutter) 0; display: flex; flex-direction: column; gap: 12px; }
.sv-page .sv-tools[hidden] { display: none; }
.sv-page .sv-tools.is-map { padding-bottom: 12px; }
.sv-page .sv-tools.is-map .sv-find { display: none; }
.sv-page .sv-chips-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.sv-page .sv-chips, .sv-sheet .sv-kinds { display: flex; flex-wrap: wrap; gap: 6px; }
.sv-page .sv-count { font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); white-space: nowrap; }
.sv-page .sv-chip, .sv-sheet .sv-chip { height: 32px; padding: 0 12px; border: 1px solid var(--fo-rule); background: transparent; font-family: var(--fo-sans); font-size: 12px; font-weight: 500; color: var(--fo-ink); cursor: pointer; }
.sv-sheet .sv-chip.is-small { height: 30px; padding: 0 10px; }
.sv-page .sv-chip.is-on, .sv-sheet .sv-chip.is-on { border-color: var(--fo-ink); background: var(--fo-ink); color: var(--fo-card); }

/* The groups and their rows (the Saved board). */
.sv-page .sv-group-head { display: flex; justify-content: space-between; margin: 22px var(--fo-gutter) 10px; font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; }
.sv-page .sv-group-when { color: var(--fo-graphite); }
.sv-page .sv-group { margin: 0 var(--fo-gutter); border: 1px solid var(--fo-rule); background: var(--fo-band); }
.sv-page .sv-slot { position: relative; overflow: hidden; }
.sv-page .sv-slot + .sv-slot { border-top: 1px solid var(--fo-rule); }
.sv-page .sv-under { position: absolute; inset: 0; display: flex; justify-content: space-between; align-items: center; padding: 0 16px; background: var(--fo-ink); color: var(--fo-card); font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; opacity: 0; }
.sv-page .sv-slot.is-swiping .sv-under { opacity: 1; }
.sv-page .sv-row { position: relative; background: var(--fo-band); touch-action: pan-y; }
.sv-page .sv-row.is-open { background: var(--fo-card); }
.sv-page .sv-row__head { width: 100%; min-height: 46px; padding: 10px 16px; border: none; background: transparent; display: flex; justify-content: space-between; align-items: center; gap: 12px; text-align: left; cursor: pointer; color: var(--fo-ink); }
.sv-page .sv-row__name { font-family: var(--fo-serif); font-size: 16px; line-height: 1.25; }
.sv-page .sv-row__end { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.sv-page .sv-row__sign { width: 12px; text-align: center; font-size: 14px; color: var(--fo-graphite); }
.sv-page .sv-tag { height: 22px; padding: 0 8px; display: inline-flex; align-items: center; box-sizing: border-box; font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; }
.sv-page .sv-tag.is-someday { border: 1px dashed var(--fo-hair-open); color: var(--fo-graphite); }
.sv-page .sv-tag.is-next { border: 1px solid var(--fo-ink); color: var(--fo-ink); }
.sv-page .sv-tag.is-been { background: var(--fo-rule); color: var(--fo-graphite); }
.sv-page .sv-row__more { padding: 0 16px 14px; display: flex; flex-direction: column; gap: 8px; }
.sv-page .sv-row__kind { font-size: 12px; color: var(--fo-graphite); }
.sv-page .sv-row__when { font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-page .sv-row__when.is-next { color: var(--fo-ink); }
.sv-page .sv-row__whenrow { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.sv-page .sv-row__note { margin: 2px 0 0; font-family: var(--fo-serif); font-style: italic; font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
.sv-page .sv-row__link { display: flex; align-items: baseline; gap: 8px; }
.sv-page .sv-row__host { font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-page .sv-row__acts { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 2px; }
.sv-page .sv-row__words { display: flex; gap: 18px; align-items: center; }
.sv-page .sv-foot-note { margin: 18px var(--fo-gutter) 0; font-size: 12px; line-height: 1.5; color: var(--fo-graphite); }

/* Words and buttons, shared by the page, its sheets and the import. */
.sv-page .sv-link, .sv-sheet .sv-link, .sv-import .sv-link { min-height: 32px; padding: 0; border: none; background: none; font: inherit; font-size: 12px; color: var(--fo-ink); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.sv-page .sv-word-quiet { min-height: 44px; padding: 0; border: none; background: none; font: inherit; font-size: 12px; color: var(--fo-graphite); cursor: pointer; }
.sv-page .sv-btn, .sv-sheet .sv-btn, .sv-import .sv-btn { height: 44px; padding: 0 18px; border: 1px solid var(--fo-ink); background: var(--fo-ink); font-family: var(--fo-sans); font-size: 14px; font-weight: 500; color: var(--fo-card); cursor: pointer; }
.sv-page .sv-btn.is-small { height: 36px; padding: 0 14px; font-size: 12px; }
.sv-page .sv-btn.is-line, .sv-sheet .sv-btn.is-line, .sv-import .sv-btn.is-line { border-color: var(--fo-edge); background: transparent; color: var(--fo-ink); }
.sv-import .sv-btn.is-wide { width: 100%; height: 52px; font-size: 16px; }
.sv-import .sv-btn[disabled] { border-color: var(--fo-rule); background: var(--fo-rule); color: var(--fo-pale); cursor: default; }

/* Said, not shown: empty, nothing matching, could not be read, reading. */
.sv-page .sv-say, .sv-page .sv-empty, .sv-page .sv-wait { margin: 24px var(--fo-gutter) 0; display: flex; flex-direction: column; gap: 10px; }
.sv-page .sv-say__big, .sv-import .sv-say__big, .sv-sheet .sv-say__big { margin: 0; font-family: var(--fo-serif); font-style: italic; font-size: 16px; line-height: 1.35; }
.sv-page .sv-say__line, .sv-import .sv-say__line { margin: 0; font-size: 12px; line-height: 1.5; color: var(--fo-graphite); }
.sv-page .sv-say__ways, .sv-page .sv-empty__ways { display: flex; gap: 18px; align-items: center; }
.sv-page .sv-empty__ways { gap: 8px; }
.sv-page .sv-bones { display: flex; flex-direction: column; }
.sv-page .sv-bones span { height: 52px; display: flex; align-items: center; border-bottom: 1px dashed var(--fo-hair); }
.sv-page .sv-bones i { height: 10px; background: var(--fo-band); }
.sv-page .sv-wait .sv-bones i { animation: sv-breathe 1.6s ease-in-out infinite alternate; }
.sv-page .sv-wait__word { margin: 4px 0 0; display: flex; flex-direction: column; gap: 6px; font-family: var(--fo-serif); font-style: italic; font-size: 16px; }
.sv-page .sv-wait__word span, .sv-page .sv-wait__word.is-late { font-family: var(--fo-sans); font-style: normal; font-size: 12px; color: var(--fo-graphite); }
.sv-page .sv-wait.is-late .sv-wait__word.is-soon, .sv-page .sv-wait:not(.is-late) .sv-wait__word.is-late { display: none; }
@keyframes sv-breathe { from { opacity: 1; } to { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .sv-page .sv-wait .sv-bones i { animation: none; } }

/* On a map (the SavedMap board): the chips over it, the legend at its top right, a picked place in a card. */
/* The map to the foot of the screen, the tabs over it (owner, 2026-10-05: 没有拉到和屏幕一样高). */
.sv-page.active.is-map { height: 100vh; height: 100dvh; min-height: 0; padding-bottom: 0; display: flex; flex-direction: column; overflow: hidden; }
.sv-page .sv-map-wrap { position: relative; flex: 1; min-height: 0; }
.sv-page .sv-map-wrap[hidden] { display: none; }
.sv-page .sv-map { position: absolute; inset: 0; background: var(--fo-band); }
.sv-page .sv-map__say { margin: 24px var(--fo-gutter); font-family: var(--fo-serif); font-style: italic; font-size: 14px; }
/* The legend at the lower left, as the journey's map has it (owner, 2026-10-05), over the tabs; it steps aside for a picked place. */
.sv-page .sv-legend { position: absolute; left: var(--fo-gutter); bottom: calc(96px + env(safe-area-inset-bottom, 0px)); z-index: 2; padding: 8px 10px; display: flex; flex-direction: column; gap: 5px; border: 1px solid var(--fo-rule); background: rgba(253,252,250,0.9); font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-page .sv-map-wrap:has(.sv-pick:not([hidden])) .sv-legend, .sv-page .sv-map-wrap:has(.sv-pick:not([hidden])) .sv-off { display: none; }
.sv-page .sv-map-wrap:has(.sv-off:not([hidden])) .sv-legend { bottom: calc(140px + env(safe-area-inset-bottom, 0px)); }
/* The places not yet on the map lead back to the list (the SavedMap board). */
.sv-page .sv-off { position: absolute; left: var(--fo-gutter); bottom: calc(96px + env(safe-area-inset-bottom, 0px)); z-index: 2; height: 36px; padding: 0 12px; display: inline-flex; align-items: center; gap: 8px; border: 1px dashed var(--fo-hair-open); background: rgba(253,252,250,0.92); font-family: var(--fo-sans); font-size: 12px; color: var(--fo-ink); cursor: pointer; }
.sv-page .sv-off[hidden] { display: none; }
.sv-page .sv-off span { color: var(--fo-pale); }
.sv-page .sv-legend span { display: flex; align-items: center; gap: 8px; }
.sv-page .sv-legend i { width: 10px; height: 10px; border-radius: 50%; box-sizing: border-box; }
.sv-page .sv-legend i.is-someday { border: 1.5px solid var(--fo-ink); background: var(--fo-card); }
.sv-page .sv-legend i.is-next { background: var(--fo-ink); }
.sv-page .sv-legend i.is-been { background: var(--fo-pale); }
.sv-page .sv-pick { position: absolute; left: var(--fo-gutter); right: var(--fo-gutter); bottom: calc(96px + env(safe-area-inset-bottom, 0px)); z-index: 2; display: flex; flex-direction: column; gap: 8px; background: rgba(253,252,250,0.97); }
.sv-page .sv-pick[hidden] { display: none; }
.sv-page .sv-pick__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.sv-page .sv-pick__name { font-family: var(--fo-serif); font-size: 16px; }
.sv-page .sv-pick__line { margin: 0; font-size: 12px; color: var(--fo-graphite); }
.sv-page .sv-pick__acts { display: flex; justify-content: space-between; align-items: center; gap: 12px; }

/* The sheets' own rows, in the Add a country frame. */
.sv-sheet .sv-sheet__body { gap: 10px; }
.sv-sheet .sv-search-box { position: relative; display: block; }
.sv-sheet .sv-search-box svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--fo-graphite); pointer-events: none; }
.sv-sheet .ac-input.sv-has-glass { width: 100%; padding-left: 34px; }
.sv-sheet .sv-suggest { margin-top: -10px; }
.sv-sheet .sv-suggest .place-suggestion { padding: 10px 12px; border-bottom: 1px dashed var(--fo-hair); font-size: 14px; color: var(--fo-ink); cursor: pointer; }
.sv-sheet .sv-suggest .place-suggestion:last-child { border-bottom: none; }
.sv-sheet .sv-link-row { display: flex; gap: 8px; }
.sv-sheet .sv-link-row .ac-input { flex: 1; min-width: 0; }
.sv-sheet .sv-link-row .sv-btn { flex-shrink: 0; }
.sv-sheet .sv-busy { margin: 0; font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-sheet .sv-found { margin-top: 8px; padding: 12px 14px; border: 1px solid var(--fo-rule); background: var(--fo-card); display: flex; flex-direction: column; gap: 6px; }
.sv-sheet .sv-found__from { font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-sheet .sv-found__name { font-family: var(--fo-serif); font-size: 16px; line-height: 1.1; }
.sv-sheet .sv-found__line { font-size: 12px; color: var(--fo-graphite); }
.sv-sheet .sv-found .sv-kinds { margin-top: 6px; }
.sv-sheet .sv-found__label { margin-top: 6px; padding-top: 10px; border-top: 1px dashed var(--fo-hair); font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-sheet .sv-note-in { height: 36px; padding: 0; border: none; border-bottom: 1px solid var(--fo-rule); background: transparent; font-family: var(--fo-serif); font-style: italic; font-size: 16px; color: var(--fo-ink); outline: none; }
.sv-sheet .sv-note-in:focus { border-bottom-color: var(--fo-ink); }
.sv-sheet .sv-note-in::placeholder { color: var(--fo-pale); }
/* While the answers are under the box, the lines about links and files step aside for them (the board, typing). */
.sv-sheet:has(.sv-suggest[style*="block"]) .ac-help, .sv-sheet:has(.sv-suggest[style*="block"]) .sv-sheet__more { display: none; }
.sv-sheet .sv-sheet__more { margin-top: 12px; text-align: center; font-size: 12px; color: var(--fo-graphite); }
.sv-sheet .sv-sheet__head { display: flex; flex-direction: column; gap: 4px; }
.sv-sheet .sv-sheet__name { font-family: var(--fo-serif); font-size: 16px; line-height: 1.1; }
.sv-sheet .sv-sheet__lead { font-size: 12px; color: var(--fo-graphite); }
.sv-sheet .sv-trips { display: flex; flex-direction: column; border: 1px solid var(--fo-rule); background: var(--fo-band); }
.sv-sheet .sv-trip { width: 100%; min-height: 56px; padding: 10px 14px; border: none; background: transparent; display: flex; justify-content: space-between; align-items: center; gap: 12px; text-align: left; cursor: pointer; color: var(--fo-ink); }
.sv-sheet .sv-trip + .sv-trip { border-top: 1px solid var(--fo-rule); }
.sv-sheet .sv-trip__text, .sv-sheet .sv-day__text { display: flex; flex-direction: column; gap: 3px; }
.sv-sheet .sv-trip__name { font-family: var(--fo-serif); font-size: 16px; }
.sv-sheet .sv-trip__dates { font-size: 12px; color: var(--fo-graphite); }
.sv-sheet .sv-trip__now { height: 22px; padding: 0 8px; display: inline-flex; align-items: center; border: 1px solid var(--fo-red); font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-red); }
.sv-sheet .sv-days-head { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 8px; border-bottom: 1px dashed var(--fo-hair); font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; }
.sv-sheet .sv-days { max-height: 380px; overflow-y: auto; scrollbar-width: none; }
.sv-sheet .sv-day { width: 100%; min-height: 52px; padding: 8px 0; border: none; border-bottom: 1px dashed var(--fo-hair); background: transparent; display: flex; justify-content: space-between; align-items: center; gap: 12px; text-align: left; cursor: pointer; color: var(--fo-ink); }
.sv-sheet .sv-day.is-on { padding: 8px 10px; background: var(--fo-card); }
.sv-sheet .sv-day.is-past { color: var(--fo-pale); cursor: default; }
.sv-sheet .sv-day__date { font-size: 14px; }
.sv-sheet .sv-day__where, .sv-sheet .sv-day__mark { font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-sheet .sv-day__mark.is-on, .sv-sheet .sv-day__mark.is-now { height: 22px; padding: 0 8px; display: inline-flex; align-items: center; }
.sv-sheet .sv-day__mark.is-on { border: 1px solid var(--fo-ink); color: var(--fo-ink); }
.sv-sheet .sv-day__mark.is-now { background: var(--fo-rule); }
.sv-sheet .sv-save { justify-self: end; color: var(--fo-red); text-decoration: underline; text-underline-offset: 3px; }
.sv-sheet .sv-edit { display: flex; flex-direction: column; gap: 6px; padding-bottom: 10px; border-bottom: 1px dashed var(--fo-hair); }
.sv-sheet .sv-edit.is-last { border-bottom: none; padding-top: 6px; align-items: flex-start; }
.sv-sheet .sv-edit .ac-label { margin-top: 0; }
.sv-sheet .sv-edit__in { height: 32px; padding: 0; border: none; background: transparent; font-family: var(--fo-sans); font-size: 16px; color: var(--fo-ink); outline: none; }
.sv-sheet .sv-edit__in.is-name { font-family: var(--fo-serif); }
.sv-sheet .sv-edit__in.is-note { font-family: var(--fo-serif); font-style: italic; }
.sv-sheet .sv-edit__in.is-link { font-size: 12px; color: var(--fo-graphite); }
.sv-sheet .sv-edit__in::placeholder { color: var(--fo-pale); }
.sv-sheet .sv-edit__text { font-size: 16px; line-height: 1.4; }
.sv-sheet .sv-link.is-small { align-self: flex-start; min-height: 28px; }
.sv-sheet .sv-select { position: relative; display: flex; align-items: center; }
.sv-sheet .sv-select select { width: 100%; height: 32px; padding: 0 24px 0 0; border: none; background: transparent; font-family: var(--fo-sans); font-size: 16px; color: var(--fo-ink); -webkit-appearance: none; appearance: none; outline: none; }
.sv-sheet .sv-select svg { position: absolute; right: 0; pointer-events: none; }

/* Import (the SavedImport board): a page over Saved. */
.sv-import { position: fixed; inset: 0; z-index: 820; display: none; flex-direction: column; background: var(--fo-paper); color: var(--fo-ink); font-family: var(--fo-sans); }
.sv-import.is-open { display: flex; }
.sv-import .sv-import__bar { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; height: 44px; padding: env(safe-area-inset-top, 0px) var(--fo-gutter) 0; border-bottom: 1px dashed var(--fo-hair); }
.sv-import .sv-import__word { justify-self: start; min-height: 44px; padding: 0; border: none; background: none; font: inherit; font-size: 14px; color: var(--fo-ink); cursor: pointer; }
.sv-import .sv-import__head { font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; }
.sv-import .sv-import__body { flex: 1; min-height: 0; overflow-y: auto; padding: 16px var(--fo-gutter) 24px; display: flex; flex-direction: column; gap: 12px; }
.sv-import .sv-import__body > * { flex-shrink: 0; }
.sv-import .sv-import__title { margin: 0; font-family: var(--fo-serif); font-size: 24px; font-weight: 400; line-height: 1.15; }
.sv-import .sv-import__ways { display: flex; flex-direction: column; border-top: 1px dashed var(--fo-hair); }
.sv-import .sv-import__way { padding: 12px 0; display: flex; flex-direction: column; gap: 4px; border-bottom: 1px dashed var(--fo-hair); }
.sv-import .sv-import__way-name { font-family: var(--fo-serif); font-size: 16px; }
.sv-import .sv-import__way-line { font-size: 12px; line-height: 1.5; color: var(--fo-graphite); }
.sv-import .sv-import__note, .sv-import .sv-import__sub { margin: 0; font-size: 12px; line-height: 1.5; color: var(--fo-graphite); }
.sv-import .sv-import__file, .sv-import .sv-import__more, .sv-import .sv-import__later { font-family: var(--fo-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fo-graphite); }
.sv-import .sv-import__later { height: 22px; padding: 0 8px; display: inline-flex; align-items: center; flex-shrink: 0; border: 1px dashed var(--fo-hair-open); }
.sv-import .sv-import__dupes { min-height: 44px; padding: 0; border: none; border-top: 1px dashed var(--fo-hair); border-bottom: 1px dashed var(--fo-hair); background: none; display: flex; justify-content: space-between; align-items: center; font: inherit; font-size: 12px; color: var(--fo-graphite); cursor: pointer; }
.sv-import .sv-import__list { display: flex; flex-direction: column; }
.sv-import .sv-import__row { min-height: 44px; padding: 6px 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px dashed var(--fo-hair); }
.sv-import .sv-import__text { display: flex; flex-direction: column; gap: 2px; }
.sv-import .sv-import__name { font-size: 14px; }
.sv-import .sv-import__where { font-size: 12px; color: var(--fo-graphite); }
.sv-import .sv-import__foot { padding: 10px var(--fo-gutter) max(calc(env(safe-area-inset-bottom, 0px) + 8px), 34px); }
.sv-import .sv-import__done { margin-top: 8px; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.sv-import .sv-import__acts { display: flex; gap: 8px; margin: 4px 0; }
.sv-import .sv-import__small { font-size: 10px; color: var(--fo-pale); }
