/* Hypha component kit ("Living Mycelium", owner-approved comps in scratchpad/garden). Generated from the comp CSS by
   scripts in the redesign session: every selector is scoped to .gm (new pages + shell) so it never touches older views;
   renames vs the comp: .nav→.gnav .foot→.gfoot .kv→.gkv .cols→.gcols .field→.gfield .chip→.fchip, --t→--tint.
   App-specific additions are at the end ("APP ADDITIONS"). Tokens live in app.css :root. */
/* from g-base.css */
.gm .num, .gm td.r, .gm .val { font-variant-numeric: tabular-nums; }
.gm .mono { font-family: var(--mono); font-size: .88em; letter-spacing: 0; }
.gm .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.gm .display { font-size: clamp(48px, 7vw, 96px); line-height: .98; letter-spacing: -.04em; font-weight: 500; }
.gm .h1 { font-size: clamp(34px, 4.2vw, 56px); line-height: 1.04; letter-spacing: -.035em; font-weight: 500; }
.gm .h2 { font-size: clamp(28px, 3vw, 40px); line-height: 1.08; letter-spacing: -.03em; }
.gm .h3 { font-size: 21px; line-height: 1.25; letter-spacing: -.015em; }
.gm .lede { font-size: clamp(18px, 1.6vw, 21px); color: var(--ink-2); max-width: 60ch; }
.gm .small { font-size: 14px; color: var(--ink-3); }
.gm .up { color: var(--lime); }
.gm .down { color: var(--red); }
.gm .eth { color: var(--amber); }
.gm .wrap { width: min(1240px, 100% - 64px); margin-inline: auto; }
.gm .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 22px; border-radius: 999px; border: 0;
  background: var(--pod-3); color: var(--ivory); font-weight: 500; font-size: 16px; text-decoration: none; cursor: pointer; white-space: nowrap;
  box-shadow: inset 0 0 0 1px rgba(242, 244, 232, .08); transition: background .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease); }
.gm .btn:hover { background: #242D33; transform: translateY(-1px); }
.gm .btn:active { transform: translateY(0) scale(.98); }
.gm .btn[disabled], .gm .btn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; transform: none; }
.gm .btn.mint { background: var(--mint); color: #05231B; font-weight: 500; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 255, 255, .35); }
.gm .btn.mint:hover { background: #7FEFD1; box-shadow: 0 14px 28px -12px rgba(0, 0, 0, .95), inset 0 1px 0 rgba(255, 255, 255, .4); }
.gm .btn.lg { min-height: 60px; padding: 0 32px; font-size: 19px; }
.gm .btn.sm { min-height: 38px; padding: 0 16px; font-size: 15px; }
.gm .btn.ghost { background: transparent; box-shadow: inset 0 0 0 1.5px rgba(242, 244, 232, .16); }
.gm .btn.ghost:hover { box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .5); background: rgba(101, 230, 196, .06); }
.gm .link { display: inline-flex; align-items: center; gap: 6px; color: var(--ivory); font-weight: 540; text-decoration: none; }
.gm .link:hover { color: var(--mint); }
.gm .ico { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.gm .ico.sm { width: 16px; height: 16px; }
.gm .pod { background: linear-gradient(180deg, var(--pod-2), var(--pod)); border-radius: var(--rad-l); box-shadow: var(--lift), inset 0 1px 0 rgba(242, 244, 232, .05); }
.gm .pod-in { padding: 28px; }
.gm .pod-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap; padding: 26px 28px 8px; }
.gm .pod-head p { color: var(--ink-3); font-size: 15px; }
.gm .pill { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 13px; border-radius: 999px; font-size: 14px; font-weight: 500; white-space: nowrap;
  background: rgba(242, 244, 232, .06); color: var(--ink-2); }
.gm .pill .dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.gm .pill.run { background: rgba(101, 230, 196, .12); color: var(--mint); }
.gm .pill.paused { background: rgba(242, 244, 232, .07); color: var(--ink-2); }
.gm .pill.paused .dot { box-shadow: none; opacity: .6; }
.gm .pill.guard { background: rgba(242, 176, 78, .12); color: var(--r-bodyguard); }
.gm .pill.no { background: rgba(255, 138, 122, .12); color: var(--red); }
.gm .pill.eth { background: rgba(242, 193, 78, .12); color: var(--amber); }
.gm .pill.myc { background: rgba(185, 162, 232, .13); color: var(--spore); }
.gm .demo { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 11px; border-radius: 999px; font-size: 13px; font-weight: 500;
  color: var(--amber); background: rgba(242, 193, 78, .10); white-space: nowrap; }
.gm .soon { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 12.5px; font-weight: 500; color: var(--spore); background: rgba(185, 162, 232, .14); }
.gm .src { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 4px 11px 4px 8px; border-radius: 999px; font-size: 13px; color: var(--ink-3);
  background: rgba(242, 244, 232, .045); text-decoration: none; transition: color .2s, background .2s; }
.gm .src:hover { color: var(--ivory); background: rgba(101, 230, 196, .10); }
.gm .src .ico { width: 14px; height: 14px; color: var(--mint); }
.gm .src span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 720px) {
.gm .wrap { width: calc(100% - 32px); }
.gm .pod-in { padding: 20px; }
.gm .pod-head { padding: 20px 20px 6px; }
.gm .pod { border-radius: 26px; }
}
/* from g-shell.css */
.gm .gnav { position: sticky; top: 14px; z-index: 50; width: min(1320px, 100% - 32px); margin: 14px auto 0; display: flex; align-items: center; gap: 18px;
  padding: 8px 8px 8px 22px; border-radius: 999px; background: rgba(13, 17, 20, .86); box-shadow: 0 16px 40px -18px rgba(0, 0, 0, .9), inset 0 0 0 1px rgba(242, 244, 232, .06); }
