/* Dorax Finance — a panel opened from the summary "Bosque" with its light sheet (features/phone/bosque-sheet.js: bqSheet), as Transactions and the
   account's panel (owner, 2026-10-12: "me gustó esa combinación, úsala más seguido"): the panel is forest from its top down to where its sheet starts,
   its name and the round close button light on it, its words white (#B5C2BE when quieter), its switches lime when chosen, its main button lime and
   the others light on the forest; the sheet is the summary's grey with a handle, rounded at the top, its lists in white cards; the buttons at the
   foot on the same grey. The notifications, More, "You can spend", the days of freedom and a fixed cost's details. */
/* (v199: on a phone and on a computer; look-land-desk.css fits them to a computer) */
  /* ---------- the forest part ---------- */
  :root.land #overlay .drawer:has(.bq-sheet), :root.land #overlay .sheet:has(.bq-sheet) {
    --ink: var(--lk-on); --ink-strong: #FFFFFF; --ink-2: var(--lk-soft); --ink-3: var(--lk-soft-2); --line: rgba(255, 255, 255, .14); --line-strong: rgba(255, 255, 255, .24);
    --surface: rgba(255, 255, 255, .06); --surface-2: rgba(255, 255, 255, .08); --surface-3: rgba(255, 255, 255, .12); --well: rgba(255, 255, 255, .06); --badge: rgba(255, 255, 255, .1);
    --track: rgba(255, 255, 255, .14); --switch-on: var(--lk-lime); --switch-off: rgba(255, 255, 255, .16); --field: rgba(255, 255, 255, .22); --knob: #FFFFFF; --hover-line: rgba(255, 255, 255, .45);
    --pos: var(--lk-lime); --good: var(--lk-lime); --crit: #FF8A80; --warn: #F5C04A; --brand: var(--lk-lime); --brand-deep: var(--lk-lime); --link: var(--lk-lime); --focus: var(--lk-lime); --select: rgba(var(--lk-lime-rgb), .16); --select-ink: var(--lk-lime);
    border: 0; background: var(--lk-deep); color: #FFFFFF;
  }
  :root.land #overlay .drawer:has(.bq-sheet) > header h2 { color: #FFFFFF; }
  :root.land #overlay .drawer:has(.bq-sheet) > header [data-a="close"] { background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); color: #FFFFFF; }
  :root.land #overlay .drawer:has(.bq-sheet) > header [data-a="close"]:focus-visible { outline: 2px solid var(--lk-lime); outline-offset: 2px; }
  :root.land #overlay :is(.drawer, .sheet):has(.bq-sheet) > .grab::before { display: none; }      /* v305: no handle, as the sheet under it (v303); a drag down from the top still closes the panel */
  @media (max-width: 920px) { :root.land #overlay :is(.drawer, .sheet):has(.bq-sheet) { border-radius: 0; } }      /* v305: on a phone square at the top too (a computer's panel floats, its corners round) */
  /* on the forest: the buttons that are not the main one light pills, a switch's choice lime, a field translucent */
  :root.land #overlay :is(.drawer .body, .sheet):has(> .bq-sheet) > :not(.bq-sheet) .btn:not(.primary):not(.danger):not(.ghost):not(.linkbtn),
  :root.land #overlay :is(.drawer .body, .sheet):has(> .bq-sheet) > .btn:not(.primary):not(.danger):not(.ghost):not(.linkbtn) { border-color: rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .1); color: #FFFFFF; }
  :root.land #overlay :is(.drawer .body, .sheet):has(> .bq-sheet) > :not(.bq-sheet) .seg { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .12); }
  :root.land #overlay :is(.drawer .body, .sheet):has(> .bq-sheet) > :not(.bq-sheet) .seg button { color: var(--lk-soft); }
  :root.land #overlay :is(.drawer .body, .sheet):has(> .bq-sheet) > :not(.bq-sheet) .seg button[aria-pressed="true"],
  :root.land #overlay :is(.drawer .body, .sheet):has(> .bq-sheet) > :not(.bq-sheet) .seg button[aria-pressed="true"]:hover { background: var(--lk-lime); color: var(--lk-deep); }

  /* ---------- the sheet ---------- */
  :root.land #overlay .bq-sheet {
    --ink: var(--bq-ink); --ink-strong: var(--bq-ink); --ink-2: var(--bq-ink-2); --ink-3: var(--bq-ink-3); --line: var(--bq-line); --line-strong: var(--bq-line-2);
    --surface: var(--bq-card); --surface-2: var(--bq-card-2); --surface-3: var(--bq-card-3); --well: var(--bq-card); --badge: var(--bq-card-3); --track: var(--bq-track);
    --switch-on: var(--bq-accent); --switch-off: var(--bq-grab); --field: var(--bq-line-2); --knob: #FFFFFF; --hover-line: var(--lk-soft-2);
    --pos: var(--bq-in); --good: var(--bq-in); --crit: var(--bq-crit); --warn: var(--bq-warn); --brand: var(--bq-accent); --brand-deep: var(--bq-accent); --link: var(--bq-accent); --focus: var(--bq-accent); --select: var(--bq-mint); --select-ink: var(--bq-accent);
    position: relative; display: flex; flex-direction: column; gap: 16px; flex: 1 0 auto; margin: 6px -16px -16px; padding: 20px 16px 24px;
    border-radius: 0; background: var(--bq-page); color: var(--bq-ink);  /* v303 (owner, 2026-10-27: "quita esos bordes redondeados y el icono de barrita"): square at the top, no handle */
  }
  :root.land #overlay .sheet .bq-sheet { margin: 10px -12px calc(-18px - var(--safe-b)); padding: 20px 12px calc(18px + var(--safe-b)); }
  :root.land #overlay .bq-sheet > .bq-grab { display: none; }      /* v303 (owner, 2026-10-27: "quita esos bordes redondeados y el icono de barrita"): square at the top, no handle */
  /* the buttons at the foot of a panel with a sheet: on the sheet's grey */
  :root.land #overlay .drawer:has(.bq-sheet) > footer {
    --ink: var(--bq-ink); --ink-strong: var(--bq-ink); --ink-2: var(--bq-ink-2); --ink-3: var(--bq-ink-3); --line: var(--bq-line); --brand: var(--lk-deep); --link: var(--lk-deep); --focus: var(--lk-deep); --crit: var(--bq-crit);
    background: var(--bq-page); color: var(--bq-ink);
  }

  /* ---------- the notifications: their switch on the forest; each group a white card in the sheet ---------- */
  :root.land #overlay .bq-sheet .rem-group { display: flex; flex-direction: column; padding: 4px 14px; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); }
  :root.land #overlay .bq-sheet .rem-group > h3 { margin: 12px 0 2px; }
  :root.land #overlay .bq-sheet .rem-group .list { border: 0; }
  :root.land #overlay .bq-sheet > .empty, :root.land #overlay .bq-sheet > .banner { margin: 0; border: 0; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); }

  /* ---------- More (v305; owner, 2026-10-27, the canvas "Barra de abajo: antes y después": "bien, publícalas"): the person and a button to close
     on the forest; on the dark part the search, "Your money" as tiles, the other groups as rows with no card round them, the account's actions as
     rows too (logging out in red), the networks and the terms at the foot ---------- */
  :root.land #overlay .sheet:has(.bq-sheet) .mr-top { display: flex; align-items: center; gap: 10px; margin: 6px 0 4px; }
  :root.land #overlay .sheet:has(.bq-sheet) .mr-top .mr-me { flex: 1 1 auto; min-width: 0; margin: 0; padding: 6px 4px; }
  :root.land #overlay .sheet:has(.bq-sheet) .mr-top .mr-me .mr-chev { display: none; }
  :root.land #overlay .sheet:has(.bq-sheet) .mr-me .mr-who small { color: var(--lk-soft); }
  :root.land #overlay .sheet:has(.bq-sheet) .mr-x { all: unset; box-sizing: border-box; flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); color: #FFFFFF; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  :root.land #overlay .sheet:has(.bq-sheet) .mr-x svg { width: 16px; height: 16px; }
  :root.land #overlay .sheet:has(.bq-sheet) .mr-x:focus-visible { outline: 2px solid var(--lk-lime); outline-offset: 2px; }
  :root.land #overlay .bq-sheet .sheet-find { min-height: 50px; margin: 0; border: 0; border-radius: 999px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); color: var(--bq-ink-3); font-size: 15px; }
  :root.land #overlay .bq-sheet .mr-nav { display: flex; flex-direction: column; gap: 22px; }
  :root.land #overlay .bq-sheet .mr-group { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
  :root.land #overlay .bq-sheet .mr-group + .mr-group, :root.land #overlay .bq-sheet .mr-nav + .mr-help { margin-top: 0; padding-top: 0; border-top: 0; }
  :root.land #overlay .bq-sheet .mr-h, :root.land #overlay .bq-sheet .mr-nav > .mr-group:first-child .mr-h { margin: 0 0 6px; padding: 0; color: var(--bq-ink-3); font-size: 12px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
  :root.land #overlay .bq-sheet .mr-group > a, :root.land #overlay .bq-sheet .mr-group > .mr-pick, :root.land #overlay .bq-sheet .mr-help > .mr-row { min-height: 56px; padding: 0 2px; border-radius: 0; color: var(--bq-ink); font-size: 15.5px; }
  :root.land #overlay .bq-sheet .mr-group > :is(a, .mr-pick, .mr-row) + :is(a, .mr-pick, .mr-row) { border-top: 1px solid var(--bq-line); }
  :root.land #overlay .bq-sheet .mr-group > a svg, :root.land #overlay .bq-sheet .mr-pick .mr-ic, :root.land #overlay .bq-sheet .mr-help .mr-ic { color: var(--bq-ink-2); }
  :root.land #overlay .bq-sheet .mr-help { padding: 0; }
  /* "Your money": three to a row, each its icon on a lime-tinted circle and its name; the pending count and "Beta" in the corner */
  :root.land #overlay .bq-sheet .mr-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  :root.land #overlay .bq-sheet .mr-grid > a { position: relative; box-sizing: border-box; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 10px; min-width: 0; min-height: 104px; height: auto; padding: 12px 10px 12px 12px;
    border: 0; border-radius: 20px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); color: var(--bq-ink); font-size: 12.5px; font-weight: 600; line-height: 1.2; letter-spacing: -.005em; text-decoration: none; -webkit-tap-highlight-color: transparent; transition: transform var(--t1) ease-out; }
  :root.land #overlay .bq-sheet .mr-grid > a:active { transform: scale(.96); }
  :root.land #overlay .bq-sheet .mr-grid > a > svg:first-child { box-sizing: content-box; width: 19px; height: 19px; padding: 10.5px; border-radius: 50%; background: var(--bq-circle); color: var(--bq-accent); }
  :root.land #overlay .bq-sheet .mr-grid > a > span:not(.count):not(.beta-tag) { max-width: 100%; overflow-wrap: anywhere; }
  :root.land #overlay .bq-sheet .mr-grid > a :is(.count, .beta-tag) { position: absolute; top: 12px; right: 10px; margin: 0; }
  :root.land #overlay .bq-sheet .mr-grid > a[aria-current="page"] { box-shadow: inset 0 0 0 1.5px var(--bq-accent); }
  :root.land #overlay .bq-sheet .mr-grid > a:focus-visible { outline: 2px solid var(--bq-accent); outline-offset: 2px; }
  :root.land #overlay .bq-sheet .mr-tiles .sheet-desk { margin-top: 10px; padding: 0 2px; }
  /* the account's own actions as rows, logging out in red, not two big buttons */
  :root.land #overlay .bq-sheet .mr-acts { gap: 0; margin-top: -10px; }
  :root.land #overlay .bq-sheet .mr-btn { justify-content: flex-start; min-height: 56px; padding: 0 2px; border-radius: 0; border-top: 1px solid var(--bq-line); background: none; color: var(--bq-ink); font-size: 15.5px; font-weight: 500; }
  :root.land #overlay .bq-sheet .mr-btn.out { color: var(--bq-crit); font-weight: 600; }

  /* ---------- "You can spend": the figure and the bar on the forest; how it is worked out in the sheet, in a white card ---------- */
  :root.land #overlay .fu-view > .fu-big, :root.land #overlay .fu-view > .fu-say { color: #FFFFFF; }
  :root.land #overlay .fu-view > .fu-say { color: var(--lk-soft); }
  :root.land #overlay .bq-sheet .fu-h { margin: 6px 0 -6px; }
  :root.land #overlay .bq-sheet .fu-steps { padding: 4px 14px; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); }

  /* ---------- the days of freedom: the figure, the sentence and the track on the forest; how it is worked out in the sheet ---------- */
  :root.land #overlay .rw-view .rw-in, :root.land #overlay .rw-view .card-b { background: none; border: 0; padding: 0; }
  :root.land #overlay .rw-view .rw-say b, :root.land #overlay .rw-view .rw-cheer { color: #FFFFFF; }
  :root.land #overlay .bq-sheet > .note { margin: 0; padding: 16px; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); color: var(--bq-ink-2); line-height: 1.5; }

  /* ---------- a fixed cost: what it is, this month, the year and its buttons on the forest; its payments in the sheet ---------- */
  :root.land #overlay .bq-sheet .lv-rows { padding: 0 16px; border: 0; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); }      /* v300: its facts, one card of rows */
  :root.land #overlay .bq-sheet .lv-rows > .lv-row:last-child { border-bottom: 0; }
  :root.land #overlay .bq-sheet > .lv-note { padding: 0 6px; background: none; box-shadow: none; color: var(--bq-ink-3); font-size: 12.5px; line-height: 1.45; }      /* a line under them, not a card */
  :root.land #overlay .bq-sheet .lv-pays { padding: 4px 14px 8px; border: 0; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); }
  :root.land #overlay .bq-sheet .lv-pays-h { display: block; margin: 12px 0 2px; color: var(--bq-ink); font-size: 17px; font-weight: 600; }
  :root.land #overlay .bq-sheet .lv-pays .list { border: 0; }
  /* each payment: the account and what it was on top, the date under it, the amount and its button on the right */
  :root.land #overlay .bq-sheet .lv-pays .li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "g n b" "w n b"; align-items: center; column-gap: 10px; row-gap: 2px; min-height: 60px; padding: 8px 0; }
  :root.land #overlay .bq-sheet .lv-pays .li .grow { grid-area: g; overflow: hidden; color: var(--bq-ink); font-size: 15px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
  :root.land #overlay .bq-sheet .lv-pays .li .grow .muted { font-weight: 400; }
  :root.land #overlay .bq-sheet .lv-pays .li .when { grid-area: w; width: auto !important; color: var(--bq-ink-3); font-size: 13px; }
  :root.land #overlay .bq-sheet .lv-pays .li .num { grid-area: n; color: var(--bq-ink); font-size: 15px; font-weight: 600; }
  :root.land #overlay .bq-sheet .lv-pays .li .iconbtn { grid-area: b; }

  /* ---------- a goal: its figure, its buttons and its plan on the forest; what is known about it and its movements in white cards ---------- */
  :root.land #overlay .bq-sheet .gv-facts { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); }
  :root.land #overlay .bq-sheet .gv-moves { padding: 4px 14px 8px; border: 0; border-radius: 24px; background: var(--bq-card); box-shadow: inset 0 0 0 1px var(--bq-line); }
  :root.land #overlay .bq-sheet .gv-moves-h { display: block; margin: 12px 0 2px; color: var(--bq-ink); font-size: 17px; font-weight: 600; }

