/* ============================================================
   The Velocity Edge · shared menu (note pages)
   The same menu as /velocityedge, scoped so it sits on top of
   styles.css without touching the rest of the page.
   Markup: scripts/publish-note.mjs (VE_NAV) · behaviour: /ve-nav.js
   ============================================================ */
.snav, .mmenu, .vcards, .vcards-all {
  --ve-ease: cubic-bezier(.16, 1, .3, 1);
  --ve-ease-out: cubic-bezier(.23, 1, .32, 1);
  --ve-green: #2ee06a; --ve-deep: #070a24; --ve-indigo: #7c8bff; --ve-peri: #aeb8ff; --ve-sun: #f5b82e;
  --ve-display: "Space Grotesk", -apple-system, BlinkMacSystemFont, sans-serif;
  --ve-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
  --ve-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}
.snav { position: fixed; top: calc(22px + env(safe-area-inset-top, 0px)); left: 0; right: 0; z-index: 90; color: #fff; transition: top .45s var(--ve-ease); }
.snav.nav--hidden, .snav.snav--hidden { top: -120px; }
.snav a { color: inherit; text-decoration: none; }
.snav__wrap { max-width: 1280px; margin: 0 auto; padding-inline: 24px; }
.snav__inner { display: flex; align-items: center; justify-content: space-between; gap: 18px; height: 58px; padding: 0 12px 0 26px; border-radius: 100px;
  background: rgba(7, 10, 36, .82); border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%);
  box-shadow: 0 20px 50px -26px rgba(0, 0, 0, .75), inset 0 1px 0 rgba(255, 255, 255, .06); }
