/* Dorax Finance — the owner's More in the v6 look (v365; the canvas "Mas-V6"; features/phone/r6-mas.js). A full screen on the page's black,
   under the app's fade at the foot (38), the screen's buttons (39, hidden while it is up) and the bar (40), which stays usable over it. */
@media (max-width: 920px) {
  :root.land #overlay .r6-mas { position: fixed; inset: 0; z-index: 37; display: flex; flex-direction: column; background: #070808; color: #EFF1F6; }
  :root:is(.ov-r6mas, #pm-0) #r6-foot { visibility: hidden; }
  :root.land #overlay.in .r6-mas { animation: r6m-in .26s cubic-bezier(.2, .9, .25, 1) both; }
  :root.land #overlay.out .r6-mas { animation: fade-out 160ms var(--ease-in) both; }
  :root.land:not(.r6) #overlay .r6-mas::after { content: ""; position: fixed; left: 0; right: 0; bottom: 0; height: calc(150px + var(--safe-b, 0px)); pointer-events: none; background: linear-gradient(180deg, rgba(7, 8, 8, 0), rgba(7, 8, 8, .92) 55%, #070808); }      /* a screen not in this look has no fade of its own under the bar */
  @keyframes r6m-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
  :root.land #overlay .r6m-scr { flex: 1 1 auto; display: flex; flex-direction: column; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; padding: calc(14px + var(--safe-t, 0px)) 16px calc(124px + var(--safe-b, 0px)); scrollbar-width: none; }
  :root.land #overlay .r6m-scr::-webkit-scrollbar { display: none; }
  :root.land #overlay .r6-mas h1 { flex: none; display: flex; align-items: center; min-height: 44px; margin: 0 0 12px; color: #EFF1F6; font-size: 24px; font-weight: 500; letter-spacing: -.02em; }
  :root.land #overlay .r6-mas .press { transition: transform .34s cubic-bezier(.2, .9, .3, 1.25); -webkit-tap-highlight-color: transparent; }
  :root.land #overlay .r6-mas .press:active { transform: scale(.965); }
  :root.land #overlay .r6-mas :is(a, button, select):focus-visible { outline: 2px solid #9FD182; outline-offset: 3px; }

  /* you: your photo, name and email, to the profile */
  :root.land #overlay .r6m-me { flex: none; display: flex; align-items: center; gap: 14px; min-height: 56px; color: inherit; text-decoration: none; }
  :root.land #overlay .r6m-me .avatar { flex: none; width: 56px; height: 56px; }
  :root.land #overlay .r6m-who { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
  :root.land #overlay .r6m-who b { overflow: hidden; font-size: 18px; font-weight: 500; letter-spacing: -.01em; text-overflow: ellipsis; white-space: nowrap; }
  :root.land #overlay .r6m-who small { overflow: hidden; color: rgba(239, 241, 246, .55); font-size: 13.5px; text-overflow: ellipsis; white-space: nowrap; }
  :root.land #overlay .r6m-chev { flex: none; display: grid; place-items: center; color: rgba(239, 241, 246, .45); }
  :root.land #overlay .r6m-chev svg { width: 16px; height: 16px; }

  /* the cards, as every board's: #121414 with its rim */
  :root.land #overlay :is(.r6m-find, .r6m-tile, .r6m-card) { border: 1px solid transparent;
    background: radial-gradient(120% 90% at 0% 0%, rgba(255, 255, 255, .03), rgba(255, 255, 255, 0) 55%) padding-box, linear-gradient(#121414, #121414) padding-box, linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .05) 30%, rgba(255, 255, 255, .025) 70%, rgba(255, 255, 255, .06)) border-box; }
  :root.land #overlay .r6m-find { all: unset; box-sizing: border-box; flex: none; cursor: pointer; display: flex; align-items: center; gap: 10px; height: 52px; margin-top: 18px; padding: 0 18px; border: 1px solid transparent; border-radius: 999px; color: rgba(239, 241, 246, .55); font-size: 15px;
    background: radial-gradient(120% 90% at 0% 0%, rgba(255, 255, 255, .03), rgba(255, 255, 255, 0) 55%) padding-box, linear-gradient(#121414, #121414) padding-box, linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .05) 30%, rgba(255, 255, 255, .025) 70%, rgba(255, 255, 255, .06)) border-box; }
  :root.land #overlay .r6m-find svg { flex: none; width: 18px; height: 18px; }

  /* your money: three to a row */
  :root.land #overlay .r6m-sec { flex: none; display: flex; flex-direction: column; gap: 12px; margin-top: 30px; }
  :root.land #overlay .r6m-sec h2 { margin: 0; color: #EFF1F6; font-size: 18px; font-weight: 500; letter-spacing: -.02em; }
  :root.land #overlay .r6m-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  :root.land #overlay .r6m-tile { position: relative; display: flex; flex-direction: column; justify-content: space-between; height: 112px; box-sizing: border-box; padding: 14px 12px 13px; border-radius: 26px; color: #EFF1F6; text-decoration: none; animation: r6m-tile .6s cubic-bezier(.2, .9, .25, 1) backwards; }
  @keyframes r6m-tile { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
  :root.land #overlay .r6m-ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; }
  :root.land #overlay .r6m-ic svg { width: 20px; height: 20px; stroke-width: 1.9; }
  :root.land #overlay .r6m-ic.lime { background: rgba(159, 209, 130, .14); color: #9FD182; }
  :root.land #overlay .r6m-ic.teal { background: rgba(106, 175, 162, .16); color: #6AAFA2; }
  :root.land #overlay .r6m-ic.amber { background: rgba(247, 210, 122, .14); color: #F7D27A; }
  :root.land #overlay .r6m-ic.light { background: rgba(239, 241, 246, .08); color: #EFF1F6; }
  :root.land #overlay .r6m-tl { font-size: 13.5px; font-weight: 500; line-height: 1.2; letter-spacing: -.01em; -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
  :root.land #overlay .r6m-tag { position: absolute; top: 12px; right: 10px; display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border: 1px solid rgba(239, 241, 246, .16); border-radius: 999px; color: rgba(239, 241, 246, .8); font-size: 11.5px; font-weight: 500; }
  :root.land #overlay .r6m-tag.n { border-color: transparent; background: rgba(247, 210, 122, .16); color: #F7D27A; }
  :root.land #overlay .r6-mas .sheet-desk { display: flex; align-items: flex-start; gap: 8px; margin: 0; color: rgba(239, 241, 246, .5); font-size: 13px; line-height: 1.4; }
  :root.land #overlay .r6-mas .sheet-desk svg { flex: none; width: 16px; height: 16px; margin-top: 1px; }

  /* the rows, in one card each group */
  :root.land #overlay .r6m-card { display: flex; flex-direction: column; padding: 4px 18px; border-radius: 28px; }
  :root.land #overlay .r6m-help { flex: none; margin-top: 14px; }
  :root.land #overlay .r6m-row { position: relative; display: flex; align-items: center; gap: 14px; min-height: 58px; color: #EFF1F6; text-decoration: none; }
  :root.land #overlay .r6m-row + .r6m-row { border-top: 1px solid rgba(239, 241, 246, .07); }
  :root.land #overlay .r6m-row > svg { flex: none; width: 20px; height: 20px; color: rgba(239, 241, 246, .72); stroke-width: 1.9; }
  :root.land #overlay .r6m-rl { flex: 1 1 auto; min-width: 0; color: #EFF1F6; font-size: 15.5px; font-weight: 500; }
  :root.land #overlay .r6m-val { flex: none; max-width: 45%; overflow: hidden; color: rgba(239, 241, 246, .5); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
  :root.land #overlay .r6m-new { flex: none; display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; background: rgba(159, 209, 130, .14); color: #9FD182; font-size: 12px; font-weight: 500; }
  :root.land #overlay .r6m-pick select { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; font-size: 16px; }
  :root.land #overlay .r6m-pick:has(select:focus-visible) { outline: 2px solid #9FD182; outline-offset: 2px; border-radius: 12px; }

  /* the account's own buttons, then Dorax on social media and the terms */
  :root.land #overlay .r6m-acts { flex: none; display: flex; flex-direction: column; gap: 10px; margin-top: 26px; }
  :root.land #overlay .r6m-btn { all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 9px; height: 52px; border-radius: 999px; background: rgba(26, 29, 29, .92); box-shadow: inset 0 0 0 1px rgba(239, 241, 246, .14), 0 8px 22px rgba(0, 0, 0, .45); color: #EFF1F6; font-size: 15px; font-weight: 500; }
  :root.land #overlay .r6m-btn.out { color: #FF8A80; }
  :root.land #overlay .r6m-btn svg { width: 18px; height: 18px; }
  :root.land #overlay .r6m-foot { flex: none; display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 28px; }
  :root.land #overlay .r6m-soc { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 8px; }
  :root.land #overlay .r6m-soc small { color: rgba(239, 241, 246, .6); font-size: 13.5px; font-weight: 500; }
  :root.land #overlay .r6m-sl { display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 16px; border-radius: 999px; background: rgba(239, 241, 246, .08); box-shadow: inset 0 0 0 1px rgba(239, 241, 246, .14); color: #EFF1F6; font-size: 14px; font-weight: 500; text-decoration: none; }
  :root.land #overlay .r6m-sl svg { width: 13px; height: 13px; }
  :root.land #overlay .r6m-legal { margin: 0; color: rgba(239, 241, 246, .45); font-size: 13px; }
  :root.land #overlay .r6m-legal .linkbtn { display: inline-flex; align-items: center; min-height: 44px; color: rgba(239, 241, 246, .62); font-size: 13px; text-decoration: underline; text-underline-offset: 2px; }
  @media (prefers-reduced-motion: reduce) { :root.land #overlay .r6-mas, :root.land #overlay .r6m-tile { animation: none; } :root.land #overlay .r6-mas .press { transition: none; } }
}