.gm .gnav .logo { display: flex; align-items: center; height: 40px; }
.gm .gnav .logo svg { height: 26px; width: auto; display: block; }
.gm .gnav .links { display: flex; gap: 2px; margin-left: 8px; }
.gm .gnav .links a { display: inline-flex; align-items: center; gap: 7px; height: 42px; padding: 0 16px; border-radius: 999px; color: var(--ink-2); font-weight: 520; font-size: 15.5px; text-decoration: none; transition: background .2s, color .2s; }
.gm .gnav .links a:hover { color: var(--ivory); background: rgba(242, 244, 232, .06); }
.gm .gnav .links a[aria-current] { color: var(--ivory); background: rgba(101, 230, 196, .12); }
.gm .gnav .right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.gm .gnav .mine { display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 16px 0 5px; border-radius: 999px; color: var(--ivory); text-decoration: none; font-weight: 540; font-size: 15px; background: rgba(242, 244, 232, .05); }
.gm .gnav .mine:hover, .gm .gnav .mine[aria-current] { background: rgba(101, 230, 196, .12); }
.gm .gnav .mine .av { width: 36px; height: 36px; }
.gm .gnav .mine .n { display: inline-grid; place-items: center; min-width: 22px; height: 22px; border-radius: 99px; background: var(--mint); color: #05231B; font-size: 12.5px; font-weight: 500; }
.gm .gnav .btn.mint { min-height: 46px; }
.gm .ptabs { display: none; }
.gm .gfoot { margin-top: 120px; padding: 64px 0 120px; background: radial-gradient(120% 80% at 50% 0%, rgba(101, 230, 196, .06), transparent 60%); }
.gm .foot-in { width: min(1240px, 100% - 64px); margin: auto; display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 32px; }
.gm .gfoot .logo svg { height: 28px; width: auto; }
.gm .gfoot p.fine { color: var(--ink-3); font-size: 14px; margin-top: 16px; max-width: 38ch; }
.gm .gfoot h4 { font-size: 14px; font-weight: 500; color: var(--ivory); margin-bottom: 12px; }
.gm .gfoot a:not(.logo) { display: block; color: var(--ink-3); text-decoration: none; font-size: 15px; padding: 5px 0; }
.gm .gfoot a:not(.logo):hover { color: var(--mint); }
.gm .caps { font-size: 13px; letter-spacing: .34em; text-transform: uppercase; color: var(--ink-3); font-weight: 500; }
.gm .star { width: 14px; height: 14px; fill: var(--mint); flex: none; }
.gm .av { position: relative; display: inline-block; flex: none; width: 56px; height: 56px; border-radius: 50%; overflow: hidden;
  background: radial-gradient(70% 70% at 50% 35%, color-mix(in srgb, var(--tint, #65E6C4) 22%, #12181B), #0C1013 72%); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring, var(--tint, #65E6C4)) 45%, transparent), 0 8px 20px -8px rgba(0, 0, 0, .8); }
.gm .av svg { width: 100%; height: 100%; display: block; }
.gm .robot { display: block; }
.gm .av.st-guarding { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring) 60%, transparent), 0 0 0 5px color-mix(in srgb, var(--ring) 18%, transparent), 0 8px 20px -8px rgba(0, 0, 0, .8); }
.gm .av.st-paused { box-shadow: 0 0 0 2px rgba(110, 117, 111, .55), 0 8px 20px -8px rgba(0, 0, 0, .8); }
.gm .av.st-refused { box-shadow: 0 0 0 2px rgba(255, 138, 122, .7), 0 8px 20px -8px rgba(0, 0, 0, .8); }
.gm .bubble { position: relative; padding: 12px 16px; border-radius: 20px 20px 20px 6px; background: #EEF1E6; color: #0B1210; font-size: 14.5px; line-height: 1.38; font-weight: 500;
  box-shadow: 0 12px 28px -12px rgba(0, 0, 0, .8); max-width: 30ch; }
.gm .bubble b { font-weight: 500; }
.gm .bubble .who { display: block; font-size: 12.5px; font-weight: 500; color: #3A5C52; margin-bottom: 2px; }
.gm .bubble.dark { background: var(--pod-3); color: var(--ivory); }
.gm .bubble.dark .who { color: var(--mint); }
@media (max-width: 1080px) {
.gm .gnav .links a { padding: 0 11px; }
.gm .gnav .mine .lbl { display: none; }
.gm .foot-in { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
.gm .gnav { top: 10px; padding: 6px 6px 6px 16px; }
.gm .gnav .links, .gm .gnav .mine { display: none; }
.gm .gnav .btn.mint { min-height: 42px; padding: 0 18px; font-size: 15px; }
.gm .ptabs { display: flex; position: fixed; z-index: 55; left: 12px; right: 12px; bottom: 12px; padding: 6px; gap: 2px; border-radius: 999px; background: rgba(16, 21, 24, .94);
    box-shadow: 0 14px 34px -10px rgba(0, 0, 0, .95), inset 0 0 0 1px rgba(242, 244, 232, .07); }
.gm .ptabs a, .gm .ptabs summary { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 7px 0 6px; border-radius: 999px; color: var(--ink-3); font-size: 11.5px; font-weight: 500; text-decoration: none; list-style: none; cursor: pointer; }
.gm .ptabs summary::-webkit-details-marker { display: none; }
.gm .ptabs a[aria-current] { color: #05231B; background: var(--mint); }
.gm .ptabs details { flex: 1; display: flex; position: relative; }
.gm .ptabs .more { position: absolute; right: 0; bottom: 64px; width: 220px; padding: 8px; border-radius: 24px; background: var(--pod-3); box-shadow: var(--lift); }
.gm .ptabs .more a { flex-direction: row; justify-content: space-between; padding: 12px 14px; font-size: 15px; color: var(--ivory); border-radius: 16px; }
.gm .gfoot { padding-bottom: 150px; margin-top: 80px; }
.gm .foot-in { width: calc(100% - 32px); grid-template-columns: 1fr 1fr; gap: 24px; }
.gm .foot-in > div:first-child { grid-column: 1 / -1; }
}
/* from g-home.css */
.gm .hero { position: relative; margin-top: -76px; padding-top: 76px; min-height: min(940px, 100svh); overflow: hidden; isolation: isolate; }
.gm .hero canvas { position: absolute; inset: 0; z-index: -1; display: block; }
.gm .horizon { position: absolute; z-index: -2; left: -30%; right: -90%; top: 60%; height: 240%; border-radius: 50%; pointer-events: none;
  background: radial-gradient(48% 9% at 50% 0%, rgba(232, 246, 236, .2), transparent 70%), radial-gradient(70% 30% at 50% 0%, #0D1716, #08090B 70%);
  box-shadow: 0 -1px 0 rgba(242, 244, 232, .5), 0 -2px 0 rgba(101, 230, 196, .3), 0 -40px 90px -20px rgba(101, 230, 196, .26), 0 -140px 200px -60px rgba(185, 162, 232, .12); }
.gm .sunrise { position: absolute; z-index: -2; left: 80%; top: calc(60% - 80px); width: 760px; height: 160px; transform: translateX(-50%); pointer-events: none;
  background: radial-gradient(50% 50% at 50% 50%, rgba(250, 252, 240, .42), rgba(101, 230, 196, .14) 42%, transparent 72%); }
.gm .veil { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(44% 56% at 20% 46%, rgba(7, 8, 10, .85), rgba(7, 8, 10, .4) 62%, transparent 86%); }
.gm .hero-in { position: relative; width: min(1320px, 100% - 64px); margin: auto; min-height: calc(min(940px, 100svh) - 76px); padding: 24px 0 150px;
  display: grid; grid-template-columns: minmax(0, 540px) minmax(0, 1fr) 430px; column-gap: 32px; }
.gm .copy { align-self: center; position: relative; z-index: 2; }
.gm .hero h1 { max-width: 9ch; }
.gm .hero .tag { margin-top: 24px; font-size: clamp(19px, 1.7vw, 23px); color: var(--ink-2); max-width: 32ch; line-height: 1.45; }
.gm .hero .tag b { color: var(--ivory); font-weight: 500; }
.gm .hero .acts { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 36px; }
.gm .hero .caps { margin-top: 34px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; }
.gm .hero-bot { grid-column: 3; align-self: end; position: relative; width: 430px; height: 442px; margin-bottom: -24px; }
.gm .hero-bot svg { position: relative; width: 100%; height: 100%; -webkit-mask-image: linear-gradient(#000 66%, transparent 97%); mask-image: linear-gradient(#000 66%, transparent 97%); }
.gm .hero-bot::before { content: ""; position: absolute; inset: 6% 0 10%; border-radius: 50%; background: radial-gradient(closest-side, rgba(101, 230, 196, .16), transparent); }
.gm .feat { grid-column: 2; align-self: end; justify-self: end; position: relative; z-index: 2; width: min(100%, 330px); padding: 20px 22px 20px; border-radius: 30px; color: inherit; text-decoration: none;
  background: rgba(17, 22, 25, .92); box-shadow: var(--lift), inset 0 0 0 1px rgba(242, 244, 232, .07); transition: transform .3s var(--ease); }
.gm .feat:hover { transform: translateY(-3px); }
.gm .feat .top { display: flex; align-items: center; gap: 12px; }
.gm .feat .nm { font-size: 20px; font-weight: 500; letter-spacing: -.02em; }
.gm .feat .role { color: var(--ink-3); font-size: 14px; }
.gm .feat .val { margin-top: 14px; font-size: 32px; font-weight: 500; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.gm .feat .val small { display: block; font-size: 14px; font-weight: 500; margin-top: 6px; letter-spacing: 0; }
.gm .feat .bubble { margin-top: 14px; max-width: none; font-size: 14px; }
.gm .feat .foot2 { margin-top: 12px; display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.gm .nodes { position: absolute; inset: 0; pointer-events: none; }
.gm .node { position: absolute; left: calc(var(--x) * 100%); top: calc(var(--y) * 100%); width: 0; height: 0; pointer-events: auto; color: inherit; text-decoration: none; }
.gm .node::before { content: ""; position: absolute; left: -22px; top: -22px; width: 44px; height: 44px; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--tint) 55%, transparent), transparent); }
.gm .node i { position: absolute; left: -6px; top: -6px; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #fff, var(--tint) 55%); }
.gm .node.paused i { background: #6E756F; }
.gm .node.paused::before { opacity: .3; }
.gm .node b { position: absolute; left: 14px; top: -11px; font-size: 12.5px; font-weight: 500; color: var(--ink-2); white-space: nowrap; padding: 2px 9px; border-radius: 99px; background: var(--lc-s-code,rgba(7, 8, 10, .66)); }
.gm .node:hover b { color: var(--ivory); }
.gm .node .bubble { position: absolute; left: 12px; bottom: 16px; width: max-content; max-width: 22ch; font-size: 13.5px; padding: 9px 13px; }
.gm .strip { position: absolute; z-index: 2; left: 50%; bottom: 22px; transform: translateX(-50%); width: min(1320px, 100% - 64px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  gap: 4px; padding: 10px; border-radius: 32px; background: rgba(13, 17, 20, .86); box-shadow: var(--lift), inset 0 0 0 1px rgba(242, 244, 232, .06); }
.gm .cell { min-width: 0; grid-template-columns: minmax(0, 1fr); padding: 8px 18px; border-radius: 24px; display: grid; gap: 2px; align-content: start; }
.gm .cell + .cell { box-shadow: -1px 0 0 rgba(242, 244, 232, .06); }
.gm .cell .k { font-size: 14px; color: var(--ink-3); }
.gm .cell b { font-size: 28px; font-weight: 500; letter-spacing: -.025em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.gm .cell .src { justify-self: start; margin-top: 2px; }
.gm .strip > .demo { align-self: center; margin: 0 10px; }
.gm .sec { padding-top: 120px; }
.gm .sec-head { display: flex; justify-content: space-between; align-items: end; gap: 18px 32px; flex-wrap: wrap; margin-bottom: 36px; }
.gm .sec-head p { color: var(--ink-2); margin-top: 14px; max-width: 58ch; font-size: 18px; }
.gm .band { position: relative; margin-top: 120px; height: 220px; overflow: hidden; display: grid; place-items: center; text-align: center; }
.gm .band .horizon { top: 62%; left: -40%; right: -40%; }
.gm .band .sunrise { top: calc(62% - 70px); left: 50%; }
.gm .band .caps { color: var(--ink-2); display: flex; gap: 18px; align-items: center; flex-wrap: wrap; justify-content: center; margin-top: -40px; padding: 0 16px; }
@media (max-width: 1180px) {
.gm .hero-in { grid-template-columns: minmax(0, 480px) minmax(0, 1fr) 360px; }
.gm .hero-bot { width: 360px; height: 370px; }
.gm .strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gm .strip > .demo { display: none; }
}
@media (max-width: 960px) {
.gm .hero { min-height: 0; }
.gm .hero-in { display: flex; flex-direction: column; min-height: 0; padding: 40px 0 24px; width: calc(100% - 32px); }
.gm .hero-bot { order: 2; align-self: center; width: 320px; height: 330px; margin: 24px 0 -16px; }
.gm .feat { order: 3; align-self: stretch; width: auto; }
.gm .node b, .gm .node .bubble { display: none; }
.gm .strip { position: relative; left: auto; transform: none; bottom: auto; width: calc(100% - 32px); margin: 20px auto 0; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-radius: 28px; }
.gm .cell { padding: 12px; }
.gm .cell:nth-child(3) { box-shadow: none; }
.gm .cell b { font-size: 24px; }
.gm .horizon { top: 700px; height: 1400px; left: -120%; right: -120%; }
.gm .sunrise { top: 620px; left: 50%; width: 420px; }
.gm .veil { background: linear-gradient(var(--lc-s-wash,rgba(7, 8, 10, .78)), var(--lc-s-wash,rgba(7, 8, 10, .55)) 470px, transparent 560px); }
.gm .sec { padding-top: 84px; }
.gm .band { margin-top: 84px; height: 180px; }
}
/* from g-sections.css */
.gm .robot { overflow: hidden; }
.gm .role-show p.bubble { color: #0B1210; }
@media (max-width: 960px) {
.gm .bot { left: calc(var(--px) * 100%); top: calc(var(--py) * 100%); }
.gm .bot:not(.pb) .bubble { display: none; }
.gm .bot.ph-hide { display: none; }
}
.gm .roles { display: grid; grid-template-columns: 300px 1fr; gap: 24px; }
.gm .role-pick { display: grid; gap: 8px; align-content: start; }
.gm .role-pick button { display: flex; align-items: center; gap: 14px; padding: 8px 18px 8px 8px; border: 0; border-radius: 999px; background: transparent; cursor: pointer; text-align: left; transition: background .25s var(--ease); }
.gm .role-pick button:hover { background: rgba(242, 244, 232, .05); }
.gm .role-pick button[aria-pressed="true"] { background: var(--pod-2); box-shadow: var(--lift), inset 0 0 0 1.5px color-mix(in srgb, var(--tint) 45%, transparent); }
.gm .role-pick b { display: block; font-size: 18px; font-weight: 500; }
.gm .role-pick small { display: block; color: var(--ink-3); font-size: 14px; }
.gm .role-show { display: grid; grid-template-columns: 300px 1fr; align-items: center; gap: 8px 28px; padding: 26px 34px 26px 14px; min-height: 380px; }
.gm .role-show .big { width: 300px; height: 300px; position: relative; }
.gm .role-show .big::before { content: ""; position: absolute; inset: 10%; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--tint) 26%, transparent), transparent); }
.gm .role-show .big svg { position: relative; width: 100%; height: 100%; }
.gm .role-show h3 { font-size: 32px; letter-spacing: -.03em; }
.gm .role-show p { color: var(--ink-2); margin-top: 10px; font-size: 18px; max-width: 46ch; }
.gm .role-show .bubble { margin-top: 20px; max-width: 44ch; }
.gm .role-show .acts { margin-top: 22px; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.gm .limits { display: grid; grid-template-columns: 1.15fr 1fr; gap: 24px; align-items: start; }
.gm .rules { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 8px 22px 24px; }
.gm .rule { padding: 16px 4px 12px; border-top: 1px solid rgba(242, 244, 232, .08); }
.gm .rule .k { font-size: 14px; color: var(--ink-3); display: flex; align-items: center; gap: 6px; }
.gm .rule .k .ico { width: 15px; height: 15px; color: var(--mint); }
.gm .rule .v { font-size: 21px; font-weight: 500; letter-spacing: -.015em; margin-top: 4px; font-variant-numeric: tabular-nums; }
.gm .rule .n { font-size: 14px; color: var(--ink-3); margin-top: 2px; }
.gm .rule input { width: 120px; height: 44px; padding: 0 14px; border-radius: 14px; border: 0; background: var(--night); box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .4); font-size: 19px; font-weight: 500; }
.gm .four { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.gm .four li { display: grid; grid-template-columns: 52px 1fr; gap: 16px; align-items: start; padding: 18px 22px 18px 18px; border-radius: 26px; background: rgba(242, 244, 232, .03); }
.gm .four .ic { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: rgba(101, 230, 196, .1); color: var(--mint); }
.gm .four .ic.myc { background: rgba(185, 162, 232, .12); color: var(--spore); }
.gm .four b { display: block; font-size: 18px; }
.gm .four span { color: var(--ink-2); font-size: 16px; }
.gm .feed { list-style: none; margin: 0; padding: 6px 14px 16px; display: grid; gap: 6px; }
.gm .feed li { display: grid; grid-template-columns: 48px 1fr auto; gap: 14px; align-items: start; padding: 12px; border-radius: 22px; transition: background .2s; }
.gm .feed li:hover { background: rgba(242, 244, 232, .03); }
.gm .feed li.fresh { animation: arrive .9s var(--ease); }
@keyframes arrive { from { background: rgba(101, 230, 196, .12); } to { background: transparent; } }
.gm .feed .what { font-size: 16px; }
.gm .feed .what a { color: var(--ivory); font-weight: 500; text-decoration: none; }
.gm .feed .what a:hover { color: var(--mint); }
.gm .feed .why { display: block; color: var(--ink-3); font-size: 14.5px; margin-top: 2px; }
.gm .feed time { color: var(--ink-3); font-size: 13.5px; font-variant-numeric: tabular-nums; padding-top: 2px; }
.gm .feed .dotic { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; }
.gm .feed .dotic.myc { background: rgba(185, 162, 232, .14); color: var(--spore); }
.gm .feed .dotic.eth { background: rgba(242, 193, 78, .12); color: var(--amber); }
.gm .ledger { display: grid; gap: 6px; padding: 4px 14px 14px; }
.gm .lrow { display: grid; grid-template-columns: 44px 1fr auto auto; gap: 14px; align-items: center; padding: 10px 14px 10px 10px; border-radius: 22px; }
.gm .lrow:nth-child(odd) { background: rgba(242, 244, 232, .025); }
.gm .lrow b { font-weight: 500; }
.gm .lrow small { display: block; color: var(--ink-3); font-size: 13.5px; }
.gm .lrow .now { text-align: right; font-weight: 500; font-variant-numeric: tabular-nums; }
.gm .lrow .now small { font-weight: 400; }
.gm .cols2 { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; align-items: start; }
.gm .doors { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.gm .door { display: flex; flex-direction: column; gap: 12px; padding: 28px 24px 24px; border-radius: 32px 32px 32px 32px; background: linear-gradient(180deg, var(--pod-2), var(--pod)); box-shadow: var(--lift); }
.gm .door .ic { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: rgba(101, 230, 196, .1); color: var(--mint); }
.gm .door.eth .ic { background: rgba(242, 193, 78, .12); color: var(--amber); }
.gm .door.soonish .ic { background: rgba(185, 162, 232, .12); color: var(--spore); }
.gm .door h3 { font-size: 22px; display: flex; gap: 10px; align-items: center; }
.gm .door p { color: var(--ink-2); font-size: 16px; }
.gm .door ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 15px; color: var(--ink-2); flex: 1; }
.gm .door li { display: flex; gap: 8px; align-items: center; }
.gm .door li .ico { width: 15px; height: 15px; color: var(--mint); }
.gm .door .btn { align-self: flex-start; margin-top: 6px; }
.gm .vs { width: 100%; border-collapse: separate; border-spacing: 0 6px; padding: 6px 18px 4px; font-size: 16px; }
.gm .vs th { text-align: left; font-weight: 500; font-size: 15px; color: var(--ink-3); padding: 8px 18px; }
.gm .vs th:nth-child(2) { color: var(--mint); }
.gm .vs td { padding: 15px 18px; background: rgba(242, 244, 232, .03); vertical-align: top; }
.gm .vs td:first-child { border-radius: 20px 0 0 20px; color: var(--ink-3); width: 22%; }
.gm .vs td:last-child { border-radius: 0 20px 20px 0; color: var(--ink-2); }
.gm .vs td:nth-child(2) { color: var(--ivory); font-weight: 520; }
.gm .vs .s { margin-left: 8px; font-size: 13px; }
.gm .fine2 { padding: 8px 36px 28px; color: var(--ink-3); font-size: 14.5px; max-width: 110ch; }
.gm .feebar { display: flex; height: 64px; border-radius: 999px; overflow: hidden; gap: 4px; padding: 6px; background: var(--pod); box-shadow: var(--lift); }
.gm .feebar span { display: grid; place-items: center; border-radius: 999px; font-weight: 500; font-size: 15px; color: #08110E; }
.gm .feekey { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin-top: 18px; }
.gm .feekey div { display: flex; gap: 10px; align-items: center; font-size: 15px; color: var(--ink-2); }
.gm .feekey i { width: 12px; height: 12px; border-radius: 50%; flex: none; }
.gm .feekey b { color: var(--ivory); }
.gm .meter { display: inline-grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; width: 100%; min-width: 120px; font-size: 14px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.gm .meter i { height: 10px; border-radius: 99px; background: rgba(242, 244, 232, .08); position: relative; overflow: hidden; }
.gm .meter i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--v); border-radius: inherit; background: var(--mint); }
.gm .meter.warn i::after { background: var(--amber); }
.gm .fchip { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px 0 6px; border-radius: 999px; border: 0; background: rgba(242, 244, 232, .05); color: var(--ink-2); font-weight: 540; cursor: pointer; }
.gm .fchip.plain { padding: 0 18px; }
.gm .fchip:hover { color: var(--ivory); background: rgba(242, 244, 232, .08); }
.gm .fchip[aria-pressed="true"] { background: rgba(101, 230, 196, .14); color: var(--ivory); box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .45); }
@media (max-width: 960px) {
.gm .roles, .gm .limits, .gm .cols2 { grid-template-columns: 1fr; }
.gm .role-pick { grid-template-columns: repeat(5, auto); overflow-x: auto; justify-content: start; padding-bottom: 4px; }
.gm .role-pick button { flex-direction: column; gap: 6px; padding: 8px 10px; border-radius: 24px; text-align: center; }
.gm .role-pick small { display: none; }
.gm .role-pick b { font-size: 14px; }
.gm .role-show { grid-template-columns: 1fr; padding: 18px 20px 24px; justify-items: center; text-align: center; }
.gm .role-show .big { width: 220px; height: 220px; }
.gm .role-show .acts { justify-content: center; }
.gm .rules { grid-template-columns: 1fr; padding: 4px 14px 18px; }
.gm .doors { grid-template-columns: 1fr 1fr; }
.gm .feekey { grid-template-columns: 1fr 1fr; }
.gm .feebar { height: 52px; }
.gm .feebar span { font-size: 13px; }
.gm .vs { font-size: 15px; padding: 4px 8px; }
.gm .vs td, .gm .vs th { padding: 12px; }
.gm .fine2 { padding: 8px 20px 22px; }
.gm .feed li { grid-template-columns: 40px 1fr; }
.gm .feed time { grid-column: 2; padding: 0; }
.gm .feed .dotic, .gm .feed .av { width: 40px !important; height: 40px !important; }
}
@media (max-width: 560px) {
.gm .doors { grid-template-columns: 1fr; }
.gm .lrow { grid-template-columns: 40px 1fr auto; }
.gm .lrow .hide-sm { display: none; }
}
/* from g-pages.css */
.gm .phead { display: flex; justify-content: space-between; align-items: end; gap: 20px 32px; flex-wrap: wrap; padding-top: 64px; }
.gm .phead .lede { margin-top: 16px; }
.gm .phead .acts { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.gm .nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin-top: 36px; padding: 10px; border-radius: 32px; background: linear-gradient(180deg, var(--pod-2), var(--pod)); box-shadow: var(--lift); }
.gm .nums .cell { min-width: 0; grid-template-columns: minmax(0, 1fr); padding: 12px 18px; border-radius: 24px; display: grid; gap: 3px; align-content: start; }
.gm .nums .cell + .cell { box-shadow: -1px 0 0 rgba(242, 244, 232, .06); }
.gm .nums .k { font-size: 14px; color: var(--ink-3); }
.gm .nums b { font-size: 30px; font-weight: 500; letter-spacing: -.025em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.gm .nums .sub { font-size: 14px; color: var(--ink-3); }
.gm .nums .src { justify-self: start; margin-top: 4px; }
.gm .block { margin-top: 28px; }
.gm .tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 20px 22px 8px; }
.gm .tools .sp { flex: 1; }
.gm .search { display: flex; align-items: center; gap: 8px; height: 46px; padding: 0 16px; border-radius: 999px; background: var(--night); box-shadow: inset 0 0 0 1.5px rgba(242, 244, 232, .1); color: var(--ink-3); }
.gm .search:focus-within { box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .55); }
.gm .search input { border: 0; background: none; outline: none; width: 230px; height: 100%; color: var(--ivory); }
.gm .search input::placeholder { color: var(--ink-3); }
.gm .sel { height: 46px; padding: 0 40px 0 18px; border-radius: 999px; border: 0; background: var(--pod-3) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23C3C9BE' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center; appearance: none; cursor: pointer; }
.gm .agrid { display: grid; grid-template-columns: 34px minmax(220px, 1.6fr) 124px 104px 92px minmax(140px, 1fr) minmax(130px, .9fr) 74px 56px 104px; gap: 16px; align-items: center; }
.gm .ahead { padding: 10px 24px 6px; font-size: 13.5px; color: var(--ink-3); }
.gm .ahead .r, .gm .arow .r { text-align: right; }
.gm .arows { display: grid; gap: 6px; padding: 0 12px 12px; }
.gm .arow { padding: 10px 12px; border-radius: 26px; color: inherit; text-decoration: none; background: rgba(242, 244, 232, .025); transition: background .2s, box-shadow .2s, transform .2s var(--ease); }
.gm .arow:hover { background: rgba(101, 230, 196, .06); box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .25); }
.gm .arow .rank { color: var(--ink-3); font-size: 14px; text-align: center; font-variant-numeric: tabular-nums; }
.gm .arow .who { display: flex; align-items: center; gap: 12px; min-width: 0; }
.gm .arow .who b { display: block; font-size: 16.5px; font-weight: 500; }
.gm .arow .who small { display: block; color: var(--ink-3); font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gm .arow .num { font-size: 15.5px; }
.gm .arow .mono { color: var(--ink-3); font-size: 13px; }
.gm .pager { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 6px 24px 22px; color: var(--ink-3); font-size: 14.5px; flex-wrap: wrap; }
.gm .pager .bar { display: flex; gap: 8px; }
.gm .empty { padding: 36px 24px; text-align: center; color: var(--ink-2); display: grid; justify-items: center; gap: 8px; }
.gm .empty b { color: var(--ivory); font-size: 18px; }
.gm .plans { display: grid; gap: 8px; padding: 0 14px 16px; }
.gm .prow { display: grid; grid-template-columns: 52px 1.1fr 2fr auto auto; gap: 18px; align-items: center; padding: 12px 14px; border-radius: 26px; background: rgba(242, 244, 232, .025); }
.gm .prow b { font-size: 17px; }
.gm .prow small { display: block; color: var(--ink-3); font-size: 13.5px; }
.gm .prow p { color: var(--ink-2); font-size: 15px; }
.gm .prow .run { text-align: right; font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gm .crumb { padding-top: 40px; display: flex; gap: 10px; color: var(--ink-3); font-size: 15px; }
.gm .crumb a { color: var(--ink-2); text-decoration: none; }
.gm .crumb a:hover { color: var(--mint); }
.gm .ahero { display: grid; grid-template-columns: 340px 1fr; gap: 40px; align-items: center; margin-top: 12px; }
.gm .ahero .big { position: relative; width: 340px; height: 350px; -webkit-mask-image: linear-gradient(#000 72%, transparent); mask-image: linear-gradient(#000 72%, transparent); }
.gm .ahero .big::before { content: ""; position: absolute; inset: 12% 8% 0; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--tint) 24%, transparent), transparent); }
.gm .ahero .big svg { position: relative; width: 100%; height: 100%; }
.gm .ident { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.gm .idline { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.gm .idline span { padding: 7px 14px; border-radius: 999px; background: rgba(242, 244, 232, .05); color: var(--ink-3); font-size: 14.5px; }
.gm .idline b { color: var(--ivory); font-weight: 500; }
.gm .ahero .bubble { margin-top: 20px; max-width: 52ch; font-size: 16px; padding: 14px 18px; }
.gm .ahero .acts { margin-top: 22px; display: flex; gap: 12px; flex-wrap: wrap; }
.gm .ownerbar { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 28px; padding: 12px 12px 12px 24px; border-radius: 999px; background: rgba(242, 244, 232, .04); color: var(--ink-2); font-size: 15.5px; }
.gm .ownerbar .acts { display: flex; gap: 8px; flex-wrap: wrap; }
.gm .gcols { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; margin-top: 28px; align-items: start; }
.gm .stackv { display: grid; gap: 24px; }
.gm .thoughts { list-style: none; margin: 0; padding: 4px 22px 22px; display: grid; gap: 14px; }
.gm .thoughts li { display: grid; grid-template-columns: 48px 1fr; gap: 14px; align-items: start; }
.gm .thoughts .bubble { max-width: none; font-size: 15.5px; }
.gm .thoughts .bubble.dark .who { display: flex; justify-content: space-between; gap: 10px; }
.gm .thoughts .t { color: var(--ink-3); font-weight: 500; }
.gm .thoughts .no .bubble { box-shadow: inset 0 0 0 1.5px rgba(255, 138, 122, .4); }
.gm .thoughts .no .bubble .who { color: var(--red); }
.gm .thoughts .myc .bubble .who { color: var(--spore); }
.gm .hold { display: grid; gap: 6px; padding: 0 14px 16px; }
.gm .hrow { display: grid; grid-template-columns: 1.3fr repeat(4, 1fr); gap: 12px; align-items: center; padding: 12px 16px; border-radius: 20px; font-variant-numeric: tabular-nums; }
.gm .hrow:not(.h):nth-child(even) { background: rgba(242, 244, 232, .025); }
.gm .hrow.h { background: none; padding: 0 16px; font-size: 13.5px; color: var(--ink-3); }
.gm .hrow > :not(:first-child) { text-align: right; }
.gm .hrow small { display: block; font-size: 13px; color: var(--ink-3); }
.gm .hrow.trow { grid-template-columns: 2fr 1fr 1.2fr; }
.gm .hrow.trow > * { display: block !important; }
.gm .gkv { display: grid; grid-template-columns: auto 1fr; gap: 10px 16px; padding: 4px 24px 8px; margin: 0; font-size: 15px; }
.gm .gkv dt { color: var(--ink-3); }
.gm .gkv dd { margin: 0; text-align: right; }
.gm .gkv dd a { font-family: var(--mono); font-size: 14px; }
.gm .share { margin: 0 20px 18px; padding: 20px; border-radius: 26px; background: radial-gradient(120% 90% at 85% 0%, rgba(101, 230, 196, .16), transparent 60%), var(--pod-3); display: grid; grid-template-columns: 1fr 96px; gap: 8px; align-items: center; }
.gm .share .cs { font-size: 22px; font-weight: 500; }
.gm .share .row { grid-column: 1 / -1; display: flex; gap: 20px; font-size: 13.5px; color: var(--ink-3); margin-top: 6px; }
.gm .share .row b { display: block; font-size: 17px; color: var(--ivory); }
@media (max-width: 1180px) {
.gm .agrid { grid-template-columns: 30px minmax(200px, 1.6fr) 120px 96px 86px minmax(130px, 1fr) 0 0 0 0; }
.gm .agrid > :nth-child(n+8) { display: none; }
}
@media (max-width: 960px) {
.gm .phead { padding-top: 36px; }
.gm .nums { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-radius: 28px; }
.gm .nums .cell { padding: 10px 12px; }
.gm .nums .cell:nth-child(3) { box-shadow: none; }
.gm .nums b { font-size: 24px; }
.gm .agrid { grid-template-columns: 1fr auto; gap: 4px 12px; }
.gm .agrid > :nth-child(n+5), .gm .agrid > .rank, .gm .ahead { display: none; }
.gm .arow .who { grid-column: 1; }
.gm .arow .num { grid-column: 2; grid-row: 1; }
.gm .arow .pill { grid-column: 1; justify-self: start; margin-left: 64px; }
.gm .arow .r30 { grid-column: 2; grid-row: 2; display: block !important; }
.gm .tools { padding: 16px 14px 6px; }
.gm .search { flex: 1; }
.gm .search input { width: 100%; }
.gm .arows { padding: 0 8px 10px; }
.gm .prow { grid-template-columns: 44px 1fr; }
.gm .prow p { grid-column: 1 / -1; }
.gm .prow .run { grid-column: 1 / -1; text-align: left; }
.gm .prow .btn { grid-column: 1 / -1; }
.gm .ahero { grid-template-columns: 1fr; gap: 0; justify-items: center; text-align: center; }
.gm .ahero .big { width: 260px; height: 268px; }
.gm .ident, .gm .idline, .gm .ahero .acts { justify-content: center; }
.gm .ownerbar { border-radius: 28px; padding: 16px 18px; }
.gm .gcols { grid-template-columns: 1fr; }
.gm .hrow { grid-template-columns: 1.2fr 1fr 1fr; }
.gm .hrow > :nth-child(2), .gm .hrow > :nth-child(3) { display: none; }
.gm .hrow.trow { grid-template-columns: 1fr auto; }
.gm .hrow.trow > .small { grid-column: 1; grid-row: 2; text-align: left; }
.gm .thoughts { padding: 4px 14px 18px; }
.gm .thoughts li { grid-template-columns: 40px 1fr; }
.gm .gkv { padding: 4px 18px 8px; }
}
/* from g-me.css */
.gm .mine3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 28px; }
.gm .mcard { position: relative; padding: 0 22px 22px; border-radius: 32px; background: linear-gradient(180deg, color-mix(in srgb, var(--tint) 10%, var(--pod-2)), var(--pod) 55%); box-shadow: var(--lift); }
.gm .mcard .face { height: 200px; margin: 0 -22px; position: relative; overflow: hidden; border-radius: 32px 32px 0 0; }
.gm .mcard .face::before { content: ""; position: absolute; left: 50%; top: 60%; width: 280px; height: 280px; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--tint) 28%, transparent), transparent); }
.gm .mcard .face svg { position: relative; display: block; width: 230px; height: 230px; margin: -6px auto 0; }
.gm .mcard .top { display: flex; justify-content: space-between; align-items: start; gap: 10px; }
.gm .mcard h3 { font-size: 24px; }
.gm .mcard h3 a { color: inherit; text-decoration: none; }
.gm .mcard h3 a:hover { color: var(--mint); }
.gm .mcard .role { color: var(--ink-3); font-size: 14.5px; }
.gm .mcard .vals { display: flex; gap: 22px; margin: 16px 0 12px; }
.gm .mcard .vals b { display: block; font-size: 24px; font-weight: 500; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.gm .mcard .vals span { font-size: 13.5px; color: var(--ink-3); }
.gm .mcard .next { margin-top: 10px; font-size: 14px; color: var(--ink-3); }
.gm .sw { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px 0 4px; border: 0; border-radius: 999px; cursor: pointer; font-weight: 500; font-size: 14px;
  background: rgba(101, 230, 196, .14); color: var(--mint); transition: background .25s var(--ease), color .25s; }
.gm .sw i { width: 28px; height: 28px; border-radius: 50%; background: var(--mint); display: grid; place-items: center; color: #05231B; transition: background .25s; }
.gm .sw i .ico { width: 14px; height: 14px; }
.gm .sw[aria-pressed="false"] { background: rgba(242, 244, 232, .07); color: var(--ink-2); }
.gm .sw[aria-pressed="false"] i { background: var(--ink-3); box-shadow: none; }
.gm .appr { display: grid; grid-template-columns: 52px 1fr auto; gap: 14px; align-items: center; padding: 8px 4px; transition: opacity .4s; }
.gm .appr .bubble { max-width: none; }
.gm .appr .x { display: block; font-size: 13px; color: #4F6A62; margin-top: 4px; }
.gm .appr .acts { display: flex; gap: 8px; }
.gm .appr.done { opacity: .6; }
.gm .apprs { display: grid; gap: 8px; padding: 0 14px 16px; }
.gm .chat { display: grid; gap: 12px; align-content: start; padding: 6px 22px 16px; height: 440px; overflow-y: auto; overscroll-behavior: contain; }
.gm .msg { display: grid; grid-template-columns: 40px 1fr; gap: 10px; align-items: end; max-width: 88%; }
.gm .msg .bubble { max-width: none; font-size: 15px; }
.gm .msg.me { justify-self: end; grid-template-columns: 1fr; }
.gm .msg.me .bubble { background: var(--mint); color: #05231B; border-radius: 20px 20px 6px 20px; }
.gm .msg.myc .bubble { background: rgba(185, 162, 232, .16); color: var(--ivory); }
.gm .msg.myc .who { color: var(--spore); }
.gm .confirm { margin-top: 10px; padding: 14px; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1.5px rgba(46, 158, 131, .35); }
.gm .confirm .t { font-weight: 500; font-size: 16px; }
.gm .confirm .small { color: #4F6A62; }
.gm .confirm .acts { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.gm .confirm .btn:not(.mint) { background: #E3E8DD; color: #0B1210; box-shadow: none; }
.gm .compose { display: flex; gap: 8px; padding: 12px 14px 16px; }
.gm .compose input { flex: 1; min-width: 0; height: 50px; padding: 0 20px; border-radius: 999px; border: 0; background: var(--night); box-shadow: inset 0 0 0 1.5px rgba(242, 244, 232, .1); outline: none; }
.gm .compose input:focus { box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .55); }
.gm .compose input::placeholder { color: var(--ink-3); }
.gm .note24 { margin: 0 22px 18px; padding: 14px 18px; border-radius: 20px; background: rgba(242, 193, 78, .1); color: #F6D894; font-size: 15px; }
.gm .credit { padding: 6px 24px 24px; }
.gm .credit .meter i { height: 14px; }
.gm .credit p { margin-top: 10px; }
.gm .wrapline { display: flex; gap: 8px; flex-wrap: wrap; padding: 6px 22px 22px; }
.gm .steps { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 28px; padding: 6px; border-radius: 999px; background: var(--pod); width: max-content; max-width: 100%; box-shadow: var(--lift); }
.gm .steps button { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 18px 0 6px; border: 0; border-radius: 999px; background: none; color: var(--ink-3); cursor: pointer; font-weight: 500; }
.gm .steps .no { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: rgba(242, 244, 232, .07); font-size: 14px; }
.gm .steps button[aria-current] { background: var(--pod-3); color: var(--ivory); }
.gm .steps button[aria-current] .no { background: var(--mint); color: #05231B; }
.gm .steps .done .no { background: rgba(101, 230, 196, .18); color: var(--mint); }
.gm .startgrid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 24px; margin-top: 24px; align-items: start; }
.gm .preview { position: sticky; top: 100px; padding: 0 0 24px; text-align: center; overflow: hidden; }
.gm .preview .face { position: relative; height: 380px; }
.gm .preview .face::before { content: ""; position: absolute; left: 50%; top: 55%; width: 360px; height: 360px; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--tint) 26%, transparent), transparent); }
.gm .preview .face svg { position: relative; width: 380px; height: 390px; margin: 0 auto; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); }
.gm .preview .nm { font-size: 26px; font-weight: 500; letter-spacing: -.02em; margin-top: -10px; }
.gm .preview p { color: var(--ink-3); font-size: 15px; padding: 0 24px; }
.gm .preview .bubble { margin: 14px auto 0; text-align: left; }
.gm .opts { display: grid; gap: 8px; }
.gm .opt { display: grid; grid-template-columns: 52px 1fr auto; gap: 14px; align-items: center; padding: 12px 18px 12px 12px; border-radius: 26px; background: rgba(242, 244, 232, .03); cursor: pointer; transition: background .2s, box-shadow .2s; }
.gm .opt:hover { background: rgba(242, 244, 232, .06); }
.gm .opt input { position: absolute; opacity: 0; pointer-events: none; }
.gm .opt:has(input:checked) { background: color-mix(in srgb, var(--tint) 10%, var(--pod-2)); box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--tint) 55%, transparent); }
.gm .opt:has(input:focus-visible) { outline: 2px solid var(--mint); outline-offset: 2px; }
.gm .opt b { font-size: 17px; }
.gm .opt small { display: block; color: var(--ink-3); font-size: 14.5px; }
.gm .opt .tag2 { font-size: 13px; color: var(--ink-2); padding: 5px 11px; border-radius: 99px; background: rgba(242, 244, 232, .06); white-space: nowrap; }
.gm .gfield { display: grid; gap: 8px; margin-top: 20px; }
.gm .gfield label { font-weight: 500; }
.gm .gfield .hint { font-size: 14px; color: var(--ink-3); }
.gm .gfield .err { font-size: 14px; color: var(--red); }
.gm .gfield input { height: 54px; padding: 0 20px; border-radius: 18px; border: 0; background: var(--night); box-shadow: inset 0 0 0 1.5px rgba(242, 244, 232, .12); font-size: 18px; outline: none; max-width: 360px; }
.gm .gfield input:focus { box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .6); }
.gm .gfield input[aria-invalid="true"] { box-shadow: inset 0 0 0 1.5px rgba(255, 138, 122, .7); }
.gm .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.gm .check { display: grid; grid-template-columns: 26px 1fr; gap: 12px; margin-top: 16px; padding: 14px 16px; border-radius: 20px; background: rgba(242, 244, 232, .03); color: var(--ink-2); font-size: 15.5px; cursor: pointer; }
.gm .check input { width: 22px; height: 22px; accent-color: var(--mint); margin: 1px 0 0; }
.gm .check b { color: var(--ivory); }
.gm .quick { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.gm .stepnav { display: flex; justify-content: space-between; gap: 10px; padding: 16px 22px 22px; }
.spore-fx { position: fixed; z-index: 80; width: 10px; height: 10px; pointer-events: none; animation: spore 1.6s var(--ease) forwards; }
.spore-fx svg { width: 100%; height: 100%; display: block; }
@keyframes spore { 0% { transform: translate(0, 0) scale(.3) rotate(0); opacity: 1; } 100% { transform: translate(var(--dx), var(--dy)) scale(1) rotate(160deg); opacity: 0; } }
.gm .born svg { animation: born 1.1s var(--ease); }
@keyframes born { from { transform: scale(.82) translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 960px) {
.gm .mine3 { grid-template-columns: 1fr; }
.gm .appr { grid-template-columns: 44px 1fr; }
.gm .appr .acts { grid-column: 1 / -1; }
.gm .chat { height: 400px; padding: 6px 14px 14px; }
.gm .msg { max-width: 96%; }
.gm .startgrid { grid-template-columns: 1fr; }
.gm .preview { position: relative; top: 0; order: -1; }
.gm .preview .face { height: 230px; }
.gm .preview .face svg { width: 230px; height: 236px; }
.gm .steps { border-radius: 28px; width: 100%; }
.gm .steps button { padding: 0 12px 0 6px; }
.gm .steps button:not([aria-current]) .lbl { display: none; }
.gm .row2 { grid-template-columns: 1fr; }
.gm .opt { grid-template-columns: 44px 1fr; }
.gm .opt .tag2 { grid-column: 2; justify-self: start; }
}
.gm .preview p.bubble, .gm .msg p.bubble { color: #0B1210; }
.gm .cols2 > *, .gm .stackv > *, .gm .startgrid > * { min-width: 0; }
.gm .msg.myc p.bubble { color: var(--ivory); }

/* ===================== APP ADDITIONS (real app, beyond the comps) ===================== */
.gm .seg-mode { display: inline-flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--pod); box-shadow: var(--lift); }
.gm .seg-mode .fchip { height: 40px; gap: 6px; }
.gm .map-bar { position: fixed; z-index: 5; left: 50%; bottom: 28px; transform: translateX(-50%); display: flex; align-items: center; gap: 14px; flex-wrap: wrap; justify-content: center;
  padding: 8px 18px 8px 8px; border-radius: 999px; background: rgba(13, 17, 20, .92); box-shadow: var(--lift), inset 0 0 0 1px rgba(242, 244, 232, .07); max-width: calc(100% - 32px); }
body.map-on #viewHost { min-height: calc(100vh - 120px); }
#viewHost { z-index: 2; }
.gm .feed li.empty { padding: 14px; }
.gm .lg-badge:empty { display: none; }
.gm .arow .lg-hb { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 2px 8px; border-radius: 99px; background: rgba(101, 230, 196, .12); color: var(--mint); font-size: 12px; font-weight: 500; vertical-align: 2px; }
.gm .arow .lg-hb svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2; }
.gm .phead h1 .soon { font-size: 14px; letter-spacing: 0; }
@media (max-width: 860px) { .gm .map-bar { bottom: 96px; } .gm .phead .acts { width: 100%; } }
/* neutralise older global rules (app.css) that share a class name with the kit */
.gm .tag { font: inherit; background: none; padding: 0; border-radius: 0; border: 0; }
.gm .hero .tag { display: block; font-size: clamp(19px, 1.7vw, 23px); }
.gm .h2 { font-weight: 500; margin: 0; }
.gm .top { padding-block: 0; border-bottom: 0; z-index: auto; }
.gm .bar { height: auto; background: none; overflow: visible; border-radius: 0; }
.gm .row { gap: inherit; }
.gm .empty { color: var(--ink-2); }
.gm .idline span:empty{display:none}
/* My agents (views/me.js) in the page layout */
.view .v-me { position: static; inset: auto; height: auto; overflow: visible; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.gm.me-page .mcard .face { display: block; }
.gm.me-page .mcard.open { box-shadow: var(--lift), inset 0 0 0 1.5px color-mix(in srgb, var(--tint) 55%, transparent); }
.gm.me-page .mcard .next a { text-decoration: none; }
.gm.me-page .me-open { padding: 22px 26px 26px; }
.gm.me-page .me-top { position: relative; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.gm.me-page .me-valrow { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 28px; align-items: center; margin-top: 14px; }
.gm.me-page .hero-num { font-size: clamp(44px, 5vw, 72px); }
.gm.me-page .me-now { padding: 16px 20px 18px; border-radius: 22px 22px 22px 8px; background: #EEF1E6; color: #0B1210; box-shadow: 0 12px 28px -12px rgba(0, 0, 0, .8); }
.gm.me-page .me-now .b-l { display: flex; align-items: center; gap: 8px; font: 500 13px/1 var(--sans); color: #2E6B5C; }
.gm.me-page .me-now .b-l .nx { margin-left: auto; color: #5B6B65; font-weight: 500; }
.gm.me-page .me-now p { margin: 10px 0 0; font: 520 17px/1.4 var(--sans); }
.gm.me-page .me-now.spore { background: rgba(185, 162, 232, .16); color: var(--ivory); }
.gm.me-page .me-needbox { padding: 0 22px 20px; }
.gm.me-page .me-needbox .me-need { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 14px; text-align: left; padding: 14px 18px; border: 0; border-radius: 22px; background: rgba(242, 193, 78, .1); color: var(--ivory); cursor: pointer; }
.gm.me-page .me-needbox .lnk { color: var(--mint); font-weight: 500; }
.gm.me-page .rows { list-style: none; margin: 0; padding: 0 16px 18px; display: grid; gap: 4px; }
.gm.me-page .rows li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 11px 12px; border-radius: 18px; font-size: 15px; }
.gm.me-page .rows li:nth-child(odd) { background: rgba(242, 244, 232, .025); }
.gm.me-page .rows small { display: block; color: var(--ink-3); font-size: 13px; }
.gm.me-page .rows .v { text-align: right; font-variant-numeric: tabular-nums; }
.gm.me-page .rows em { font-style: normal; color: var(--ink-3); margin-right: 6px; }
.gm.me-page .me-rule { padding: 0 24px 10px; color: var(--ink-2); }
.gm.me-page .me-foot { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 4px 24px 24px; }
.gm.me-page .me-foot .cr { flex: 1 1 100%; color: var(--ink-2); }
.gm.me-page .lnk { background: none; border: 0; padding: 0; color: var(--mint); font: 500 15px/1.2 var(--sans); cursor: pointer; text-decoration: none; }
.gm.me-page .me-chatpod .chat { display: flex; flex-direction: column; height: 440px; padding: 6px 22px 12px; }
.gm.me-page .me-sh .m.bot { background: #EEF1E6; color: #0B1210; border-radius: 20px 20px 20px 6px; }
.gm.me-page .me-sh .m.bot .meta, .gm.me-page .me-sh .m.bot .when { color: #5B6B65; }
.gm.me-page .me-sh .m.you { background: var(--mint); color: #05231B; border-radius: 20px 20px 6px 20px; }
.gm.me-page .me-sh .sugg { padding: 0 22px; display: flex; gap: 8px; flex-wrap: wrap; }
.gm.me-page .me-more { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.gm.me-page .me-connect { display: grid; grid-template-columns: 96px 1fr auto; gap: 20px; align-items: center; margin-top: 32px; }
.gm.me-page .me-connect .acts { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 960px) { .gm.me-page .me-valrow { grid-template-columns: 1fr; } .gm.me-page .me-connect { grid-template-columns: 1fr; justify-items: start; } .gm.me-page .me-open { padding: 18px; } }
.view .gm.me-page .me-sh .compose { position: static; background: none; padding: 10px 16px 18px; }
.view .gm.me-page .me-sh .chat { overflow-y: auto; overscroll-behavior: contain; }
.view .gm.me-page .me-now p { color: #0B1210; }
.view .gm.me-page .me-now.spore p { color: var(--ivory); }
.view .gm.me-page .me-sh .sugg button { border: 0; background: rgba(242, 244, 232, .06); border-radius: 999px; padding: 9px 14px; font-size: 14px; }
/* Start (views/plant.js) in the page layout */
.view .v-plant .stage { position: relative; inset: auto; z-index: auto; display: block; padding: 0 0 24px; min-height: 0; background: linear-gradient(180deg, var(--pod-2), var(--pod)); overflow: visible; }
.view .v-plant .pl-top { position: static; display: flex; align-items: center; justify-content: space-between; height: auto; padding: 18px 22px 0; width: auto; }
.view .v-plant .pl-back { width: auto; height: auto; border-radius: 999px; display: inline-flex; }
.view .v-plant .pl-count { color: var(--ink-3); font-size: 14px; }
.view .v-plant .pl-step { max-width: none; align-items: stretch; text-align: left; margin: 0; padding: 8px 26px 8px; }
.view .v-plant .pl-step h1, .view .v-plant .land h1 { font: 500 clamp(26px, 2.4vw, 34px)/1.15 var(--sans); letter-spacing: -.025em; margin: 6px 0 0; }
.view .v-plant .sub { margin: 10px 0 0; max-width: 52ch; font-size: 17px; }
.view .v-plant .go { align-self: flex-start; min-width: 0; min-height: 52px; }
.view .v-plant .pl-tiles { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 22px; }
.view .v-plant .pl-tile { min-height: 0; border: 0; border-radius: 26px; background: rgba(242, 244, 232, .03); }
.view .v-plant .pl-tile[aria-checked="true"] { background: rgba(101, 230, 196, .1); box-shadow: inset 0 0 0 1.5px rgba(101, 230, 196, .55); }
.view .v-plant .narrow { width: 100%; }
.view .v-plant .land { padding: 8px 26px; text-align: left; }
.view .v-plant .land em { color: var(--mint); }
.gm.pl-page .steps button[disabled] { cursor: default; }
.gm.pl-page .steps .no .ico { width: 14px; height: 14px; }
.gm.pl-page .preview { padding-top: 6px; }
.gm.pl-page .preview p.bubble { color: #0B1210; }
body.vpl-on #navDock { visibility: visible; }
@media (max-width: 960px) { .view .v-plant .pl-step { padding: 6px 18px; } }
.view .v-plant .pl-tiles { grid-template-columns: 1fr; gap: 8px; }
.view .v-plant .pl-tile { display: grid; grid-template-columns: 52px 1fr 28px; gap: 14px; align-items: center; padding: 12px 16px 12px 12px; }
.view .v-plant .pl-tile .pg { width: 52px; height: 52px; position: static; }
.view .v-plant .pl-tile .tx b { display: block; font-size: 17px; margin: 0; }
.view .v-plant .pl-tile .tx small { display: block; color: var(--ink-3); font-size: 14.5px; margin: 2px 0 0; }
.view .v-plant .pl-tile .ck { position: static; }
.view .v-plant .btn-glow, .view .v-plant .btn-primary { background: var(--mint); color: #05231B; border: 0; }
.view .v-plant .stage.launched { background: linear-gradient(180deg, var(--pod-2), var(--pod)); pointer-events: auto; }
.view .v-plant .stage.launched .pl-top { visibility: visible; }
.view .v-plant .land { margin: 0; width: auto; padding: 8px 26px 18px; background: none; box-shadow: none; border: 0; border-radius: 0; }
.view .v-plant .stage.launched .pl-back { visibility: hidden; }
/* More page (views/help.js) */
.gm.v-more .mo-sec { margin-top: 44px; }
.gm.v-more .mo-sec h2 { margin-bottom: 14px; color: var(--ink-2); }
.gm.v-more .mo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 10px; }
.gm.v-more .mo-it { display: block; padding: 16px 18px; border-radius: 26px; background: linear-gradient(180deg, var(--pod-2), var(--pod)); box-shadow: var(--lift); color: var(--ivory); text-decoration: none; transition: box-shadow .2s; }
.gm.v-more .mo-it > a { color: inherit; text-decoration: none; }
.gm.v-more a.mo-it:hover, .gm.v-more .mo-it:hover { box-shadow: var(--lift), inset 0 0 0 1.5px rgba(101, 230, 196, .3); }
.gm.v-more .mo-it a, .gm.v-more a.mo-it { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; }
.gm.v-more div.mo-it > .link { display: inline-flex; margin-left: 58px; }
.gm.v-more .mo-ic { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: rgba(101, 230, 196, .1); color: var(--mint); }
.gm.v-more .mo-ic svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gm.v-more b { display: block; font-size: 17px; font-weight: 500; }
.gm.v-more small { display: block; margin-top: 3px; color: var(--ink-3); font-size: 14.5px; line-height: 1.4; }
.gm.v-more .mo-road { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 44px; color: var(--ivory); text-decoration: none; }
.gm.v-more .mo-kbd { font: 500 12px/1 var(--sans); padding: 3px 6px; border-radius: 6px; background: rgba(242, 244, 232, .08); color: var(--ink-3); }
/* GX.routed detail pages (recipes.js): plan, app and leader details as page sections */
.gx-hid { display: none !important; }
.gx-page.gm .gx-pbody { max-width: 860px; }
.gx-page.gm .gx-pbody .sheet-x { display: none; }
.view .gx-shade { display: none; }
.view .gx { margin-left: 0; width: auto; padding: 32px 0 24px; }
.gx-page .gx-cta { position: static; background: none; margin: 24px 0 0; padding: 0; }
.gx-page .gx-cta .btn { background: var(--mint); color: #05231B; }
/* older "layer" views that used to float over the world: plain page flow now */
.view .vt3 { margin-top: 0; min-height: 0; padding: 8px 0 24px; border-radius: 0; background: none; box-shadow: none; border: 0; }
.view .vt3-shade { display: none; }
.view .vt3-pane { border: 0; box-shadow: var(--lift), inset 0 1px 0 rgba(242, 244, 232, .05); }
@media (max-width: 860px) { .view .gx, .view .gx.c { padding: 16px 0 24px; } }
.gm .gfoot h2.ft-h { font-size: 14px; font-weight: 500; color: var(--ivory); margin: 0 0 12px; letter-spacing: 0; }
.gm .mcard h2.mc-n { font-size: 24px; } .gm .mcard h2.mc-n a { color: inherit; text-decoration: none; } .gm .mcard h2.mc-n a:hover { color: var(--mint); }
/* laptop widths: keep the logo, compact the right side; feature card moves under the copy so nothing squeezes */
.gm .gnav .logo { flex: none; }
.gm .gnav .links { flex: none; }
@media (max-width: 1180px) { .gm .gnav .mine .lbl { display: none; } .gm .gnav .mine { padding: 0 10px 0 5px; } }
@media (min-width: 961px) and (max-width: 1240px) {
  .gm .hero-in { grid-template-columns: minmax(0, 1fr) 360px; grid-template-rows: auto auto; }
  .gm .copy { grid-column: 1; grid-row: 1; }
  .gm .feat { grid-column: 1; grid-row: 2; justify-self: start; align-self: start; margin-top: 28px; width: min(100%, 380px); }
  .gm .hero-bot { grid-column: 2; grid-row: 1 / span 2; width: 360px; height: 370px; }
}
@media (max-width: 1180px) { .gm .gnav { gap: 8px; } .gm .gnav .links a { padding: 0 10px; } }
/* craft floor: no coloured side stripes on callouts in older views; tinted pods instead */
.view .vd-short, .view .va-verdict, .view .my-tip, .view .my-honest2, .view .h-risk { border: 0 !important; box-shadow: none !important; border-radius: 20px; background: rgba(101, 230, 196, .07); padding: 14px 16px; }
/* Start: Role · Plan rows with an honest tag, five labelled steps (labels stay visible on phones) */
.view .v-plant .pl-tile { grid-template-columns: 52px minmax(0, 1fr) auto 28px; }
.view .v-plant .pl-tile .tag2 { font-size: 13px; color: var(--ink-2); padding: 5px 11px; border-radius: 99px; background: rgba(242, 244, 232, .06); white-space: nowrap; }
.view .v-plant .pl-tile[aria-checked="true"] .tx b, .view .v-plant .pl-tile .tx b { color: var(--ivory); }
.view .v-plant .pl-tile .tx small { color: var(--ink-3); }
.gm.pl-page .steps { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.gm.pl-page .steps::-webkit-scrollbar { display: none; }
.gm.pl-page .steps button { white-space: nowrap; flex: none; }
.gm.pl-page .steps button .lbl { display: inline !important; }
@media (max-width: 960px) { .gm.pl-page .steps button { padding: 0 12px 0 5px; font-size: 14px; } .view .v-plant .pl-tile { grid-template-columns: 44px minmax(0, 1fr) 24px; } .view .v-plant .pl-tile .pg { width: 44px; height: 44px; } .view .v-plant .pl-tile .tag2 { grid-column: 2; grid-row: 2; justify-self: start; } .view .v-plant .pl-tile .ck { grid-column: 3; grid-row: 1; } }
@media (max-width: 960px) { .view .v-plant .pl-tile .pg .av { width: 44px !important; height: 44px !important; } }
/* $HYPHA: a card grid that fits (no clipped "More w…"), labelled pill actions instead of bare round icons */
.view .vt3-cards .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); overflow: visible; gap: 14px; }
.view .vt3-cards .cards > .card { flex: none; width: auto; height: auto; min-height: 150px; }
.view .vt3-acts { gap: 10px; }
.view .vt3-acts .btn-round { flex-direction: row; width: auto; gap: 10px; min-height: 48px; padding: 0 18px 0 6px; border-radius: 999px; background: var(--pod-3); color: var(--ivory); font-size: 15px; box-shadow: inset 0 0 0 1px rgba(242, 244, 232, .08); }
.view .vt3-acts .btn-round:hover { background: #242D33; }
.view .vt3-acts .btn-round > .o { width: 36px; height: 36px; box-shadow: none; background: rgba(242, 244, 232, .06); }
.view .vt3-acts .btn-round > .o svg { width: 18px; height: 18px; }
.view .vt3-acts .btn-round.ember { background: var(--amber); color: #2A1E02; }
.view .vt3-acts .btn-round.ember > .o { background: rgba(42, 30, 2, .12); color: #2A1E02; }
@media (max-width: 768px) { .view .vt3-acts { display: grid; grid-template-columns: 1fr 1fr; } .view .vt3-acts .btn-round { width: auto; } .view .vt3-cards .cards { grid-template-columns: 1fr 1fr; } }
/* My agents cards: each carries its role colour as a halo; the open one says so */
.gm.me-page .mcard { box-shadow: var(--lift), 0 0 0 1px color-mix(in srgb, var(--tint) 18%, transparent), 0 30px 80px -40px color-mix(in srgb, var(--tint) 45%, transparent); }
.gm.me-page .mcard .face::before { background: radial-gradient(closest-side, color-mix(in srgb, var(--tint) 42%, transparent), transparent); }
.gm.me-page .mcard.open { box-shadow: var(--lift), inset 0 0 0 1.5px color-mix(in srgb, var(--tint) 60%, transparent), 0 30px 80px -40px color-mix(in srgb, var(--tint) 55%, transparent); }
.gm.me-page .mcard.off { filter: saturate(.55); }
.gm.me-page .mc-open { position: absolute; z-index: 2; left: 16px; top: 16px; padding: 5px 11px; border-radius: 99px; font-size: 12.5px; font-weight: 500; color: #05231B; background: color-mix(in srgb, var(--tint) 85%, white); }
/* home caps tagline: never strand one word on its own line on phones */
@media (max-width: 560px) { .gm .hero .caps { font-size: 11.5px; letter-spacing: .2em; gap: 8px 10px; flex-wrap: nowrap; } }
@media (max-width: 340px) { .gm .hero .caps { flex-wrap: wrap; } }
/* More page as a designed index: five main doors, then three quiet columns of links with one-line descriptions */
.gm.v-more .mo-main { margin-top: 40px; }
.gm.v-more .mo-feat { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.gm.v-more .mo-feat .mo-it, .gm.v-more .mo-feat a.mo-it { grid-template-columns: 1fr; padding: 22px 20px; min-height: 170px; align-content: start; }
.gm.v-more .mo-feat .mo-ic { width: 52px; height: 52px; }
.gm.v-more .mo-feat b { font-size: 20px; margin-top: 6px; }
.gm.v-more .mo-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 40px; margin-top: 52px; }
.gm.v-more .mo-col h2 { color: var(--ink-2); margin-bottom: 10px; }
.gm.v-more .mo-col ul { list-style: none; margin: 0; padding: 0; }
.gm.v-more .mo-col li { padding: 12px 0; border-top: 1px solid var(--line); }
.gm.v-more .mo-col li a { color: inherit; text-decoration: none; display: block; }
.gm.v-more .mo-col li a:hover b { color: var(--mint); }
.gm.v-more .mo-col li b { font-size: 16.5px; }
.gm.v-more .mo-col li .link { margin-top: 4px; font-size: 14px; }
@media (max-width: 1100px) { .gm.v-more .mo-feat { grid-template-columns: repeat(3, minmax(0, 1fr)); } .gm.v-more .mo-cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .gm.v-more .mo-feat { grid-template-columns: 1fr 1fr; } .gm.v-more .mo-feat .mo-it { min-height: 0; padding: 16px; } .gm.v-more .mo-cols { grid-template-columns: 1fr; } }
/* long pages: in-page targets land below the sticky nav; side contents stay below it too */
.view-page [id] { scroll-margin-top: 104px; }
.view .v-docs .vd-side { top: 100px; max-height: calc(100dvh - 130px); }
@media (max-width: 860px) { .view .v-docs .vd-side { top: 80px; max-height: none; } .view-page [id] { scroll-margin-top: 84px; } }
/* activity list (views/kit-activity.js): one component everywhere. Rows are all the same: no alternating pods, a quiet hairline
   between rows, the same inset as the card's content. */
.act { list-style: none; margin: 0; padding: 0 22px 14px; }
.act-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 12px 0; border-top: 1px solid rgba(242, 244, 232, .06); }
.act-row:first-child { border-top: 0; }
.act-row.fresh { animation: actIn 1.6s var(--ease); }
@keyframes actIn { from { background: rgba(101, 230, 196, .09); } to { background: transparent; } }
.act-ic { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: rgba(242, 244, 232, .06); color: var(--ink-2); }
.act-ic .ico { width: 16px; height: 16px; }
.act-row.t-trade .act-ic { background: rgba(101, 230, 196, .12); color: var(--mint); }
.act-row.t-blocked .act-ic, .act-row.t-guard .act-ic { background: rgba(242, 176, 78, .13); color: var(--r-bodyguard); }
.act-row.t-paid .act-ic { background: rgba(242, 193, 78, .12); color: var(--amber); }
.act-row.t-network .act-ic, .act-row.t-brief .act-ic { background: rgba(185, 162, 232, .13); color: var(--spore); }
.act-row.t-setup .act-ic { background: rgba(127, 207, 242, .12); color: var(--r-assistant); }
.act-row.t-you .act-ic { background: var(--mint); color: #05231B; }
.act-main { min-width: 0; font-size: 15px; line-height: 1.45; color: var(--ivory); padding-top: 6px; }
.act-who { display: inline-flex; align-items: center; gap: 7px; margin: -4px 8px 2px 0; color: var(--ivory); text-decoration: none; vertical-align: middle; }
.act-who b { font-weight: 500; } .act-who:hover b { color: var(--mint); }
.act-type { display: inline-block; margin-right: 8px; font-size: 12.5px; font-weight: 500; letter-spacing: .02em; color: var(--ink-3); }
.act-row.t-trade .act-type { color: var(--mint); } .act-row.t-blocked .act-type, .act-row.t-guard .act-type { color: var(--r-bodyguard); } .act-row.t-paid .act-type { color: var(--amber); } .act-row.t-network .act-type, .act-row.t-brief .act-type { color: var(--spore); } .act-row.t-setup .act-type { color: var(--r-assistant); }
.act-text b { font-weight: 500; }
.act-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; padding-top: 6px; font-size: 13.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.act-meta > :first-child:not(time) { color: var(--ivory); font-weight: 500; }
.act-meta a { color: var(--mint); font-size: 12.5px; }
.act-empty { padding: 18px 0; color: var(--ink-3); }
@media (max-width: 640px) { .act { padding: 0 16px 12px; } .act-row { grid-template-columns: 30px minmax(0, 1fr); } .act-ic { width: 30px; height: 30px; } .act-meta { grid-column: 2; flex-direction: row; gap: 10px; align-items: baseline; padding-top: 0; } .act-who { display: flex; margin-bottom: 4px; } }
@media (prefers-reduced-motion: reduce) { .act-row.fresh { animation: none; } }
.act-row[data-id] { cursor: pointer; }
.act-row.open { background: rgba(242, 244, 232, .025); }
.act-more { padding: 4px 0 16px 46px; color: var(--ink-2); font-size: 14.5px; }
.act-more ul { margin: 0 0 8px; padding-left: 18px; display: grid; gap: 4px; }
.act-more .acts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.gm.v-live2 .tools { padding-bottom: 14px; }
.view .gm.me-page .rows { padding: 0 22px 14px; gap: 0; }
.view .gm.me-page .rows li { background: none !important; border: 0; border-top: 1px solid rgba(242, 244, 232, .06); border-radius: 0; padding: 12px 0; }
.view .gm.me-page .rows li:first-child { border-top: 0; }
/* Live ledger (views/ledger.js): readable cards, quiet method */
.gm.v-ledger2 .lgc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 16px; }
.gm.v-ledger2 .lgc { padding: 20px 22px; display: grid; gap: 14px; box-shadow: var(--lift), 0 0 0 1px color-mix(in srgb, var(--tint) 14%, transparent); }
.gm.v-ledger2 .lgc-top { display: grid; grid-template-columns: 52px 1fr auto; gap: 12px; align-items: center; }
.gm.v-ledger2 .lgc-id b { font-size: 18px; color: var(--ivory); } .gm.v-ledger2 .lgc-id a { text-decoration: none; } .gm.v-ledger2 .lgc-id small { display: block; color: var(--ink-3); font-size: 14px; } .gm.v-ledger2 .lgc-id small a { color: var(--ink-2); }
.gm.v-ledger2 .lgc-mid { display: grid; grid-template-columns: 1fr 160px; gap: 12px; align-items: end; }
.gm.v-ledger2 .lgc-mid small, .gm.v-ledger2 .lgc-res small { display: block; color: var(--ink-3); font-size: 13.5px; }
.gm.v-ledger2 .lgc-cap { font-size: 17px; font-weight: 500; font-variant-numeric: tabular-nums; }
.gm.v-ledger2 .lgc-spark { width: 160px; height: 40px; }
.gm.v-ledger2 .lgc-nospark { color: var(--ink-3); font-size: 13px; text-align: right; }
.gm.v-ledger2 .lgc-v { display: block; font-size: 28px; font-weight: 500; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.gm.v-ledger2 .lgc-foot { display: flex; gap: 18px; flex-wrap: wrap; padding-top: 12px; border-top: 1px solid rgba(242, 244, 232, .06); color: var(--ink-3); font-size: 13.5px; }
.gm.v-ledger2 .lgc-foot b { color: var(--ivory); font-weight: 500; }
.gm.v-ledger2 .lg-figs { gap: 12px; }
.gm.v-ledger2 .lg-fig { border: 0; border-radius: 22px; padding: 16px 18px; background: linear-gradient(180deg, var(--pod-2), var(--pod)); box-shadow: var(--lift); }
.gm.v-ledger2 .lg-fig small { font-size: 14px; } .gm.v-ledger2 .lg-fig b { font: 500 26px/1.1 var(--sans); } .gm.v-ledger2 .lg-fig .src, .gm.v-ledger2 .lg-fig .upd { font-size: 13px; }
.lgt-w { overflow-x: auto; padding: 0 12px 14px; }
.lgt { width: 100%; border-collapse: collapse; font-size: 15px; font-variant-numeric: tabular-nums; min-width: 560px; }
.lgt th { text-align: left; font-weight: 500; font-size: 13.5px; color: var(--ink-3); padding: 8px 12px; }
.lgt td { padding: 14px 12px; border-top: 1px solid rgba(242, 244, 232, .06); }
.lgt .r { text-align: right; } .lgt a { color: var(--ivory); text-decoration: none; font-weight: 500; } .lgt a:hover { color: var(--mint); }
.lgt .up { color: var(--lime); } .lgt .down { color: var(--red); }
.gm.v-ledger2 .lg-how { margin-top: 44px; max-width: 80ch; }
.gm.v-ledger2 .lg-how ul { margin: 10px 0 12px; padding-left: 20px; color: var(--ink-2); display: grid; gap: 6px; }
@media (max-width: 640px) { .gm.v-ledger2 .lgc-mid { grid-template-columns: 1fr; } .gm.v-ledger2 .lgc-spark { width: 100%; } }
/* readability floor for data tables in older pages (Docs, Builders, Verify, Compare, $HYPHA sheets) */
.view-page table th { font-size: 13.5px; font-weight: 500; color: var(--ink-3); padding: 10px 14px; text-align: left; }
.view-page table td { font-size: 15px; line-height: 1.5; padding: 12px 14px; vertical-align: top; }
.view-page table td.mono, .view-page table td code { font-size: 13.5px; }
.view-page table { border-collapse: collapse; }
.view-page table tbody tr + tr td { border-top: 1px solid rgba(242, 244, 232, .06); }
/* Roadmap readability */
.view .v-road { max-width: 860px; }
.view .rm-it { border: 0; border-radius: 22px; padding: 18px 22px; box-shadow: var(--lift); }
.view .rm-it b { font: 500 17.5px/1.3 var(--sans); }
.view .rm-it small { font-size: 15px; color: var(--ink-2); }
.view .rm-it em { font: 500 12.5px/1 var(--sans); letter-spacing: .03em; text-transform: none; border: 0; background: rgba(242, 244, 232, .06); padding: 6px 11px; }
.view .v-road h2 { font: 500 15px/1.2 var(--sans); letter-spacing: .02em; text-transform: none; color: var(--ink-2); }
@media (max-width: 640px) { .gm.v-live2 .tools { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .gm.v-live2 .tools .fchip { flex: none; } }

/* ===================== LIGHT COMPONENTS (owner 2026-10-16): ivory bands and light cards on dark =====================
   Both re-point the kit's colour tokens, so every component inside adapts: near-black ink, a deeper mint (#127A66,
   5.0:1 on ivory) for links and accents, a deeper lavender, amber, lime and red, white pods with soft neutral lift. */
.band-light, .is-light {
  --ivory: #0B1210; --mist: #0B1210; --ink-2: #39443F; --ink-3: #56615B; --mist-2: #39443F; --mist-3: #56615B;
  --mint: #127A66; --accent: #127A66; --spore: #6A4FB0; --amber: #8A6100; --ember: #8A6100; --lime: #2F7A12; --up: #2F7A12; --red: #B23A2A; --down: #B23A2A;
  --pod: #FFFFFF; --pod-2: #FFFFFF; --pod-3: #E7EBE0; --night: #F7F8F2; --line: rgba(11, 18, 16, .1);
  --lift: 0 18px 40px -24px rgba(20, 30, 25, .28), 0 1px 3px rgba(20, 30, 25, .1);
  color: var(--ivory);
}
.band-light { position: relative; background: #F2F4E8; padding: 24px 0 110px; margin-top: 110px; }
.band-light::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, rgba(101, 230, 196, .5), transparent); }
.band-light :focus-visible, .is-light :focus-visible { outline-color: #127A66; }
.band-light ::selection, .is-light ::selection { background: rgba(18, 122, 102, .22); color: #0B1210; }
.gm .band-light .sec { padding-top: 86px; }
.gm .band-light .sec-head p, .gm .band-light .lede { color: var(--ink-2); }
.gm .band-light .btn.mint, .gm .is-light .btn.mint { background: #127A66; color: #fff; box-shadow: 0 10px 22px -12px rgba(18, 122, 102, .7); }
.gm .band-light .btn:not(.mint), .gm .is-light .btn:not(.mint) { background: #E7EBE0; color: #0B1210; box-shadow: none; }
.gm .band-light .link { color: #0B1210; } .gm .band-light .link:hover { color: #127A66; }
.gm .band-light .src { background: rgba(11, 18, 16, .05); color: #56615B; } .gm .band-light .src .ico { color: #127A66; }
.gm .band-light .bubble, .gm .is-light .bubble { background: #EEF1E6; color: #0B1210; box-shadow: none; }
.gm .band-light .bubble.dark, .gm .is-light .bubble.dark { background: #F2F4E8; color: #0B1210; } .gm .is-light .bubble.dark .who { color: #127A66; }
.gm .band-light .pill.run, .gm .is-light .pill.run { background: rgba(18, 122, 102, .1); color: #127A66; }
.gm .band-light .pill, .gm .is-light .pill { background: rgba(11, 18, 16, .06); color: #39443F; }
.gm .band-light .demo, .gm .is-light .demo { background: rgba(138, 97, 0, .1); color: #7A5600; }
.gm .band-light .role-pick button[aria-pressed="true"] { background: #fff; }
.gm .band-light .rule { border-top-color: rgba(11, 18, 16, .1); }
.gm .band-light .four li { background: #fff; box-shadow: var(--lift); }
.gm .band-light .four .ic { background: rgba(18, 122, 102, .1); } .gm .band-light .four .ic.myc { background: rgba(106, 79, 176, .1); }
.gm .band-light .vs td { background: #fff; } .gm .band-light .vs th:nth-child(2) { color: #127A66; } .gm .band-light .vs .s { color: #127A66; }
.gm .band-light .feebar { background: #fff; }
.gm .band-light .feebar span { color: #0B1210; }
.gm .band-light .feebar span:nth-child(1) { background: #65E6C4 !important; } .gm .band-light .feebar span:nth-child(2) { background: #F2C14E !important; }
.gm .band-light .feebar span:nth-child(3) { background: #CBD2C4 !important; } .gm .band-light .feebar span:nth-child(4) { background: #8FD9C2 !important; }
.gm .band-light .feebar span:nth-child(5) { background: #A7ADA2 !important; } .gm .band-light .feebar span:nth-child(6) { background: #454B47 !important; color: #fff; }
.gm .band-light .feekey i[style*="--ivory"] { background: #CBD2C4 !important; }
.gm .band-light .fine2 { color: #56615B; }
.is-light { background: #FAFBF6 !important; box-shadow: 0 24px 60px -30px rgba(0, 0, 0, .9), inset 0 0 0 1px rgba(255, 255, 255, .6) !important; }
.is-light .av { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring, var(--tint)) 70%, transparent); }

/* ===================== HOME HERO v2 (owner 2026-10-16): one focus — the robot on an Earth-horizon sunrise ===================== */
.gm .hx { position: relative; margin-top: -76px; padding-top: 76px; min-height: min(900px, 100svh); overflow: hidden; isolation: isolate; }
.gm .hx canvas { position: absolute; inset: 0; z-index: -2; display: block; opacity: .55; -webkit-mask-image: linear-gradient(transparent 0, #000 22%, #000 60%, transparent 92%); mask-image: linear-gradient(transparent 0, #000 22%, #000 60%, transparent 92%); }
.gm .hx-sky { position: absolute; inset: 0; z-index: -3; background: radial-gradient(70% 55% at 72% 78%, rgba(101, 230, 196, .10), transparent 70%), radial-gradient(50% 40% at 85% 70%, rgba(185, 162, 232, .07), transparent 70%); }
.gm .hx .horizon { z-index: -1; left: -20%; right: -60%; top: 74%; }
.gm .hx .sunrise { z-index: -1; left: 72%; top: calc(74% - 90px); width: 900px; height: 180px; }
.gm .hx-in { position: relative; width: min(1320px, 100% - 64px); margin: auto; min-height: calc(min(900px, 100svh) - 76px); display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; column-gap: 40px; padding: 30px 0 40px; }
.gm .hx-copy { position: relative; z-index: 2; max-width: 640px; }
.gm .hx h1 { font-size: clamp(46px, 5.6vw, 84px); line-height: 1; letter-spacing: -.04em; max-width: 12ch; }
.gm .hx .tag { margin-top: 24px; font-size: clamp(18px, 1.5vw, 21px); line-height: 1.5; color: var(--ink-2); max-width: 46ch; }
.gm .hx-small { margin-top: 14px; display: flex; align-items: center; gap: 8px; color: var(--ink-3); font-size: 15px; }
.gm .hx .acts { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 28px; margin-top: 32px; }
.gm .hx-cta { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.gm .hx-cta small { color: var(--ink-3); font-size: 14px; padding-left: 8px; }
.gm .hx-proof { display: flex; flex-wrap: wrap; gap: 10px 36px; align-items: flex-start; margin-top: 40px; padding-top: 22px; border-top: 1px solid rgba(242, 244, 232, .08); }
.gm .hx-proof > div { display: grid; gap: 2px; justify-items: start; }
.gm .hx-proof b { font-size: 24px; font-weight: 500; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.gm .hx-proof span { font-size: 14px; color: var(--ink-3); }
.gm .hx-proof .src { margin-top: 4px; font-size: 12.5px; }
.gm .hx-proof > .demo { align-self: center; }
.gm .hx-bot { position: relative; justify-self: center; align-self: end; width: min(620px, 100%); aspect-ratio: 1180 / 1214; margin-bottom: -40px; }
.gm .hx-bot::before { content: ""; position: absolute; inset: 8% 4% 18%; border-radius: 50%; background: radial-gradient(closest-side, rgba(101, 230, 196, .18), transparent); }
.gm .hx-bot svg { position: relative; width: 100%; height: 100%; -webkit-mask-image: linear-gradient(#000 74%, transparent 98%); mask-image: linear-gradient(#000 74%, transparent 98%); }
@media (max-width: 960px) {
  .gm .hx { min-height: 0; } .gm .hx-in { grid-template-columns: 1fr; width: calc(100% - 32px); min-height: 0; padding: 36px 0 0; }
  .gm .hx-bot { width: min(380px, 92%); margin: 18px auto -30px; order: 2; } .gm .hx-proof { order: 3; margin-top: 28px; gap: 16px 24px; }
  .gm .hx .horizon { top: auto; bottom: -1240px; height: 1400px; left: -120%; right: -120%; } .gm .hx .sunrise { top: auto; bottom: 40px; left: 50%; width: 420px; }
}
/* Live right now: the featured agent as a light card next to what agents are saying */
.gm .hl-top { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: 24px; margin-bottom: 24px; align-items: stretch; }
.gm .hl-feat .feat { position: relative; grid-column: auto; width: auto; height: 100%; justify-self: stretch; align-self: stretch; display: block; }
.gm .feat .feat-k { position: absolute; right: 20px; top: 20px; font-size: 12.5px; font-weight: 500; color: var(--ink-3); }
.gm .hl-say { list-style: none; margin: 0; padding: 0 22px 22px; display: grid; gap: 14px; }
.gm .hl-say li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: start; }
.gm .hl-say .bubble { max-width: none; font-size: 15.5px; }
.gm .hl-say .who { display: block; color: #2E6B5C; font-weight: 500; font-size: 13px; text-decoration: none; margin-bottom: 2px; }
@media (max-width: 960px) { .gm .hl-top { grid-template-columns: 1fr; } }
.gm .hx h1 { margin: 0; }
.gm .hx .tag { display: block; }
.gm .hx canvas { opacity: .32; }
.gm .hx .horizon { left: -80%; right: -120%; }
@media (min-width: 961px) { .gm .hx-copy { padding-bottom: 20px; } }
@media (min-width: 961px) { .gm .hx .horizon { top: 90%; } .gm .hx .sunrise { top: calc(90% - 90px); } .gm .hx-bot { margin-bottom: -10px; } }
@media (min-width: 961px) { .gm .hx-in { grid-template-rows: auto auto; align-content: center; } .gm .hx-copy { grid-column: 1; grid-row: 1; align-self: end; } .gm .hx-proof { grid-column: 1; grid-row: 2; align-self: start; max-width: 640px; } .gm .hx-bot { grid-column: 2; grid-row: 1 / span 2; } }
@media (max-width: 960px) { .gm .hx-proof { position: relative; z-index: 2; padding-bottom: 8px; } }
.gm .feat.is-light, .gm .is-light { color: #0B1210; }
.gx-card.is-light .rc-g { width: auto; height: auto; }
.gx-card.is-light .t-up { color: #2F7A12; } .gx-card.is-light .t-down { color: #B23A2A; }
.gx-card.is-light .wk { background: rgba(18, 122, 102, .12); color: #127A66; }
.gx-card.is-light:hover { box-shadow: 0 24px 60px -30px rgba(0, 0, 0, .9), inset 0 0 0 2px rgba(18, 122, 102, .4) !important; }
.prow.is-light { border-radius: 26px; }
.gx-card.is-light .rc-g { position: static !important; inset: auto !important; display: block; width: 48px !important; height: 48px !important; margin: 0 0 6px; opacity: 1; }
.gx-card.is-light .rc-g .av { width: 48px !important; height: 48px !important; }
.gx-card.is-light .rc-g .av svg { width: 100%; height: 100%; }
/* robot avatars used outside .gm (older views: plans gallery, leaders, market): same ring style */
.av { position: relative; display: inline-block; flex: none; border-radius: 50%; overflow: hidden; background: radial-gradient(70% 70% at 50% 35%, color-mix(in srgb, var(--tint, #65E6C4) 22%, #12181B), #0C1013 72%); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring, var(--tint, #65E6C4)) 45%, transparent), 0 8px 20px -8px rgba(0, 0, 0, .8); }
.av svg { display: block; width: 100%; height: 100%; }
.av.st-paused { box-shadow: 0 0 0 2px rgba(110, 117, 111, .55); }
.av.st-guarding { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ring) 60%, transparent), 0 0 0 5px color-mix(in srgb, var(--ring) 18%, transparent); }
.gx-card.is-light .rc-g .av { border: 0; }
.gm .hx-proof { background: rgba(9, 12, 14, .78); border-top: 0; border-radius: 26px; padding: 18px 22px; box-shadow: inset 0 0 0 1px rgba(242, 244, 232, .06); width: max-content; max-width: 100%; }
.gm.v-ledger2 .small, .gm.v-ledger2 .lg-how li { max-width: 80ch; }
.gm .hx-proof { position: relative; } .gm .hx-proof > .demo { position: absolute; right: 16px; top: -13px; }
/* phone hero containment: the single column never grows past the screen */
@media (max-width: 960px) { .gm .hx-in { grid-template-columns: minmax(0, 1fr); } .gm .hx-copy, .gm .hx-proof { min-width: 0; max-width: 100%; } .gm .hx-proof { width: auto; } .gm .hx .acts { gap: 12px 20px; } }
@media (max-width: 420px) { .gm .hx h1 { font-size: clamp(38px, 11vw, 46px); } .gm .hx-proof { gap: 14px 18px; padding: 16px; } .gm .hx-proof b { font-size: 21px; } }
@media (max-width: 960px) { .gm.pl-page .steps { flex-wrap: wrap; overflow: visible; width: 100%; border-radius: 28px; gap: 4px; } .gm.pl-page .steps button { height: 40px; padding: 0 12px 0 4px; } .gm.pl-page .steps .no { width: 28px; height: 28px; } }
.view .vt3-cards .card .c-s { white-space: normal; overflow: visible; text-overflow: clip; display: block; -webkit-line-clamp: unset; line-height: 1.4; }
.view .vt3-cards .card .c-n { white-space: nowrap; }
.view .vt3-cards .card .c-n small { font-size: .5em; }
/* How it works: a numbered sequence (the order carries meaning), then the rules in one wide pod */
.gm .seq { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; position: relative; }
.gm .seq::before { content: ""; position: absolute; left: 22px; right: 22px; top: 21px; height: 2px; background: linear-gradient(90deg, var(--mint), var(--spore)); opacity: .45; }
.gm .seq li { position: relative; padding: 0 22px 0 0; display: grid; gap: 6px; align-content: start; }
.gm .seq .sq-n { position: relative; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font-weight: 500; font-size: 17px; background: var(--pod-2); color: var(--mint); box-shadow: var(--lift), inset 0 0 0 2px var(--mint); margin-bottom: 10px; }
.gm .seq b { font-size: 20px; font-weight: 500; letter-spacing: -.015em; }
.gm .seq span:not(.sq-n) { color: var(--ink-2); font-size: 16px; line-height: 1.5; max-width: 30ch; }
.gm .limits1 .rules { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) { .gm .seq { grid-template-columns: 1fr; gap: 18px; } .gm .seq::before { left: 21px; right: auto; top: 22px; bottom: 22px; width: 2px; height: auto; } .gm .seq li { grid-template-columns: 44px 1fr; column-gap: 14px; padding: 0; } .gm .seq .sq-n { grid-row: 1 / span 2; margin: 0; } .gm .limits1 .rules { grid-template-columns: 1fr; } }
/* Four ways in: one lead door at large scale, three compact doors */
.gm .ways { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 24px; align-items: stretch; }
.gm .way-lead { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 12px; padding: 34px 0 0 34px; overflow: hidden; background: radial-gradient(80% 90% at 90% 100%, rgba(127, 207, 242, .14), transparent 60%), linear-gradient(180deg, var(--pod-2), var(--pod)); }
.gm .way-lead p { color: var(--ink-2); margin-top: 12px; font-size: 18px; max-width: 40ch; }
.gm .way-lead ul { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 8px; color: var(--ink-2); }
.gm .way-lead li { display: flex; gap: 10px; align-items: center; } .gm .way-lead li .ico { color: var(--mint); width: 16px; height: 16px; }
.gm .way-lead .acts { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; margin: 26px 0 34px; }
.gm .wl-bot { align-self: end; width: 240px; height: 240px; } .gm .wl-bot svg { width: 100%; height: 100%; display: block; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); }
.gm .way-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; align-content: stretch; }
.gm .way-list a { height: 100%; display: grid; grid-template-columns: 48px 1fr 18px; gap: 14px; align-items: center; padding: 18px 20px; border-radius: 26px; background: rgba(242, 244, 232, .035); color: var(--ivory); text-decoration: none; transition: background .2s; }
.gm .way-list a:hover { background: rgba(101, 230, 196, .07); }
.gm .way-list .ic { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: rgba(101, 230, 196, .1); color: var(--mint); }
.gm .way-list .ic.eth { background: rgba(242, 193, 78, .12); color: var(--amber); } .gm .way-list .ic.soonish { background: rgba(185, 162, 232, .12); color: var(--spore); }
.gm .way-list b { display: block; font-size: 18px; } .gm .way-list small { display: block; color: var(--ink-3); font-size: 14.5px; margin-top: 2px; }
@media (max-width: 960px) { .gm .ways { grid-template-columns: 1fr; } .gm .way-lead { grid-template-columns: 1fr; padding: 26px 22px 0; } .gm .wl-bot { justify-self: center; width: 200px; height: 200px; } .gm .way-lead .acts { margin-bottom: 8px; } }
/* More page top: one featured "Start here", then the main pages as an index */
.gm.v-more .mo-start { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 28px; margin-top: 40px; align-items: stretch; }
.gm.v-more .mo-hero { display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: 8px; padding: 30px 0 0 30px; overflow: hidden; background: radial-gradient(80% 90% at 90% 100%, rgba(101, 230, 196, .16), transparent 60%), linear-gradient(180deg, var(--pod-2), var(--pod)); }
.gm.v-more .mo-hero p { color: var(--ink-2); margin-top: 10px; font-size: 17px; max-width: 42ch; }
.gm.v-more .mo-hero .acts { display: flex; gap: 10px; flex-wrap: wrap; margin: 22px 0 30px; }
.gm.v-more .mo-bot { align-self: end; width: 200px; height: 200px; } .gm.v-more .mo-bot svg { width: 100%; height: 100%; display: block; }
.gm.v-more .mo-index ul { list-style: none; margin: 10px 0 0; padding: 0; }
.gm.v-more .mo-index li { padding: 11px 0; border-top: 1px solid var(--line); } .gm.v-more .mo-index li:first-child { border-top: 0; }
.gm.v-more .mo-index a { color: inherit; text-decoration: none; display: block; } .gm.v-more .mo-index a:hover b { color: var(--mint); }
@media (max-width: 860px) { .gm.v-more .mo-start { grid-template-columns: 1fr; } .gm.v-more .mo-hero { grid-template-columns: 1fr; padding: 24px 22px 0; } .gm.v-more .mo-bot { justify-self: center; width: 160px; height: 160px; } .gm.v-more .mo-hero .acts { margin-bottom: 8px; } }
/* hero background: the owner's mycelium field (brand/field/*, scripts/prep_field.py). Threads come in from the right and the
   bottom; the open dark left keeps the headline at full contrast. A very slow drift (transform only), off under reduced motion. */
.gm .hx-img { position: absolute; z-index: -2; inset: -2% -2% -2% -2%; background: #050607 no-repeat right bottom / cover;
  background-image: image-set(url(brand/field/hero-960.webp) 1x, url(brand/field/hero-1672.webp) 2x); will-change: transform; animation: hxDrift 48s ease-in-out infinite alternate; }
@media (min-width: 1100px) { .gm .hx-img { background-image: url(brand/field/hero-1672.webp); } }
@media (max-width: 760px) { .gm .hx-img { background-image: url(brand/field/hero-m.webp); background-position: right 62%; background-size: auto 78%; opacity: .9; } }
@keyframes hxDrift { from { transform: translate3d(0, 0, 0) scale(1.02); } to { transform: translate3d(-1.2%, -.8%, 0) scale(1.05); } }
@media (prefers-reduced-motion: reduce) { .gm .hx-img { animation: none; } }
.gm .hx-veil { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg, rgba(5, 6, 7, .9) 0%, rgba(5, 6, 7, .6) 34%, rgba(5, 6, 7, 0) 58%), linear-gradient(0deg, rgba(5, 6, 7, .7), transparent 22%); }
@media (max-width: 960px) { .gm .hx-veil { background: linear-gradient(180deg, rgba(5, 6, 7, .82) 0%, rgba(5, 6, 7, .55) 52%, rgba(5, 6, 7, .1) 70%, rgba(5, 6, 7, .6) 100%); } }
.gm .hx-sky { z-index: -3; }
.gm .hx .horizon { opacity: .75; }
.view .vt3-cards .cards { -webkit-mask-image: none; mask-image: none; }
.view .vt3-cards .card .c-n { font-size: clamp(28px, 2.6vw, 38px); }
.view .vt3-cards .card .c-n small { font-size: .45em; }
.view .vt3-cards .card .c-v { margin: 10px 0 6px; }
.fee-streams { display: grid; gap: 10px; margin-bottom: 16px; } .fee-streams > div { padding: 14px 16px; border-radius: 18px; background: rgba(242, 244, 232, .05); } .fee-streams p { margin: 4px 0 0; color: var(--ink-2); font-size: 14.5px; }
.act-row.t-funds .act-ic { background: rgba(127, 207, 242, .12); color: var(--r-assistant); } .act-row.t-funds .act-type { color: var(--r-assistant); }
.hz-closed { margin: 0 0 16px; padding: 14px 18px; border-radius: 20px; background: rgba(242, 193, 78, .1); color: var(--ink-2); font-size: 15px; } .hz-closed b { color: var(--amber); }
.lim-note { margin: 10px 0 0; padding: 10px 12px; border-radius: 14px; font-size: 14px; line-height: 1.45; }
.lim-note.bad { background: rgba(255, 138, 122, .12); color: var(--red); } .lim-note.wait { background: rgba(242, 193, 78, .1); color: #F6D894; } .lim-note.fit { background: rgba(185, 162, 232, .12); color: var(--ink-2); }
/* phone: My agents is a compact horizontal switcher, the open agent's details follow right away */
.gm.me-page .mc-av { display: none; }
@media (max-width: 640px) {
  .gm.me-page .mine3 { display: flex; overflow-x: auto; gap: 10px; scroll-snap-type: x mandatory; scrollbar-width: none; margin-top: 20px; padding-bottom: 4px; }
  .gm.me-page .mine3::-webkit-scrollbar { display: none; }
  .gm.me-page .mcard { flex: 0 0 78%; scroll-snap-align: start; padding: 14px 16px; }
  .gm.me-page .mcard .face, .gm.me-page .mcard .meter, .gm.me-page .mcard > .small { display: none; }
  .gm.me-page .mc-av { display: block; flex: none; }
  .gm.me-page .mcard .top { align-items: center; gap: 10px; } .gm.me-page .mcard .top > div { flex: 1; min-width: 0; }
  .gm.me-page .mcard h2.mc-n { font-size: 19px; } .gm.me-page .mcard .vals { margin: 10px 0 4px; gap: 16px; } .gm.me-page .mcard .vals b { font-size: 19px; }
  .gm.me-page .mc-open { left: auto; right: 14px; top: -10px; }
}
@media (max-width: 640px) { .gm.me-page .mcard .sw { padding: 0 4px; } .gm.me-page .mcard .sw span { display: none; } .gm.me-page .mcard .pill { padding: 0 9px; font-size: 12.5px; }
  .gm.me-page .mcard h2.mc-n, .gm.me-page .mcard .role { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } }
.view .vt3-h1 { margin: 0; font: 500 1.6rem/1 var(--sans); letter-spacing: -.02em; }
.view .vi-h1 { margin: 6px 0 0; font: 500 clamp(2rem, 4vw, 3rem)/1.05 var(--sans); letter-spacing: -.03em; }
/* chat: bot bubbles are ivory, so everything inside them (confirm and receipt cards, labels, amounts) uses the light-surface tokens */
.gm.me-page .me-sh .m.bot { --ivory: #0B1210; --mist: #0B1210; --mist-2: #39443F; --mist-3: #56615B; --ink-2: #39443F; --ink-3: #56615B; --accent: #127A66; --mint: #127A66; --bio: #127A66; --up: #2F7A12; --down: #B23A2A; --ember: #7A5600; --line: rgba(11, 18, 16, .12); --line-2: rgba(11, 18, 16, .18); color: #0B1210; }
.gm.me-page .me-sh .m.bot .btn-ghost, .gm.me-page .me-sh .m.bot .btn:not(.btn-glow):not(.btn-primary) { background: #E3E8DD; color: #0B1210; box-shadow: none; }
.gm.me-page .me-sh .m.bot .btn-glow, .gm.me-page .me-sh .m.bot .btn-primary { background: #127A66; color: #fff; }
.gm.me-page .me-sh .m.bot a { color: #127A66; }
.gm.me-page .me-sh .m.sys { color: var(--ink-2); background: rgba(242, 244, 232, .06); border: 0; }
.gm.me-page .me-sh .m.sys.ok { color: var(--mint); background: rgba(101, 230, 196, .1); }
/* Agents › Map as a page state: a framed panel with legend + zoom, the agent list beside it (below on phones) */
.gm .map-bar { display: none; }
body.map-on #viewHost { min-height: 0; }
.gm .map-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; margin-top: 28px; align-items: start; }
.gm .map-frame { position: relative; overflow: hidden; padding: 0; height: 70vh; min-height: 420px; display: grid; grid-template-rows: auto 1fr auto; }
.gm .map-tools { position: relative; z-index: 3; display: flex; justify-content: space-between; align-items: center; gap: 10px 16px; flex-wrap: wrap; padding: 14px 16px 10px; background: linear-gradient(180deg, rgba(17, 22, 25, .95), rgba(17, 22, 25, 0)); }
.gm .map-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; color: var(--ink-2); }
.gm .map-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }
.gm .map-zoom { display: flex; gap: 6px; } .gm .map-zoom .btn { min-width: 38px; padding: 0 12px; }
.gm .map-3d, .gm .map-2d { position: absolute; inset: 0; z-index: 1; }
.gm .map-2d { display: none; } .gm .map-frame.is-2d .map-2d { display: grid; place-items: center; padding: 56px 16px 40px; } .gm .map-frame.is-2d .map-3d { display: none; }
.gm .map-2d svg { width: 100%; height: 100%; } .gm .map-2d a circle:hover { r: 9; }
.gm .map-3d .world { position: absolute; inset: 0; z-index: auto; background: transparent; }
.gm .map-note { position: relative; z-index: 3; align-self: end; margin: 0; padding: 10px 16px 14px; background: linear-gradient(0deg, rgba(17, 22, 25, .95), rgba(17, 22, 25, 0)); }
.gm .map-side { max-height: 70vh; display: flex; flex-direction: column; }
.gm .map-list { list-style: none; margin: 0; padding: 0 10px 12px; overflow-y: auto; }
.gm .map-list a { display: grid; grid-template-columns: 32px 1fr; gap: 10px; align-items: center; padding: 7px 8px; border-radius: 14px; color: var(--ivory); text-decoration: none; }
.gm .map-list a:hover { background: rgba(101, 230, 196, .07); } .gm .map-list b { display: block; font-size: 14.5px; } .gm .map-list small { display: block; color: var(--ink-3); font-size: 12.5px; }
@media (max-width: 960px) { .gm .map-wrap { grid-template-columns: 1fr; } .gm .map-frame { height: 60vh; min-height: 340px; } .gm .map-side { max-height: 46vh; } }
.gm .map-frame.is-2d .map-zoom { display: none; }
/* ===================== HOME MOTION (owner 2026-10-16: "the home page is a dead page"): views/home-motion.js =====================
   transform / opacity only, no blur or backdrop-filter, everything paused offscreen (.hx.is-off) and static under reduced motion */
.gm .hx-th, .gm .hx-pl { position: absolute; z-index: -1; display: block; pointer-events: none; transition: translate .9s cubic-bezier(.2, .7, .2, 1); }
.gm .hx-img { transition: translate .9s cubic-bezier(.2, .7, .2, 1); }
.gm .hx-net { position: absolute; inset: 0; z-index: 3; pointer-events: none; transition: translate .9s cubic-bezier(.2, .7, .2, 1); }
.gm .hn { position: absolute; display: flex; align-items: center; width: 0; height: 0; }
.gm .hn-dot { position: absolute; left: -6px; top: -6px; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle, #FBFFF6 0 22%, var(--tint) 46%, transparent 74%); }
.gm .hn-dot::before { content: ""; position: absolute; inset: -11px; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--tint) 38%, transparent), transparent); animation: hnBreath 3.8s ease-in-out infinite; animation-delay: var(--d, 0s); }
.gm .hn-dot::after { content: ""; position: absolute; inset: -3px; border-radius: 50%; box-shadow: 0 0 0 1.5px var(--tint); opacity: 0; }
.gm .hn.f1 .hn-dot::after { animation: hnRingA 1.2s cubic-bezier(.2, .7, .2, 1); } .gm .hn.f2 .hn-dot::after { animation: hnRingB 1.2s cubic-bezier(.2, .7, .2, 1); }
.gm .hn.f1 .hn-dot, .gm .hn.f2 .hn-dot { animation: hnPop .6s ease-out; }
@keyframes hnBreath { 0%, 100% { opacity: .5; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.12); } }
@keyframes hnRingA { from { opacity: .95; transform: scale(.7); } to { opacity: 0; transform: scale(4); } }
@keyframes hnRingB { from { opacity: .95; transform: scale(.7); } to { opacity: 0; transform: scale(4); } }
@keyframes hnPop { 30% { transform: scale(1.7); } }
.gm .hn-tag { position: absolute; left: 12px; top: -11px; padding: 3px 9px; border-radius: 999px; background: rgba(9, 12, 14, .74); box-shadow: inset 0 0 0 1px rgba(242, 244, 232, .09); font-size: 12px; line-height: 16px; font-weight: 500; color: var(--ink-2); white-space: nowrap; }
.gm .hn.tag-l .hn-tag { left: auto; right: 12px; }
.gm .hn-tag:empty { display: none; }
.gm .hx-say { position: absolute; left: 0; top: 0; width: max-content; max-width: 228px; padding: 10px 14px; font-size: 13.5px; opacity: 0; transform: scale(.82); transition: opacity .35s ease, transform .5s cubic-bezier(.2, 1.3, .3, 1); }
.gm .hx-say.on { opacity: 1; transform: none; }
.gm .hx-say.p-ur { border-radius: 18px 18px 18px 5px; transform-origin: 0 100%; } .gm .hx-say.p-ul { border-radius: 18px 18px 5px 18px; transform-origin: 100% 100%; }
.gm .hx-say.p-dr { border-radius: 5px 18px 18px 18px; transform-origin: 0 0; } .gm .hx-say.p-dl { border-radius: 18px 5px 18px 18px; transform-origin: 100% 0; }
.gm .hx-say .who { font-size: 12px; } .gm .hx-say em { font-style: normal; margin-left: 6px; padding: 0 6px; border-radius: 999px; background: rgba(11, 18, 16, .08); font-size: 10.5px; color: #55645E; }
@media (max-width: 960px) { .gm .hx-say { max-width: 210px; font-size: 13px; padding: 9px 12px; } }
/* the robot: the supplied render, untouched. It floats; its halo breathes; the chest star and shoulder rings glow through overlays */
.gm .hx-bot { animation: botFloat 7s ease-in-out infinite; will-change: transform; }
@keyframes botFloat { 0%, 100% { transform: translate3d(0, 0, 0); } 50% { transform: translate3d(0, -8px, 0); } }
.gm .hx-bot::before { animation: botHalo 6s ease-in-out infinite; }
@keyframes botHalo { 0%, 100% { opacity: .6; } 50% { opacity: 1; } }
.gm .hb-glow { position: absolute; pointer-events: none; border-radius: 50%; background: radial-gradient(closest-side, rgba(150, 245, 218, .75), rgba(101, 230, 196, .22) 48%, transparent); opacity: 0; }
.gm .hb-star { left: calc(65.6% - 7%); top: calc(72.6% - 6.8%); width: 14%; height: 13.6%; animation: starBeat 4.6s ease-in-out infinite; }
.gm .hb-star.g1 { animation: starFlashA 1.4s ease-out, starBeat 4.6s ease-in-out 1.4s infinite; } .gm .hb-star.g2 { animation: starFlashB 1.4s ease-out, starBeat 4.6s ease-in-out 1.4s infinite; }
.gm .hb-sh { width: 11%; height: 10.7%; animation: ringBeat 5.2s ease-in-out infinite; }
.gm .hb-l { left: calc(27.7% - 5.5%); top: calc(69% - 5.35%); } .gm .hb-r { left: calc(87.4% - 5.5%); top: calc(70.6% - 5.35%); animation-delay: -2.6s; }
@keyframes starBeat { 0%, 100% { opacity: .12; transform: scale(.85); } 50% { opacity: .42; transform: scale(1); } }
@keyframes starFlashA { 0% { opacity: .2; transform: scale(.8); } 25% { opacity: 1; transform: scale(1.5); } 100% { opacity: .12; transform: scale(.85); } }
@keyframes starFlashB { 0% { opacity: .2; transform: scale(.8); } 25% { opacity: 1; transform: scale(1.5); } 100% { opacity: .12; transform: scale(.85); } }
@keyframes ringBeat { 0%, 100% { opacity: 0; } 50% { opacity: .38; } }
.gm .hx.is-off, .gm .hx.is-off * { animation-play-state: paused !important; }
/* below the hero: sections rise in as they enter view; lists stagger; the fee bar grows in; new activity rows slide in */
.gm.home .rv:not(.in) { opacity: 0; }
.gm.home .rv.in { animation: rvIn .8s cubic-bezier(.2, .7, .2, 1) backwards; animation-delay: calc(var(--i, 0) * 80ms); }
@keyframes rvIn { from { opacity: 0; transform: translate3d(0, 24px, 0); } }
.gm.home .feebar.in > span { animation: feeIn 1s cubic-bezier(.2, .7, .2, 1) backwards; animation-delay: calc(200ms + var(--i, 0) * 110ms); transform-origin: 0 50%; }
@keyframes feeIn { from { transform: scaleX(0); opacity: 0; } }
.gm.home .act-row.fresh { animation: actIn 1.6s var(--ease), rowIn .55s cubic-bezier(.2, .7, .2, 1); }
@keyframes rowIn { from { opacity: 0; transform: translate3d(0, -10px, 0); } }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .gm.home a.pod, .gm.home .way-list a, .gm.home .lrow, .gm.home .hl-feat .feat { transition: transform .3s cubic-bezier(.2, .7, .2, 1); }
  .gm.home a.pod:hover, .gm.home .way-list a:hover, .gm.home .lrow:hover, .gm.home .hl-feat .feat:hover { transform: translate3d(0, -3px, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .gm .hx-bot, .gm .hx-bot::before, .gm .hb-glow, .gm .hn-dot, .gm .hn-dot::before, .gm .hn-dot::after, .gm.home .rv.in, .gm.home .feebar.in > span, .gm.home .act-row.fresh { animation: none !important; }
  .gm .hb-glow { opacity: 0; } .gm .hx-say { transition: none; } .gm.home .rv { opacity: 1 !important; }
}
@media print { .gm.home .rv { opacity: 1 !important; animation: none !important; } }
.gm .hn.act .hn-tag { color: var(--ivory); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tint) 55%, transparent); }