.sbrand { display: inline-flex; align-items: center; gap: 12px; color: #fff; }
.sbrand__mark { color: var(--ve-green); display: inline-flex; }
.sbrand__text { display: inline-flex; flex-direction: column; line-height: 1; }
.sbrand__text b { font-family: var(--ve-display); font-weight: 600; font-size: 1.6rem; letter-spacing: -1px; color: #fff; }
.sbrand__text i { font-style: normal; font-family: var(--ve-body); font-size: .7rem; font-weight: 600; letter-spacing: 2.6px; text-transform: uppercase; color: var(--ve-green); margin-top: 3px; }
.snav__links { display: flex; align-items: center; gap: 4px; }
.snav__links a:not(.snav__cta) { color: rgba(255, 255, 255, .8); font-family: var(--ve-body); font-size: .94rem; font-weight: 500; padding: 9px 16px; border-radius: 100px; transition: background .3s var(--ve-ease), color .3s var(--ve-ease); }
.snav__links a:not(.snav__cta):hover { color: #fff; background: rgba(255, 255, 255, .09); }
.snav__links a.is-current { color: #fff; background: rgba(46, 224, 106, .16); }
.snav__cta { display: inline-flex; align-items: center; gap: 8px; background: var(--ve-green); color: var(--ve-deep) !important; font-family: var(--ve-body); font-weight: 600; font-size: .94rem;
  padding: 11px 22px; border-radius: 100px; margin-left: 6px; box-shadow: 0 10px 26px -10px rgba(46, 224, 106, .75);
  transition: background .3s var(--ve-ease), transform 160ms var(--ve-ease-out), box-shadow .3s var(--ve-ease); }
.snav__cta span { display: inline-block; transition: transform .3s var(--ve-ease); }
.snav__cta:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) {
  .snav__cta:hover { background: #fff; box-shadow: 0 16px 32px -12px rgba(46, 224, 106, .6); }
  .snav__cta:hover span { transform: translateX(4px); }
}
.snav__has-sub { position: relative; display: inline-flex; align-items: center; }
.snav__sub-toggle { display: inline-flex !important; align-items: center; gap: 7px; }
.snav__caret { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .3s var(--ve-ease); opacity: .85; }
.snav__has-sub:hover .snav__caret, .snav__has-sub:focus-within .snav__caret { transform: rotate(225deg) translate(-1px, -1px); }
.snav__submenu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(6px); min-width: 250px; margin-top: 12px; background: rgba(7, 10, 36, .94);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border: 1px solid rgba(255, 255, 255, .12); border-radius: 16px; padding: 8px; display: flex; flex-direction: column; gap: 2px;
  opacity: 0; visibility: hidden; transition: opacity .28s var(--ve-ease), transform .28s var(--ve-ease), visibility .28s; box-shadow: 0 26px 54px -22px rgba(0, 0, 0, .75); z-index: 20; }
.snav__submenu::before { content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px; }
.snav__has-sub:hover .snav__submenu, .snav__has-sub:focus-within .snav__submenu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.snav__submenu a { display: flex; align-items: center; gap: 10px; padding: 11px 14px !important; border-radius: 10px; color: rgba(255, 255, 255, .82) !important; font-size: .9rem !important; font-weight: 500; white-space: nowrap; background: none !important; }
.snav__submenu a:hover { background: rgba(255, 255, 255, .09) !important; color: #fff !important; }
.snav__submenu-all { color: var(--ve-green) !important; border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 4px; padding-top: 12px !important; }
.snav__ext span { opacity: .6; font-size: .85em; }
.snav a:focus-visible, .snav button:focus-visible, .mmenu a:focus-visible, .mmenu button:focus-visible { outline: 2px solid var(--ve-green); outline-offset: 3px; }
.snav__toggle { display: none; flex-direction: column; gap: 6px; background: none; border: 0; cursor: pointer; padding: 8px; }
.snav__toggle span { width: 24px; height: 2px; background: #fff; transition: .35s var(--ve-ease); }
.snav__toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.snav__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.snav__toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
/* language switch (built by /i18n.js inside #navLinks; a copy lives in the mobile menu) */
.snav .lang-switch { margin-left: 8px; border-color: rgba(255, 255, 255, .2); }
.snav .lang-switch__btn { font-family: var(--ve-display); }
@media (max-width: 1180px) { .snav__links a:not(.snav__cta) { padding: 9px 12px; } .snav__ext { display: none !important; } }
@media (max-width: 1100px) { .snav__links a:not(.snav__cta) { padding: 9px 10px; font-size: .9rem; } .snav__cta { padding: 10px 18px; } .snav .lang-switch { margin-left: 4px; } }
@media (max-width: 940px) { .snav__links { display: none; } .snav__toggle { display: flex; } .snav__inner { padding: 0 10px 0 20px; } }
@media (max-width: 420px) { .snav__wrap { padding-inline: 12px; } .snav { top: calc(12px + env(safe-area-inset-top, 0px)); } }

/* edition marks */
.sdot { width: 8px; height: 8px; border-radius: 50%; flex: none; display: inline-block; }
.sdot--morning { background: var(--ve-green); }
.sdot--midday { background: var(--ve-sun); }
.sdot--closing { background: transparent; box-shadow: inset -3px 0 0 0 var(--ve-peri), 0 0 0 1px rgba(174, 184, 255, .35); }
.sdot--week { background: linear-gradient(135deg, var(--ve-green), var(--ve-indigo)); }
.sdot--focus { background: transparent; border: 2px solid var(--ve-green); }
.sdot--gvi { width: 7px; height: 7px; border-radius: 1px; transform: rotate(45deg); background: #7fd6ff; }

/* ---------- mobile menu: accordion, every group closed ---------- */
.mmenu { position: fixed; inset: 0; z-index: 89; background: #04070e; color: #e9eef8; display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain;
  padding-top: calc(88px + env(safe-area-inset-top, 0px)); animation: veMmIn .35s cubic-bezier(.2, .8, .2, 1); font-family: var(--ve-body); }
.mmenu[hidden] { display: none !important; }
.mmenu a { color: inherit; text-decoration: none; }
@keyframes veMmIn { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }
@keyframes veMmLink { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.mmenu__in { display: flex; flex-direction: column; flex: 1; width: 100%; max-width: 1180px; margin: 0 auto; padding: 6px 24px 0; }
.mmenu__in > a, .mm-row > a { font-family: var(--ve-display); font-weight: 600; font-size: clamp(2rem, 9vw, 3rem); letter-spacing: -.035em; line-height: 1.1; padding: 14px 0; color: #e9eef8; }
.mmenu__in > a { border-bottom: 1px solid rgba(120, 160, 225, .12); display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  animation: veMmLink .5s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(80ms + var(--i) * 60ms); }
.mmenu__in a small { font-family: var(--ve-mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: #8ea2c4; font-weight: 400; }
.mmenu__in > a:active, .mm-row > a:active { color: #6fbcff; }
.mm-g { border-bottom: 1px solid rgba(120, 160, 225, .12); animation: veMmLink .5s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(80ms + var(--i) * 60ms); }
.mm-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.mm-row > a { flex: 1; min-width: 0; }
.mm-tog { flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(120, 160, 225, .26); background: none; color: #e9eef8; cursor: pointer;
  transition: background .3s var(--ve-ease), border-color .3s var(--ve-ease), color .3s var(--ve-ease), transform 160ms var(--ve-ease-out); -webkit-user-select: none; user-select: none; }
.mm-tog:active { transform: scale(.97); }
.mm-tog svg { transition: transform .4s var(--ve-ease); }
.mm-g.is-open .mm-tog { background: var(--ve-green); border-color: var(--ve-green); color: var(--ve-deep); }
.mm-g.is-open .mm-tog svg { transform: rotate(180deg); }
.mm-sub { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--ve-ease); }
.mm-g.is-open .mm-sub { grid-template-rows: 1fr; }
.mm-sub__in { min-height: 0; overflow: hidden; visibility: hidden; transition: visibility 0s linear .4s; }
.mm-g.is-open .mm-sub__in { visibility: visible; transition-delay: 0s; }
.mmenu__books { display: flex; flex-direction: column; padding: 4px 0 10px 14px; border-left: 2px solid var(--ve-green); margin: 2px 0 16px; }
.mmenu__books a { display: flex; align-items: center; gap: 10px; font-size: .95rem; color: #8ea2c4; padding: 7px 0; }
.mmenu__books a:active { color: #fff; }
.mmenu__in > a.mmenu__cta { justify-content: center; align-items: center; gap: 10px; margin-top: 18px; border: 0; border-radius: 100px; padding: 15px 22px; font-family: var(--ve-body);
  font-size: 1rem; letter-spacing: 0; font-weight: 600; background: var(--ve-green); color: var(--ve-deep); box-shadow: 0 10px 26px -10px rgba(46, 224, 106, .75); }
.mmenu__lang { display: flex; gap: 8px; margin-top: 22px; }
.mmenu__lang button { font-family: var(--ve-mono); font-size: .8rem; color: #8ea2c4; background: none; border: 1px solid rgba(120, 160, 225, .26); border-radius: 999px; padding: 9px 16px; cursor: pointer; }
.mmenu__lang button[aria-pressed="true"] { color: var(--ve-deep); background: var(--ve-green); border-color: var(--ve-green); font-weight: 600; }
.mmenu__foot { margin-top: auto; padding: 26px 0 calc(26px + env(safe-area-inset-bottom, 0px)); font-family: var(--ve-mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: #8ea2c4; }
body.menu-open { overflow: hidden; }
@media (min-width: 941px) { .mmenu { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .mmenu, .mmenu__in > a, .mm-g { animation: none; } .mm-sub { transition: none; } }

/* language switch base (pages without /styles.css, e.g. the archive) */
.snav .lang-switch { display: inline-flex; gap: 2px; align-items: center; padding: 3px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 100px; }
.snav .lang-switch__btn { font-size: .72rem; font-weight: 600; letter-spacing: .6px; color: rgba(255, 255, 255, .6); background: none; border: 0; padding: 5px 10px; border-radius: 100px; cursor: pointer; line-height: 1; transition: color .25s var(--ve-ease), background .25s var(--ve-ease); }
.snav .lang-switch__btn:hover { color: #fff; }
.snav .lang-switch__btn.is-active { color: var(--ve-deep); background: var(--ve-green); }

/* ============================================================
   Note pages · the edition shows on the note itself
   <main class="art" data-edition="morning|midday|closing|week|focus">
   Morning Brief green · Midday Pulse yellow · The Close violet moon
   · Week Ahead green-indigo · In Focus green ring (mint, the special one)
   · GVI glacier sky blue with a diamond (Francesco's indices)
   ============================================================ */
.art[data-edition] { --ed: #2ee06a; --ed-2: #2ee06a; --ed-ink: #0f7a3c; --ed-soft: rgba(46, 224, 106, .1); --ed-line: rgba(46, 224, 106, .34); --ed-glow: rgba(46, 224, 106, .2); }
.art[data-edition="midday"] { --ed: #f5b82e; --ed-2: #f5b82e; --ed-ink: #8a5a00; --ed-soft: rgba(245, 184, 46, .13); --ed-line: rgba(245, 184, 46, .5); --ed-glow: rgba(245, 184, 46, .3); }
.art[data-edition="closing"] { --ed: #aeb8ff; --ed-2: #7c8bff; --ed-ink: #4a52c8; --ed-soft: rgba(124, 139, 255, .12); --ed-line: rgba(124, 139, 255, .42); --ed-glow: rgba(124, 139, 255, .22); }
.art[data-edition="week"] { --ed: #2ee06a; --ed-2: #7c8bff; --ed-ink: #3a48c9; --ed-soft: rgba(124, 139, 255, .1); --ed-line: rgba(124, 139, 255, .38); --ed-glow: rgba(124, 139, 255, .18); }
.art[data-edition="focus"] { --ed: #2ee06a; --ed-2: #2ee06a; --ed-ink: #0a6b36; --ed-soft: rgba(22, 196, 90, .12); --ed-line: rgba(22, 196, 90, .45); --ed-glow: rgba(46, 224, 106, .22); }
.art[data-edition="gvi"] { --ed: #7fd6ff; --ed-2: #4fb8ea; --ed-ink: #0b5f86; --ed-soft: rgba(127, 214, 255, .14); --ed-line: rgba(79, 184, 234, .5); --ed-glow: rgba(127, 214, 255, .28); }
/* dark pages: the light tint reads best */
.art--night[data-edition="gvi"] { --ed-ink: #9fdcff; }
.art--night[data-edition] { --ed-ink: #5ff09a; }
.art--night[data-edition="midday"] { --ed-ink: #f5c451; }
.art--night[data-edition="closing"] { --ed-ink: #c3caff; }
.art--night[data-edition="week"] { --ed-ink: #aeb8ff; }

/* the edition band along the top of the note */
.art[data-edition] .art-hero::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; z-index: 1; background: linear-gradient(90deg, var(--ed), var(--ed-2)); }
.art[data-edition] .art-hero__glow { background: radial-gradient(42% 55% at 82% 14%, var(--ed-glow), transparent 62%); }
.art[data-edition] .art-kicker { color: var(--ed-ink); background: var(--ed-soft); border-color: var(--ed-line); font-weight: 600; }
.art[data-edition="week"] .art-kicker { border-color: transparent; background: linear-gradient(rgba(124, 139, 255, .08), rgba(124, 139, 255, .08)) padding-box, linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #2ee06a, #7c8bff) border-box; }
.art--night[data-edition="week"] .art-kicker { background: linear-gradient(rgba(124, 139, 255, .14), rgba(124, 139, 255, .14)) padding-box, linear-gradient(#070a24, #070a24) padding-box, linear-gradient(90deg, #2ee06a, #7c8bff) border-box; }
/* the reading-progress bar takes the edition colour too */
body:has(.art[data-edition="midday"]) .scroll-progress { background: #f5b82e; box-shadow: 0 0 12px #f5b82e; }
body:has(.art[data-edition="closing"]) .scroll-progress { background: #aeb8ff; box-shadow: 0 0 12px #7c8bff; }
body:has(.art[data-edition="gvi"]) .scroll-progress { background: #7fd6ff; box-shadow: 0 0 12px #7fd6ff; }
body:has(.art[data-edition="week"]) .scroll-progress { background: linear-gradient(90deg, #2ee06a, #7c8bff); box-shadow: 0 0 12px rgba(124, 139, 255, .8); }
.art[data-edition] .art-section-head__num, .art[data-edition] .art-pull__label { color: var(--ed-ink); }
.art[data-edition] .art-meta__tag { border-color: var(--ed-line); }

/* the edition symbol inside the label */
.art-kicker__pulse--morning { background: #2ee06a; }
.art-kicker__pulse--midday { background: #f5b82e; box-shadow: 0 0 0 0 rgba(245, 184, 46, .6); animation-name: veSunPulse; }
.art-kicker__pulse--closing { width: 12px; height: 12px; background: transparent; box-shadow: inset -4px 0 0 0 #7c8bff, 0 0 0 1px rgba(124, 139, 255, .45); animation: none; }
.art--night .art-kicker__pulse--closing { box-shadow: inset -4px 0 0 0 #aeb8ff, 0 0 0 1px rgba(174, 184, 255, .45); }
.art-kicker__pulse--week { background: linear-gradient(135deg, #2ee06a, #7c8bff); animation: none; box-shadow: 0 0 0 3px rgba(124, 139, 255, .16); }
.art-kicker__pulse--focus { width: 11px; height: 11px; background: transparent; border: 2px solid #16c45a; animation: none; box-shadow: 0 0 9px rgba(46, 224, 106, .55); }
.art-kicker__pulse--gvi { width: 9px; height: 9px; border-radius: 1px; transform: rotate(45deg); background: #7fd6ff; animation: none; box-shadow: 0 0 8px rgba(127, 214, 255, .7); }
@keyframes veSunPulse { 0% { box-shadow: 0 0 0 0 rgba(245, 184, 46, .6); } 100% { box-shadow: 0 0 0 10px rgba(245, 184, 46, 0); } }

/* In Focus is the special edition: a mint hero, like its card */
.art--day[data-edition="focus"] .art-hero { background: radial-gradient(120% 90% at 50% -10%, #dcf6e5 0%, #f2fdf6 45%, #ffffff 75%); }
.art--night[data-edition="focus"] .art-hero { background: radial-gradient(120% 90% at 50% -10%, #12402a 0%, #070a24 62%); }
/* GVI: a glacier sky */
.art--day[data-edition="gvi"] .art-hero { background: radial-gradient(120% 90% at 50% -10%, #d9f0fb 0%, #f1faff 45%, #ffffff 75%); }
.art--night[data-edition="gvi"] .art-hero { background: radial-gradient(120% 90% at 50% -10%, #12405a 0%, #070a24 62%); }
/* The Close: a night sky */
.art--night[data-edition="closing"] .art-hero { background: radial-gradient(120% 90% at 50% -10%, #1d2466 0%, #070a24 62%); }

@media (prefers-reduced-motion: reduce) { .art-kicker__pulse--midday { animation: none; } }

/* ============================================================
   "More from The Velocity Edge" — the same edition cards as
   /velocityedge/ and the archive (rendered by /ve-nav.js)
   ============================================================ */
.vcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 40px; }
@media (max-width: 960px) { .vcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .vcards > :last-child:nth-child(odd) { grid-column: 1 / -1; } }
@media (max-width: 600px) { .vcards { grid-template-columns: 1fr; } }
.vcard { --nc: #aeb8ff; --nm: rgba(255, 255, 255, .74); --nd: rgba(255, 255, 255, .58);
  position: relative; display: flex; flex-direction: column; min-width: 0; border-radius: 18px; overflow: hidden; text-decoration: none; color: #fff;
  border: 1px solid rgba(124, 139, 255, .28); background: linear-gradient(160deg, #121a4d, #070a24); font-family: var(--ve-body);
  transition: border-color .3s var(--ve-ease), box-shadow .4s var(--ve-ease), transform 160ms var(--ve-ease-out); }
.vcard:active { transform: scale(.985); }
.vcard:focus-visible { outline: 2px solid #2ee06a; outline-offset: 3px; }
.vcard--focus { --nc: #0a6b36; --nm: #3d5a49; --nd: #53705f; color: #0b1f13; border-color: rgba(22, 196, 90, .42); background: linear-gradient(160deg, #f2fdf6, #d8f4e2); }
.art--night .vcard--focus { --nc: #5ff09a; --nm: rgba(233, 238, 248, .74); --nd: rgba(233, 238, 248, .6); color: #e9eef8; border-color: rgba(46, 224, 106, .4); background: linear-gradient(160deg, rgba(46, 224, 106, .16), rgba(46, 224, 106, .03) 60%), #0a1122; }
.vcard--gvi { --nc: #0b5f86; --nm: #3d5a6b; --nd: #4f6e80; color: #06253a; border-color: rgba(11, 95, 134, .28); background: linear-gradient(160deg, #f1faff, #d9f0fb); }
.art--night .vcard--gvi { --nc: #9fdcff; --nm: rgba(233, 238, 248, .74); --nd: rgba(233, 238, 248, .6); color: #e9eef8; border-color: rgba(127, 214, 255, .4); background: linear-gradient(160deg, rgba(127, 214, 255, .16), rgba(127, 214, 255, .03) 60%), #0a1122; }
@media (hover: hover) and (pointer: fine) {
  .vcard--gvi:hover { border-color: rgba(127, 214, 255, .8); }
  .vcard:hover { border-color: rgba(174, 184, 255, .55); box-shadow: 0 24px 50px -34px rgba(7, 10, 36, .7); }
  .vcard--focus:hover { border-color: rgba(22, 196, 90, .7); }
  .vcard:hover .vcard__media img { transform: scale(1.04); }
}
.vcard__media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #0d1238; }
.vcard__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .9s var(--ve-ease); }
.vcard__media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(7, 10, 36, 0) 55%, rgba(7, 10, 36, .38)); }
.vcard__badge { position: absolute; left: 12px; top: 12px; z-index: 1; display: inline-flex; align-items: center; gap: 8px; font-family: var(--ve-mono); font-size: .72rem; letter-spacing: .05em;
  color: #fff; background: rgba(7, 10, 36, .82); border: 1px solid rgba(255, 255, 255, .14); border-radius: 999px; padding: 6px 12px 6px 10px; }
.vcard__ph { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.vcard__ph--morning { background: #2ee06a; box-shadow: 0 0 0 2px rgba(46, 224, 106, .3); }
.vcard__ph--midday { background: #f5b82e; box-shadow: 0 0 0 2px rgba(245, 184, 46, .32); }
.vcard__ph--closing { background: transparent; box-shadow: inset -3px 0 0 0 #aeb8ff; }
.vcard__ph--week { background: linear-gradient(135deg, #2ee06a, #7c8bff); }
.vcard__ph--gvi { width: 8px; height: 8px; border-radius: 1px; transform: rotate(45deg); background: #7fd6ff; box-shadow: 0 0 0 2px rgba(127, 214, 255, .3); }
.vcard__ph--focus { border: 2px solid #2ee06a; box-shadow: 0 0 8px rgba(46, 224, 106, .6); }
.vcard__body { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; flex: 1; min-width: 0; }
.vcard__cat { font-family: var(--ve-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--nc); }
.vcard h3 { margin: 0; font-family: var(--ve-display); font-weight: 600; font-size: 1.14rem; line-height: 1.22; letter-spacing: -.01em; color: inherit; }
.vcard p { margin: 0; font-size: .88rem; line-height: 1.6; color: var(--nm); font-weight: 300; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.vcard__foot { margin-top: auto; padding-top: 8px; display: flex; justify-content: space-between; gap: 10px; font-family: var(--ve-mono); font-size: .75rem; color: var(--nd); }
.vcard__go { color: var(--nc); white-space: nowrap; }
.vcards-all { display: flex; justify-content: center; margin-top: 28px; }
.vcards-all a { font-family: var(--ve-mono); font-size: .8rem; letter-spacing: .04em; text-decoration: none; color: inherit; opacity: .8; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.vcards-all a:hover { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .vcard, .vcard__media img { transition: none; } }

/* ============================================================
   v29 · Brand sky blue in the menu — logo, "Velocity Edge",
   Subscribe and the language switch (#309bff, from the brand file)
   ============================================================ */
:root { --ve-sky: #309bff; }
.snav .sbrand__mark, .mmenu .sbrand__mark { color: var(--ve-sky); }
.snav .sbrand__text i { color: var(--ve-sky); }
.snav__cta { background: var(--ve-sky); color: var(--ve-deep) !important; box-shadow: 0 10px 26px -10px rgba(48, 155, 255, .75); }
@media (hover: hover) and (pointer: fine) { .snav__cta:hover { background: #fff; box-shadow: 0 16px 32px -12px rgba(48, 155, 255, .6); } }
.mmenu__in > a.mmenu__cta { background: var(--ve-sky); color: var(--ve-deep); box-shadow: 0 10px 26px -10px rgba(48, 155, 255, .75); }
.snav .lang-switch__btn.is-active { color: var(--ve-deep); background: var(--ve-sky); }
.mmenu__lang button[aria-pressed="true"] { color: var(--ve-deep); background: var(--ve-sky); border-color: var(--ve-sky); }

/* ============================================================
   v30 · Note pages: brand sky blue replaces the green accents
   (highlights, numbers, labels, signals, logo marks, the cursor
   ring, the brief button). Stays green: the FdK author badge and
   the edition marks (Morning Brief / In Focus band, label, dot).
   ============================================================ */
body:has(main.art) { --green: #309bff; --green-deep: #1a6fd0; --green-dim: rgba(48, 155, 255, .16); }
body:has(main.art) .art-author__badge { background: linear-gradient(140deg, #2ee06a, #16c45a); }
body:has(.art[data-edition="morning"]) .scroll-progress, body:has(.art[data-edition="focus"]) .scroll-progress { background: #2ee06a; box-shadow: 0 0 12px #2ee06a; }
.art[data-edition] .art-section-head__num, .art[data-edition] .art-pull__label { color: var(--green); }
.art--day[data-edition] .art-section-head__num, .art--day[data-edition] .art-pull__label { color: var(--green-deep); }
body:has(main.art) .cursor-ring { border-color: rgba(48, 155, 255, .75); }
body:has(main.art) .cursor-ring.is-hover { background: rgba(48, 155, 255, .08); border-color: rgba(48, 155, 255, .85); }
body:has(main.art) .cursor-ring.is-down { background: rgba(48, 155, 255, .16); }
.art .signal:hover, .art .pattern:hover { border-color: rgba(48, 155, 255, .34); }
.art .signal.is-open { border-color: rgba(48, 155, 255, .45); background: linear-gradient(160deg, rgba(48, 155, 255, .07), rgba(255, 255, 255, .015)); }
.art--day .signal.is-open { border-color: rgba(26, 111, 208, .45); background: linear-gradient(160deg, rgba(48, 155, 255, .08), rgba(17, 20, 46, .015)); }
.art .pattern:hover { background: rgba(48, 155, 255, .05); }
.art .pattern:hover .pattern__ghost { color: rgba(48, 155, 255, .12); }
.art .takeaways__list li::before { background: rgba(48, 155, 255, .14); }
.art .art-matrix__item--accent { border-color: rgba(48, 155, 255, .45); background: rgba(48, 155, 255, .07); }
.art .art-next__inner { background: linear-gradient(120deg, rgba(48, 155, 255, .12), rgba(124, 139, 255, .12)); }
body:has(main.art) .btn--brief { background: #309bff; color: #070a24; box-shadow: 0 12px 32px -12px rgba(48, 155, 255, .55), inset 0 1px 0 rgba(255, 255, 255, .4); }
body:has(main.art) .btn--brief:hover { background: #5cb0ff; box-shadow: 0 18px 40px -12px rgba(48, 155, 255, .75), inset 0 1px 0 rgba(255, 255, 255, .5); }
.art .art-matrix__s { background: rgba(48, 155, 255, .1); border-color: rgba(48, 155, 255, .3); }
body:has(main.art--night) .hl-green, .art--night .hl-green { color: #309bff; }

/* "The signal" — the note in 5–6 points, one minute (scripts/publish-note.mjs, ::signal) */
.art-signal { margin: 8px 0 48px; padding: 28px clamp(22px, 3.4vw, 36px); border-radius: 22px; background: linear-gradient(150deg, #11173f, #0a0e2c); border: 1px solid rgba(48, 155, 255, .35); box-shadow: 0 24px 60px -36px rgba(10, 14, 44, .55); }
.art-signal__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.art-signal__label { font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: .74rem; letter-spacing: 2px; text-transform: uppercase; color: #309bff; }
.art-signal__time { font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: .72rem; letter-spacing: 1px; color: rgba(255, 255, 255, .55); border: 1px solid rgba(255, 255, 255, .18); border-radius: 999px; padding: 4px 10px; }
.art-signal__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; counter-reset: sig; }
.art-signal__list li { position: relative; padding-left: 40px; font-size: 1.02rem; line-height: 1.5; color: rgba(255, 255, 255, .88); counter-increment: sig; }
.art-signal__list li::before { content: counter(sig, decimal-leading-zero); position: absolute; left: 0; top: 1px; font-family: var(--font-mono, "JetBrains Mono", monospace); font-size: .82rem; font-weight: 600; color: #309bff; }
.art-signal__list strong { color: #fff; }
.art-signal__more { display: inline-flex; gap: 8px; margin-top: 18px; font-size: .9rem; font-weight: 600; color: #309bff; text-decoration: none; }
.art-signal__more:hover { text-decoration: underline; text-underline-offset: 4px; }