/* /Components/Accounts/DeleteAccountDialog.razor.rz.scp.css */
.ramah-delete-text[b-a135jm0gww] { margin: 0 0 18px; line-height: 1.5; }
/* /Components/Accounts/DemoBanner.razor.rz.scp.css */
.ramah-demo-banner[b-04485tood3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 20px;
    margin: 0 0 16px;
    padding: 10px 16px;
    border: 1px solid var(--hairline-strong);
    border-radius: var(--radius);
    background: var(--accent-soft);
    color: var(--ink);
    font-size: 14px;
}

.ramah-demo-banner b[b-04485tood3] {
    color: var(--ink-strong);
    font-weight: 500;
}

.ramah-demo-banner a[b-04485tood3] {
    color: var(--link);
    font-weight: 500;
    white-space: nowrap;
}
/* /Components/BoardCard.razor.rz.scp.css */
/* A card on the stage board, as the desktop's: the name in the serif on one line, its line, a thin bar of the stage
   so far, the day and where. Picked, it wears the accent. */
.ramah-bcard[b-owt9hfolyt] { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--hairline); cursor: grab; user-select: none; -webkit-user-select: none; transition: border-color .15s, background .15s; }
.ramah-bcard:hover[b-owt9hfolyt] { border-color: var(--accent-line); }
.ramah-bcard:active[b-owt9hfolyt] { cursor: grabbing; }
.ramah-bcard-on[b-owt9hfolyt], .ramah-bcard-on:hover[b-owt9hfolyt] { border-color: var(--accent); background: var(--accent-soft); }
.ramah-bcard-top[b-owt9hfolyt] { display: flex; align-items: flex-start; gap: 6px; min-width: 0; }
.ramah-bcard-name[b-owt9hfolyt] { flex: 1; min-width: 0; font: 400 17px/1.25 var(--serif); color: var(--ink-strong); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ramah-bcard-name:hover[b-owt9hfolyt] { color: var(--display-em); }
.ramah-bcard-menu[b-owt9hfolyt] { flex: none; margin: -5px -8px -4px 0; opacity: 0; transition: opacity .15s; }
.ramah-bcard:hover .ramah-bcard-menu[b-owt9hfolyt], .ramah-bcard:focus-within .ramah-bcard-menu[b-owt9hfolyt], .ramah-bcard-on .ramah-bcard-menu[b-owt9hfolyt] { opacity: 1; }
.ramah-bcard-menu[b-owt9hfolyt]  .mud-icon-button { padding: 3px; color: var(--muted); }
.ramah-bcard-line[b-owt9hfolyt] { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ramah-bcard-bar[b-owt9hfolyt] { position: relative; display: flex; height: 5px; margin-top: 8px; border-radius: 2.5px; overflow: hidden;
                   background: linear-gradient(color-mix(in srgb, var(--stage) 28%, transparent) 0 0), var(--sunken); }
.ramah-bcard-bar i[b-owt9hfolyt] { display: block; height: 100%; background: var(--stage); }
.ramah-bcard-bar b[b-owt9hfolyt] { display: block; height: 100%; background: var(--danger); }
.ramah-bcard-foot[b-owt9hfolyt] { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 6px; min-width: 0; }
.ramah-bcard-foot .ramah-code[b-owt9hfolyt] { font-size: 11.5px; white-space: nowrap; }
.ramah-bcard-where[b-owt9hfolyt] { font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

/* No hover or dragging on a touch screen, and lanes stacked in a narrow window: the menu (a way to move a card that
   needs neither) is always there. */
@media (hover: none), (pointer: coarse) { .ramah-bcard-menu[b-owt9hfolyt] { opacity: 1; } .ramah-bcard[b-owt9hfolyt] { cursor: pointer; } }
@media (max-width: 640px) { .ramah-bcard-menu[b-owt9hfolyt] { opacity: 1; } }
.ramah-menu-stage[b-owt9hfolyt] { display: inline-flex; align-items: center; gap: 9px; }
/* /Components/Breeding/CrossCard.razor.rz.scp.css */
.card[b-7rfv7h452i] { display: block; width: 100%; text-align: left; border: 1px solid var(--hairline); border-radius: var(--radius-card); padding: 14px 16px; background: var(--surface); color: var(--ink); cursor: pointer; font: inherit; transition: border-color .2s, background .2s; }
.card:hover[b-7rfv7h452i] { border-color: var(--hairline-strong); }
.card:focus-visible[b-7rfv7h452i] { outline: 2px solid var(--accent-line); outline-offset: 2px; }
.card.sel[b-7rfv7h452i] { border-color: var(--accent-line); background: var(--accent-soft); }
.top[b-7rfv7h452i] { display: flex; align-items: center; gap: 14px; }
.rank[b-7rfv7h452i] { flex: none; width: 14px; font: 500 11px/1 var(--sans); color: var(--faint); }
.name[b-7rfv7h452i] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.name b[b-7rfv7h452i] { font: 400 19px/1.15 var(--serif); color: var(--ink-strong); overflow-wrap: anywhere; }
.name span[b-7rfv7h452i] { font-size: 12px; color: var(--muted); }
.mini[b-7rfv7h452i] { display: grid; grid-template-columns: repeat(auto-fit, minmax(24px, 1fr)); gap: 5px; margin: 12px 0 0 28px; }
.bar[b-7rfv7h452i] { display: block; height: 4px; border-radius: 2px; background: var(--sunken); overflow: hidden; }
.bar i[b-7rfv7h452i] { display: block; height: 100%; border-radius: 2px; background: var(--tone, var(--display-em)); transition: width .9s cubic-bezier(.2,.7,.2,1); }
/* /Components/Breeding/MatchRing.razor.rz.scp.css */
.ring[b-kbzctdyry7] { position: relative; flex: none; width: 54px; height: 54px; }
.ring svg[b-kbzctdyry7] { width: 100%; height: 100%; transform: rotate(-90deg); }
.ring circle[b-kbzctdyry7] { fill: none; stroke-width: 4; }
.ring .track[b-kbzctdyry7] { stroke: var(--sunken); }
.ring .value[b-kbzctdyry7] { stroke: var(--display-em); stroke-linecap: round; transition: stroke-dashoffset .9s cubic-bezier(.2,.7,.2,1); }
.ring b[b-kbzctdyry7] { position: absolute; inset: 0; display: grid; place-items: center; font: 500 13.5px/1 var(--sans); color: var(--ink-strong); font-variant-numeric: tabular-nums; }
/* /Components/Breeding/OddsRow.razor.rz.scp.css */
.odds[b-91sh1fclxf] { border-top: 1px solid var(--hairline); margin-top: 18px; padding-top: 18px; }
.odds .ramah-label[b-91sh1fclxf] { margin: 0 0 14px; }
.row[b-91sh1fclxf] { display: grid; grid-template-columns: repeat(auto-fit, minmax(76px, 1fr)); gap: 12px 6px; align-items: end; }
.odd[b-91sh1fclxf] { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 4px 2px; border: 0; background: none; color: var(--ink); font: inherit; cursor: pointer; border-radius: var(--radius); text-align: center; }
.odd:focus-visible[b-91sh1fclxf] { outline: 2px solid var(--accent-line); }
.bubble[b-91sh1fclxf] { --size: calc(var(--s) * 78px); width: var(--size); height: var(--size); border-radius: 50%; display: grid; place-items: center; font: 500 12.5px/1.1 var(--sans); color: var(--ink-strong); font-variant-numeric: tabular-nums;
          background: var(--tone-soft, var(--accent-soft)); border: 1px solid var(--tone, var(--accent-line)); transition: width .6s cubic-bezier(.2,.7,.2,1), height .6s cubic-bezier(.2,.7,.2,1); }
.none .bubble[b-91sh1fclxf] { background: transparent; border-style: dashed; border-color: var(--hairline-strong); color: var(--muted); }
.odd small[b-91sh1fclxf] { font-size: 11.5px; line-height: 1.25; color: var(--ink); }
.odd em[b-91sh1fclxf] { font: 400 13px/1.1 var(--serif); font-style: italic; color: var(--muted); }
.open small[b-91sh1fclxf] { color: var(--ink-strong); }
.why[b-91sh1fclxf] { margin: 14px 0 0; font-size: 12.5px; color: var(--muted); }
.why b[b-91sh1fclxf] { font-weight: 500; color: var(--ink); }
@media (max-width: 600px) {
  .row[b-91sh1fclxf] { grid-template-columns: repeat(3, 1fr); }
  .bubble[b-91sh1fclxf] { --size: calc(var(--s) * 64px); font-size: 11.5px; }
}
/* /Components/Climate/EquipmentDial.razor.rz.scp.css */
/* The desktop's equipment tile: a quiet tile, the dial drawn at 60 and scaled with its tile (56 to 120 across; 48 to
   64 on a phone), so its icon and level grow with it. Idle reads muted; running takes the colour of what's plugged in
   (RamahTokens: lamp, fan, mist, dry, heat, cool, pump, device), which the dial, its icon and its level all share. */
.eq[b-u6igcm1cb9] { position: relative; min-width: 0; --eq: var(--muted); }
.k-light[b-u6igcm1cb9] { --kind: var(--lamp); }
.k-fan[b-u6igcm1cb9] { --kind: var(--fan); }
.k-humidifier[b-u6igcm1cb9] { --kind: var(--mist); }
.k-dehumidifier[b-u6igcm1cb9] { --kind: var(--dry); }
.k-heater[b-u6igcm1cb9] { --kind: var(--heat); }
.k-cooler[b-u6igcm1cb9] { --kind: var(--cool); }
.k-pump[b-u6igcm1cb9] { --kind: var(--pump); }
.k-device[b-u6igcm1cb9] { --kind: var(--device); }
.running[b-u6igcm1cb9] { --eq: var(--kind); }

.tile[b-u6igcm1cb9] { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px 8px; box-sizing: border-box;
        border: 1px solid var(--hairline); border-radius: 8px; background: transparent; color: inherit; font: inherit; cursor: help; transition: background .12s; }
.tile:hover[b-u6igcm1cb9], .open .tile[b-u6igcm1cb9] { background: var(--hover); }
.tile:focus-visible[b-u6igcm1cb9] { outline: 2px solid var(--accent-line); outline-offset: 1px; }

.dial[b-u6igcm1cb9] { position: relative; width: clamp(56px, 100%, 120px); aspect-ratio: 1 / 1; container-type: inline-size; color: var(--eq); }
.dial svg[b-u6igcm1cb9] { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.dial path[b-u6igcm1cb9] { fill: none; stroke-width: 5.4; stroke-linecap: butt; }
.lit[b-u6igcm1cb9] { stroke: var(--eq); }
.unlit[b-u6igcm1cb9] { stroke: var(--sunken); }
.inside[b-u6igcm1cb9] { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.inside[b-u6igcm1cb9]  .icon { width: 33.4cqi; height: 33.4cqi; font-size: 33.4cqi; color: var(--eq); }
.level[b-u6igcm1cb9] { font: 700 17.5cqi/1.3 var(--sans-strong); letter-spacing: .06em; color: var(--ink); }
.name[b-u6igcm1cb9] { max-width: 100%; font: 500 12px/1.25 var(--sans); color: var(--ink); text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Its port's card, as the desktop's tooltip: on the sheet, a hairline round it, shown after a moment's rest (or a
   tap). Out of the layout until it shows. */
.tip[b-u6igcm1cb9] { display: none; position: absolute; z-index: 30; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); width: max-content; max-width: 340px;
       padding: 10px 12px; border-radius: 8px; background: var(--sheet); border: 1px solid var(--hairline-strong); box-shadow: var(--sheet-shadow); pointer-events: none; }
@media (hover: hover) {
  .eq:hover .tip[b-u6igcm1cb9] { display: block; animation: tip-in-b-u6igcm1cb9 .15s .4s both; }
}
.open .tip[b-u6igcm1cb9] { display: block; animation: tip-in-b-u6igcm1cb9 .15s both; }
@keyframes tip-in-b-u6igcm1cb9 { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 760px) {
  .dial[b-u6igcm1cb9] { width: clamp(48px, 100%, 64px); }
  .tip[b-u6igcm1cb9] { position: fixed; left: 16px; right: 16px; bottom: calc(96px + env(safe-area-inset-bottom)); transform: none; width: auto; max-width: none; }
}
/* /Components/Climate/EquipmentGroup.razor.rz.scp.css */
/* The dials share the row: as many of at least 96 as fit (70 on a phone), a short row split between just those. */
.group[b-vx8h96sgzs] { display: flex; flex-direction: column; gap: 10px; }
.flow[b-vx8h96sgzs] { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); }
.none[b-vx8h96sgzs] { margin: 0; font-size: 12px; color: var(--muted); }
@media (max-width: 760px) { .flow[b-vx8h96sgzs] { grid-template-columns: repeat(auto-fit, minmax(70px, 1fr)); } }
/* /Components/Climate/GroupHeader.razor.rz.scp.css */
/* The desktop's group heading: a 14px muted glyph, the name small, bold and letterspaced in ink, a hairline, the summary. */
.group-head[b-rxcw5kc6wl] { display: flex; align-items: center; min-height: 18px; }
.group-head[b-rxcw5kc6wl]  .glyph { width: 14px; height: 14px; font-size: 14px; margin-right: 7px; color: var(--muted); flex: none; }
.title[b-rxcw5kc6wl] { font: 700 10.5px/1 var(--sans-strong); letter-spacing: .15em; text-transform: uppercase; color: var(--ink); white-space: nowrap; }
.rule[b-rxcw5kc6wl] { flex: 1; height: 1px; margin: 0 12px; background: var(--hairline); min-width: 12px; }
.summary[b-rxcw5kc6wl] { font: 400 11.5px/1.2 var(--sans); color: var(--muted); white-space: nowrap; }
/* /Components/Climate/PortCard.razor.rz.scp.css */
/* The desktop's port tooltip: a label, the name in the serif beside a status dot, the mode as a chip, then the state and settings. */
.port[b-9u1x4h16j6] { display: flex; flex-direction: column; gap: 3px; max-width: 320px; min-width: 200px; text-align: left; }
.number[b-9u1x4h16j6] { font: 500 10.5px/1.3 var(--sans); letter-spacing: .15em; color: var(--muted); margin: 0 0 3px 2px; }
.head[b-9u1x4h16j6] { display: flex; align-items: center; gap: 8px; }
.dot[b-9u1x4h16j6] { width: 8px; height: 8px; border-radius: 50%; background: var(--status-idle); flex: none; }
.dot.ready[b-9u1x4h16j6] { background: var(--status-ready); }
.name[b-9u1x4h16j6] { font: 400 15.5px/1.2 var(--serif); color: var(--ink-strong); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mode[b-9u1x4h16j6] { margin-left: 12px; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--hairline-strong); font: 400 11.5px/1.2 var(--sans); color: var(--muted); white-space: nowrap; }
.state[b-9u1x4h16j6] { margin-left: 16px; font: 400 12.5px/1.4 var(--sans); color: var(--muted); }
.details[b-9u1x4h16j6] { margin: 2px 0 0 16px; font: 400 14px/22px var(--sans); color: var(--muted); }
/* /Components/Climate/ReadingChart.razor.rz.scp.css */
/* The desktop's environment chart: each lane a sunken well with its band shaded in the measure's colour (14%), its
   name small at the top left, its high and low at the left, the line 2px, its latest value in colour at the end. */
.chart[b-735mdqrh4h] { position: relative; width: 100%; min-height: 280px; }
.chart svg[b-735mdqrh4h] { display: block; overflow: visible; }
.temp[b-735mdqrh4h] { --lane: var(--temp); }
.humidity[b-735mdqrh4h] { --lane: var(--humidity); }
.vpd[b-735mdqrh4h] { --lane: var(--vpd); }
.well[b-735mdqrh4h] { fill: var(--sunken); rx: 8px; }
.band[b-735mdqrh4h] { fill: var(--lane); fill-opacity: .14; }
.name[b-735mdqrh4h] { font: 400 9.5px var(--sans); fill: var(--muted); }
.tick[b-735mdqrh4h] { font: 400 10px var(--sans); fill: var(--muted); text-anchor: end; }
.line[b-735mdqrh4h] { fill: none; stroke: var(--lane); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.dot[b-735mdqrh4h] { fill: var(--lane); }
.end[b-735mdqrh4h] { font: 400 12px var(--sans); fill: var(--lane); }
.axis[b-735mdqrh4h] { stroke: var(--hairline); stroke-width: 1; }
.when[b-735mdqrh4h] { font: 400 10.5px var(--sans); fill: var(--muted); text-anchor: middle; }
.when.first[b-735mdqrh4h] { text-anchor: start; }
.when.last[b-735mdqrh4h] { text-anchor: end; }
.moment[b-735mdqrh4h] { stroke: var(--hairline-strong); stroke-width: 1; stroke-dasharray: 3 3; }
.hit[b-735mdqrh4h] { position: absolute; cursor: crosshair; }
.moment-tip[b-735mdqrh4h] { position: absolute; top: 0; transform: translateX(-50%); padding: 5px 10px; border-radius: 8px; white-space: nowrap; pointer-events: none;
              background: var(--sheet); border: 1px solid var(--hairline-strong); font: 400 11.5px/1.3 var(--sans); color: var(--ink); }
.moment-tip.from-left[b-735mdqrh4h] { transform: translateX(-12%); }
.moment-tip.from-right[b-735mdqrh4h] { transform: translateX(-88%); }
.empty[b-735mdqrh4h] { margin: 0; min-height: 280px; display: grid; place-items: center; text-align: center; font-size: 12.5px; color: var(--muted); }
/* /Components/Climate/ReadingHistory.razor.rz.scp.css */
.group[b-hc629kca0e] { display: flex; flex-direction: column; gap: 12px; }
/* The desktop's view switch: options on a sunken track, the current one raised. */
.switch[b-hc629kca0e] { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--sunken); margin-left: 12px; }
.switch button[b-hc629kca0e] { border: 0; background: transparent; padding: 5px 9px; border-radius: 8px; font: 400 12.5px/1.2 var(--sans); color: var(--muted); cursor: pointer; }
.switch button:hover[b-hc629kca0e] { background: var(--hover); color: var(--ink); }
.switch button.current[b-hc629kca0e] { background: var(--segment-selected); color: var(--ink-strong); }
/* /Components/Cultivars/CultivarTile.razor.rz.scp.css */
/* A line's tile: the plant card's frame, with its badges over the photo and the line's facts kept to one line each. */
.cv-tile-cover[b-xumj73x2lc] { position: relative; }
.cv-tile-badges[b-xumj73x2lc] { position: absolute; left: 12px; top: 12px; display: flex; gap: 6px; }
.cv-retired[b-xumj73x2lc] { background: var(--canvas); }
.cv-tile-line[b-xumj73x2lc] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-tile[b-xumj73x2lc]  .ramah-card-title { font-size: 21px; }
.cv-tile[b-xumj73x2lc]  .ramah-lineage { font-size: 14.5px; }
.cv-tile[b-xumj73x2lc]  .ramah-caption { font-size: 12px; }
.cv-tile-tags[b-xumj73x2lc] { margin-top: 6px; }
.cv-tile-mix[b-xumj73x2lc] { height: 6px; margin: 8px 0 0; gap: 2px; }
.cv-tile-counts[b-xumj73x2lc] { margin-top: 4px; }

/* A photo dragged over a tile: the tile lights up, its note as the desktop's drop overlay (the accent at 90%, its
   words on it), and a hidden file field over it takes the drop. */
.cv-tile-wrap[b-xumj73x2lc] { position: relative; display: flex; flex-direction: column; }
.cv-tile-wrap > .cv-tile[b-xumj73x2lc] { flex: 1; }
.cv-tile-dragging > .cv-tile[b-xumj73x2lc] { border-color: var(--accent); }
.cv-tile-wrap[b-xumj73x2lc]  .cv-tile-drop { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; font-size: 0; }
.cv-tile-wrap[b-xumj73x2lc]  .cv-tile-drop-on { pointer-events: auto; cursor: copy; }
.cv-tile-drop-note[b-xumj73x2lc] { position: absolute; left: 12px; right: 12px; top: 40%; transform: translateY(-50%); padding: 10px 14px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 90%, transparent); color: var(--on-accent); font-size: 13.5px; font-weight: 500; text-align: center; pointer-events: none; }
/* /Components/Cultivars/DaysBox.razor.rz.scp.css */
.cv-daysbox[b-7wvfzk4g7p] { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.cv-daysbox[b-7wvfzk4g7p]  .mud-input-control { margin: 0; }
/* /Components/Cultivars/LibraryResultTile.razor.rz.scp.css */
/* A shared strain as the desktop's library card: a round of initials in the accent beside its name, lineage and breeder. */
.cv-lib[b-rujwhy0tvd] { display: flex; align-items: center; gap: 14px; padding: 14px 16px; min-width: 0; border-color: var(--hairline-strong); }
.cv-lib-initials[b-rujwhy0tvd] { flex: none; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font: 400 20px/1 var(--serif); color: var(--accent); background: var(--accent-soft); }
.cv-lib-text[b-rujwhy0tvd] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cv-lib-name[b-rujwhy0tvd] { font: 400 18px/1.15 var(--serif); color: var(--ink-strong); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-lib-lineage[b-rujwhy0tvd] { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-lib-facts[b-rujwhy0tvd] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 2px; }
.cv-lib:hover .cv-lib-name[b-rujwhy0tvd] { color: var(--display-em); }
/* /Components/Cultivars/NameDialog.razor.rz.scp.css */
.cv-dialog-message[b-fsi5os9bgx] { margin: 0 0 14px; max-width: 42ch; line-height: 1.5; }
/* /Components/Cultivars/PedigreeTree.razor.rz.scp.css */
/* The desktop's lineage bubbles (LineageBubbles, StrainCardView): hairline connectors that meet at a dot above each
   child, bubbles by kind (the tree's own in the accent, your lines blue, a plant on the surface, a parent nobody
   recorded dashed on the sunken), a photo filling its bubble with the name on a pill across its bottom edge, and the
   card on the sheet beside the bubble it's about. The bubbles grow in from the plant, and glide when the width changes. */
.tree[b-4knff0q2qt] { position: relative; width: 100%; min-width: 0; }
.scroll[b-4knff0q2qt] { overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
.canvas[b-4knff0q2qt] { position: relative; margin: 0 auto; }
.canvas svg[b-4knff0q2qt] { position: absolute; inset: 0; display: block; overflow: visible; pointer-events: none; animation: fade-in-b-4knff0q2qt .3s ease-out both; }
.link[b-4knff0q2qt] { fill: none; stroke: var(--hairline-strong); stroke-width: 1.4; }
.link.dashed[b-4knff0q2qt] { stroke-width: 1.2; stroke-dasharray: 3 4; }
.joint[b-4knff0q2qt] { fill: var(--hairline-strong); }
.arc[b-4knff0q2qt] { fill: none; stroke: var(--accent); stroke-width: 1.4; stroke-dasharray: 3 4; }
.notes[b-4knff0q2qt] { position: absolute; left: 0; right: 0; top: 4px; text-align: center; font: 500 10.5px/1.4 var(--sans); letter-spacing: .08em; color: var(--accent); }
.none[b-4knff0q2qt] { position: absolute; left: 50%; top: 2px; transform: translateX(-50%); width: min(100%, 520px); margin: 0; text-align: center; font-size: 12.5px; line-height: 1.45; color: var(--muted); }

.node[b-4knff0q2qt] { position: absolute; box-sizing: border-box; --size: clamp(10.5px, calc(var(--r) * .34), 18px); --ring: var(--hairline-strong); --fill: var(--surface); --name: var(--ink); --ring-w: 1.5px; --ring-s: solid;
        transition: left .26s cubic-bezier(.2,.7,.2,1), top .26s cubic-bezier(.2,.7,.2,1), width .26s, height .26s;
        animation: grow-b-4knff0q2qt .26s cubic-bezier(.33,1,.68,1) both; outline: none; }
@keyframes grow-b-4knff0q2qt { from { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.6); } }
@keyframes fade-in-b-4knff0q2qt { from { opacity: 0; } }
.plant.repeat[b-4knff0q2qt] { --ring: var(--accent); --name: var(--accent); }
.root[b-4knff0q2qt] { --fill: var(--accent-soft); --ring: var(--accent); --name: var(--accent); --ring-w: 2.6px; }
.line[b-4knff0q2qt] { --fill: var(--blue-soft); --ring: var(--blue); --name: var(--blue); }
.is-root[b-4knff0q2qt] { --ring-w: 2.6px; }
.untracked[b-4knff0q2qt] { --fill: var(--sunken); --ring: var(--muted); --name: var(--muted); --ring-w: 1.3px; --ring-s: dashed; }
.opens[b-4knff0q2qt] { cursor: pointer; }

.bubble[b-4knff0q2qt] { position: absolute; inset: 0; border-radius: 50%; background: var(--fill); border: var(--ring-w) var(--ring-s) var(--ring); box-sizing: border-box;
          display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; transition: transform .15s ease-out, outline-color .15s; outline: 6px solid transparent; outline-offset: 1px; }
.hover .bubble[b-4knff0q2qt], .node:focus-visible .bubble[b-4knff0q2qt] { transform: scale(1.06); outline-color: var(--accent-line); }
.hover:not(.is-root):not(.untracked) .bubble[b-4knff0q2qt] { --ring-w: 2.2px; }
.bubble img[b-4knff0q2qt] { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.photo .bubble[b-4knff0q2qt] { border-style: solid; }
.label[b-4knff0q2qt] { max-width: 80%; font: 400 var(--size)/1.15 var(--sans); color: var(--name); text-align: center; overflow-wrap: anywhere;
         display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.near .label[b-4knff0q2qt] { font-family: var(--serif); }
.untracked .label[b-4knff0q2qt] { font-style: italic; }
.line-tag[b-4knff0q2qt] { position: absolute; top: 8px; font: 500 8.5px/1 var(--sans); letter-spacing: .06em; color: var(--blue); }
.pill[b-4knff0q2qt] { position: absolute; left: 50%; top: 100%; transform: translate(-50%, -50%); box-sizing: border-box; padding: 3px 9px; border-radius: 999px;
        max-width: max(calc(var(--r) * 2.6), 96px); background: var(--surface); border: 1px solid var(--ring); font: 500 max(11px, calc(var(--size) * .82))/1.25 var(--sans); color: var(--name);
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.is-root .pill[b-4knff0q2qt] { max-width: calc(var(--w) * .6); }
.caption[b-4knff0q2qt] { position: absolute; margin-top: 10px; transform: translateX(-50%); max-width: 70%; font-size: 12px; line-height: 1.35; color: var(--muted); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; animation: fade-in-b-4knff0q2qt .3s ease-out both; }
.caption.under-photo[b-4knff0q2qt] { margin-top: 20px; }

/* A parent at a glance, as the desktop's strain card: its photo, its name, its parents, who bred it, and what you can do. */
.card[b-4knff0q2qt] { position: absolute; z-index: 5; margin: 0 6px; width: 236px; transform: translateY(-50%); border-radius: 14px; overflow: hidden; background: var(--sheet);
        border: 1px solid var(--hairline-strong); box-shadow: var(--sheet-shadow); animation: fade-in-b-4knff0q2qt .15s ease-out both; }
.card-photo[b-4knff0q2qt] { display: block; width: 100%; height: 120px; object-fit: cover; }
.card-text[b-4knff0q2qt] { display: flex; flex-direction: column; gap: 4px; padding: 14px 18px 16px; }
.card-title[b-4knff0q2qt] { font: 400 21px/1.15 var(--serif); color: var(--ink-strong); overflow-wrap: anywhere; }
.card-parents[b-4knff0q2qt] { font: italic 400 15px/1.25 var(--serif); color: var(--display-em); }
.card-breeder[b-4knff0q2qt] { font-size: 12px; color: var(--muted); }
.card-actions[b-4knff0q2qt] { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 6px; }
.act[b-4knff0q2qt] { display: inline-flex; align-items: center; gap: 6px; padding: 2px 0; border: 0; background: none; font: 400 12.5px/1.3 var(--sans); color: var(--link); text-decoration: none; cursor: pointer; }
.act:hover[b-4knff0q2qt] { color: var(--link-hover); }
.act[disabled][b-4knff0q2qt] { opacity: .6; cursor: default; }
.act[b-4knff0q2qt]  .mud-icon-root { width: 14px; height: 14px; font-size: 14px; }
/* /Components/Cultivars/Suggestion.razor.rz.scp.css */
/* A suggestion: its text, and why it's offered, quiet at the right. */
.cv-suggest[b-wnejcaba2b] { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; width: 100%; min-width: 0; font-size: 14px; }
.cv-suggest-text[b-wnejcaba2b] { flex: 0 1 auto; min-width: 0; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-suggest-hint[b-wnejcaba2b] { flex: 0 100 auto; min-width: 0; font-size: 12px; color: var(--faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cv-suggest-close .cv-suggest-text[b-wnejcaba2b] { color: var(--display-em); }
/* /Components/Cultivars/TagField.razor.rz.scp.css */
/* Tags as the desktop's tag field: the chips (Components/TagChip) with the box beside them in one field's frame;
   the parents' tags underneath, each a "+" in the accent, or ringed in its word's colour when it's a known word. */
.cv-tagfield[b-t3ppoxaw1z] { display: flex; flex-direction: column; gap: 8px; }
.cv-tagcloud[b-t3ppoxaw1z] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-height: 44px; padding: 7px 8px; background: var(--surface); border: 1px solid var(--hairline-strong); border-radius: var(--radius); box-sizing: border-box; transition: border-color .15s; }
.cv-tagcloud:hover[b-t3ppoxaw1z] { border-color: var(--accent-line); }
.cv-tagcloud:focus-within[b-t3ppoxaw1z] { border-color: var(--accent); }
.cv-tag-box[b-t3ppoxaw1z] { flex: 1 1 140px; min-width: 120px; }
.cv-tag-box[b-t3ppoxaw1z]  .mud-input-control { margin: 0; }
.cv-tag-box[b-t3ppoxaw1z]  .mud-input > input.mud-input-root { padding: 4px 4px; font-size: 12.5px; }
.cv-picks[b-t3ppoxaw1z] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.cv-picks-label[b-t3ppoxaw1z] { font-size: 11.5px; color: var(--muted); margin: 0 2px 0 2px; }
.cv-pick[b-t3ppoxaw1z] { display: inline-flex; align-items: center; gap: 3px; min-height: 24px; padding: 2px 10px 2px 8px; border-radius: 999px; border: 1px solid var(--accent-line); background: transparent; color: var(--accent); font: 400 12px/1.2 var(--sans); cursor: pointer; transition: background .15s; }
.cv-pick:hover[b-t3ppoxaw1z] { background: var(--accent-soft); }
.cv-pick[b-t3ppoxaw1z]  .mud-icon-root { width: 11px; height: 11px; }
.cv-pick[class*="ramah-tone-"]:not(.ramah-tone-plain)[b-t3ppoxaw1z] { border-color: var(--tone-line); color: var(--tone-ink); }
.cv-pick[class*="ramah-tone-"]:not(.ramah-tone-plain):hover[b-t3ppoxaw1z] { background: var(--tone-soft); }
/* /Components/DashboardPlant.razor.rz.scp.css */
/* The desktop's row button: no chrome until the pointer's on it, then the hover tint at the field radius. */
.plant[b-d5nibuftmt] { display: flex; flex-direction: column; gap: 6px; padding: 9px 10px; margin: 0 -10px; border-radius: var(--radius); color: inherit; text-decoration: none;
         min-width: 0; transition: background .15s; }
.plant:hover[b-d5nibuftmt] { background: var(--hover); }
.top[b-d5nibuftmt] { display: flex; align-items: center; gap: 10px; min-width: 0; }
.name[b-d5nibuftmt] { flex: 1; min-width: 0; font-weight: 500; font-size: 13.5px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.top[b-d5nibuftmt]  .ramah-stage-pill { flex: none; }
.detail[b-d5nibuftmt] { font-size: 12px; color: var(--muted); }
/* /Components/GaugeDial.razor.rz.scp.css */
/* The desktop's reading ring: as wide as its tile allows (between 80 and 170), its stroke 8.5% of its size (the
   dial's geometry in GaugeDial assumes that), the number 21% of it in the serif, the measure under it. */
.ring[b-frso8omef7] { --gauge: var(--accent); position: relative; width: 100%; max-width: 170px; min-width: 80px; aspect-ratio: 1 / 1; margin: 0 auto; container-type: inline-size; }
.ring svg[b-frso8omef7] { position: absolute; inset: 0; width: 100%; height: 100%; display: block; overflow: visible; }
.ring path[b-frso8omef7] { fill: none; stroke-width: 8.5; }
.track[b-frso8omef7] { stroke: var(--sunken); stroke-linecap: round; }
.band[b-frso8omef7] { stroke: var(--environment-band); stroke-linecap: butt; }
.value[b-frso8omef7] { stroke: var(--gauge); stroke-linecap: round; }
.knob[b-frso8omef7] { fill: var(--surface); stroke: var(--gauge); stroke-width: 2px; vector-effect: non-scaling-stroke; }
.out[b-frso8omef7] { --gauge: var(--environment-bad); }

.read[b-frso8omef7] { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 4cqi; box-sizing: border-box; pointer-events: none; }
.read b[b-frso8omef7] { font: 400 21cqi/1.12 var(--serif); color: var(--ink); white-space: nowrap; max-width: 80cqi; overflow: hidden; text-overflow: ellipsis; }
.read span[b-frso8omef7] { font: 700 max(9px, 9.5cqi)/1.25 var(--sans-strong); color: var(--muted); white-space: nowrap; max-width: 80cqi; overflow: hidden; text-overflow: ellipsis; }

.m-temperature[b-frso8omef7] { --gauge: var(--temp); }
.m-humidity[b-frso8omef7] { --gauge: var(--humidity); }
.m-vpd[b-frso8omef7] { --gauge: var(--vpd); }
.m-co2[b-frso8omef7] { --gauge: var(--co2); }
.m-soil[b-frso8omef7] { --gauge: var(--soil); }
.m-light[b-frso8omef7] { --gauge: var(--lux); }
.m-water[b-frso8omef7] { --gauge: var(--water); }
.m-temperature.out[b-frso8omef7], .m-humidity.out[b-frso8omef7], .m-vpd.out[b-frso8omef7], .m-co2.out[b-frso8omef7], .m-soil.out[b-frso8omef7], .m-light.out[b-frso8omef7], .m-water.out[b-frso8omef7] { --gauge: var(--environment-bad); }
/* /Components/HarvestFirstDialog.razor.rz.scp.css */
/* The chop: two pairs of fields and the notes, in one column on a phone. */
.ramah-harvest-intro[b-5llc82lpzc] { margin: 0 0 18px; }
.ramah-harvest-form[b-5llc82lpzc] { display: flex; flex-direction: column; gap: 14px; }
.ramah-harvest-pair[b-5llc82lpzc] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: end; }
.ramah-harvest-pair[b-5llc82lpzc]  .mud-input-control { margin: 0; }
.ramah-harvest-use[b-5llc82lpzc] { display: flex; flex-direction: column; gap: 8px; padding-bottom: 2px; }
.ramah-harvest-use[b-5llc82lpzc]  .ramah-segments { align-self: flex-start; }
@media (max-width: 480px) { .ramah-harvest-pair[b-5llc82lpzc] { grid-template-columns: minmax(0, 1fr); } }
/* /Components/LabelSheet.razor.rz.scp.css */
/* The label sheet, as the desktop's sheets: over the page, on the sheet colour. The labels on it are paper (white, black
   ink, in either theme) at one pixel per printer dot, laid out in the printer's dots as the desktop's LabelVisual:
   406 × 203, the QR code in the 183-dot square 10 dots in, the words in the 193 × 183 column from 203 across. On paper
   only the labels print, each exactly 2 × 1 in, one to a page. */
.ramah-labels[b-ge7nbsdh96] { position: fixed; inset: 0; z-index: 1350; display: grid; place-items: center; padding: 24px; box-sizing: border-box; }
.scrim[b-ge7nbsdh96] { position: absolute; inset: 0; background: var(--overlay); }
.sheet[b-ge7nbsdh96] { position: relative; display: flex; flex-direction: column; gap: 16px; width: min-content; max-width: 100%; max-height: 100%; overflow: hidden;
         box-sizing: border-box; padding: 24px 24px 22px; background: var(--sheet); color: var(--ink); border-radius: var(--radius-sheet); box-shadow: var(--sheet-shadow); }
.head[b-ge7nbsdh96] { display: flex; flex-direction: column; gap: 6px; }
.title[b-ge7nbsdh96] { margin: 0; font: 400 24px/1.15 var(--serif); color: var(--ink-strong); }
.head .ramah-sheet-lede[b-ge7nbsdh96] { margin: 0; }
.sheet > p[b-ge7nbsdh96] { margin: 0; }
.problem[b-ge7nbsdh96] { font-size: 13px; line-height: 1.45; color: var(--danger); }
.hint[b-ge7nbsdh96] { line-height: 1.5; }
.actions[b-ge7nbsdh96] { display: flex; justify-content: flex-end; gap: 8px; padding-top: 4px; }

/* The labels scroll when there are more than fit; the heading and the buttons stay put. */
.ramah-printed-pages[b-ge7nbsdh96] { --dot: 1px; display: grid; grid-template-columns: calc(406 * var(--dot)); gap: 12px; flex: 0 1 auto; min-height: 0; overflow: hidden auto;
                       scrollbar-gutter: stable; padding: 1px; margin: -1px; }
@media (min-width: 960px) {
  .ramah-printed-pages.many[b-ge7nbsdh96] { grid-template-columns: repeat(2, calc(406 * var(--dot))); }
}
@media (max-width: 520px) {
  .ramah-labels[b-ge7nbsdh96] { padding: 16px; }
  .sheet[b-ge7nbsdh96] { padding: 20px 18px 18px; }
  .ramah-printed-pages[b-ge7nbsdh96] { --dot: calc((100vw - 68px) / 406); }
}

.ramah-printed[b-ge7nbsdh96] { position: relative; width: calc(406 * var(--dot)); height: calc(203 * var(--dot)); overflow: hidden; box-sizing: border-box;
               background: var(--label-paper); color: var(--label-ink); border-radius: 6px; box-shadow: 0 0 0 1px var(--hairline); }
.ink[b-ge7nbsdh96] { position: absolute; inset: 0; width: 100%; height: 100%; fill: var(--label-ink); shape-rendering: crispEdges; }
.ramah-printed-words[b-ge7nbsdh96] { --column-dots: 183; position: absolute; left: calc(203 * var(--dot)); top: calc(10 * var(--dot)); width: calc(193 * var(--dot));
                     height: calc(var(--column-dots) * var(--dot)); display: grid; grid-template-rows: minmax(0, 1fr) auto auto;
                     font-family: Inter, var(--sans); color: var(--label-ink); -webkit-font-smoothing: antialiased; }
/* Sized by js/labels.js (in dots) to fit, so nothing is cut: not even a descender, which a clipped line box would lose. */
.ramah-printed-name[b-ge7nbsdh96] { align-self: center; font-weight: 700; font-size: calc(var(--name, 20) * var(--dot)); line-height: .98; letter-spacing: -.01em; overflow-wrap: normal; }
.ramah-printed-cultivar[b-ge7nbsdh96] { font-weight: 600; font-size: calc(var(--cultivar, 14) * var(--dot)); line-height: 1.05; white-space: pre; }
.ramah-printed-footer[b-ge7nbsdh96] { margin-top: calc(var(--column-dots) * .03 * var(--dot)); font-weight: 500; font-size: calc(var(--footer, 14) * var(--dot)); line-height: 1.05; white-space: pre; }

@media print {
  .ramah-labels[b-ge7nbsdh96] { position: static; display: block; place-items: normal; padding: 0; }
  .scrim[b-ge7nbsdh96], .head[b-ge7nbsdh96], .actions[b-ge7nbsdh96], .sheet > p[b-ge7nbsdh96] { display: none; }
  .sheet[b-ge7nbsdh96] { display: block; width: auto; max-width: none; max-height: none; overflow: visible; padding: 0; background: none; border-radius: 0; box-shadow: none; }
  .ramah-printed-pages[b-ge7nbsdh96], .ramah-printed-pages.many[b-ge7nbsdh96] { --dot: calc(1in / 203); display: block; overflow: visible; padding: 0; margin: 0; }
  .ramah-printed[b-ge7nbsdh96] { width: 2in; height: 1in; border-radius: 0; box-shadow: none; break-inside: avoid; break-after: page; page-break-after: always; }
  .ramah-printed:last-child[b-ge7nbsdh96] { break-after: auto; page-break-after: auto; }
}
/* /Components/Photos/PhotoExportSheet.razor.rz.scp.css */
/* Export photos…: the desktop's sheet. The photos to pick as the strip's 84 × 63 thumbs, wrapping, the picked ones
   ringed in the accent; the switch beside what it means; the example name and the location note small and quiet. */
.heading[b-68cxy25fgs] { margin: 0 0 2px; }
.pick-line[b-68cxy25fgs] { display: flex; align-items: center; gap: 14px; margin: 14px 0 8px; }
.picked[b-68cxy25fgs] { font-size: 12.5px; color: var(--muted); }
.grow[b-68cxy25fgs] { flex: 1; }
.pick-link[b-68cxy25fgs] { font-size: 12px; }
.picks[b-68cxy25fgs] { display: flex; flex-wrap: wrap; gap: 8px; max-height: 226px; overflow-y: auto; padding: 2px 0; scrollbar-width: thin; }
.pick[b-68cxy25fgs] { flex: none; width: 84px; height: 63px; box-sizing: border-box; padding: 0; border-radius: 8px; overflow: hidden; border: 2px solid transparent; background: var(--sunken); cursor: pointer; opacity: .55; transition: opacity .15s, border-color .15s; }
.pick img[b-68cxy25fgs] { width: 100%; height: 100%; object-fit: cover; display: block; }
.pick:hover[b-68cxy25fgs] { opacity: .85; }
.pick-on[b-68cxy25fgs], .pick-on:hover[b-68cxy25fgs] { opacity: 1; border-color: var(--accent); }
.count[b-68cxy25fgs] { margin: 10px 0 0; font-size: 13px; color: var(--muted); }
.details[b-68cxy25fgs] { display: flex; align-items: center; gap: 16px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--hairline); }
.details-words[b-68cxy25fgs] { flex: 1; min-width: 0; }
.details-title[b-68cxy25fgs] { font-size: 13.5px; color: var(--ink-strong); }
.details-text[b-68cxy25fgs] { margin: 4px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.example[b-68cxy25fgs] { margin: 12px 0 0; font-size: 12.5px; color: var(--muted); overflow-wrap: anywhere; }
.note[b-68cxy25fgs] { display: flex; align-items: center; gap: 10px; margin: 16px 0 4px; font-size: 12.5px; color: var(--muted); }
.note[b-68cxy25fgs]  .mud-icon-root { flex: none; width: 28px; height: 28px; padding: 6px; box-sizing: border-box; border-radius: 14px; font-size: 16px; color: var(--accent); background: var(--accent-soft); }
/* /Components/Plant/AddToLogSheet.razor.rz.scp.css */
/* Add to log: the readings side by side, two a row on a phone. */
.log-readings[b-gmmu5xse20] { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 10px; }
/* The techniques, as the desktop's toggles: a hairline round; ticked, the accent's soft fill in an accent ring. */
.ramah-tags .ramah-chip[b-gmmu5xse20] { font-size: 12.5px; padding: 4px 10px; color: var(--ink); }
.ramah-tags .ramah-chip.log-picked[b-gmmu5xse20], .ramah-tags .ramah-chip.log-picked:hover[b-gmmu5xse20] { background: var(--accent-soft); border-color: var(--accent); color: var(--ink-strong); }
@media (max-width: 520px) { .log-readings[b-gmmu5xse20] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* /Components/Plant/CalendarTile.razor.rz.scp.css */
/* The desktop's calendar tile: 46 × 50 on the surface, a strong hairline, a soft shadow, the band red (the accent for
   an age), its word 9.5px bold and spaced in white, the number 22px medium; the caption 10.5px, muted, centred. */
.fact-tile[b-y2w37s8967] { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.page[b-y2w37s8967] { width: 46px; height: 50px; box-sizing: border-box; border-radius: 9px; overflow: hidden; display: flex; flex-direction: column;
        background: var(--surface); border: 1px solid var(--hairline-strong); box-shadow: var(--tile-shadow); }
.band[b-y2w37s8967] { flex: none; padding: 2px 0 1px; text-align: center; background: var(--calendar); color: var(--calendar-ink); font: 700 9.5px/1.25 var(--sans-strong); letter-spacing: 1px; }
.age .band[b-y2w37s8967] { background: var(--accent); }
.value[b-y2w37s8967] { flex: 1; display: grid; place-items: center; font: 500 22px/1 var(--sans); color: var(--ink-strong); }
.caption[b-y2w37s8967] { font-size: 10.5px; line-height: 1.3; color: var(--muted); }
/* /Components/Plant/CycleBar.razor.rz.scp.css */
/* The desktop's full CycleBar: a 12px bar on the sunken track, rounded at its ends, a 2px gap after each part; the
   today line in ink through it; the labels 11px under it, muted, the current one in ink and medium. A label that
   doesn't fit its part drops out of sight (it wraps under the zero-width mark before it, past the row's height). */
.cycle[b-ol7lg29btd] { position: relative; padding-top: 3px; }
.bar[b-ol7lg29btd] { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: var(--sunken); }
.part[b-ol7lg29btd] { position: relative; flex: 1 1 0; min-width: 0; margin-right: 2px; background: color-mix(in srgb, var(--stage) 28%, transparent); }
.part:last-child[b-ol7lg29btd] { margin-right: 0; }
.part.done[b-ol7lg29btd] { background: var(--stage); }
.part i[b-ol7lg29btd] { position: absolute; left: 0; top: 0; bottom: 0; background: var(--stage); }
.part b[b-ol7lg29btd] { position: absolute; top: 0; bottom: 0; background: var(--danger); }
.held .part[b-ol7lg29btd] { margin: 0; }
.today[b-ol7lg29btd] { position: absolute; top: 0; width: 2px; height: 18px; margin-left: -1px; background: var(--ink); border-radius: 1px; }
.labels[b-ol7lg29btd] { position: relative; height: 16px; margin-top: 7px; }
.label[b-ol7lg29btd] { position: absolute; top: 0; height: 16px; display: flex; flex-wrap: wrap; overflow: hidden; font: 400 11px/16px var(--sans); color: var(--muted); }
.label i[b-ol7lg29btd] { width: 0; height: 16px; }
.label span[b-ol7lg29btd] { white-space: nowrap; }
.label.current[b-ol7lg29btd] { overflow: visible; color: var(--ink); font-weight: 500; }
.held-text[b-ol7lg29btd] { margin-top: 7px; font: 500 11px/16px var(--sans); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* /Components/Plant/HarvestSessionCard.razor.rz.scp.css */
/* One recorded cut. */
.session[b-wbbfzxvc1k] { padding: 12px 14px 4px; border: 1px solid var(--hairline); border-radius: 12px; }
.session-head[b-wbbfzxvc1k] { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.session-n[b-wbbfzxvc1k] { font: 400 22px/1 var(--serif); color: var(--ink); min-width: 18px; }
.session-head .ramah-save[b-wbbfzxvc1k] { margin-left: auto; }
.session-remove[b-wbbfzxvc1k] { font-size: 13px; color: var(--danger); }
.session-fields[b-wbbfzxvc1k] { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 8px; margin-bottom: 8px; }
.session[b-wbbfzxvc1k]  .mud-input-control { margin: 0; }
@media (max-width: 520px) { .session-fields[b-wbbfzxvc1k] { grid-template-columns: minmax(0, 1fr); } }
/* /Components/Plant/HarvestSheet.razor.rz.scp.css */
/* The harvest sheet: the sessions so far, then the next cut. */
.harvest-sessions[b-frkrb91eyf] { display: flex; flex-direction: column; gap: 10px; margin-bottom: 8px; }
.harvest-next[b-frkrb91eyf] { margin-top: 18px; padding: 16px 18px 18px; border: 1px solid var(--hairline); border-radius: var(--radius-card); background: var(--surface); }
.harvest-pair[b-frkrb91eyf] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
.harvest-add[b-frkrb91eyf] { display: flex; justify-content: flex-end; margin-top: 16px; }
.ramah-rule[b-frkrb91eyf] { margin-top: 16px; }
@media (max-width: 520px) { .harvest-pair[b-frkrb91eyf] { grid-template-columns: minmax(0, 1fr); } }
/* /Components/Plant/PhotoViewer.razor.rz.scp.css */
/* The full-window viewer, as the desktop's: the photo as large as the window allows on a near-black stage in either
   theme, the name, arrows and counter floating over it on shades that fade to clear. */
.viewer[b-w2h9t0lm56] { position: fixed; inset: 0; z-index: 1500; background: var(--viewer); display: flex; align-items: center; justify-content: center; outline: 0; }
.viewer img[b-w2h9t0lm56] { max-width: 100vw; max-height: 100vh; max-height: 100dvh; object-fit: contain; display: block; }
.viewer-top[b-w2h9t0lm56] { position: absolute; inset: 0 0 auto 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px 40px;
              background: linear-gradient(to bottom, var(--viewer-shade), transparent); }
.viewer-top b[b-w2h9t0lm56] { display: block; font: 400 24px/1.1 var(--serif); color: var(--viewer-ink); }
.viewer-top span[b-w2h9t0lm56] { font-size: 12.5px; color: var(--viewer-muted); }
.viewer-button[b-w2h9t0lm56] { width: 44px; height: 44px; border-radius: 50%; border: 0; display: grid; place-items: center; background: transparent; color: var(--viewer-muted); cursor: pointer; flex: none; }
.viewer-button:hover[b-w2h9t0lm56] { background: var(--viewer-hover); color: var(--viewer-hover-ink); }
.viewer-arrow.viewer-button[b-w2h9t0lm56] { background: var(--viewer-arrow); }
.viewer-arrow.viewer-button:hover[b-w2h9t0lm56] { background: var(--viewer-hover); }
.viewer-arrow[b-w2h9t0lm56] { position: absolute; top: 50%; margin-top: -22px; }
.viewer-prev[b-w2h9t0lm56] { left: 16px; }
.viewer-next[b-w2h9t0lm56] { right: 16px; }
.viewer-bottom[b-w2h9t0lm56] { position: absolute; inset: auto 0 0 0; display: flex; justify-content: center; gap: 14px; padding: 36px 20px 18px; font-size: 12.5px; color: var(--viewer-muted);
                 background: linear-gradient(to top, var(--viewer-shade), transparent); }
.viewer-cover[b-w2h9t0lm56] { color: var(--viewer-cover); }
/* /Components/Plant/PlantActivity.razor.rz.scp.css */
/* The desktop's activity: "Activity" in the serif over its count, the list/grid switch on its sunken track; the
   timeline a column of days (52), a 36-wide rail (a 1.5px thread, the icon in a 28px ring of its stage's colour on
   the surface), then the title 14px medium with its time at the right, where the plant stood, and 72 × 54 photos. The
   grid is cards at least 220 wide. Up to 560 tall, then it scrolls; a phone lets it run. */
.activity[b-0831vkea0y] { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.head[b-0831vkea0y] { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px; }
.title[b-0831vkea0y] { margin: 0; font: 400 24px/1.2 var(--serif); color: var(--ink-strong); }
.count[b-0831vkea0y] { margin-top: 2px; font-size: 12.5px; color: var(--muted); }
.switch[b-0831vkea0y] { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--sunken); }
.switch button[b-0831vkea0y] { display: grid; place-items: center; border: 0; background: transparent; padding: 6px 9px; border-radius: 8px; color: var(--muted); cursor: pointer; }
.switch button:hover[b-0831vkea0y] { background: var(--hover); color: var(--ink); }
.switch button.current[b-0831vkea0y] { background: var(--segment-selected); color: var(--ink-strong); }
.switch[b-0831vkea0y]  .mud-icon-root { width: 18px; height: 18px; font-size: 18px; }
.feed[b-0831vkea0y] { max-height: 560px; overflow-y: auto; margin-right: -10px; padding-right: 10px; scrollbar-width: thin; }

.item[b-0831vkea0y] { display: grid; grid-template-columns: 52px 36px minmax(0, 1fr); }
.day[b-0831vkea0y] { margin-top: 6px; font: 700 12px/1.3 var(--sans-strong); color: var(--ink-strong); }
.rail[b-0831vkea0y] { position: relative; display: flex; justify-content: center; }
.thread[b-0831vkea0y] { position: absolute; top: 28px; bottom: 0; left: calc(50% - .75px); width: 1.5px; background: var(--hairline); }
.item:last-child .thread[b-0831vkea0y] { bottom: 12px; }
.ring[b-0831vkea0y] { position: relative; display: grid; place-items: center; width: 28px; height: 28px; box-sizing: border-box; border-radius: 14px; border: 2px solid var(--stage); background: var(--surface); color: var(--ink); }
.ring.no-stage[b-0831vkea0y] { border-color: var(--faint); }
.ring[b-0831vkea0y]  .mud-icon-root { width: 14px; height: 14px; font-size: 14px; }
.body[b-0831vkea0y] { display: flex; flex-direction: column; gap: 3px; min-width: 0; margin: 4px 0 22px 8px; }
.line-head[b-0831vkea0y] { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.line-title[b-0831vkea0y] { font: 500 14px/1.35 var(--sans); color: var(--ink); overflow-wrap: anywhere; }
.time[b-0831vkea0y] { margin-top: 1px; font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.context[b-0831vkea0y] { font-size: 11.5px; line-height: 1.4; color: var(--muted); white-space: pre-wrap; }
.detail[b-0831vkea0y] { margin: 3px 0 0; font-size: 13.5px; line-height: 1.45; color: var(--ink); overflow-wrap: anywhere; white-space: pre-line; }
.code[b-0831vkea0y] { font: 400 11.5px/1.4 Menlo, Consolas, monospace; letter-spacing: 1px; color: var(--muted); }
.shots[b-0831vkea0y] { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.shot[b-0831vkea0y] { width: 72px; height: 54px; padding: 0; border: 0; border-radius: 6px; overflow: hidden; background: var(--sunken); cursor: pointer; }
.shot img[b-0831vkea0y] { width: 100%; height: 100%; object-fit: cover; display: block; }
.shots.small[b-0831vkea0y] { gap: 6px; }

.grid[b-0831vkea0y] { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; align-items: start; }
.card[b-0831vkea0y] { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 12px 14px; border-radius: 14px; background: var(--surface); border: 1px solid var(--hairline); }
.card-head[b-0831vkea0y] { display: flex; align-items: center; gap: 8px; }
.dot[b-0831vkea0y] { width: 9px; height: 9px; border-radius: 50%; background: var(--stage); flex: none; }
.dot.no-stage[b-0831vkea0y] { background: var(--faint); }
.card-date[b-0831vkea0y] { font-size: 12px; color: var(--muted); }
.card-title[b-0831vkea0y] { font: 500 15px/1.3 var(--sans); color: var(--ink); overflow-wrap: anywhere; }
.clamp[b-0831vkea0y] { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 760px) { .feed[b-0831vkea0y] { max-height: none; margin-right: 0; padding-right: 0; } }
/* /Components/Plant/PlantDetailsPanel.razor.rz.scp.css */
/* The desktop's details tab: each field under its small spaced label, Environment and Sex side by side (stacked when
   tight), the tags as chips with the box to add one at the end of the cloud, Mother and how the saving's going. */
.field[b-xxwezb9op9] { display: flex; flex-direction: column; min-width: 0; }
.label[b-xxwezb9op9] { margin: 0 0 6px 2px; font: 500 10.5px/1.3 var(--sans); letter-spacing: .15em; text-transform: uppercase; color: var(--muted); }
.pair[b-xxwezb9op9] { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px 10px; }
.cloud[b-xxwezb9op9] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.tag-new[b-xxwezb9op9] { flex: 1 1 120px; min-width: 120px; min-height: 28px; box-sizing: border-box; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--hairline-strong);
           background: var(--surface); color: var(--ink); font: 400 12.5px/1.3 var(--sans); outline: 0; }
.tag-new:hover[b-xxwezb9op9] { border-color: var(--accent-line); }
.tag-new:focus[b-xxwezb9op9] { border-color: var(--accent); }
.tag-new[b-xxwezb9op9]::placeholder { color: var(--faint); }
.foot[b-xxwezb9op9] { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.foot[b-xxwezb9op9]  .mud-checkbox { margin: 0 0 0 -8px; }
.foot[b-xxwezb9op9]  .mud-checkbox .mud-typography { font-size: 13.5px; color: var(--ink); }
.save[b-xxwezb9op9] { font: 400 12.5px/18px var(--serif); color: var(--muted); }
.save.failed[b-xxwezb9op9] { color: var(--danger); }
.hint[b-xxwezb9op9] { margin: -8px 0 0; font-size: 12px; line-height: 1.45; color: var(--faint); }
.details[b-xxwezb9op9]  .mud-input-control { margin: 0; }
/* /Components/Plant/PlantEnvironmentPanel.razor.rz.scp.css */
/* The desktop's environment tab: the span switch on its sunken track at the left, the 84px ring at the right. */
.head[b-y52gh7mc89] { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.switch[b-y52gh7mc89] { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--sunken); }
.switch button[b-y52gh7mc89] { border: 0; background: transparent; padding: 6px 9px; border-radius: 8px; font: 400 13px/1.2 var(--sans); color: var(--muted); cursor: pointer; }
.switch button:hover[b-y52gh7mc89] { background: var(--hover); color: var(--ink); }
.switch button.current[b-y52gh7mc89] { background: var(--segment-selected); color: var(--ink-strong); }
.score[b-y52gh7mc89] { width: 84px; height: 84px; flex: none; }
.score[b-y52gh7mc89]  .ring { min-width: 0; }
.empty[b-y52gh7mc89] { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
/* /Components/Plant/PlantLog.razor.rz.scp.css */
/* The desktop's log: "Log" 14px medium over its count, a small ghost Add to log…, the kind chips (the pick on the
   accent's soft fill), then a column of days (48 wide) beside quiet cards: the kind as a badge on its colour's soft fill,
   the time, ⋯, what was written, what was measured as small mono chips. Up to 560 tall, then it scrolls; a phone lets
   it run. */
.head[b-tkfgttwrxo] { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.title[b-tkfgttwrxo] { margin: 0; font: 500 14px/1.3 var(--sans); color: var(--ink); }
.count[b-tkfgttwrxo] { margin-top: 2px; font-size: 12.5px; color: var(--muted); }
.ghost[b-tkfgttwrxo] { padding: 5px 11px; border-radius: 10px; border: 1px solid var(--hairline-strong); background: transparent; font: 400 12px/1.35 var(--sans); color: var(--ink); cursor: pointer; white-space: nowrap; }
.ghost:hover[b-tkfgttwrxo] { background: var(--hover); }
.filters[b-tkfgttwrxo] { display: flex; flex-wrap: wrap; gap: 6px; }
.filter[b-tkfgttwrxo] { padding: 3px 10px; border-radius: 999px; border: 1px solid var(--hairline-strong); background: transparent; font: 400 12px/1.4 var(--sans); color: var(--ink); cursor: pointer; }
.filter:hover[b-tkfgttwrxo] { background: var(--hover); }
.filter.on[b-tkfgttwrxo] { background: var(--accent-soft); }
.empty[b-tkfgttwrxo] { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }

.feed[b-tkfgttwrxo] { max-height: 560px; overflow-y: auto; margin-right: -10px; padding-right: 10px; scrollbar-width: thin; }
.entry[b-tkfgttwrxo] { display: grid; grid-template-columns: 48px minmax(0, 1fr); margin-bottom: 10px; }
.day[b-tkfgttwrxo] { margin-top: 6px; font: 700 12px/1.3 var(--sans-strong); color: var(--ink-strong); }
.card[b-tkfgttwrxo] { display: flex; flex-direction: column; gap: 5px; min-width: 0; padding: 9px 12px; border-radius: 8px; border: 1px solid var(--hairline); --soft: var(--sunken); }
.k-water[b-tkfgttwrxo] { --soft: var(--blue-soft); }
.k-feed[b-tkfgttwrxo] { --soft: var(--success-soft); }
.k-training[b-tkfgttwrxo], .k-stage[b-tkfgttwrxo] { --soft: var(--accent-soft); }
.k-issue[b-tkfgttwrxo] { --soft: var(--danger-soft); }
.k-reading[b-tkfgttwrxo], .k-environment[b-tkfgttwrxo] { --soft: var(--gold-soft); }
.card-head[b-tkfgttwrxo] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; }
.kind[b-tkfgttwrxo] { display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px; border-radius: 999px; background: var(--soft); font: 700 11.5px/1.35 var(--sans-strong); color: var(--ink); }
.kind[b-tkfgttwrxo]  .kind-icon { width: 13px; height: 13px; font-size: 13px; }
.when[b-tkfgttwrxo] { margin-left: 10px; font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.more-button[b-tkfgttwrxo] { display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 999px; background: transparent; color: var(--muted); cursor: pointer; }
.more-button:hover[b-tkfgttwrxo] { background: var(--hover); color: var(--ink); }
.more-button[b-tkfgttwrxo]  .mud-icon-root { width: 18px; height: 18px; font-size: 18px; }
.note[b-tkfgttwrxo] { margin: 0; font-size: 13px; line-height: 1.45; color: var(--ink); overflow-wrap: anywhere; white-space: pre-line; }
.readings[b-tkfgttwrxo] { display: flex; flex-wrap: wrap; gap: 6px; }
.reading[b-tkfgttwrxo] { padding: 2px 7px; border-radius: 8px; background: var(--sunken); font: 400 11.5px/1.45 Menlo, Consolas, monospace; color: var(--ink); }
.more-entries[b-tkfgttwrxo] { margin: 2px 0 0 48px; padding: 2px 0; border: 0; background: none; font: 400 12.5px/1.3 var(--sans); color: var(--link); cursor: pointer; }
.more-entries:hover[b-tkfgttwrxo] { color: var(--link-hover); }
@media (max-width: 760px) { .feed[b-tkfgttwrxo] { max-height: none; margin-right: 0; padding-right: 0; } }
/* /Components/Plant/PlantPhotos.razor.rz.scp.css */
/* The desktop's photos: the frame on the sunken, 18 round, filling the height it's given beside the plant (the photo
   cropped to it) or, stacked, taking the photo's own shape (shown whole); arrows on a dark round that show on hover;
   the counter and Expand on dark pills at its foot; a drop in the accent. Under it the date, Cover in gold, Ask AI's
   spark in the accent and the ⋯; the strip's 84 × 63 thumbs, the one in view ringed in the accent, and the add tile. */
.frame[b-f8x46lzzfg] { position: relative; flex: 1 1 auto; min-height: 260px; max-height: 900px; border-radius: 18px; overflow: hidden; background: var(--sunken); }
.frame-empty[b-f8x46lzzfg] { min-height: 260px; }
.hero[b-f8x46lzzfg] { position: absolute; inset: 0; display: block; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.hero img[b-f8x46lzzfg] { width: 100%; height: 100%; object-fit: cover; display: block; }
.nav[b-f8x46lzzfg] { position: absolute; top: 50%; margin: -20px 12px 0; display: grid; place-items: center; padding: 7px; border: 0; border-radius: 22px; background: var(--scrim-soft); color: var(--on-photo); cursor: pointer; opacity: 0; transition: opacity .15s; }
.nav:hover[b-f8x46lzzfg] { background: var(--scrim-hover); }
.nav[b-f8x46lzzfg]  .mud-icon-root { width: 26px; height: 26px; font-size: 26px; }
.nav-prev[b-f8x46lzzfg] { left: 0; }
.nav-next[b-f8x46lzzfg] { right: 0; }
.frame:hover .nav[b-f8x46lzzfg], .nav:focus-visible[b-f8x46lzzfg] { opacity: 1; }
.pill[b-f8x46lzzfg] { position: absolute; left: 12px; bottom: 12px; padding: 3px 9px; border-radius: 11px; background: var(--scrim); color: var(--on-photo); font: 400 11.5px/1.35 var(--sans); }
.pill-button[b-f8x46lzzfg] { position: absolute; right: 12px; bottom: 12px; display: grid; place-items: center; padding: 7px; border: 0; border-radius: 14px; background: var(--scrim); color: var(--on-photo); cursor: pointer; }
.pill-button:hover[b-f8x46lzzfg] { background: var(--scrim-strong); }
.pill-button[b-f8x46lzzfg]  .mud-icon-root { width: 15px; height: 15px; font-size: 15px; }
@media (hover: none) { .nav[b-f8x46lzzfg] { opacity: 1; } }

.prompt[b-f8x46lzzfg] { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 16px; text-align: center; }
.prompt-title[b-f8x46lzzfg] { margin: 0; font: 400 24px/1.2 var(--serif); color: var(--ink-strong); }
.prompt p[b-f8x46lzzfg] { margin: 0; max-width: 320px; font-size: 12.5px; color: var(--muted); }
.ghost[b-f8x46lzzfg] { margin-top: 6px; padding: 5px 11px; border-radius: 10px; border: 1px solid var(--hairline-strong); font: 400 12px/1.35 var(--sans); color: var(--ink); }
.drop-note[b-f8x46lzzfg] { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 18px; background: color-mix(in srgb, var(--accent) 90%, transparent); color: var(--on-accent); font: 500 18px/1.2 var(--sans); pointer-events: none; }
.frame[b-f8x46lzzfg]  .drop { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; pointer-events: none; }
.frame[b-f8x46lzzfg]  .drop-on { pointer-events: auto; }

.bar[b-f8x46lzzfg] { display: flex; align-items: center; gap: 10px; min-height: 30px; }
.when[b-f8x46lzzfg] { font-size: 12.5px; color: var(--muted); }
.cover[b-f8x46lzzfg] { font-size: 12.5px; color: var(--gold); }
.grow[b-f8x46lzzfg] { flex: 1; }
.icon[b-f8x46lzzfg] { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 999px; background: transparent; color: var(--muted); cursor: pointer; }
.icon:hover[b-f8x46lzzfg] { background: var(--hover); color: var(--ink); }
.icon[b-f8x46lzzfg]  .mud-icon-root { width: 18px; height: 18px; font-size: 18px; }
.claude[b-f8x46lzzfg] { color: var(--accent); }
.claude:hover[b-f8x46lzzfg] { color: var(--accent); }
.busy[b-f8x46lzzfg] { opacity: .5; animation: pulse-b-f8x46lzzfg 1.2s ease-in-out infinite; }
@keyframes pulse-b-f8x46lzzfg { 50% { opacity: .25; } }

.import[b-f8x46lzzfg] { display: flex; flex-direction: column; gap: 6px; }
.import-line[b-f8x46lzzfg] { display: flex; justify-content: space-between; gap: 12px; font-size: 12.5px; color: var(--muted); }
.import-line span[b-f8x46lzzfg] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.link[b-f8x46lzzfg] { padding: 0; border: 0; background: none; font: 400 12px/1.3 var(--sans); color: var(--link); cursor: pointer; }

.strip[b-f8x46lzzfg] { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
.thumb[b-f8x46lzzfg] { flex: none; width: 84px; height: 63px; box-sizing: border-box; padding: 0; border-radius: 8px; overflow: hidden; border: 2px solid transparent; background: var(--sunken); cursor: pointer; opacity: .72; transition: opacity .15s; }
.thumb img[b-f8x46lzzfg] { width: 100%; height: 100%; object-fit: cover; display: block; }
.thumb:hover[b-f8x46lzzfg] { opacity: 1; }
.thumb-on[b-f8x46lzzfg] { opacity: 1; border-color: var(--accent); }
.add[b-f8x46lzzfg] { flex: none; display: grid; place-items: center; width: 84px; height: 63px; box-sizing: border-box; border-radius: 8px; border: 1.5px solid var(--hairline-strong); color: var(--muted); cursor: pointer; }
.add:hover[b-f8x46lzzfg] { background: var(--hover); border-color: var(--accent-line); color: var(--ink); }
.add[b-f8x46lzzfg]  .mud-icon-root { width: 20px; height: 20px; font-size: 20px; }
.add[b-f8x46lzzfg]  .hidden-input { display: none; }

/* Stacked over the plant (a narrow page), the frame takes the photo's own shape and shows it whole, never taller than
   most of the screen. */
@container plant (max-width: 899px) {
  .frame[b-f8x46lzzfg] { flex: none; min-height: 200px; max-height: none; }
  .hero[b-f8x46lzzfg] { position: relative; }
  .hero img[b-f8x46lzzfg] { height: auto; max-height: min(560px, 60vh); min-height: 200px; object-fit: contain; }
}
/* /Components/Plant/PlantRun.razor.rz.scp.css */
/* The desktop's run panel: the stage in the serif italic, its since and overall in captions, when it's due on the
   right (red once it's past the plan), the bar, and MOVE TO with its picker and a small Move. */
.top[b-0cy6gsbay2] { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; }
.now-block[b-0cy6gsbay2] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.now[b-0cy6gsbay2] { font: italic 400 19px/1.25 var(--serif); color: var(--display-em); }
.since[b-0cy6gsbay2] { display: flex; flex-wrap: wrap; gap: 0 8px; font-size: 12.5px; line-height: 1.4; color: var(--muted); }
.due[b-0cy6gsbay2] { max-width: 240px; margin-top: 4px; font-size: 13px; line-height: 1.35; color: var(--ink); text-align: right; }
.due.late[b-0cy6gsbay2] { color: var(--danger); }
.harvest[b-0cy6gsbay2] { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; font-size: 12.5px; color: var(--muted); }
.link[b-0cy6gsbay2] { padding: 2px 0; border: 0; background: none; font: inherit; color: var(--link); cursor: pointer; }
.link:hover[b-0cy6gsbay2] { color: var(--link-hover); }
.move[b-0cy6gsbay2] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; }
.move-label[b-0cy6gsbay2] { margin: 0 12px 0 2px; font: 500 10.5px/1.3 var(--sans); letter-spacing: .15em; text-transform: uppercase; color: var(--muted); }
.move-pick[b-0cy6gsbay2] { min-width: 0; }
.move-pick[b-0cy6gsbay2]  .mud-input-control { margin: 0; }
.primary[b-0cy6gsbay2], .ghost[b-0cy6gsbay2] { margin-left: 10px; padding: 5px 11px; border-radius: 10px; font: 500 12px/1.35 var(--sans); cursor: pointer; white-space: nowrap; }
.primary[b-0cy6gsbay2] { border: 0; background: var(--accent); color: var(--on-accent); }
.primary:hover[b-0cy6gsbay2] { background: var(--accent-hover); }
.primary[disabled][b-0cy6gsbay2] { background: var(--accent-disabled); color: var(--on-accent-disabled); cursor: default; }
.ghost[b-0cy6gsbay2] { border: 1px solid var(--hairline-strong); background: transparent; color: var(--ink); font-weight: 400; }
.ghost:hover[b-0cy6gsbay2] { background: var(--hover); }
@media (max-width: 520px) {
  .top[b-0cy6gsbay2] { grid-template-columns: minmax(0, 1fr); }
  .due[b-0cy6gsbay2] { text-align: left; max-width: none; margin-top: 0; }
  .move[b-0cy6gsbay2] { grid-template-columns: auto minmax(0, 1fr) auto; row-gap: 10px; }
  .ghost[b-0cy6gsbay2] { grid-column: 2 / -1; justify-self: end; }
}
/* /Components/Plant/PlantTag.razor.rz.scp.css */
/* The desktop's tag chip: a pill at least 28 tall, 12.5px ink on the sunken (10px in, 6px before its ×); a rule's in
   the accent on its soft fill, with a 12px spark before the word. */
.chip[b-nc9jp9sa6s] { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; box-sizing: border-box; padding: 4px 10px; border-radius: 999px; background: var(--sunken); vertical-align: middle; }
.chip.removable[b-nc9jp9sa6s] { padding: 4px 6px 4px 10px; }
.chip.auto[b-nc9jp9sa6s] { padding: 4px 10px 4px 8px; background: var(--accent-soft); }
.word[b-nc9jp9sa6s] { font: 400 12.5px/1.3 var(--sans); color: var(--ink); white-space: nowrap; }
.auto .word[b-nc9jp9sa6s] { color: var(--accent); }
.chip[b-nc9jp9sa6s]  .spark { width: 12px; height: 12px; font-size: 12px; color: var(--accent); }
.chip[class*="ramah-tone-"]:not(.ramah-tone-plain)[b-nc9jp9sa6s] { background: var(--tone-soft); }
.chip[class*="ramah-tone-"]:not(.ramah-tone-plain) .word[b-nc9jp9sa6s] { color: var(--tone-ink); }
.x[b-nc9jp9sa6s] { display: inline-grid; place-items: center; width: 17px; height: 17px; padding: 0; border: 0; border-radius: 999px; background: transparent; color: var(--muted); cursor: pointer; }
.x:hover[b-nc9jp9sa6s] { background: var(--hover); color: var(--ink); }
.x[b-nc9jp9sa6s]  .mud-icon-root { width: 11px; height: 11px; font-size: 11px; }
/* /Components/ZoneCard.razor.rz.scp.css */
/* The desktop's environment card: its name in the serif, the status pill and the controller, then its groups. */
.zone[b-owbacmg7ne] { display: flex; flex-direction: column; gap: 18px; padding: 18px 20px 20px; border-radius: 14px; min-width: 0; }
.head[b-owbacmg7ne] { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.title[b-owbacmg7ne] { display: flex; align-items: center; gap: 8px; min-width: 0; }
.name[b-owbacmg7ne] { flex: 1; min-width: 0; font: 400 21px/1.15 var(--serif); color: var(--ink-strong); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Its ⋯, as the desktop's MoreButton: quiet, round, always there. */
.title[b-owbacmg7ne]  .more { flex: none; margin-right: -6px; }
.more-button[b-owbacmg7ne] { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 999px; background: transparent; color: var(--muted); cursor: pointer; }
.more-button:hover[b-owbacmg7ne] { background: var(--hover); color: var(--ink); }
.more-button[b-owbacmg7ne]  .mud-icon-root { width: 20px; height: 20px; font-size: 20px; }
.line[b-owbacmg7ne] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.controller[b-owbacmg7ne] { font-size: 12px; color: var(--muted); }
.plants[b-owbacmg7ne] { font-size: 12px; }

/* How the controller is reporting, and when it last read: green online, amber quiet, red offline. Click to read now. */
.status[b-owbacmg7ne] { display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; border: 0; border-radius: 999px; cursor: default;
          font: 500 11.5px/1.3 var(--sans); background: var(--sunken); color: var(--muted); }
.status i[b-owbacmg7ne] { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.status.online[b-owbacmg7ne] { background: var(--success-soft); color: var(--success); }
.status.online i[b-owbacmg7ne] { background: var(--environment-good); }
.status.quiet[b-owbacmg7ne] { background: var(--gold-soft); color: var(--gold); }
.status.quiet i[b-owbacmg7ne] { background: var(--environment-warn); }
.status.offline[b-owbacmg7ne] { background: var(--danger-soft); color: var(--danger); }
.status.offline i[b-owbacmg7ne] { background: var(--environment-bad); }

/* Climate: every reading as a ring in a quiet tile, as many to a row as fit (at least 104 wide; 88 on a phone), a
   short row split between just those. */
.group[b-owbacmg7ne] { display: flex; flex-direction: column; gap: 10px; }
.gauges[b-owbacmg7ne] { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); }
.gauge[b-owbacmg7ne] { position: relative; min-width: 0; padding: 8px 6px; border: 1px solid var(--hairline); border-radius: 8px; box-sizing: border-box; }
/* Climate over Equipment, as the desktop's CardBands: cards side by side are one height, and Equipment keeps the
   bottom 40% of it, so their dials start on one line however many sensors each has. Listed one to a row (or on a
   phone), the two simply stack. */
.bands[b-owbacmg7ne] { flex: 1; display: grid; grid-template-rows: 3fr 2fr; row-gap: 18px; align-content: stretch; }
.bands.stacked[b-owbacmg7ne] { grid-template-rows: auto auto; }
.note[b-owbacmg7ne] { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }

/* A reading's line, as the desktop's tooltip: after a moment's rest, or a tap. Out of the layout until it shows. */
.tip[b-owbacmg7ne] { display: none; position: absolute; z-index: 30; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%); width: max-content; max-width: 280px;
       padding: 6px 10px; border-radius: 8px; background: var(--sheet); border: 1px solid var(--hairline-strong); box-shadow: var(--sheet-shadow);
       font: 400 12px/1.4 var(--sans); color: var(--ink); pointer-events: none; }
@media (hover: hover) {
  .gauge:hover .tip[b-owbacmg7ne] { display: block; animation: tip-in-b-owbacmg7ne .15s .4s both; }
}
.open .tip[b-owbacmg7ne] { display: block; animation: tip-in-b-owbacmg7ne .15s both; }
@keyframes tip-in-b-owbacmg7ne { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 760px) {
  .zone[b-owbacmg7ne] { padding: 16px 16px 18px; }
  .bands[b-owbacmg7ne] { grid-template-rows: auto auto; }
  .gauges[b-owbacmg7ne] { grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); }
  .gauge[b-owbacmg7ne]  .ring { max-width: 104px; min-width: 64px; }
  .tip[b-owbacmg7ne] { position: fixed; left: 16px; right: 16px; bottom: calc(96px + env(safe-area-inset-bottom)); transform: none; width: auto; max-width: none; padding: 10px 12px; }
}
/* /Components/ZonesPanel.razor.rz.scp.css */
/* The Environments page lists its cards one to a row, each with the width to itself. */
.listed[b-p9roh00x8s] { grid-template-columns: minmax(0, 1fr); gap: 18px; }
/* /Pages/BreedingPage.razor.rz.scp.css */
/* Breeding: the desktop's Cross Finder (BreedingView). The ask on its panel; the results as a list of crosses
   beside the chosen one's family tree and odds; one column on a phone. */
.bz-ask[b-wcwcfpgyw5] { display: flex; flex-direction: column; gap: 12px; padding: 22px 24px; }
.bz-box[b-wcwcfpgyw5] { width: 100%; box-sizing: border-box; min-height: 96px; resize: vertical; border: 1px solid var(--hairline-strong); border-radius: var(--radius-card); background: var(--surface);
          padding: 16px 18px; font: 400 21px/1.45 var(--serif); color: var(--ink-strong); transition: border-color .2s; }
.bz-box[b-wcwcfpgyw5]::placeholder { color: var(--faint); }
.bz-box:focus[b-wcwcfpgyw5] { outline: none; border-color: var(--accent-line); }
.bz-ask-foot[b-wcwcfpgyw5] { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.bz-tags[b-wcwcfpgyw5] { flex: 1; min-width: 0; min-height: 30px; align-items: center; }
.bz-trait[b-wcwcfpgyw5] { display: inline-flex; align-items: center; gap: 2px; }
.bz-unscored[b-wcwcfpgyw5]  .ramah-tag { border-style: dashed; }
.bz-trait[b-wcwcfpgyw5]  .bz-ai { width: 14px; height: 14px; color: var(--display-em); }
.bz-find[b-wcwcfpgyw5] { flex: none; }
.bz-scan[b-wcwcfpgyw5] { display: flex; align-items: center; gap: 16px; font-size: 12.5px; color: var(--muted); }
.bz-step[b-wcwcfpgyw5] { flex: none; min-width: 0; max-width: 60%; }
/* The scan, as the desktop's ProgressBar.ramah-scan-bar: 3 tall, the lilac on the sunken. */
.bz-bar[b-wcwcfpgyw5] { flex: 1; height: 3px; border-radius: 2px; background: var(--sunken); overflow: hidden; }
.bz-bar i[b-wcwcfpgyw5] { display: block; height: 100%; width: 100%; background: var(--display-em); transition: width .4s; }
.bz-scan.idle .bz-bar i[b-wcwcfpgyw5] { width: 0; }
.bz-scan.busy .bz-bar i[b-wcwcfpgyw5] { width: 40%; animation: bz-scan-b-wcwcfpgyw5 1.1s ease-in-out infinite alternate; }
@keyframes bz-scan-b-wcwcfpgyw5 { from { transform: translateX(-100%); } to { transform: translateX(250%); } }
.bz-note[b-wcwcfpgyw5] { margin: 0; }
.bz-empty[b-wcwcfpgyw5] { max-width: 640px; margin: 22px 2px; }
.bz-results[b-wcwcfpgyw5] { display: grid; grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); gap: 22px; margin-top: 22px; align-items: start; }
.bz-list[b-wcwcfpgyw5] { display: flex; flex-direction: column; gap: 10px; }
.bz-viz[b-wcwcfpgyw5] { padding: 20px 22px 22px; min-width: 0; }
.bz-viz-wide[b-wcwcfpgyw5] { margin-top: 22px; }
.bz-viz-head[b-wcwcfpgyw5] { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.bz-why[b-wcwcfpgyw5] { margin: 8px 0 4px; color: var(--ink); max-width: 72ch; }
.bz-tree[b-wcwcfpgyw5] { margin: 6px -8px 0; }
.bz-caveat[b-wcwcfpgyw5] { margin: 14px 0 0; }
.bz-private[b-wcwcfpgyw5] { margin: 22px 2px 0; }
.bz-intro[b-wcwcfpgyw5] { margin: 0; }
.bz-pair[b-wcwcfpgyw5] { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 12px; align-items: end; }
.bz-pair > div[b-wcwcfpgyw5] { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.bz-x[b-wcwcfpgyw5] { font: 400 26px/1 var(--serif); color: var(--muted); padding-bottom: 8px; }
.bz-hope-label[b-wcwcfpgyw5] { margin-top: 4px; }
.bz-hope[b-wcwcfpgyw5] { width: 100%; box-sizing: border-box; height: 40px; border: 1px solid var(--hairline-strong); border-radius: var(--radius); background: var(--surface); padding: 0 12px; color: var(--ink); font: inherit; }
.bz-hope:focus[b-wcwcfpgyw5] { outline: none; border-color: var(--accent-line); }
@media (max-width: 1100px) {
  .bz-results[b-wcwcfpgyw5] { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .bz-ask[b-wcwcfpgyw5] { padding: 16px; }
  .bz-box[b-wcwcfpgyw5] { font-size: 18px; padding: 14px; }
  .bz-scan[b-wcwcfpgyw5] { flex-wrap: wrap; gap: 8px; }
  .bz-step[b-wcwcfpgyw5] { max-width: none; }
  .bz-bar[b-wcwcfpgyw5] { flex-basis: 100%; }
  .bz-viz[b-wcwcfpgyw5] { padding: 16px 12px; }
  .bz-pair[b-wcwcfpgyw5] { grid-template-columns: 1fr; }
  .bz-x[b-wcwcfpgyw5] { display: none; }
  .bz-find[b-wcwcfpgyw5] { width: 100%; }
}
/* /Pages/CultivarPage.razor.rz.scp.css */
/* A line's page, as the desktop's: the photo beside whose line it is, the name, the italic lineage, chips, the stage
   mix and its count, with Actions at the right; the family tree in a panel under its section label; About beside
   Growing; then its plants. Shared parts (chips, panels, tiles) are in wwwroot/css/ramah.css. */
.cv-top[b-maqe5y7ds9] { display: flex; justify-content: flex-end; min-height: 18px; margin: -4px 0 4px; }
.cv-save:empty[b-maqe5y7ds9] { display: none; }

.cv-hero[b-maqe5y7ds9] { display: grid; grid-template-columns: 300px minmax(0, 1fr) auto; gap: 30px; align-items: center; }
.cv-photo[b-maqe5y7ds9] { position: relative; height: 220px; border-radius: var(--radius-sheet); overflow: hidden; background: var(--accent-soft); }
.cv-photo[b-maqe5y7ds9]  .cv-photo-img { position: absolute; inset: 0; }
.cv-photo[b-maqe5y7ds9]  .ramah-initials { font-size: 56px; }
.cv-photo-takes[b-maqe5y7ds9] { cursor: pointer; }
.cv-photo-hint[b-maqe5y7ds9] { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; padding: 5px 10px; border-radius: 999px; font-size: 12.5px; color: var(--ink); background: var(--surface); opacity: .92; pointer-events: none; }
.cv-photo-hint[b-maqe5y7ds9]  .mud-icon-root { width: 14px; height: 14px; }
/* The file box covers the photo, unseen: click it to pick, or drop a photo on it. */
.cv-photo[b-maqe5y7ds9]  .cv-photo-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; font-size: 0; }
.cv-photo-takes:hover[b-maqe5y7ds9] { box-shadow: 0 0 0 1px var(--accent-line); }

.cv-head[b-maqe5y7ds9] { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.cv-origin[b-maqe5y7ds9] { margin: 0 0 2px; }
.cv-name[b-maqe5y7ds9] { display: block; width: 100%; box-sizing: border-box; background: transparent; border: 0; border-radius: 6px 6px 0 0; border-bottom: 1px solid transparent; outline: 0; padding: 2px 0; margin: 0; font: 400 40px/1.15 var(--serif); letter-spacing: -.01em; color: var(--ink-strong); transition: border-color .15s, background .15s; }
.cv-name:hover[b-maqe5y7ds9] { background: var(--hover); }
.cv-name:focus[b-maqe5y7ds9] { background: transparent; border-bottom-color: var(--gold-fill); }
.cv-name[b-maqe5y7ds9]::placeholder { color: var(--faint); }
.cv-sub[b-maqe5y7ds9] { margin: 0; font-size: 20px; }
.cv-sub-none[b-maqe5y7ds9] { color: var(--faint); }
.cv-chips[b-maqe5y7ds9] { margin-top: 4px; gap: 8px; }
.cv-mix[b-maqe5y7ds9] { margin: 10px 0 0; width: 420px; max-width: 100%; height: 8px; }
.cv-meta[b-maqe5y7ds9] { margin: 0; }
.cv-hero[b-maqe5y7ds9]  .cv-actions { align-self: start; margin-top: 6px; }
.cv-hero[b-maqe5y7ds9]  .cv-actions .ramah-pill .mud-icon-root { margin-right: -4px; }

.cv-ancestry[b-maqe5y7ds9] { margin-top: 26px; }
.cv-tree[b-maqe5y7ds9] { padding: 16px 18px; }

.cv-panels[b-maqe5y7ds9] { margin-top: 26px; gap: 18px; }
.cv-panel[b-maqe5y7ds9] { padding: 20px 20px 22px; display: flex; flex-direction: column; gap: 14px; }
.cv-panel > .ramah-subhead[b-maqe5y7ds9], .cv-panel-head .ramah-subhead[b-maqe5y7ds9] { font-size: 14px; font-weight: 500; color: var(--ink-strong); }
.cv-panel-head[b-maqe5y7ds9] { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.cv-field[b-maqe5y7ds9] { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cv-field[b-maqe5y7ds9]  .mud-input-control { margin: 0; }
.cv-pair[b-maqe5y7ds9] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cv-help[b-maqe5y7ds9] { color: var(--muted); line-height: 1.45; }
.cv-help-top[b-maqe5y7ds9] { margin-top: -4px; }
.cv-short[b-maqe5y7ds9] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cv-short-box[b-maqe5y7ds9] { width: 180px; }
.cv-idea[b-maqe5y7ds9] { min-height: 24px; padding: 2px 10px; border-radius: 999px; border: 1px solid var(--accent-line); background: transparent; color: var(--accent); font: 400 12px/1.2 var(--sans); cursor: pointer; transition: background .15s; }
.cv-idea:hover[b-maqe5y7ds9] { background: var(--accent-soft); }
.cv-breeder[b-maqe5y7ds9] { display: flex; align-items: center; gap: 6px; }
.cv-breeder-box[b-maqe5y7ds9] { flex: 1; min-width: 0; }
.cv-switches[b-maqe5y7ds9] { display: flex; flex-wrap: wrap; gap: 6px 28px; margin-top: -4px; }
.cv-grown-for[b-maqe5y7ds9] { align-self: flex-start; }

.cv-days[b-maqe5y7ds9] { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.cv-panel-plan[b-maqe5y7ds9] { container-type: inline-size; }
.cv-run[b-maqe5y7ds9] { display: flex; gap: 4px; margin-top: 2px; }
.cv-run-part[b-maqe5y7ds9] { min-width: 44px; display: flex; flex-direction: column; gap: 8px; }
.cv-run-legend[b-maqe5y7ds9] { display: none; margin-top: -8px; }
/* A short stage's name won't fit under its part in a narrow panel: the legend names them all instead. */
@container (max-width: 420px) {
  .cv-run-part[b-maqe5y7ds9] { min-width: 6px; }
  .cv-run-part > span[b-maqe5y7ds9] { display: none; }
  .cv-run-legend[b-maqe5y7ds9] { display: flex; }
}
.cv-run-part > i[b-maqe5y7ds9] { display: block; height: 8px; border-radius: 4px; background: var(--stage); }
.cv-run-part > span[b-maqe5y7ds9] { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cv-run-part > span b[b-maqe5y7ds9] { display: block; font-weight: 500; color: var(--ink); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; }
.cv-plan-text[b-maqe5y7ds9] { margin: -4px 0 0; line-height: 1.5; }

.cv-plants[b-maqe5y7ds9] { margin-top: 14px; }

@media (max-width: 1100px) {
  .cv-hero[b-maqe5y7ds9] { grid-template-columns: 240px minmax(0, 1fr) auto; gap: 24px; }
  .cv-photo[b-maqe5y7ds9] { height: 190px; }
}
/* Narrow: the photo across the top, the words under it, Actions beside whose line it is. */
@media (max-width: 860px) {
  .cv-hero[b-maqe5y7ds9] { grid-template-columns: minmax(0, 1fr) auto; gap: 20px 16px; }
  .cv-photo[b-maqe5y7ds9] { grid-column: 1 / -1; height: 220px; }
  .cv-hero[b-maqe5y7ds9]  .cv-actions { grid-row: 2; grid-column: 2; }
  .cv-name[b-maqe5y7ds9] { font-size: 34px; }
}
@media (max-width: 760px) {
  .cv-photo[b-maqe5y7ds9] { height: 200px; }
  .cv-panel[b-maqe5y7ds9] { padding: 18px 16px 20px; }
  .cv-pair[b-maqe5y7ds9] { grid-template-columns: 1fr; }
  .cv-days[b-maqe5y7ds9] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cv-ancestry[b-maqe5y7ds9] { margin-top: 28px; }
}

/* Names like the one being typed, under it: yours open, the library's fill this line in. */
.cv-name-matches[b-maqe5y7ds9] { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 4px; }
.cv-name-match[b-maqe5y7ds9] { display: inline-flex; align-items: baseline; gap: 8px; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--hairline-strong);
  background: var(--surface); color: var(--ink); font: 400 13px/1.3 var(--sans); text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s; }
.cv-name-match:hover[b-maqe5y7ds9] { background: var(--hover); border-color: var(--accent-line); }
.cv-name-match-name[b-maqe5y7ds9] { font-weight: 500; }
.cv-name-match-detail[b-maqe5y7ds9] { color: var(--muted); font-size: 12px; }
/* /Pages/CultivarsPage.razor.rz.scp.css */
/* The Cultivars gallery's own spacing; tiles, cards and the search are shared (wwwroot/css/ramah.css). */
.cv-library-count[b-x2nkpdmn15] { margin-top: 0; }
.cv-library[b-x2nkpdmn15] { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 12px; }
/* A phone: one line to a row, as the phone app has it. */
@media (max-width: 599.98px) { .cv-gallery[b-x2nkpdmn15] { grid-template-columns: minmax(0, 1fr); } }
/* /Pages/LibraryStrainPage.razor.rz.scp.css */
/* A shared strain, as the desktop's: one centred column; its initials in a round of the accent beside its name,
   lineage and breeder, Make it mine at the right; what the sources say in a panel; then the pages they said it on. */
.lib-page[b-8yvmdlhzeo] { max-width: 900px; margin: 0 auto; padding-top: 14px; }
.lib-hero[b-8yvmdlhzeo] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 26px; align-items: center; }
.lib-initials[b-8yvmdlhzeo] { width: 150px; height: 150px; border-radius: 50%; display: grid; place-items: center; font: 400 54px/1 var(--serif); color: var(--accent); background: var(--accent-soft); }
.lib-head[b-8yvmdlhzeo] { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.lib-name[b-8yvmdlhzeo] { font-size: 40px; overflow-wrap: anywhere; }
.lib-sub[b-8yvmdlhzeo] { margin: 0; font-size: 20px; }
.lib-breeder[b-8yvmdlhzeo] { margin: 0; font-size: 13px; }
.lib-action[b-8yvmdlhzeo] { align-self: start; margin-top: 6px; display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.lib-explainer[b-8yvmdlhzeo] { margin: 26px 0 0; }
.lib-panel[b-8yvmdlhzeo] { margin-top: 18px; display: flex; flex-direction: column; gap: 14px; }
.lib-panel-title[b-8yvmdlhzeo] { color: var(--ink-strong); }
.lib-summary[b-8yvmdlhzeo] { margin: 0; font-size: 13.5px; font-weight: 500; line-height: 1.55; color: var(--ink-strong); max-width: 70ch; }
.lib-tags[b-8yvmdlhzeo] { display: flex; flex-direction: column; gap: 10px; margin-top: 2px; padding-left: 2px; }
.lib-section[b-8yvmdlhzeo] { margin-top: 26px; display: flex; flex-direction: column; gap: 8px; padding-left: 2px; }
.lib-provenance[b-8yvmdlhzeo] { margin: 4px 0 0; }
.lib-sources[b-8yvmdlhzeo] { display: flex; flex-direction: column; gap: 6px; }
.lib-source[b-8yvmdlhzeo] { align-self: flex-start; font-size: 13px; }

@media (max-width: 900px) {
  .lib-hero[b-8yvmdlhzeo] { grid-template-columns: auto minmax(0, 1fr); }
  .lib-action[b-8yvmdlhzeo] { grid-column: 1 / -1; margin-top: 0; }
}
@media (max-width: 600px) {
  .lib-hero[b-8yvmdlhzeo] { grid-template-columns: 1fr; gap: 18px; }
  .lib-initials[b-8yvmdlhzeo] { width: 96px; height: 96px; font-size: 36px; }
  .lib-name[b-8yvmdlhzeo] { font-size: 32px; }
}
/* /Pages/NewPlantPage.razor.rz.scp.css */
/* The new plant: one column of fields in the record's card, the action at its foot. */
.form[b-rmt4cl8slv] { display: block; max-width: 640px; padding: 30px 36px 32px; }
.form > .ramah-field-label:first-child[b-rmt4cl8slv] { margin-top: 0; }
.pair[b-rmt4cl8slv] { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0 14px; }
.hint[b-rmt4cl8slv] { display: block; margin-top: 6px; color: var(--faint); }
/* The environments already in use, as the desktop's place picks: a hairline round, the hover tint when pointed at;
   the one picked as the desktop marks a pick (its technique toggle): the accent's soft fill, an accent ring. */
.places[b-rmt4cl8slv] { margin-top: 10px; }
.places .ramah-tag[b-rmt4cl8slv] { cursor: pointer; min-height: 0; padding: 4px 11px; background: transparent; border: 1px solid var(--hairline-strong); color: var(--ink); }
.places .ramah-tag:hover[b-rmt4cl8slv] { background: var(--hover); }
.places .picked[b-rmt4cl8slv], .places .picked:hover[b-rmt4cl8slv] { background: var(--accent-soft); border-color: var(--accent); color: var(--ink-strong); }
.actions[b-rmt4cl8slv] { display: flex; justify-content: flex-end; gap: 10px; margin-top: 28px; }
.form[b-rmt4cl8slv]  .mud-input-control { margin: 0; }
@media (max-width: 760px) { .form[b-rmt4cl8slv] { padding: 22px 18px 24px; } }
/* /Pages/PlantPage.razor.rz.scp.css */
/* A plant's page, as the desktop's: wide (900 and up), the plant beside its photos, 6 to 5, 32 apart; the photos take
   the height of the plant's head and tabs, so the log and the activity start on one line under them. Narrow: the
   photos, the plant, its log, then the activity. Shared parts are in wwwroot/css/ramah.css. */
.page[b-e52jxry0mi] { container: plant / inline-size; max-width: 1640px; }
.plant[b-e52jxry0mi] { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); grid-template-areas: "info photos" "log activity"; column-gap: 32px; row-gap: 18px; align-items: start; }
.info[b-e52jxry0mi] { grid-area: info; display: flex; flex-direction: column; min-width: 0; }
.photos[b-e52jxry0mi] { grid-area: photos; align-self: stretch; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.log[b-e52jxry0mi] { grid-area: log; min-width: 0; }
.activity[b-e52jxry0mi] { grid-area: activity; min-width: 0; }
@container plant (max-width: 899px) {
  .plant[b-e52jxry0mi] { grid-template-columns: minmax(0, 1fr); grid-template-areas: "photos" "info" "log" "activity"; row-gap: 18px; }
  .photos[b-e52jxry0mi] { align-self: start; margin-bottom: 4px; }
  .activity[b-e52jxry0mi] { margin-top: 10px; }
}

/* Who it is: MOTHER in gold, the name in the serif with Actions beside it, its lineage in the serif italic, then the
   two calendar tiles and the rest of its facts, its NFC tag and its tags. */
.head[b-e52jxry0mi] { display: flex; flex-direction: column; gap: 6px; }
.eyebrow[b-e52jxry0mi] { margin: 0; font: 500 10.5px/1.3 var(--sans); letter-spacing: .21em; text-transform: uppercase; color: var(--gold); }
.name-line[b-e52jxry0mi] { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.name[b-e52jxry0mi] { margin: 0; padding: 0; font: 400 32px/1.2 var(--serif); color: var(--ink); overflow-wrap: anywhere; }
/* The name is the field: it reads as the heading until pointed at or typed in (the cultivar page's name, the same way). */
.name-input[b-e52jxry0mi] { display: block; width: 100%; box-sizing: border-box; background: transparent; border: 0; border-radius: 6px 6px 0 0; border-bottom: 1px solid transparent;
  outline: 0; padding: 2px 0; margin: 0; font: inherit; letter-spacing: -.01em; color: inherit; text-overflow: ellipsis; transition: border-color .15s, background .15s; }
.name-input:hover[b-e52jxry0mi] { background: var(--hover); }
.name-tools[b-e52jxry0mi] { display: flex; align-items: center; gap: 12px; }
.name-input:focus[b-e52jxry0mi] { background: transparent; border-bottom-color: var(--gold-fill); }
.actions[b-e52jxry0mi] { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; border: 1px solid var(--hairline-strong); background: transparent;
           font: 500 13px/1.3 var(--sans); color: var(--ink); cursor: pointer; white-space: nowrap; }
.actions:hover[b-e52jxry0mi] { background: var(--hover); }
.actions[b-e52jxry0mi]  .mud-icon-root { width: 14px; height: 14px; font-size: 14px; }
.lineage[b-e52jxry0mi] { margin: 0; font: italic 400 17px/1.3 var(--serif); color: var(--display-em); text-decoration: none; overflow-wrap: anywhere; }
a.lineage:hover[b-e52jxry0mi] { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.tiles[b-e52jxry0mi] { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 8px 0 2px; }
.facts[b-e52jxry0mi] { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.facts-text[b-e52jxry0mi] { font-size: 12.5px; line-height: 1.4; color: var(--muted); white-space: pre-wrap; }
.chips[b-e52jxry0mi] { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.nfc[b-e52jxry0mi] { padding: 3px 10px; border-radius: 999px; border: 1px solid var(--hairline-strong); background: transparent; font: 400 11.5px/1.4 var(--sans); color: var(--muted); cursor: pointer; }
.nfc:hover[b-e52jxry0mi] { color: var(--ink); }
.note[b-e52jxry0mi] { margin: 4px 0 0; font-size: 12.5px; color: var(--muted); }
.ended[b-e52jxry0mi] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12.5px; color: var(--danger); }
.ghost[b-e52jxry0mi] { padding: 5px 11px; border-radius: 10px; border: 1px solid var(--hairline-strong); background: transparent; font: 400 12px/1.35 var(--sans); color: var(--ink); cursor: pointer; }
.ghost:hover[b-e52jxry0mi] { background: var(--hover); }

/* The tabs, as the desktop's: 15px, muted, 24 apart; the one open in the strong ink over a gold pipe. */
.tabs[b-e52jxry0mi] { display: flex; flex-wrap: wrap; gap: 0 24px; margin-top: 18px; }
.tab[b-e52jxry0mi] { position: relative; min-height: 36px; padding: 0; border: 0; background: none; font: 400 15px/36px var(--sans); color: var(--muted); cursor: pointer; }
@media (hover: hover) { .tab:hover[b-e52jxry0mi] { color: var(--ink); } }
.tab.current[b-e52jxry0mi] { color: var(--ink-strong); }
.tab.current[b-e52jxry0mi]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; border-radius: 2px; background: var(--gold-fill); }
.tab:focus-visible[b-e52jxry0mi] { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.tab-body[b-e52jxry0mi] { display: flex; flex-direction: column; gap: 12px; padding-top: 12px; min-width: 0; }

/* Lineage: the bubbles in a panel, then what came from it. */
.lineage-tab[b-e52jxry0mi] { display: flex; flex-direction: column; gap: 18px; }
.tree[b-e52jxry0mi] { padding: 18px 16px; }
.offspring[b-e52jxry0mi] { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.offspring .eyebrow[b-e52jxry0mi] { margin-bottom: 0; }
.child[b-e52jxry0mi] { padding: 2px 0; font-size: 13px; color: var(--link); text-decoration: none; }
.child:hover[b-e52jxry0mi] { color: var(--link-hover); }

@media (max-width: 760px) {
  .name[b-e52jxry0mi] { font-size: 28px; }
}
/* /Pages/SettingsPage.razor.rz.scp.css */
/* Settings, as the desktop's: the panes at the left (MudBlazor's nav menu: each its icon on a small tinted tile, the
   chosen one on the surface), a hairline, and the chosen one's groups beside them, as wide as they read well. On a
   phone the panes are a grouped list of their own (one card, hairlines between, a chevron at each end) and each opens
   on its own, with the way back. */
.ramah-settings[b-9cm4c5xty2] { display: grid; grid-template-columns: 232px minmax(0, 580px); align-items: stretch; min-height: calc(100vh - 40px); min-height: calc(100dvh - 40px); margin: -22px 0 -48px -40px; }
.ramah-settings-topics[b-9cm4c5xty2] { padding: 32px 12px 16px 14px; border-right: 1px solid var(--hairline); }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-list-title { display: none; }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-panes { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 2px; }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link { display: flex; align-items: center; gap: 10px; min-height: 40px; margin: 0; padding: 7px 10px; box-sizing: border-box;
    border: 0; border-radius: var(--radius-small); font: 400 13.5px/1.3 var(--sans); color: var(--ink-strong); background: transparent; transition: background .15s; }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link:hover { background: var(--hover); }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link.active, .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane-on .mud-nav-link,
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link.active:hover, .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane-on .mud-nav-link:hover { background: var(--surface); color: var(--ink-strong); border: 0; }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link-icon { flex: none; width: 26px; height: 26px; padding: 5px; margin: 0; box-sizing: border-box; border-radius: 7px; background: var(--sunken); color: var(--ink); }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-topic-controllers .mud-nav-link-icon { background: var(--blue-soft); color: var(--blue-ink); }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link-text { display: flex; align-items: center; flex: 1; min-width: 0; margin: 0; padding: 0; color: inherit; }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane-name { flex: 1; min-width: 0; }
.ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-chevron { display: none; color: var(--faint); }
.ramah-settings-pane-body[b-9cm4c5xty2]  .ramah-settings-back { display: none; }
.ramah-settings-pane-body[b-9cm4c5xty2] { min-width: 0; padding: 32px 0 40px 40px; }
.ramah-settings-pane-body[b-9cm4c5xty2]  .ramah-settings-title { margin: 0 0 22px 4px; }

@media (max-width: 999.98px) {
  .ramah-settings[b-9cm4c5xty2] { margin: -22px 0 -40px -24px; grid-template-columns: 200px minmax(0, 1fr); }
  .ramah-settings-pane-body[b-9cm4c5xty2] { padding: 28px 0 32px 28px; }
}
@media (max-width: 760px) {
  .ramah-settings[b-9cm4c5xty2] { grid-template-columns: minmax(0, 1fr); gap: 0; margin: 0; min-height: 0; }
  .ramah-settings-topics[b-9cm4c5xty2] { padding: 0; border-right: 0; }
  .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-list-title { display: block; margin-bottom: 22px; }
  .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-panes { position: static; gap: 0; background: var(--surface); border: 1px solid var(--hairline); border-radius: var(--radius); overflow: hidden; }
  .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane + .ramah-settings-pane { border-top: 1px solid var(--hairline); }
  .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link { min-height: 50px; padding: 0 12px 0 14px; border-radius: 0; font-size: 14px; }
  .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link.active, .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane-on .mud-nav-link { background: transparent; }
  .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-pane .mud-nav-link:hover { background: var(--hover); }
  .ramah-settings-topics[b-9cm4c5xty2]  .ramah-settings-chevron { display: inline-block; }
  .ramah-settings-pane-body[b-9cm4c5xty2] { padding: 0; }
  .ramah-settings-at-list .ramah-settings-pane-body[b-9cm4c5xty2] { display: none; }
  .ramah-settings-at-topic .ramah-settings-topics[b-9cm4c5xty2] { display: none; }
  .ramah-settings-pane-body[b-9cm4c5xty2]  .ramah-settings-back { display: inline-block; margin-bottom: 14px; font-size: 13.5px; color: var(--link); }
}
/* /Pages/StagesPage.razor.rz.scp.css */
/* The stage board, as the desktop's: lanes side by side on the sunken ground (the stage's dot, its name as an eyebrow,
   how many), each card on the surface. Below the lanes' readable width the board scrolls sideways; on a phone the
   lanes stack. Dry & cure's switch has its label before it. */
.ramah-page-actions[b-3q8qctzy1r]  .ramah-stages-chop { margin: 0; }
.ramah-page-actions[b-3q8qctzy1r]  .ramah-stages-chop label.mud-switch { flex-direction: row-reverse; gap: 4px; margin: 0; }
.ramah-stages-chop .ramah-label[b-3q8qctzy1r] { white-space: nowrap; }
.ramah-page-head[b-3q8qctzy1r] { margin-bottom: 20px; }
.ramah-page-head .ramah-stages-sub[b-3q8qctzy1r] { display: block; }
.ramah-stages-by-menu[b-3q8qctzy1r] { display: none; }

.ramah-stages-picked[b-3q8qctzy1r] { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 12px 16px; margin-bottom: 18px; }
.ramah-stages-picked-count[b-3q8qctzy1r] { font-size: 14px; color: var(--ink); }
.ramah-stages-picked-move[b-3q8qctzy1r] { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ramah-stages-picked-move[b-3q8qctzy1r]  .ramah-stages-target { width: 180px; flex: none; }
.ramah-stages-picked-move[b-3q8qctzy1r]  .ramah-stages-target .mud-input-control { margin: 0; }

.ramah-board-scroll[b-3q8qctzy1r] { overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: 8px; }
.ramah-board-scroll[b-3q8qctzy1r]  .ramah-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(184px, 1fr); gap: 10px; align-items: stretch; min-height: calc(100vh - 230px); }

.ramah-lane[b-3q8qctzy1r] { display: flex; flex-direction: column; min-width: 0; padding: 12px; border-radius: var(--radius-card); background: var(--sunken); border: 1.5px solid transparent; box-sizing: border-box; transition: opacity .15s, border-color .15s, background .15s; }
.ramah-lane-head[b-3q8qctzy1r] { display: flex; flex-direction: column; gap: 2px; padding: 2px 4px 12px; }
.ramah-lane-title[b-3q8qctzy1r] { display: flex; align-items: center; gap: 7px; }
.ramah-lane-title .ramah-stage-dot[b-3q8qctzy1r] { width: 11px; height: 11px; }
.ramah-lane-title .ramah-eyebrow[b-3q8qctzy1r] { margin: 0; }
.ramah-lane-count[b-3q8qctzy1r] { display: flex; gap: 8px; font-size: 12.5px; color: var(--muted); }
.ramah-lane-average[b-3q8qctzy1r] { opacity: .75; }
.ramah-lane[b-3q8qctzy1r]  .ramah-lane-cards { flex: 1; display: flex; flex-direction: column; gap: 8px; min-height: 96px; border-radius: var(--radius); }

/* While a plant is carried: a lane the rules let it into waits for it; one that won't take it steps back. */
.ramah-lane-refuses[b-3q8qctzy1r] { opacity: .42; }
.ramah-lane-accepts[b-3q8qctzy1r] { border-color: var(--hairline-strong); }
.ramah-lane-accepts:has(.ramah-zone-over)[b-3q8qctzy1r] { border-color: var(--accent); background: var(--accent-soft); }

.ramah-stages-empty[b-3q8qctzy1r] { margin-top: 18px; }

@media (max-width: 640px) {
  .ramah-board-scroll[b-3q8qctzy1r] { overflow: visible; }
  .ramah-board-scroll[b-3q8qctzy1r]  .ramah-board { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .ramah-lane[b-3q8qctzy1r]  .ramah-lane-cards { min-height: 0; }
  .ramah-lane-head[b-3q8qctzy1r] { flex-direction: row; align-items: baseline; justify-content: space-between; }
  .ramah-stages-picked[b-3q8qctzy1r] { position: sticky; top: 64px; z-index: 4; box-shadow: var(--sheet-shadow); }
  .ramah-stages-picked-move[b-3q8qctzy1r] { width: 100%; }
  .ramah-stages-picked-move[b-3q8qctzy1r]  .ramah-stages-target { flex: 1; width: auto; }
  .ramah-stages-picked-move .ramah-label[b-3q8qctzy1r] { width: 100%; }
}
/* A finger scrolls the board instead of dragging a card: each card's menu moves it. */
@media (pointer: coarse) {
  .ramah-stages-by-drag[b-3q8qctzy1r] { display: none; }
  .ramah-stages-by-menu[b-3q8qctzy1r] { display: inline; }
}
.ramah-lane[b-3q8qctzy1r]  .ramah-bcard-dragging { opacity: .35; }
/* /Pages/TodayPage.razor.rz.scp.css */
/* Today, as the desktop's dashboard (DashboardView): its sections 22 px apart, each laid out as the desktop lays it.
   What it shares with other pages (the number tiles, the environment cards, the plant tiles) is in wwwroot/css/ramah.css
   and the cards' own files. */
.today[b-6bzuitod4u] { display: flex; flex-direction: column; gap: 22px; max-width: 1320px; }

/* Environments: the heading, whose account and how fresh under it, Connect or Disconnect at its end; the cards under. */
.environments[b-6bzuitod4u] { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.head[b-6bzuitod4u] { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.head-text[b-6bzuitod4u] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.status[b-6bzuitod4u] { overflow-wrap: anywhere; }
.head .ramah-link[b-6bzuitod4u] { flex: none; font-size: 13px; padding-bottom: 1px; }
.head .ramah-pill[b-6bzuitod4u] { flex: none; }
.none[b-6bzuitod4u] { margin: 0; }
@media (max-width: 600px) { .account[b-6bzuitod4u] { display: none; } }

/* Stages: every live plant as one bar, a part per stage (16 tall, 3 apart, round ends), its legend under it. */
.stages[b-6bzuitod4u] { display: flex; flex-direction: column; gap: 14px; user-select: none; -webkit-user-select: none; }
.panel-head[b-6bzuitod4u] { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.panel-head .ramah-link[b-6bzuitod4u] { font-size: 13px; }
.mix[b-6bzuitod4u] { display: flex; gap: 3px; height: 16px; }
.mix i[b-6bzuitod4u] { min-width: 16px; border-radius: 8px; background: var(--stage); }
.legend[b-6bzuitod4u] { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 13.5px; color: var(--ink); }
.share[b-6bzuitod4u] { display: inline-flex; align-items: center; gap: 8px; }
.share .ramah-stage-dot[b-6bzuitod4u] { width: 10px; height: 10px; }

/* Coming up beside Lately, at least 400 wide each (one above the other when there isn't room), the same 380 tall,
   each scrolling inside when long. */
.feeds[b-6bzuitod4u] { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: 16px; }
.feed[b-6bzuitod4u] { display: flex; flex-direction: column; height: 380px; min-width: 0; }
.feed-title[b-6bzuitod4u] { margin-bottom: 10px; }
.feed-scroll[b-6bzuitod4u] { flex: 1; min-height: 0; overflow-y: auto; margin-right: -10px; padding-right: 10px; display: flex; flex-direction: column; gap: 10px; }
.feed-scroll > p[b-6bzuitod4u] { margin: 0; }
.list[b-6bzuitod4u] { display: flex; flex-direction: column; }
.overdue[b-6bzuitod4u] { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
.overdue-title[b-6bzuitod4u] { display: flex; align-items: center; gap: 8px; }
.overdue-title[b-6bzuitod4u]  .mud-icon-root { width: 18px; height: 18px; color: var(--danger); }

/* Lately: a dot in the kind's colour, the plant and when, what it was (two lines at most), its readings, its photos. */
.entry[b-6bzuitod4u] { display: flex; gap: 12px; padding: 9px 10px; margin: 0 -10px; border-radius: var(--radius); color: inherit; text-decoration: none; min-width: 0; transition: background .15s; }
.entry:hover[b-6bzuitod4u] { background: var(--hover); }
.dot[b-6bzuitod4u] { flex: none; width: 8px; height: 8px; margin: 7px 0 0 2px; border-radius: 50%; background: var(--blue); }
.dot.is-feed[b-6bzuitod4u] { background: var(--stage-vegetative); }
.dot.is-training[b-6bzuitod4u] { background: var(--stage-flowering); }
.dot.is-issue[b-6bzuitod4u] { background: var(--danger); }
.dot.is-stage[b-6bzuitod4u] { background: var(--accent); }
.dot.is-photos[b-6bzuitod4u] { background: var(--gold); }
.entry-main[b-6bzuitod4u] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.entry-top[b-6bzuitod4u] { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.entry-top b[b-6bzuitod4u] { flex: 1; min-width: 0; font-weight: 500; font-size: 13.5px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.when[b-6bzuitod4u] { flex: none; font-size: 11.5px; color: var(--muted); }
.body[b-6bzuitod4u] { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.readings[b-6bzuitod4u] { font: 400 11px/1.4 var(--mono); color: var(--ink); }
.thumbs[b-6bzuitod4u] { display: flex; gap: 6px; margin-top: 4px; }
.thumbs[b-6bzuitod4u]  .thumb { flex: none; width: 64px; height: 48px; border-radius: 8px; background: transparent; }

/* Furthest along: its heading and All plants, then the plants as tiles. */
.along[b-6bzuitod4u] { display: flex; flex-direction: column; gap: 12px; }
.along-head[b-6bzuitod4u] { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.along-head .ramah-link[b-6bzuitod4u] { font-size: 13px; }